项目更改

src/views/farm/project/index.vue

@@ -55,13 +55,25 @@
       <el-table-column label="ID" align="center" prop="id" />
       <el-table-column label="项目名" align="center" prop="name" />
       <el-table-column label="项目内容" align="center" prop="content" />
-      <el-table-column label="区域名" align="center" prop="areas"/>
+      <!-- <el-table-column label="区域名" align="center" prop="areas"/> -->
+      <el-table-column label="区域名" align="center" prop="areas" width="80" >
+        <template slot-scope="scope">
+              <span>{{areasConvert(scope.row.areas)}}</span>
+        </template>
+      </el-table-column>
       <el-table-column label="作物名" align="center" prop="cropId" >
         <template slot-scope="scope">
           <span> {{cropList.find(t=>t.id == scope.row.cropId ).name}}  </span>
         </template>
       </el-table-column>
-      <el-table-column label="项目成员" align="center" prop="members"/>
+      <!-- <el-table-column label="项目成员" align="center" prop="members"/> -->
+
+      <el-table-column label="项目成员" align="center" prop="members">
+        <template slot-scope="scope">
+          <span>{{membersConvert(scope.row.members)}}</span>
+        </template>
+      </el-table-column>
+
 
       <el-table-column label="图片" align="center" prop="images">
           <template slot-scope="scope">
@@ -108,34 +120,20 @@
         <el-form-item label="项目内容" prop="content">
           <editor v-model="form.content" :min-height="192"/>
         </el-form-item>
-
+        <el-form-item label="区域选择" prop="areas">
-        <!-- <el-form-item label="区域选择" prop="assemAreaList">
-          <el-cascader 
-          :options="assemAreaList" 
-          :props="props" 
-          clearable 
-          ref="chooseA"
-          @change="changeArea"
-          v-model="form.areas">
-          </el-cascader>
-        </el-form-item> -->
-
-        <el-form-item label="区域选择" prop="selectAreasList">
           <el-select  v-model="form.areas" multiple placeholder="请选择">
             <el-option v-for="item in areasList" :key="item.id" :label="item.name" :value="item.id"> {{item.name}}
             </el-option>
           </el-select>
         </el-form-item>
-
-
         <el-form-item label="作物选择" prop="cropId">
           <el-select  v-model="form.cropId" placeholder="请选择">
             <el-option v-for="item in cropList" :key="item.id" :label="item.name" :value="item.id"> {{item.name}}
             </el-option>
           </el-select>
         </el-form-item>
-        <el-form-item label="成员选择" prop="selectMembersList">
+        <el-form-item label="成员选择" prop="members">
-          <el-select  v-model="selectMembersList" multiple placeholder="请选择">
+          <el-select  v-model="form.members" multiple placeholder="请选择">
             <el-option v-for="item in membersList" :key="item.id" :label="item.name" :value="item.id"> {{item.name}}
             </el-option>
           </el-select>
