From 8d94a4a0a987f586a9f7f8826ebb76c19387f207 Mon Sep 17 00:00:00 2001
From: heyujie <516346543@qq.com>
Date: 星期五, 26 三月 2021 17:19:40 +0800
Subject: [PATCH] 人员任务分配

---
 src/pages/shuohuangMonitorAnalyze/components/taskManage.vue |  495 +++++++++++++++++++++++++++++-------------------------
 1 files changed, 269 insertions(+), 226 deletions(-)

diff --git a/src/pages/shuohuangMonitorAnalyze/components/taskManage.vue b/src/pages/shuohuangMonitorAnalyze/components/taskManage.vue
index df42df8..1d93278 100644
--- a/src/pages/shuohuangMonitorAnalyze/components/taskManage.vue
+++ b/src/pages/shuohuangMonitorAnalyze/components/taskManage.vue
@@ -25,8 +25,8 @@
                 v-model="keyword1"
                 placeholder="璇疯緭鍏ユ満杞﹀彿"
                 size="small"
-                style="margin: 0 10px;"
-                clearable="true"
+                style="margin: 0 10px"
+                clearable
               ></el-input>
             </div>
             <div>
@@ -35,8 +35,8 @@
                 v-model="keyword2"
                 placeholder="璇疯緭鍏ヨ溅娆�"
                 size="small"
-                style="margin: 0 10px;"
-                clearable="true"
+                style="margin: 0 10px"
+                clearable
               ></el-input>
             </div>
             <div>
@@ -45,39 +45,41 @@
                 v-model="keyword3"
                 placeholder="璇疯緭鍏ュ徃鏈哄鍚�"
                 size="small"
-                style="margin: 0 10px;"
-                clearable="true"
+                style="margin: 0 10px"
+                clearable
               ></el-input>
             </div>
             <el-button
               type="primary"
               @click="renderVideoTable"
               size="small"
-              style="margin-right:10px;"
-            >鎼滅储</el-button>
-            <!-- <el-checkbox v-model="isShowUndistributedOnly">浠呮樉绀烘湭鍒嗛厤</el-checkbox> -->
-            <el-checkbox v-model="notAssignedOnly">浠呮樉绀烘湭鍒嗛厤</el-checkbox>
+              style="margin-right: 10px"
+              >鎼滅储</el-button
+            >
+            <el-checkbox v-model="notAssignedOnly" @change="renderVideoTable">浠呮樉绀烘湭鍒嗛厤</el-checkbox>
           </div>
           <div class="video-list">
             <el-checkbox-group v-model="trainNochecked">
               <el-collapse v-model="actCollapseName">
                 <el-collapse-item
                   :name="vkey"
-                  v-for="(v,vkey,i) in videoPackageList"
+                  v-for="(v, vkey, i) in videoPackageList"
                   :key="i"
                 >
                   <template slot="title">
                     <div>
                       <el-checkbox
-                        :label="i"
-                        style="padding-right:10px;"
+                        :label="vkey"
+                        style="padding-right: 10px"
                       ></el-checkbox>
-                      <span>{{vkey}}({{v.length}})</span>
+                      <span>{{ vkey }}({{ v.length }})</span>
                     </div>
                   </template>
                   <div class="video-detail" v-for="video in v" :key="video.ID">
-                    <i class="el-icon-film" style="margin-left: 20px;"></i>
-                    <span style="padding-left: 10px;">{{video.VideoName}}</span>
+                    <i class="el-icon-film" style="margin-left: 20px"></i>
+                    <span style="padding-left: 10px">{{
+                      video.VideoName
+                    }}</span>
                   </div>
                 </el-collapse-item>
               </el-collapse>
@@ -96,9 +98,19 @@
       </div>
       <div class="top-right partment">
         <div class="header">
-         <el-checkbox v-model="isAllCheck" :indeterminate="isIndeterminate"  @change="handleCheckAllChange"></el-checkbox>
+          <el-checkbox
+            v-model="isAllCheck"
+            :indeterminate="isIndeterminate"
+            @change="handleCheckAllChange"
+          ></el-checkbox>
           <div class="title">浜哄憳鍒楄〃</div>
