构建数据json

构建数据json

src/layout/components/template/pages/index/sector.vue

@@ -82,7 +82,7 @@ export default {
             component_style:1,//该组件使用哪个展示样式
             component_name:"",
             sort:1,
-            componentList:[]//该组件不请求指定类型的数据，但是后端需要返回imgUrl
+            componentData:[]//该组件不请求指定类型的数据，但是后端需要返回imgUrl
           }
         ]
       },

src/store/modules/template.js

@@ -126,9 +126,23 @@ const mutations = {
     // state.editComponentType = "";
     // state.editComponentStyle = "";
   },
+  //选择组件样式
+  selectComponentStyleNumber(state,data){
+    state.editComponentStyle = data;
+  },
   //设置组件样式
   setComponentStyleNumber(state,data){
-    state.editComponentStyle = data;
+    let id = state.editSectorId;
+    let sort = state.editComponentSort;
+    let num = state.editComponentStyle;
+
+    // 获取当前模块数据并进行深拷贝
+    let module = JSON.parse(JSON.stringify(state.pageData.index[id]));
+    module.content.componentList[sort].component_style = num;
+    // 拷贝后直接替换原来的板块
+    state.pageData.index[id] = module;
+    console.log("当前的板块数据为：");
+    console.log(state.pageData.index);
   },
   //0.全局配置 start------------------------------------------------------------>
   //1.配置模块 start------------------------------------------------------------>
@@ -142,6 +156,7 @@ const mutations = {
       //data.type 组件名称 data.h 模块高度 
       //计算当前布局的最大 y 值
       const maxY = Math.max(...state.pageData.index.map(item => item.y), 0);
+      console.log(data);
       //添加板块id  
       state.pageData.index.push({
         i: state.pageData.index.length, 
@@ -150,13 +165,14 @@ const mutations = {
         w: 12, 
         h: data.h, 
         type: data.type,
-        content:"",
-        sectorData:data.jsonData
+        //content:"",
+        //sectorData:data.jsonData
+        content:data.jsonData
       });
-      console.log("当前添加的板块id：" + state.pageData.index.length);
-      data.jsonData.sectorId = state.pageData.index.length;
-      console.log("添加完毕后的数据：");
-      console.log(state.pageData.index);
+      // console.log("当前添加的板块id：" + state.pageData.index.length);
+      // data.jsonData.sectorId = state.pageData.index.length;
+      // console.log("添加完毕后的数据：");
+      // console.log(state.pageData.index);
     }
   },
   //删除首页板块
@@ -300,11 +316,11 @@ const mutations = {
     let websiteData = [];
     //获取板块的sort
     for (let index in data.data) {
-      console.log(data.data[index].sectorData);
-      data.data[index].sectorData.sort = Number(index)+1;
+      console.log(data.data[index].content);
+      data.data[index].content.sort = Number(index)+1;
       if(data.type=="index"){
         //不要把数据直接保存到state.webSiteData.template中，否则无法删除
-        websiteData.push(data.data[index].sectorData)
+        websiteData.push(data.data[index].content)
       }
     }
     //保存到对应的页面json中

src/views/complaint/complaintList.vue

@@ -229,7 +229,7 @@
               <el-radio label="103">已完结</el-radio>
             </el-radio-group>
           </el-form-item>
-          <el-form-item label="备注信息：" :label-width="formLabelWidth" prop="" class="custom-align-right">
+          <el-form-item label="拒绝原因：" :label-width="formLabelWidth" class="custom-align-right" prop="reason" v-if="form.status==102">
             <el-input type="textarea" v-model="form.reason" class="custom-textarea" placeholder="请输入备注信息"></el-input>
           </el-form-item>
         </div>
@@ -366,6 +366,8 @@ export default {
         status:[{required:true,trigger:'blur',validator:validateEmpty}],
         //身份证不能为空
         id_card:[{required:true,trigger:'blur',validator:validateNull}],
+        //拒绝原因不能为空
+        reason:[{required:true,trigger:'blur',validator:validateEmpty}],
       },
       //弹出框中的表单设置 end ------------------------------------------------------------>
     }

