更改训练登记，更改记录本

src/components/look_word/bdglsoldier.vue

@@ -196,6 +196,7 @@
           </tr>
         </tbody>
       </table>
+      
       <table
         border="1"
         style="

src/views/grassrootsregistration/bdglarmament/index.vue

@@ -90,7 +90,6 @@
       style="width: 100%"
     >
       <el-table-column type="selection" width="55" align="center" />
-      <!-- <el-table-column label="序号" align="center" prop="id" /> -->
       <el-table-column label="序号" type="index" width="50" align="center">
         <template scope="scope">
           <span>{{
@@ -163,6 +162,7 @@
           >
         </template>
       </el-table-column>
+
     </el-table>
 
     <pagination
@@ -546,7 +546,8 @@ export default {
     /** 新增按钮操作 */
     handleAdd() {
       // 人员
-      (this.renYuan = []), this.getTreeselect();
+      this.renYuan = [];
+      this.getTreeselect();
       this.style = 2;
       this.reset();
       this.open = true;

src/views/grassrootsregistration/bdgldiary/index.vue

@@ -247,6 +247,7 @@
                 class="text"
                 @change="blogDate"
                 value-format="yyyy-MM-dd HH:mm:ss"
+                disabled
               >
               </el-date-picker>
             </el-form-item>

src/views/grassrootsregistration/bdgldrill/index.vue

@@ -384,12 +384,13 @@
           :data="drillFus"
           :header-cell-style="{ background: '#003C69', color: 'white' }"
         >
-          <el-table-column label="姓名" align="center" prop="peopleName">
+          <el-table-column label="姓名" align="center" prop="peopleId">
             <template slot-scope="scope">
               <el-select
                 v-model="scope.row.peopleId"
-                placeholder="请选择姓名"
+                placeholder=""
                 filterable
+                disabled
               >
                 <el-option
                   :label="item.name"
@@ -673,12 +674,13 @@
           :data="drillFus"
           :header-cell-style="{ background: '#003C69', color: 'white' }"
         >
-          <el-table-column label="姓名" align="center" prop="peopleName">
+          <el-table-column label="姓名" align="center" prop="peopleId">
             <template slot-scope="scope">
               <el-select
                 v-model="scope.row.peopleId"
-                placeholder="请选择姓名"
+                placeholder=""
                 filterable
+                disabled
               >
                 <el-option
                   :label="item.name"
@@ -746,6 +748,28 @@
         ></bdgldrill>
       </el-dialog>
     </div>
+
+    <!-- 添加人员弹出层 -->
+    <el-dialog
+      title="添加人员"
+      :visible.sync="open2"
+      width="750px"
+      append-to-body
+      :close-on-click-modal="false"
+    >
+      <el-transfer
+        v-model="arr1"
+        :data="renYuan"
+        :props="{
+          key: 'id',
+          label: 'name',
+        }"
+        :titles="['全部人员', '已添加人员']"
+      ></el-transfer>
+      <div slot="footer" class="dialog-footer" style="margin-right: 28px">
+        <el-button type="primary" @click="submitForm3">确 定</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
@@ -862,6 +886,10 @@ export default {
       open1: false,
       // 是否禁用效果成绩输入框
       dilabled: true,
+      // 添加人员弹出层
+      open2: false,
+      arr1: [],
+      falg: null,
     };
   },
   created() {
@@ -871,6 +899,25 @@ export default {
     });
   },
   methods: {
+    // 添加人员确定
+    submitForm3() {
+      this.open2 = false;
+      this.arr1.forEach((item) => {
+        this.drillFus.push({
+          peopleId: item,
+          state: "",
+          trainingStatus: "",
+        });
+      });
+      for (var i = 0; i < this.drillFus.length - 1; i++) {
+        for (var j = i + 1; j < this.drillFus.length; j++) {
+          if (this.drillFus[i].peopleId == this.drillFus[j].peopleId) {
+            this.drillFus.splice(j, 1);
+            j--;
+          }
+        }
+      }
+    },
     // 应训人数触发
     yingxun() {
       if (this.form.yingxun && this.form.shixun) {
@@ -978,6 +1025,8 @@ export default {
       this.title = "添加军事训练登记簿";
       this.drillFus = [];
       this.nr = null;
+      this.arr1 = [];
+      this.falg = true;
     },
     //查看按钮操作
     handleChakan(row) {
@@ -994,6 +1043,8 @@ export default {
     /** 修改按钮操作 */
     handleUpdate(row) {
       this.nr = null;
+      this.falg = false;
+      this.arr1 = [];
       this.reset();
       this.getQuanShu();
       const id = row.id || this.ids;
@@ -1087,6 +1138,7 @@ export default {
               this.getList();
             });
           } else {
+            console.log(this.form);
             addBdgldrill(this.form).then((response) => {
               this.$modal.msgSuccess("新增成功");
               this.open = false;
@@ -1125,12 +1177,25 @@ export default {
         })
         .catch(() => {});
     },
+    // 新增人员
     adddrillFus() {
-      this.drillFus.push({
-        peopleName: "",
-        state: "",
-        trainingStatus: "",
-      });
+      this.open2 = true;
+      if (this.falg) {
+        console.log(1);
+        this.renYuan.map((item, i) => {
+          if (this.drillFu) {
+            if (item.id == this.drillFu[i]) {
+              this.arr1[i] = item;
+            }
+          }
+          return this.arr1;
+        });
+      } else if (this.falg == false) {
+        // this.arr1=this.drillFus 
+        this.drillFus.forEach((item=>{
+       this.arr1.push(item.peopleId)
+        }))
+      }
     },
     submitForm2() {
       this.drillFus.push(this.formdrillFus);
@@ -1298,4 +1363,39 @@ export default {
 ::v-deep .el-dialog__footer {
   margin-right: 47px;
 }
+
+::v-deep
+  .el-transfer-panel
+  .el-transfer-panel__header
+  .el-checkbox
+  .el-checkbox__label
+  span {
+  color: #fff;
+}
+::v-deep .el-transfer-panel__item.el-checkbox {
+  color: #fff;
+}
+::v-deep
+  .el-transfer-panel
+  .el-transfer-panel__header
+  .el-checkbox
+  .el-checkbox__label {
+  color: #fff;
+}
+::v-deep
+  .el-transfer-panel
+  .el-transfer-panel__header
+  .el-checkbox
+  .el-checkbox__label {
+  color: #fff;
+}
+::v-deep .el-transfer-panel {
+  background: rgba(255, 255, 255, 0.2);
+}
+::v-deep .el-transfer-panel .el-transfer-panel__header {
+  background: rgba(255, 255, 255, 0.2);
+}
+::v-deep .el-transfer-panel .el-transfer-panel__empty {
+  color: #fff;
+}
 </style>

src/views/grassrootsregistration/bdglmeeting/index.vue

@@ -246,58 +246,70 @@
 
           <el-form-item label="参加人" prop="joinId" class="joinId">
             <el-select
-              ref="aa"
-              v-model="form.joinId"
+              ref="abc"
+              v-model="form1.joinId"
               multiple
               placeholder="请选择参加人"
+              class="input_xiala"
               filterable
+              @remove-tag="removeSelect"
+              @change="changeSelect"
             >
               <el-option
-                v-for="(item, i) in renYuan"
-                :key="i"
+                v-for="item in renYuan"
+                :key="item.id"
                 :label="item.name"
                 :value="item.name"
                 class="input_xiala"
+                :disabled="item.disabled"
+                :class="item.disabled == true ? 'colors' : ''"
               >
-                {{ item.name }}
               </el-option>
             </el-select>
           </el-form-item>
           <el-form-item label="列席人" class="joinId">
             <el-select
-              ref="bb"
-              v-model="form.peopleIds"
+              ref="abcd"
+              v-model="form1.peopleIds"
               multiple
               placeholder="请选择列席人"
+              class="input_xiala"
               filterable
+              @remove-tag="removeSelect"
+              @change="changeSelect"
             >
               <el-option
-                v-for="(item, i) in renYuan"
-                :key="i"
+                v-for="item in renYuan"
+                :key="item.id"
                 :label="item.name"
+                :disabled="item.disabled"
                 :value="item.name"
                 class="input_xiala"
+                :class="item.disabled == true ? 'colors' : ''"
               >
-                {{ item.name }}
               </el-option>
             </el-select>
           </el-form-item>
           <el-form-item label="缺席人" class="joinId">
             <el-select
-              ref="cc"
-              v-model="form.absentIds"
+              ref="abcde"
+              v-model="form1.absentIds"
               multiple
               placeholder="请选择缺席人"
+              class="input_xiala"
               filterable
+              @remove-tag="removeSelect"
+              @change="changeSelect"
             >
               <el-option
-                v-for="(item, i) in renYuan"
-                :key="i"
+                v-for="item in renYuan"
+                :key="item.id"
                 :label="item.name"
                 :value="item.name"
+                :disabled="item.disabled"
                 class="input_xiala"
+                :class="item.disabled == true ? 'colors' : ''"
               >
-                {{ item.name }}
               </el-option>
             </el-select>
           </el-form-item>
@@ -470,6 +482,13 @@ export default {
       },
       // 修改拿到的数据
       result: {},
+      changeArr: [], //存放选中选项的数组
+      // 表单参数
+      form1: {
+        joinId: "",
+        peopleIds: "",
+        absentIds: "",
+      },
     };
   },
   created() {
@@ -479,6 +498,43 @@ export default {
     this.onEditor();
   },
   methods: {
+    //change方法
+    changeSelect() {
+      for (var key in this.form1) {
+        this.form1[key].forEach((item) => {
+          this.changeArr.push(item);
+        });
+      }
+      //有可能会出现重复的元素，所以对changeArr数组进行去重操作
+      this.changeArr = this.quchong(this.changeArr);
+      //对changeArr进行遍历，对hobbyList进行遍历，
+      //changeArr有哪一项，就把hobbyList中该项的disabled属性置为true，禁用
+      this.changeArr.forEach((item) => {
+        this.renYuan.forEach((yitem) => {
+          if (item === yitem.name) {
+            yitem.disabled = true;
+          }
+        });
+      });
+    },
+    //remove-tag方法，移除某一项时触发该方法
+    removeSelect(val) {
+      //将移除的那一项，从changeArr数组中找到下标，并移除
+      var str = this.changeArr.findIndex((item) => item === val);
+      this.changeArr.splice(str, 1);
+      //对hobbyList数组遍历，将移除的那项disabled属性置为false，启用
+      this.renYuan.forEach((item) => {
+        if (val === item.name) {
+          item.disabled = false;
+        }
+      });
+    },
+    //数组去重的方法，避免changeArr出现重复的元素
+    quchong(arr) {
+      return arr.filter(function (item, index, arr) {
+        return arr.indexOf(item, 0) === index;
+      });
+    },
     // 获取搜索所有人
     getSuo() {
       getAll().then((res) => {
@@ -608,10 +664,10 @@ export default {
     },
     // 让select失去焦点
     blurSelect() {
-      this.$refs.headerSearchSelect.blur();
-      this.$refs.aa.blur();
-      this.$refs.bb.blur();
-      this.$refs.cc.blur();
+      // this.$refs.headerSearchSelect.blur();
+      // this.$refs.aa.blur();
+      // this.$refs.bb.blur();
+      // this.$refs.cc.blur();
     },
     // 多选框选中数据
     handleSelectionChange(selection) {
@@ -621,8 +677,12 @@ export default {
     },
     /** 新增按钮操作 */
     handleAdd() {
+      this.form1.absentIds = [];
+      this.form1.joinId = [];
+      this.form1.peopleIds = [];
       // 主持人 人员
-      (this.renYuan = []), this.reset();
+      this.renYuan = [];
+      this.reset();
       this.style = 2;
       this.getTreeselect();
       this.open = true;
@@ -641,13 +701,13 @@ export default {
           }
         }
         if (this.result.joinId !== "") {
-          this.result.joinId = response.data.joinId.split(",");
+          this.form1.joinId = response.data.joinId.split(",");
         }
         if (this.result.peopleIds !== "" && this.result.peopleIds != null) {
-          this.result.peopleIds = response.data.peopleIds.split(",");
+          this.form1.peopleIds = response.data.peopleIds.split(",");
         }
         if (this.result.absentIds !== "" && this.result.absentIds != null) {
-          this.result.absentIds = response.data.absentIds.split(",");
+          this.form1.absentIds = response.data.absentIds.split(",");
         }
         this.form = this.result;
         this.form.unitId = row.unitId;
@@ -672,27 +732,28 @@ export default {
     /** 提交按钮 */
     submitForm(style) {
       this.style = style;
+      this.form.joinId = this.form1.joinId;
       this.$refs["form"].validate((valid) => {
         if (valid) {
           if (this.form.id != null) {
-            if (this.form.joinId !== undefined) {
-              this.form.joinId = this.form.joinId.join(",");
+            if (this.form1.joinId !== undefined) {
+              this.form.joinId = this.form1.joinId.join(",");
             }
             if (
-              this.form.peopleIds !== undefined &&
-              this.form.peopleIds != null &&
-              this.form.peopleIds != ""
+              this.form1.peopleIds !== undefined &&
+              this.form1.peopleIds != null &&
+              this.form1.peopleIds != ""
             ) {
-              this.form.peopleIds = this.form.peopleIds.join(",");
+              this.form.peopleIds = this.form1.peopleIds.join(",");
             } else {
               this.form.peopleIds = "";
             }
             if (
-              this.form.absentIds !== undefined &&
-              this.form.absentIds != null &&
-              this.form.absentIds != ""
+              this.form1.absentIds !== undefined &&
+              this.form1.absentIds != null &&
+              this.form1.absentIds != ""
             ) {
-              this.form.absentIds = this.form.absentIds.join(",");
+              this.form.absentIds = this.form1.absentIds.join(",");
             } else {
               this.form.absentIds = "";
             }
@@ -703,29 +764,29 @@ export default {
             });
           } else {
             if (
-              this.form.peopleIds != null &&
-              this.form.peopleIds.length != 0 &&
-              this.form.peopleIds != ""
+              this.form1.peopleIds != null &&
+              this.form1.peopleIds.length != 0 &&
+              this.form1.peopleIds != ""
             ) {
-              this.form.peopleIds = this.form.peopleIds.join(",");
+              this.form.peopleIds = this.form1.peopleIds.join(",");
             } else {
               this.form.peopleIds = "";
             }
             if (
-              this.form.absentIds != null &&
-              this.form.absentIds != "" &&
-              this.form.absentIds.length != 0
+              this.form1.absentIds != null &&
+              this.form1.absentIds != "" &&
+              this.form1.absentIds.length != 0
             ) {
-              this.form.absentIds = this.form.absentIds.join(",");
+              this.form.absentIds = this.form1.absentIds.join(",");
             } else {
               this.form.absentIds = "";
             }
-            (this.form.joinId = this.form.joinId.join(",")),
-              addBdglmeeting(this.form).then((response) => {
-                this.$modal.msgSuccess("新增成功");
-                this.open = false;
-                this.getList();
-              });
+            this.form.joinId = this.form1.joinId.join(",");
+            addBdglmeeting(this.form).then((response) => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
           }
         }
       });
@@ -929,4 +990,8 @@ export default {
 ::v-deep .el-select__input {
   color: #fff !important;
 }
+
+.colors {
+  color: #ccc !important;
+}
 </style>

src/views/grassrootsregistration/bdglparty/index.vue

@@ -208,7 +208,6 @@
                 :key="i"
                 :label="item.name"
                 :value="item.id"
-                :disabled="item.status == 1"
                 @click.native="ZhuChiRen(item.name)"
                 class="input_xiala"
               >
@@ -240,11 +239,13 @@
           <el-form-item label="参加人" prop="joinId" class="joinId">
             <el-select
               ref="abc"
-              v-model="form.joinId"
+              v-model="form1.joinId"
               multiple
               placeholder="请选择参加人"
               class="input_xiala"
               filterable
+              @remove-tag="removeSelect"
+              @change="changeSelect"
             >
               <el-option
                 v-for="item in renYuan"
@@ -252,6 +253,8 @@
                 :label="item.name"
                 :value="item.name"
                 class="input_xiala"
+                :disabled="item.disabled"
+                :class="item.disabled == true ? 'colors' : ''"
               >
               </el-option>
             </el-select>
@@ -259,18 +262,22 @@
           <el-form-item label="列席人" class="joinId">
             <el-select
               ref="abcd"
-              v-model="form.peopleIds"
+              v-model="form1.peopleIds"
               multiple
               placeholder="请选择列席人"
               class="input_xiala"
               filterable
+              @remove-tag="removeSelect"
+              @change="changeSelect"
             >
               <el-option
                 v-for="item in renYuan"
                 :key="item.id"
                 :label="item.name"
+                :disabled="item.disabled"
                 :value="item.name"
                 class="input_xiala"
+                :class="item.disabled == true ? 'colors' : ''"
               >
               </el-option>
             </el-select>
@@ -278,18 +285,22 @@
           <el-form-item label="缺席人" class="joinId">
             <el-select
               ref="abcde"
-              v-model="form.absentIds"
+              v-model="form1.absentIds"
               multiple
               placeholder="请选择缺席人"
               class="input_xiala"
               filterable
+              @remove-tag="removeSelect"
+              @change="changeSelect"
             >
               <el-option
                 v-for="item in renYuan"
                 :key="item.id"
                 :label="item.name"
                 :value="item.name"
+                :disabled="item.disabled"
                 class="input_xiala"
+                :class="item.disabled == true ? 'colors' : ''"
               >
               </el-option>
             </el-select>
@@ -359,7 +370,6 @@ import { quillEditor } from "vue-quill-editor";
 // 树形
 import Treeselect from "@riophae/vue-treeselect";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
-import loginVue from "../../login.vue";
 import { getShouBu, getAll } from "@/api/grassrootsregistration/bdglmeeting";
 export default {
   name: "Bdglparty",
@@ -414,6 +424,11 @@ export default {
         unitId: null,
       },
       // 表单参数
+      form1: {
+        joinId: "",
+        peopleIds: "",
+        absentIds: "",
+      },
       form: {},
       // 表单校验
       rules: {
@@ -460,6 +475,7 @@ export default {
       },
       // 修改拿到的数据
       result: {},
+      changeArr: [], //存放选中选项的数组
     };
   },
   created() {
@@ -469,6 +485,43 @@ export default {
     this.onEditor();
   },
   methods: {
+    //change方法
+    changeSelect() {
+      for (var key in this.form1) {
+        this.form1[key].forEach((item) => {
+          this.changeArr.push(item);
+        });
+      }
+      //有可能会出现重复的元素，所以对changeArr数组进行去重操作
+      this.changeArr = this.quchong(this.changeArr);
+      //对changeArr进行遍历，对hobbyList进行遍历，
+      //changeArr有哪一项，就把hobbyList中该项的disabled属性置为true，禁用
+      this.changeArr.forEach((item) => {
+        this.renYuan.forEach((yitem) => {
+          if (item === yitem.name) {
+            yitem.disabled = true;
+          }
+        });
+      });
+    },
+    //remove-tag方法，移除某一项时触发该方法
+    removeSelect(val) {
+      //将移除的那一项，从changeArr数组中找到下标，并移除
+      var str = this.changeArr.findIndex((item) => item === val);
+      this.changeArr.splice(str, 1);
+      //对hobbyList数组遍历，将移除的那项disabled属性置为false，启用
+      this.renYuan.forEach((item) => {
+        if (val === item.name) {
+          item.disabled = false;
+        }
+      });
+    },
+    //数组去重的方法，避免changeArr出现重复的元素
+    quchong(arr) {
+      return arr.filter(function (item, index, arr) {
+        return arr.indexOf(item, 0) === index;
+      });
+    },
     // 获取搜索所有人
     getSuo() {
       getAll().then((res) => {
@@ -502,6 +555,9 @@ export default {
     // 获取主持人
     getZhuChi(id) {
       getZhuChiRen(id).then((res) => {
+        res.data.forEach((item) => {
+          item.disabled = false;
+        });
         this.renYuan = res.data;
       });
     },
@@ -596,8 +652,12 @@ export default {
     },
     /** 新增按钮操作 */
     handleAdd() {
+      this.form1.absentIds = [];
+      this.form1.joinId = [];
+      this.form1.peopleIds = [];
       // 人员
-      (this.renYuan = []), (this.style = 2);
+      this.renYuan = [];
+      this.style = 2;
       this.reset();
       this.getTreeselect();
       this.open = true;
@@ -613,13 +673,13 @@ export default {
       getBdglparty(id).then((response) => {
         this.result = response.data;
         if (this.result.joinId !== "") {
-          this.result.joinId = response.data.joinId.split(",");
+          this.form1.joinId = response.data.joinId.split(",");
         }
         if (this.result.peopleIds !== "" && this.result.peopleIds != null) {
-          this.result.peopleIds = response.data.peopleIds.split(",");
+          this.form1.peopleIds = response.data.peopleIds.split(",");
         }
         if (this.result.absentIds !== "" && this.result.absentIds != null) {
-          this.result.absentIds = response.data.absentIds.split(",");
+          this.form1.absentIds = response.data.absentIds.split(",");
         }
         this.form = this.result;
         this.open = true;
@@ -641,28 +701,29 @@ export default {
     /** 提交按钮 */
     submitForm(style) {
       this.style = style;
+      this.form.joinId = this.form1.joinId;
       this.$refs["form"].validate((valid) => {
         this.style = style;
         if (valid) {
           if (this.form.id != null) {
-            if (this.form.joinId !== undefined) {
-              this.form.joinId = this.form.joinId.join(",");
+            if (this.form1.joinId !== undefined) {
+              this.form.joinId = this.form1.joinId.join(",");
             }
             if (
-              this.form.peopleIds !== undefined &&
-              this.form.peopleIds != null &&
-              this.form.peopleIds != ""
+              this.form1.peopleIds !== undefined &&
+              this.form1.peopleIds != null &&
+              this.form1.peopleIds != ""
             ) {
-              this.form.peopleIds = this.form.peopleIds.join(",");
+              this.form.peopleIds = this.form1.peopleIds.join(",");
             } else {
               this.form.peopleIds = "";
             }
             if (
-              this.form.absentIds !== undefined &&
-              this.form.absentIds != null &&
-              this.form.absentIds != ""
+              this.form1.absentIds !== undefined &&
+              this.form1.absentIds != null &&
+              this.form1.absentIds != ""
             ) {
-              this.form.absentIds = this.form.absentIds.join(",");
+              this.form.absentIds = this.form1.absentIds.join(",");
             } else {
               this.form.absentIds = "";
             }
@@ -673,29 +734,29 @@ export default {
             });
           } else {
             if (
-              this.form.peopleIds != null &&
-              this.form.peopleIds.length != 0 &&
-              this.form.peopleIds != ""
+              this.form1.peopleIds != null &&
+              this.form1.peopleIds.length != 0 &&
+              this.form1.peopleIds != ""
             ) {
-              this.form.peopleIds = this.form.peopleIds.join(",");
+              this.form.peopleIds = this.form1.peopleIds.join(",");
             } else {
               this.form.peopleIds = "";
             }
             if (
-              this.form.absentIds != null &&
-              this.form.absentIds != "" &&
-              this.form.absentIds.length != 0
+              this.form1.absentIds != null &&
+              this.form1.absentIds != "" &&
+              this.form1.absentIds.length != 0
             ) {
-              this.form.absentIds = this.form.absentIds.join(",");
+              this.form.absentIds = this.form1.absentIds.join(",");
             } else {
               this.form.absentIds = "";
             }
-            (this.form.joinId = this.form.joinId.join(",")),
-              addBdglparty(this.form).then((response) => {
-                this.$modal.msgSuccess("新增成功");
-                this.open = false;
-                this.getList();
-              });
+            this.form.joinId = this.form1.joinId.join(",");
+            addBdglparty(this.form).then((response) => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
           }
         }
       });
@@ -922,4 +983,7 @@ export default {
 ::v-deep .el-select__input {
   color: #fff !important;
 }
+.colors {
+ color: #ccc !important;
+}
 </style>

src/views/grassrootsregistration/bdglsoldier/index.vue

@@ -93,7 +93,6 @@
       :header-cell-style="{ background: '#003c69', color: 'white' }"
     >
       <el-table-column type="selection" width="55" align="center" />
-      <!-- <el-table-column label="序号" align="center" prop="id" /> -->
       <el-table-column label="序号" type="index" width="50" align="center">
         <template scope="scope">
           <span>{{
@@ -102,12 +101,6 @@
         </template>
       </el-table-column>
       <el-table-column label="单位" align="center" prop="deptName" />
-      <!-- <el-table-column
-        label="会议议题"
-        align="center"
-        prop="title"
-        show-overflow-tooltip
-      /> -->
       <el-table-column label="会议议题" align="center" show-overflow-tooltip>
         <template slot-scope="scope">
           <span>{{ onEditor(scope.row.title) }}</span>
@@ -151,6 +144,8 @@
       </el-table-column>
     </el-table>
 
+    
+
     <pagination
       v-show="total > 0"
       :total="total"
@@ -176,7 +171,6 @@
           label-width="80px"
           :inline="true"
         >
-          <el-table-column type="selection" width="55" align="center" />
           <el-form-item label="单位" prop="unitId">
             <treeselect
               v-model="form.unitId"
@@ -236,11 +230,14 @@
         </el-form-item> -->
           <el-form-item label="参加人" prop="joinId" class="joinId">
             <el-select
-              ref="bb"
-              v-model="form.joinId"
+              ref="abc"
+              v-model="form1.joinId"
               multiple
               placeholder="请选择参加人"
+              class="input_xiala"
               filterable
+              @remove-tag="removeSelect"
+              @change="changeSelect"
             >
               <el-option
                 v-for="item in renYuan"
@@ -248,42 +245,54 @@
                 :label="item.name"
                 :value="item.name"
                 class="input_xiala"
+                :disabled="item.disabled"
+                :class="item.disabled == true ? 'colors' : ''"
               >
               </el-option>
             </el-select>
           </el-form-item>
           <el-form-item label="列席人" class="joinId">
             <el-select
-              ref="cc"
-              v-model="form.peopleIds"
+              ref="abcd"
+              v-model="form1.peopleIds"
               multiple
               placeholder="请选择列席人"
+              class="input_xiala"
               filterable
+              @remove-tag="removeSelect"
+              @change="changeSelect"
             >
               <el-option
                 v-for="item in renYuan"
                 :key="item.id"
                 :label="item.name"
+                :disabled="item.disabled"
                 :value="item.name"
                 class="input_xiala"
+                :class="item.disabled == true ? 'colors' : ''"
               >
               </el-option>
             </el-select>
           </el-form-item>
           <el-form-item label="缺席人" class="joinId">
             <el-select
-              ref="dd"
-              v-model="form.absentIds"
+              ref="abcde"
+              v-model="form1.absentIds"
               multiple
               placeholder="请选择缺席人"
+              class="input_xiala"
               filterable
+              @remove-tag="removeSelect"
+              @change="changeSelect"
             >
               <el-option
                 v-for="item in renYuan"
                 :key="item.id"
                 :label="item.name"
                 :value="item.name"
+                :disabled="item.disabled"
                 class="input_xiala"
+                :class="item.disabled == true ? 'colors' : ''"
               >
               </el-option>
             </el-select>
@@ -309,8 +318,6 @@
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="submitForm">确 定</el-button>
         <el-button @click="cancel" size="btn">取消</el-button>
-
-        <!-- <el-button @click="cancel">取 消</el-button> -->
       </div>
     </el-dialog>
 
@@ -444,6 +451,13 @@ export default {
       buMeng: [],
       // 外面人员
       renYuans: [],
+      // 表单参数
+      form1: {
+        joinId: "",
+        peopleIds: "",
+        absentIds: "",
+      },
+      changeArr: [], //存放选中选项的数组
     };
   },
   created() {
@@ -453,6 +467,43 @@ export default {
     this.onEditor();
   },
   methods: {
+    //change方法
+    changeSelect() {
+      for (var key in this.form1) {
+        this.form1[key].forEach((item) => {
+          this.changeArr.push(item);
+        });
+      }
+      //有可能会出现重复的元素，所以对changeArr数组进行去重操作
+      this.changeArr = this.quchong(this.changeArr);
+      //对changeArr进行遍历，对hobbyList进行遍历，
+      //changeArr有哪一项，就把hobbyList中该项的disabled属性置为true，禁用
+      this.changeArr.forEach((item) => {
+        this.renYuan.forEach((yitem) => {
+          if (item === yitem.name) {
+            yitem.disabled = true;
+          }
+        });
+      });
+    },
+    //remove-tag方法，移除某一项时触发该方法
+    removeSelect(val) {
+      //将移除的那一项，从changeArr数组中找到下标，并移除
+      var str = this.changeArr.findIndex((item) => item === val);
+      this.changeArr.splice(str, 1);
+      //对hobbyList数组遍历，将移除的那项disabled属性置为false，启用
+      this.renYuan.forEach((item) => {
+        if (val === item.name) {
+          item.disabled = false;
+        }
+      });
+    },
+    //数组去重的方法，避免changeArr出现重复的元素
+    quchong(arr) {
+      return arr.filter(function (item, index, arr) {
+        return arr.indexOf(item, 0) === index;
+      });
+    },
     // 获取搜索所有人
     getSuo() {
       getAll().then((res) => {
@@ -573,10 +624,10 @@ export default {
     },
     // 让select失去焦点
     blurSelect() {
-      this.$refs.aa.blur();
-      this.$refs.bb.blur();
-      this.$refs.cc.blur();
-      this.$refs.dd.blur();
+      // this.$refs.aa.blur();
+      // this.$refs.bb.blur();
+      // this.$refs.cc.blur();
+      // this.$refs.dd.blur();
     },
     // 多选框选中数据
     handleSelectionChange(selection) {
@@ -587,6 +638,9 @@ export default {
     /** 新增按钮操作 */
     handleAdd() {
       // 人员列表
+      this.form1.absentIds = [];
+      this.form1.joinId = [];
+      this.form1.peopleIds = [];
       this.reset();
       this.renYuan = [];
       this.getTreeselect();
@@ -603,13 +657,13 @@ export default {
       getBdglsoldier(id).then((response) => {
         this.result = response.data;
         if (this.result.joinId !== "") {
-          this.result.joinId = response.data.joinId.split(",");
+          this.form1.joinId = response.data.joinId.split(",");
         }
         if (this.result.peopleIds !== "" && this.result.peopleIds != null) {
-          this.result.peopleIds = response.data.peopleIds.split(",");
+          this.form1.peopleIds = response.data.peopleIds.split(",");
         }
         if (this.result.absentIds !== "" && this.result.absentIds != null) {
-          this.result.absentIds = response.data.absentIds.split(",");
+          this.form1.absentIds = response.data.absentIds.split(",");
         }
         this.form = this.result;
         this.open = true;
@@ -630,27 +684,28 @@ export default {
 
     /** 提交按钮 */
     submitForm() {
+      this.form.joinId = this.form1.joinId;
       this.$refs["form"].validate((valid) => {
         if (valid) {
           if (this.form.id != null) {
-            if (this.form.joinId !== undefined) {
-              this.form.joinId = this.form.joinId.join(",");
+            if (this.form1.joinId !== undefined) {
+              this.form.joinId = this.form1.joinId.join(",");
             }
             if (
-              this.form.peopleIds !== undefined &&
-              this.form.peopleIds != null &&
-              this.form.peopleIds != ""
+              this.form1.peopleIds !== undefined &&
+              this.form1.peopleIds != null &&
+              this.form1.peopleIds != ""
             ) {
-              this.form.peopleIds = this.form.peopleIds.join(",");
+              this.form.peopleIds = this.form1.peopleIds.join(",");
             } else {
               this.form.peopleIds = "";
             }
             if (
-              this.form.absentIds !== undefined &&
-              this.form.absentIds != null &&
-              this.form.absentIds != ""
+              this.form1.absentIds !== undefined &&
+              this.form1.absentIds != null &&
+              this.form1.absentIds != ""
             ) {
-              this.form.absentIds = this.form.absentIds.join(",");
+              this.form.absentIds = this.form1.absentIds.join(",");
             } else {
               this.form.absentIds = "";
             }
@@ -661,24 +716,24 @@ export default {
             });
           } else {
             if (
-              this.form.peopleIds != null &&
-              this.form.peopleIds.length != 0 &&
-              this.form.peopleIds != ""
+              this.form1.peopleIds != null &&
+              this.form1.peopleIds.length != 0 &&
+              this.form1.peopleIds != ""
             ) {
-              this.form.peopleIds = this.form.peopleIds.join(",");
+              this.form.peopleIds = this.form1.peopleIds.join(",");
             } else {
               this.form.peopleIds = "";
             }
             if (
-              this.form.absentIds != null &&
-              this.form.absentIds != "" &&
-              this.form.absentIds.length != 0
+              this.form1.absentIds != null &&
+              this.form1.absentIds != "" &&
+              this.form1.absentIds.length != 0
             ) {
-              this.form.absentIds = this.form.absentIds.join(",");
+              this.form.absentIds = this.form1.absentIds.join(",");
             } else {
               this.form.absentIds = "";
             }
-            this.form.joinId = this.form.joinId.join(",");
+            this.form.joinId = this.form1.joinId.join(",");
             addBdglsoldier(this.form).then((response) => {
               this.$modal.msgSuccess("新增成功");
               this.open = false;
@@ -901,4 +956,7 @@ export default {
 ::v-deep .el-select__input {
   color: #fff !important;
 }
+.colors {
+  color: #ccc !important;
+}
 </style>