|
|
@@ -11,7 +11,7 @@
|
|
|
<el-col :span="8">
|
|
|
<div class="searchBox">
|
|
|
<div class="searchTitle">模板风格</div>
|
|
|
- <el-select v-model="getApiData.islink" placeholder="请选择..">
|
|
|
+ <el-select v-model="getApiData.template_class_id" placeholder="请选择..">
|
|
|
<el-option
|
|
|
v-for="item in allClass"
|
|
|
:key="item.value"
|
|
|
@@ -59,7 +59,7 @@
|
|
|
<!--步骤按钮 start------------------------------------------------------------>
|
|
|
<div class="btnBox">
|
|
|
<el-button type="info" @click="goBase">上一步</el-button>
|
|
|
- <el-button type="primary" @click="editData" v-if="this.$route.query.step!=undefined">编辑并进入下一步</el-button>
|
|
|
+ <el-button type="primary" @click="editData" v-if="this.$route.query.step>=2">编辑并进入下一步</el-button>
|
|
|
<el-button type="primary" @click="addData" v-else>保存并进入下一步</el-button>
|
|
|
</div>
|
|
|
<!--步骤按钮 end------------------------------------------------------------>
|
|
|
@@ -71,7 +71,7 @@
|
|
|
<img :src="classPic">
|
|
|
</div>
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
- <div>
|
|
|
+ <div class="alignCenterBox">
|
|
|
<el-button @click="windowStatus=false">关闭</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -111,6 +111,7 @@ export default {
|
|
|
},
|
|
|
//用户选择的页面模板
|
|
|
userData:[],
|
|
|
+ userTemplateId:"",//用户选择的模板风格id
|
|
|
allCount:0,//总条数
|
|
|
//分页相关 end ------------------------------------------------------------>
|
|
|
}
|
|
|
@@ -174,6 +175,12 @@ export default {
|
|
|
this.$store.dispatch('template/getWebsiteTemplateList',this.getApiData).then(res=> {
|
|
|
if(res.code != 200){
|
|
|
this.$message.error(res.message)
|
|
|
+ //展示数据
|
|
|
+ this.tableData = [];
|
|
|
+ //总条数
|
|
|
+ this.allCount = 0;
|
|
|
+ //还原当前页数
|
|
|
+ this.getApiData.page = 1;
|
|
|
}else{
|
|
|
for(let item of res.data.rows){
|
|
|
item.status = 0;
|
|
|
@@ -183,16 +190,22 @@ export default {
|
|
|
this.tableData = res.data.rows;
|
|
|
//总条数
|
|
|
this.allCount = res.data.count;
|
|
|
+ //判断是否需要回显选择
|
|
|
+ if(this.$route.query.step!=undefined&&this.$route.query.step>=2){
|
|
|
+ this.getUserTemplate();
|
|
|
+ }
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
//1.3 选中一个模板
|
|
|
useIt(item){
|
|
|
- console.log(item)
|
|
|
+ for(let item of this.tableData){
|
|
|
+ item.status = 0;
|
|
|
+ }
|
|
|
item.status = 1;
|
|
|
this.userData = item.template_img;
|
|
|
+ this.userTemplateId = item.id;
|
|
|
},
|
|
|
-
|
|
|
//1.4 列表内容分页
|
|
|
//直接跳转
|
|
|
handleSizeChange(val) {
|
|
|
@@ -204,15 +217,82 @@ export default {
|
|
|
this.getApiData.page = val;
|
|
|
this.getData();
|
|
|
},
|
|
|
-
|
|
|
+ //1.风格列表 end ------------------------------------------------------------>
|
|
|
+ //2.提交风格模板 start ------------------------------------------------------------>
|
|
|
addData(){
|
|
|
-
|
|
|
+ //2.1 判断是否已经选择了模板
|
|
|
+ console.log(this.userData.length)
|
|
|
+ if(this.userData.length==0){
|
|
|
+ console.log("未选择模板")
|
|
|
+ this.$message.error("必须选择一个模板风格！")
|
|
|
+ }else{
|
|
|
+ let data = {
|
|
|
+ website_id:this.$route.query.website_id,
|
|
|
+ template_id:this.userTemplateId
|
|
|
+ }
|
|
|
+ //console.log(this.userTemplateId)
|
|
|
+ //this.$route.query.website_id
|
|
|
+ this.$store.dispatch('template/addWebsiteTemplateclassintel',data).then(res=> {
|
|
|
+ if(res.code!=200){
|
|
|
+ this.$message.error(res.message)
|
|
|
+ }else{
|
|
|
+ this.$message.success('模板风格保存成功！');
|
|
|
+ //保存模板风格成功,开始构建网站
|
|
|
+ this.$router.push({
|
|
|
+ path: '/templateCreat',
|
|
|
+ query: {
|
|
|
+ website_id: this.$route.query.website_id,
|
|
|
+ step:2
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //回显数据
|
|
|
+ getUserTemplate(){
|
|
|
+ this.$store.dispatch('template/getWebsiteTemplateclassintel',{website_id:this.$route.query.website_id}).then(res=> {
|
|
|
+ let that = this;
|
|
|
+ if(res.code!=200){
|
|
|
+ this.$message.error(res.message)
|
|
|
+ }else{
|
|
|
+ for(let item of that.tableData){
|
|
|
+ if(item.id == res.data.tid){
|
|
|
+ item.status = 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ //给与所选缩略图
|
|
|
+ this.userData = res.data.template_img;
|
|
|
+ //给与所选id
|
|
|
+ this.userTemplateId = res.data.tid;
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
editData(){
|
|
|
-
|
|
|
+ //编辑的时候就不用判断是否有选中了，因为必定有选中的
|
|
|
+ let data = {
|
|
|
+ website_id:this.$route.query.website_id,
|
|
|
+ template_id:this.userTemplateId
|
|
|
+ }
|
|
|
+ //console.log(this.userTemplateId)
|
|
|
+ //this.$route.query.website_id
|
|
|
+ this.$store.dispatch('template/addWebsiteTemplateclassintel',data).then(res=> {
|
|
|
+ if(res.code!=200){
|
|
|
+ this.$message.error(res.message)
|
|
|
+ }else{
|
|
|
+ this.$message.success('模板风格编辑成功！');
|
|
|
+ //保存模板风格成功,开始构建网站
|
|
|
+ this.$router.push({
|
|
|
+ path: '/templateCreat',
|
|
|
+ query: {
|
|
|
+ website_id: this.$route.query.website_id,
|
|
|
+ step:this.$route.query.step,
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ })
|
|
|
}
|
|
|
-
|
|
|
- //1.风格列表 end ------------------------------------------------------------>
|
|
|
+ //2.提交风格模板 end ------------------------------------------------------------>
|
|
|
},
|
|
|
mounted(){
|
|
|
//给与网站id
|
|
|
@@ -221,9 +301,10 @@ export default {
|
|
|
this.getAllClass();
|
|
|
//获取所有模板
|
|
|
this.getData();
|
|
|
-
|
|
|
- if(this.$route.query.step!=undefined){
|
|
|
+
|
|
|
+ if(this.$route.query.step!=undefined&&this.$route.query.step>=2){
|
|
|
console.log("编辑风格！")
|
|
|
+ //this.getUserTemplate();
|
|
|
}else{
|
|
|
console.log("选择风格！")
|
|
|
}
|
|
|
@@ -258,6 +339,7 @@ export default {
|
|
|
.thumbnailItemBox {
|
|
|
background: #ECEFFD;
|
|
|
border-radius: 10px;
|
|
|
+ padding: 10px;
|
|
|
position: relative;
|
|
|
cursor: pointer;
|
|
|
.thumbnailItemTitle {
|
|
|
@@ -274,7 +356,9 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
img {
|
|
|
- height: 180px;
|
|
|
+ width: 140px;
|
|
|
+ height: 140px;
|
|
|
+ display: block;
|
|
|
}
|
|
|
}
|
|
|
.templateStyleBox {
|
|
|
@@ -292,7 +376,7 @@ export default {
|
|
|
.templateStyleItemBox {
|
|
|
background: #fff;
|
|
|
border-radius: 10px;
|
|
|
- padding-top: 10px;
|
|
|
+ padding:20px 20px 0 20px;
|
|
|
border-top: 5px solid #E9EDF7;
|
|
|
border-bottom: 5px solid #E9EDF7;
|
|
|
border-left: 1px solid #E9EDF7;
|
|
|
@@ -317,7 +401,8 @@ export default {
|
|
|
padding: 10px 0;
|
|
|
}
|
|
|
img {
|
|
|
- width: 100%;
|
|
|
+ width: 200px;
|
|
|
+ height: 340px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -326,5 +411,8 @@ export default {
|
|
|
width: 100%;
|
|
|
}
|
|
|
}
|
|
|
+ .alignCenterBox {
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
</style>
|
|
|
|
dangyunlong