@@ -213,32 +211,41 @@ export default {
       // 表单校验
       rules: {
         name: [{ required: true, message: "不能为空", trigger: "blur" }],
-        // content: [{ required: true, message: "不能为空", trigger: "blur" }],
-        // selectAreasList: [{ required: true, message: "不能为空", trigger: "blur" }],
-        // cropId: [{ required: true, message: "不能为空", trigger: "blur" }],
-        // selectMembersList: [{ required: true, message: "不能为空", trigger: "blur" }],
         planStartTime: [{ required: true, message: "不能为空", trigger: "blur" }],
         planEndTime: [{ required: true, message: "不能为空", trigger: "blur" }],
         weight: [{ required: true, message: "不能为空", trigger: "blur" }],
       },
-      props: { multiple: true },
-
       areasList:[],
-      assemAreaList:[],
-      areasParentList:[],
-      areasSonList:[],
-
-      selectAreasList:[],
       cropList:[],
       membersList:[],
-      selectMembersList:[]
-
     };
   },
   created() {
     this.getList();
   },
   methods: {
+    membersConvert(members){
+      let membersName = "";
+      this.membersList.forEach(item =>{
+        members.forEach(memberId =>{
+          if (memberId == item.id) {
+            membersName += item.name +"\n";
+          }
+        })
+      })
+      return membersName;
+    },
+    areasConvert(areas){
+      let areasName = "";
+      this.areasList.forEach(item => {
+        areas.forEach( pArea =>{
+          if (pArea == item.id) {
+            areasName += item.name + "\n";
+          }
+        })
+      })
+      return areasName;
+    },
     getCropList(){
       getCropPage({
         pageNo: 1,
@@ -269,7 +276,7 @@ export default {
       this.getAreasList();
       this.getCropList();
       this.getCpUserList();
-      this.assemArea();
+      // this.assemArea();
       this.loading = true;
       // 处理查询参数
       let params = {...this.queryParams};
@@ -278,30 +285,6 @@ export default {
       this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
       // 执行查询
       getProjectPage(params).then(response => {
-        response.data.list.forEach(element => {
-        element.areas = JSON.parse(element.areas);
-        let areaName = "";
-        element.areas.forEach(a=>{
-          this.areasList.filter(t=>t.id == a)[0].name;
-          areaName += this.areasList.filter(t=>t.id == a)[0].name +"、\n";
-        })
-        element.areas = areaName;
-
-          element.members = JSON.parse(element.members);
-          if(element.members != null){
-            let memberName = '';
-            element.members.forEach((mem) =>{
-              this.membersList.forEach((sel) =>{
-                if(mem == sel.id){
-                  memberName += (sel.name + "、\n");
-                }
-              })
-            })
-            element.members = memberName;
-          }
-          
-        });
-
         this.list = response.data.list;
         this.total = response.data.total;
         this.loading = false;
@@ -373,25 +356,15 @@ export default {
     handleAdd() {
       this.reset();
       this.getCpUserList();
-      this.assemArea();
       this.open = true;
       this.title = "添加农场项目";
     },
     /** 修改按钮操作 */
     handleUpdate(row) {
-      this.assemArea();
       this.reset();
       const id = row.id;
       getProject(id).then(response => {
         this.form = response.data;
-        let areasArray = JSON.parse(response.data.areas);
-        this.form.areas = areasArray;
-        this.selectAreasList = areasArray;
-
-        let membersArray = JSON.parse(response.data.members);
-        this.form.members = membersArray;
-        this.selectMembersList = membersArray;
-
         this.open = true;
         this.title = "修改农场项目";
       });
@@ -403,8 +376,6 @@ export default {
         if (!valid) {
           return;
         }
-        this.form.members = JSON.stringify(this.selectMembersList);
-        this.form.areas = JSON.stringify(this.form.areas);
 
         // 修改的提交
         if (this.form.id != null) {
@@ -417,8 +388,6 @@ export default {
         }
         // 添加的提交
         createProject(this.form).then(response => {
-          this.form.areas = JSON.stringify(this.form.areas);
-          this.form.members = JSON.stringify(this.form.members);
           this.$modal.msgSuccess("新增成功");
           this.open = false;
           this.getList();
@@ -452,30 +421,7 @@ export default {
           this.$download.excel(response, '${table.classComment}.xls');
           this.exportLoading = false;
         }).catch(() => {});
-    },
-    assemArea(){
-        let parentLsit = this.areasList.filter(t => t.parentId == 0);
-        let sonList = this.areasList.filter(s => s.parentId != 0);
-
-        let firstList = [];
-        parentLsit.forEach(p => {
-          this.areasParentList.push(p);
-          let secondList = [];
-          sonList.forEach(s => {
-            if (p.id == s.parentId) {
-              this.areasSonList.push(s);
-              secondList.push({value:s.id, label:s.name});
     }
-          })
-          firstList.push({value: p.id, label:p.name, children: secondList})
-        })
-        this.assemAreaList = firstList;
-    },
-    changeArea(){
-
-    }
-    
-
   }
 };
 </script>