-          <el-input size="small" @input="searchName" v-model="inputName" placeholder="璇疯緭鍏ュ唴瀹�" clearable="true"></el-input>
+          <el-input
+            size="small"
+            @input="searchName"
+            v-model="inputName"
+            placeholder="璇疯緭鍏ュ唴瀹�"
+            clearable
+          ></el-input>
         </div>
         <div class="body">
           <!-- <div class="flex-box">
@@ -107,9 +119,12 @@
             <el-button type="primary" size="mini" @click="selOrg">閫夋嫨閮ㄩ棬</el-button>
           </div> -->
           <div class="person-list">
-            <el-checkbox-group v-model="memberChecked" @change="handleCheckedCitiesChange">
+            <el-checkbox-group
+              v-model="memberChecked"
+              @change="handleCheckedCitiesChange"
+            >
               <div class="person" v-for="person in personList" :key="person.ID">
-                <el-checkbox :label="person.ID">{{person.Name}}</el-checkbox>
+                <el-checkbox :label="person.ID">{{ person.Name }}</el-checkbox>
               </div>
             </el-checkbox-group>
             <el-button
@@ -117,7 +132,8 @@
               type="primary"
               @click="toAddAssignList"
               size="small"
-            >鍔犲叆寰呭垎閰嶅垪琛�</el-button>
+              >鍔犲叆寰呭垎閰嶅垪琛�</el-button
+            >
           </div>
         </div>
       </div>
@@ -127,18 +143,24 @@
       <div class="header">
         <div class="title">浠诲姟鍒楄〃</div>
         <div class="header-right flex-box">
-          <el-radio-group v-model="taskType" size="mini">
+          <el-radio-group v-model="taskType" size="mini" @change="renderTaskTable">
             <el-radio-button label="1">寰呭垎閰�</el-radio-button>
             <el-radio-button label="2">宸插垎閰�</el-radio-button>
           </el-radio-group>
           <el-input
             class="keyword-input"
-            placeholder="璇疯緭鍏�"
+            placeholder="鎼滅储鍏抽敭瀛�"
             v-model="keyWordOfTask"
             size="mini"
-            style="margin-left: 10px;"
+            style="margin-left: 10px"
+            @input="reRenderWhenClear"
+            clearable
           >
-            <el-button slot="append" icon="el-icon-search" @click="renderTaskTable"></el-button>
+            <el-button
+              slot="append"
+              icon="el-icon-search"
+              @click="searchKeyword"
+            ></el-button>
           </el-input>
         </div>
       </div>
@@ -148,31 +170,54 @@
             type="primary"
             size="small"
             @click="distributeTask"
-            v-if="taskType==1&&taskVideoChecked.length"
-          >鍒嗛厤浠诲姟</el-button>
+            v-if="taskType == 1"
+            >鍒嗛厤浠诲姟</el-button
+          >
         </div>
         <el-table
           class="thbg"
           :data="taskTableData"
+          v-if="taskTableData"
           ref="elTable"
           @selection-change="taskTableSelection"
           v-loading
         >
-          <el-table-column v-if="taskType==1" type="selection" width="55"></el-table-column>
-          <el-table-column prop="LocomotiveNumber" label="鏈鸿溅鍙�"></el-table-column>
+          <el-table-column
+            v-if="taskType == 1"
+            type="selection"
+            width="55"
+          ></el-table-column>
+          <el-table-column prop="Title" label="鏈鸿溅鍙�"></el-table-column>
           <el-table-column label="瑙嗛鏁伴噺">
             <template slot-scope="scope">
-              <div>{{scope.row.LKGList.length}}</div>
+              <div>{{ scope.row.LKGList.length }}</div>
             </template>
           </el-table-column>