src/views/role/components/userAdmin.vue

@@ -197,29 +197,33 @@ export default {
     addData(){
       console.log(this.form);
       //1.先验证用户是否已经存在
-      this.$store.dispatch('userMember/verifyUserInfo',{user_name:this.form.user_name}).then(res=>{
-        if(res.code==0){
-          //如果code为0表示用户不存在，提交表单
-          this.$store.dispatch('userMember/createUser',this.form).then(res=>{
-            console.log(res);
+      this.$refs.form.validate(valid => {
+        if (valid) {
+          this.$store.dispatch('userMember/verifyUserInfo',{user_name:this.form.user_name}).then(res=>{
+            if(res.code==0){
+              //如果code为0表示用户不存在，提交表单
+              this.$store.dispatch('userMember/createUser',this.form).then(res=>{
+                console.log(res);
+                this.$message({
+                  type: 'success',
+                  message: '用户添加成功！'
+                });
+                this.goList();
+              })
+            }else if(res.code==200){
+              //如果code==200 表示用户存在，阻止进一步提交
+              this.$message({
+                type: 'warning',
+                message: '该账号已被注册，请更换其他账号！'
+              });
+            }
+          }).catch(error=>{
             this.$message({
-              type: 'success',
-              message: '用户添加成功！'
+              type: 'info',
+              message: '网络错误，请重试！'
             });
-            this.goList();
           })
-        }else if(res.code==200){
-          //如果code==200 表示用户存在，阻止进一步提交
-          this.$message({
-            type: 'warning',
-            message: '该账号已被注册，请更换其他账号！'
-          });
         }
-      }).catch(error=>{
-        this.$message({
-          type: 'info',
-          message: '网络错误，请重试！'
-        });
       })
     },
     //提交表单 start ------------------------------------------------------------>
@@ -245,32 +249,36 @@ export default {
     },
     //修改用户
     editData(){
-      this.$store.dispatch('userMember/verifyUserInfo',{id:this.editId,user_name:this.form.user_name}).then(res=>{
-        if(res.code==0){
-          this.form.id = this.editId;
-          delete this.form.password;
-          delete this.form.confirm_password;
-          //如果code为0表示用户不存在，提交表单
-          this.$store.dispatch('userMember/updateUser',this.form).then(res=>{
-            console.log(res);
+      this.$refs.form.validate(valid => {
+        if (valid) {
+          this.$store.dispatch('userMember/verifyUserInfo',{id:this.editId,user_name:this.form.user_name}).then(res=>{
+            if(res.code==0){
+              this.form.id = this.editId;
+              delete this.form.password;
+              delete this.form.confirm_password;
+              //如果code为0表示用户不存在，提交表单
+              this.$store.dispatch('userMember/updateUser',this.form).then(res=>{
+                console.log(res);
+                this.$message({
+                  type: 'success',
+                  message: '用户添加成功！'
+                });
+                this.goList();
+              })
+            }else if(res.code==200){
+              //如果code==200 表示用户存在，阻止进一步提交
+              this.$message({
+                type: 'warning',
+                message: '该账号已被注册，请更换其他账号！'
+              });
+            }
+          }).catch(error=>{
             this.$message({
-              type: 'success',
-              message: '用户添加成功！'
+              type: 'info',
+              message: '网络错误，请重试！'
             });
-            this.goList();
           })
-        }else if(res.code==200){
-          //如果code==200 表示用户存在，阻止进一步提交
-          this.$message({
-            type: 'warning',
-            message: '该账号已被注册，请更换其他账号！'
-          });
         }
-      }).catch(error=>{
-        this.$message({
-          type: 'info',
-          message: '网络错误，请重试！'
-        });
       })
     },
     //重置密码

src/views/role/components/userDefault.vue

@@ -118,11 +118,10 @@
           <el-form-item label="手机号：" :label-width="formLabelWidth" prop="mobile" class="custom-align-right">
             <el-input v-model="form.mobile" autocomplete="off" placeholder="请输入手机号.."></el-input>
           </el-form-item>
-          <el-form-item label="有效期：" :label-width="formLabelWidth" prop="timeList" class="custom-align-right" v-if="form.long_time==false">
+          <el-form-item label="有效期：" :label-width="formLabelWidth" prop="timeList" class="custom-align-right" v-if="form.long_time==0">
             <el-date-picker
               v-model="timeList"
               type="daterange"
-              :disabled="form.long_time === 1"
               range-separator="至"
               start-placeholder="开始日期"
               end-placeholder="结束日期"
@@ -133,7 +132,6 @@
           <div class="timeBox" v-else>
             <div class="timeTitle"><span>*</span>有效期：</div>
             <el-date-picker
-              v-model="timeList"
               type="daterange"
               :disabled="form.long_time === 1"
               range-separator="至"
@@ -581,7 +579,12 @@ export default {
           this.$store.dispatch('userMember/verifyUserInfo',{id:this.editId,user_name:this.form.user_name}).then(res=>{
             if(res.code==0){
               console.log(this.form);
-              this.form.native_place_arr_id = JSON.parse(this.form.native_place_arr_id);
+              
+              if(this.form.native_place_arr_id == ""){
+                this.form.native_place_arr_id = [];
+              }else{
+                this.form.native_place_arr_id = JSON.parse(this.form.native_place_arr_id);
+              }
 
               //2.设置修改的用户id
               this.form.id = this.editId;
@@ -724,4 +727,4 @@ export default {
     width: 100%; /* 禁止用户拖拽调整大小 */
   }
   //执行v-deep穿透scope选择器 end------------------------------------------------------------>*/
-</style>
+</style>

src/views/template/public/componentWindow.vue

@@ -9,7 +9,7 @@
         <div class="testAssistantContentItem"><span>板块id:</span>{{this.$store.state.template.editSectorId}}</div>
         <div class="testAssistantContentItem"><span>组件sort:</span>{{this.$store.state.template.editComponentSort}}</div>
         <div class="testAssistantContentItem"><span>组件type:</span>{{this.$store.state.template.editComponentType}}</div>
-        <div class="testAssistantContentItem"><span>原始的组件style:</span>{{this.$store.state.template.pageData.index[this.$store.state.template.editSectorId].sectorData.componentList[this.$store.state.template.editComponentSort].component_style}}</div>
+        <div class="testAssistantContentItem"><span>原始的组件style:</span>{{this.$store.state.template.pageData.index[this.$store.state.template.editSectorId].content.componentList[this.$store.state.template.editComponentSort].component_style}}</div>
         <div class="testAssistantContentItem"><span>现在的组件style:</span>{{this.$store.state.template.editComponentStyle}}</div>
       </div>
     </div>
@@ -20,17 +20,17 @@
           <table>
             <tr>
               <td>
-                <div :class="['componentScrollBoxItem', this.$store.state.template.editComponentStyle === 1 ? 'active' : '']" @click="setUseStyleNumber(1)">
+                <div :class="['componentScrollBoxItem', this.$store.state.template.editComponentStyle === 1 ? 'active' : '']" @click="selectUseStyleNumber(1)">
                   <img src="@/assets/template/component/style1imgTitle.png"/>
                 </div>
               </td>
               <td>
-                <div :class="['componentScrollBoxItem', this.$store.state.template.editComponentStyle === 2 ? 'active' : '']" @click="setUseStyleNumber(2)">
+                <div :class="['componentScrollBoxItem', this.$store.state.template.editComponentStyle === 2 ? 'active' : '']" @click="selectUseStyleNumber(2)">
                   <img src="@/assets/template/component/style2imgTitle.png"/>
                 </div>
               </td>
               <td>
-                <div :class="['componentScrollBoxItem', this.$store.state.template.editComponentStyle === 3 ? 'active' : '']" @click="setUseStyleNumber(3)">
+                <div :class="['componentScrollBoxItem', this.$store.state.template.editComponentStyle === 3 ? 'active' : '']" @click="selectUseStyleNumber(3)">
                   <img src="@/assets/template/component/style3imgTitle.png"/>
                 </div>
               </td>
@@ -59,9 +59,9 @@ export default {
     }
   },
   methods: {
-    //设置选择的组件样式
-    setUseStyleNumber(number){
-      this.$store.commit('template/setComponentStyleNumber',number);
+    //选择组件样式
+   selectUseStyleNumber(number){
+      this.$store.commit('template/selectComponentStyleNumber',number);
     },
     //关闭选择组件样式弹出框
     closeEditWindow(){
@@ -69,27 +69,12 @@ export default {
     },
     //提交编辑的数据
     submitData(){
-      let id = this.$store.state.template.editSectorId;
-      //编辑的板块id
-      //console.log(this.$store.state.template.editSectorId);
-      let sort = this.$store.state.template.editComponentSort;
-      console.log(id,sort);
-      // this.$store.state.template.pageData.index["0"].sectorData.componentList[0].component_style = 1;
-      // this.$store.state.template.pageData.index["1"].sectorData.componentList[0].component_style = 2;
-
-      console.log(typeof this.$store.state.template.pageData.index);
-      //编辑的组件sort
-      //console.log(this.$store.state.template.editComponentSort);
-      //当前组件默认的样式
-      //console.log(this.$store.state.template.pageData.index[0].sectorData.componentList[0].component_style);
-      //当前组件选择的样式
-      //console.log(this.$store.state.template.editComponentStyle);
       //提交修改
-      // this.$store.state.template.pageData.index[id].sectorData.componentList[sort].component_style = this.$store.state.template.editComponentStyle;
-      // //当前保存完了的数据
-      // console.log(this.$store.state.template.pageData);
-      // //关闭窗口
-      // this.$store.commit('template/closeComponentStyleStatus');
+      this.$store.commit('template/setComponentStyleNumber');
+      //关闭窗口
+      this.$store.commit('template/closeComponentStyleStatus');
+      //当前保存完了的数据
+      //console.log(this.$store.state.template.pageData);
     }
   },
   mounted() {

src/views/template/public/convertBtn.vue

@@ -27,7 +27,7 @@ export default {
   },
   methods: {
     openComponentListWindow(){
-      let style = this.$store.state.template.pageData.index[this.id].sectorData.componentList[this.sort].component_style;
+      let style = this.$store.state.template.pageData.index[this.id].content.componentList[this.sort].component_style;
       let data = {
         id:this.id,
         sort:this.sort,

src/views/template/style/1/imgTitleSector.vue

@@ -3,15 +3,13 @@
     <div class="imgSectorBox">
       <editBtn :id="id" :sort="0" :type="3" :size="1"/>
       <convertBtn :id="id" :sort="0" :type="3"/>
-      {{ id }}
-      {{ this.$store.state.template.pageData.index[id].sectorData.componentList[0].component_style }}
-      <div v-if="this.$store.state.template.pageData.index[id].sectorData.componentList[0].component_style == 1">
+      <div v-if="this.$store.state.template.pageData.index[id].content.componentList[0].component_style == 1">
         <useStyle1 />
       </div>
-      <div v-if="this.$store.state.template.pageData.index[id].sectorData.componentList[0].component_style == 2">
+      <div v-if="this.$store.state.template.pageData.index[id].content.componentList[0].component_style == 2">
         <useStyle2 />
       </div>
-      <div v-if="this.$store.state.template.pageData.index[id].sectorData.componentList[0].component_style == 3">
+      <div v-if="this.$store.state.template.pageData.index[id].content.componentList[0].component_style == 3">
         <useStyle3 />
       </div>
     </div>