-          <el-table-column prop="DistributionUser" label="鍒嗛厤浜�"></el-table-column>
-          <el-table-column prop="DistributionDate" label="鍒嗛厤鏃堕棿"></el-table-column>
-          <el-table-column prop="HandlingUsers" label="澶勭悊浜�"></el-table-column>
+          <el-table-column
+            prop="DistributionUser"
+            label="鍒嗛厤浜�"
+          ></el-table-column>
+          <el-table-column
+            prop="DistributionDate"
+            label="鍒嗛厤鏃堕棿"
+          ></el-table-column>
+          <el-table-column
+            prop="HandlingUsers"
+            label="澶勭悊浜�"
+          ></el-table-column>
           <el-table-column label="鎿嶄綔">
             <template slot-scope="scope">
               <div class="operation">
-                <span @click="cancelDistribute(scope.row)" v-show="taskType==1">鍙栨秷鍒嗛厤</span>
-                <span @click="cancelDistribute(scope.row)" v-show="taskType==2">鍙栨秷鎸囨淳</span>
+                <span
+                  @click="cancelDistribute(scope.row)"
+                  v-show="taskType == 1"
+                  >鍙栨秷鍒嗛厤</span
+                >
+                <span
+                  @click="cancelDistribute(scope.row)"
+                  v-show="taskType == 2"
+                  >鍙栨秷鎸囨淳</span
+                >
                 <!-- <span @click="toggleCollapse(scope.row)">鏌ョ湅/闅愯棌杞︽</span> -->
               </div>
             </template>
@@ -183,13 +228,15 @@
                 class="video-item"
                 v-for="video in scope.row.LKGList"
                 :key="video.ID"
-              >{{video.VideoName}}</div>
+              >
+                {{ video.VideoName }}
+              </div>
             </template>
           </el-table-column>
         </el-table>
       </div>
     </div>
-    <el-dialog :visible="orgTreeDialogVisible">
+    <!-- <el-dialog :visible="orgTreeDialogVisible">
       <div>
         <el-tree
           :data="organizeData"
@@ -201,124 +248,109 @@
           :highlight-current="true"
         ></el-tree>
         <div slot="footer" class="btns">
-          <el-button size="small" @click="orgTreeDialogVisible=false">鍙栨秷</el-button>
-          <el-button size="small" type="primary" @click="searchMemberByOrg">纭畾</el-button>
+          <el-button size="small" @click="orgTreeDialogVisible = false"
+            >鍙栨秷</el-button
+          >
+          <el-button size="small" type="primary" @click="searchMemberByOrg"
+            >纭畾</el-button
+          >
         </div>
       </div>
-    </el-dialog>
+    </el-dialog> -->
   </div>
 </template>
 
 <script>
-import { getOrganizeTree, getMemberByOrg, getVideoListBySearch, addToAssignList, getTaskList, distributeTask, cancelMission } from '@/api/shuohuang';
+import {
+  getOrganizeTree,
+  getMemberByOrg,
+  getVideoListBySearch,
+  addToAssignList,
+  getTaskList,
+  distributeTask,
+  cancelMission,
+} from "@/api/shuohuang";
 export default {
-  data () {
+  data() {
     return {
-      isAllCheck:false,
-      taskType: '1',
-      keyWordOfTask: '',
-      // videoSearchTime: [],
-      pickerOptions: {
-        shortcuts: [{
-          text: '浠婂ぉ',
-          onClick (picker) {
-            const end = new Date();
-            const start = new Date();
-            start.setHours(0, 0, 0);
-            picker.$emit('pick', [start, end]);
-          }
-        }, {
-          text: '鏄ㄥぉ',
-          onClick (picker) {
-            const end = new Date();
-            const start = new Date();
-            start.setTime(start.getTime() - 3600 * 1000 * 24);
-            start.setHours(0, 0, 0);
-            end.setTime(end.getTime() - 3600 * 1000 * 24);
-            end.setHours(23, 59, 59);
-            picker.$emit('pick', [start, end]);
-          }
-        }, {
-          text: '杩戜竴鍛�',
-          onClick (picker) {
-            const end = new Date();
-            const start = new Date();
-            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
-            //start.setHours(0,0,0);
-            picker.$emit('pick', [start, end]);
-          }
-        }]
-      },
+      isAllCheck: false,
+      taskType: "1",
+      keyWordOfTask: "",
       isShowUndistributedOnly: false,
       videoPackageList: {},
       trainNochecked: [],
-      // trainNoCurPage: 1,
-      // trainNoPageSize: 8,
-      // trainNoPageSizes: [5, 8, 12],
       trainNoTotal: 0,
-      keyword1: '',
-      keyword2: '',
-      keyword3: '',
-      actCollapseName: '',
-      checkedOrg: {},
-      orgTreeDialogVisible: false,
-      organizeData: [],
+      keyword1: "",
+      keyword2: "",
+      keyword3: "",
+      actCollapseName: "",
       personList: [],
       memberChecked: [],
-      taskTableData: [],
+      taskTableData: null,
       taskVideoChecked: [],
       notAssignedOnly: false,
-      isIndeterminate:false,
-      inputName:""
-    }
+      isIndeterminate: false,
+      inputName: "",
+    };
   },
-  mounted () {
-    this.getOrganizeTreeData();
+  mounted() {
+    // this.getOrganizeTreeData();
     this.refreshAll();
   },
-  watch: {
-    taskType (n, o) {
-      this.renderTaskTable();
-    }
-  },
   methods: {
-    searchName(val){
-      console.log(this.personList ,val);
-      if (val=="") {
-        this.searchMemberByOrg()
+    reRenderWhenClear(val){
+      if (val.trim() == "") {
+        this.renderTaskTable()
       }
-      if (val.trim()=="") {
-        return 
+    },
+    searchName(val) {
+      console.log(this.personList, val);
+      if (val == "") {
+        this.searchMemberByOrg();
       }
-      this.personList = this.personList.filter(item=>{
-        return item.Name.indexOf(val)>-1
-      })
+      if (val.trim() == "") {
+        return;
+      }
+      this.personList = this.personList.filter((item) => {
+        return item.Name.indexOf(val) > -1;
+      });
     },
     handleCheckAllChange(val) {
-      let arr =[]
-      this.personList.forEach(item=>{
-        arr.push(item.ID)
-      })
-        this.memberChecked = val ? arr : [];
-        this.isIndeterminate = false;
-      },
-       handleCheckedCitiesChange(value) {
-        let checkedCount = value.length;
-        this.isAllCheck = checkedCount === this.personList.length;
-        this.isIndeterminate = checkedCount > 0 && checkedCount < this.personList.length;
-      },
-    cancelDistribute (row) {
-      cancelMission({ UniqeID: row.LKGList[0].UniqeID }).then(res => {
+      let arr = [];
+      this.personList.forEach((item) => {
+        arr.push(item.ID);
+      });
+      this.memberChecked = val ? arr : [];
+      this.isIndeterminate = false;
+    },
+    handleCheckedCitiesChange(value) {
+      let checkedCount = value.length;
+      this.isAllCheck = checkedCount === this.personList.length;
+      this.isIndeterminate =
+        checkedCount > 0 && checkedCount < this.personList.length;
+    },
+    cancelDistribute(row) {
+      let arr = row.LKGList.map((x) => x.ID);
+      cancelMission({ LkgIDs: arr }).then((res) => {
         if (res.success) {
           this.$notify({
-            type: 'success',
-            message: res.msg
+            type: "success",
+            message: res.msg,
           });
           this.refreshAll();
         }
-      })
+      });
     },
-    refreshAll () {
+    searchKeyword() {
+      const val = this.keyWordOfTask
+      this.taskTableData = this.taskTableData.filter((item) => {
+        const b1 = item.DistributionUser.indexOf(val) > -1;
+        const b2 = item.HandlingUsers.indexOf(val) > -1;
+        const b3 = item.Title.indexOf(val) > -1;
+        return b1 || b2 || b3;
+      });
+    },
+    refreshAll() {
       this.trainNochecked = [];
       this.checkedOrg = {};
       this.memberChecked = [];
@@ -326,121 +358,131 @@
       this.renderVideoTable();
       this.renderTaskTable();
     },
-    taskTableSelection (val) {
-      this.taskVideoChecked = val
+    taskTableSelection(val) {
+      let arr = val.map((item) => item.LKGList.map((x) => x.ID));
+      this.taskVideoChecked = arr;
     },
-    renderTaskTable () {
+    renderTaskTable() {
       let _this = this;
-      let params = {
-        IsPackage: 0,
-        Status: this.taskType
-      };
-      getTaskList(params).then(res => {
-        _this.taskTableData = res.data
-      })
+      getTaskList({
+        Status: this.taskType,
+      }).then((res) => {
+        _this.taskTableData = res.data;
+      });
     },
-    // handleTrainNoSizeChange (size) {
-    //   this.trainNoPageSize = size;
-    //   this.renderVideoTable();
-    // },
-    handleTrainNoCurChange () {
-      this.renderVideoTable();
-    },
-    renderVideoTable () {
+    renderVideoTable() {
       let _this = this;
-      let params = {
+      getVideoListBySearch({
         CarNumber: this.keyword1,
         TrainNumber: this.keyword2,
         DriverName: this.keyword3,
-        // PageIndex: this.trainNoCurPage,
-        // PageSize: this.trainNoPageSize,
         notAssignedOnly: this.notAssignedOnly,
-      };
-      getVideoListBySearch(params).then(res => {
-        _this.videoPackageList = res.data
+      }).then((res) => {
+        _this.videoPackageList = res.data;
         _this.trainNoTotal = res.total;
       });
     },
-    toAddAssignList () {
+    toAddAssignList() {
       let _this = this;
-      let params = {
-        UserID: this.memberChecked[0],
-        UniqeID: this.trainNochecked.join(',')
-      };
-      addToAssignList(params).then(res => {
+      let total = this.trainNochecked.length;
+      let people = this.memberChecked.length;
+      let least = (total / people) | 0;
+      let left = total % people;
+
+      let checkedTrain = [...this.trainNochecked];
+      let pickList = [];
+      for (let i = 0; i < people; i++) {
+        pickList[i] = [];
+        if (i < left) {
+          for (let j = 0; j < least + 1; j++) {
+            pickList[i].push(...this.videoPackageList[checkedTrain[0]]);
+            checkedTrain.shift();
+          }
+        } else {
+          for (let j = 0; j < least; j++) {
+            pickList[i].push(...this.videoPackageList[checkedTrain[0]]);
+            checkedTrain.shift();
+          }
+        }
+      }
+      let arr = pickList.map((a) => {
+        return a.map((item) => item.ID);
+      });
+
+      addToAssignList({
+        UserID: this.memberChecked,
+        LkgIDs: arr,
+      }).then((res) => {
         if (res.success) {
           this.$notify({
-            type: 'success',
-            message: res.msg
+            type: "success",
+            message: res.msg,
           });
           _this.refreshAll();
         }
-      })
+      });
     },
-    searchMemberByOrg () {
+    searchMemberByOrg() {
       let _this = this;
-      getMemberByOrg({}).then(res => {
+      getMemberByOrg({}).then((res) => {
         _this.personList = res.data;
         // _this.orgTreeDialogVisible = false;
-      })
+      });
     },
-    deepNodeChildren (node) {
-      if (node.ChildDept && node.ChildDept.length > 0) {
-        return node.ChildDept.map(child => {
-          let childObj = {};
-          childObj.id = child.ID;
-          childObj.label = child.Name;
-          childObj.Status = child.Status;
-          if (child.ChildDept) {
-            childObj.children = this.deepNodeChildren(child)
-          }
-          if (child.UserLst) {
-            childObj.children = this.deepNodeChildren(child)
-          }
-          return childObj;
-        });
-      } else if (node.UserLst && node.UserLst.length > 0) {
-        return node.UserLst.map(child => {
-          let childObj = {};
-          childObj.id = child.ID;
-          childObj.label = child.Name;
-          childObj.Status = child.Status;
-          return childObj;
-        });
-      }
-    },
-    checkOrgNode (a, b, c) {
-      this.checkedOrg = a
-    },
-    getOrganizeTreeData () {
+    // deepNodeChildren(node) {
+    //   if (node.ChildDept && node.ChildDept.length > 0) {
+    //     return node.ChildDept.map((child) => {
+    //       let childObj = {};
+    //       childObj.id = child.ID;
+    //       childObj.label = child.Name;
+    //       childObj.Status = child.Status;
+    //       if (child.ChildDept) {
+    //         childObj.children = this.deepNodeChildren(child);
+    //       }
+    //       if (child.UserLst) {
+    //         childObj.children = this.deepNodeChildren(child);
+    //       }
+    //       return childObj;
+    //     });
+    //   } else if (node.UserLst && node.UserLst.length > 0) {
+    //     return node.UserLst.map((child) => {
+    //       let childObj = {};
+    //       childObj.id = child.ID;
+    //       childObj.label = child.Name;
+    //       childObj.Status = child.Status;
+    //       return childObj;
+    //     });
+    //   }
+    // },
+    // checkOrgNode(a, b, c) {
+    //   this.checkedOrg = a;
+    // },
+    // getOrganizeTreeData() {
+    //   let _this = this;
+    //   getOrganizeTree().then((res) => {
+    //     _this.organizeData = res.data.map((item) => {
+    //       let obj = {};
+    //       obj.id = item.ID;
+    //       obj.label = item.Name;
+    //       obj.Status = item.Status;
+    //       obj.children = _this.deepNodeChildren(item);
+    //       return obj;
+    //     });
+    //   });
+    // },
+    distributeTask() {
       let _this = this;
-      getOrganizeTree().then(res => {
-        _this.organizeData = res.data.map(item => {
-          let obj = {};
-          obj.id = item.ID;
-          obj.label = item.Name;
-          obj.Status = item.Status;
-          obj.children = _this.deepNodeChildren(item);
-          return obj
-        })
-      })
-    },
-    distributeTask () {
-      let _this = this;
-      let arr = this.taskVideoChecked.map(train => train['LKGList'][0]['UniqeID'])
-      let params = {
-        UniqeID: arr.join(',')
-      }
-      distributeTask(params).then(res => {
+      distributeTask({
+        LkgIDs: this.taskVideoChecked,
+      }).then((res) => {
         _this.renderTaskTable();
-      })
+      });
     },
-
     // selOrg () {
     //   this.orgTreeDialogVisible = true;
     // },
-  }
-}
+  },
+};
 </script>
 
 <style lang="scss">
@@ -457,11 +499,12 @@
     height: 40px;
     .title {
       float: left;
-      padding-left: 20px;
       height: 40px;
+      padding-left: 10px;
+
       line-height: 40px;
       font-size: 14px;
-      font-family: 'PingFangSC-Semibold', 'PingFang SC Semibold', 'PingFang SC';
+      font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC";
     }
     .header-right {
       float: right;
@@ -491,7 +534,7 @@
         text-align: left;
         .el-checkbox-group {
           margin-bottom: 20px;
-          .el-checkbox__label{
+          .el-checkbox__label {
             display: none;
           }
           .video-detail {
@@ -507,18 +550,18 @@
       width: 360px;
       height: 465px;
       // overflow-y:auto;
-      .header{
-        .el-input{
-              line-height: 41px;
-            width: 185px;
-            font-size: 14px;
+      .header {
+        .el-input {
+          line-height: 41px;
+          width: 185px;
+          font-size: 14px;
         }
-        .el-checkbox{
+        .el-checkbox {
           float: left;
           padding-left: 20px;
           height: 40px;
           line-height: 40px;
-          font-size: 14px;  
+          font-size: 14px;
         }
       }
       .checked-org {
@@ -531,16 +574,16 @@
       .person-list {
         padding-top: 14px;
 
-        .el-checkbox-group{
+        .el-checkbox-group {
           height: 330px;
 
-        margin-bottom: 8px;
-        overflow: auto;
+          margin-bottom: 8px;
+          overflow: auto;
         }
         .person {
           text-align: left;
           margin-bottom: 10px;
-          
+
           padding-bottom: 6px;
           border-bottom: 1px solid #eee;
         }

--
Gitblit v1.8.0