人员管理,任务管理接口调试,左侧导航图标更新

hanbaoshan

2021-01-15 fb9b3e1f1fcf57d213f6f68c09445e368bb70a4e

 src/pages/shuohuangMonitorAnalyze/components/taskManage.vue

@@ -31,27 +31,45 @@
            <div></div>
            <el-button
              type="primary"
              @click="searchVideoList"
              @click="renderVideoTable"
              size="mini"
              style="margin-right:10px;"
            >搜索</el-button>
            <el-checkbox v-model="isShowUndistributedOnly">仅显示未分配</el-checkbox>
            <!-- <el-checkbox v-model="isShowUndistributedOnly">仅显示未分配</el-checkbox> -->
          </div>
          <div class="video-list">
            <el-collapse v-model="actCollapseName">
              <el-collapse-item :name="trainNo.id" v-for="trainNo in trainNoList" :key="trainNo.id">
                <template slot="title">
                  <div>
                    <el-checkbox v-model="trainNo.checked" style="padding-right:10px;"></el-checkbox>
                    <span>{{trainNo.no}}({{trainNo.videos.length}})</span>
            <el-checkbox-group v-model="trainNochecked">
              <el-collapse v-model="actCollapseName">
                <el-collapse-item
                  :name="trainNo.no"
                  v-for="trainNo in trainNoList"
                  :key="trainNo.id"
                >
                  <template slot="title">
                    <div>
                      <el-checkbox
                        :label="trainNo.videos[0]['UniqeID']"
                        style="padding-right:10px;"
                      ></el-checkbox>
                      <span>{{trainNo.no}}({{trainNo.videos.length}})</span>
                    </div>
                  </template>
                  <div class="video-detail" v-for="video in trainNo.videos" :key="video.ID">
                    <i class="el-icon-film" style="margin-left: 20px;"></i>
                    <span style="padding-left: 10px;">{{video.VideoName}}</span>
                  </div>
                </template>
                <div v-for="video in trainNo.videos" :key="video.id">
                  <i class="el-icon-film" style="margin-left: 20px;"></i>
                  <span style="padding-left: 10px;">{{video.name}}</span>
                </div>
              </el-collapse-item>
            </el-collapse>
                </el-collapse-item>
              </el-collapse>
            </el-checkbox-group>
            <el-pagination
              @size-change="handleTrainNoSizeChange"
              @current-change="handleTrainNoCurChange"
              :current-page.sync="trainNoCurPage"
              :page-size="trainNoPageSize"
              :page-sizes="trainNoPageSizes"
              layout="total,sizes, prev, pager, next"
              :total="trainNoTotal"
            ></el-pagination>
          </div>
        </div>
      </div>
@@ -66,9 +84,17 @@
            <el-button type="primary" size="mini" @click="selOrg">选择部门</el-button>
          </div>
          <div class="person-list">
            <div class="person" v-for="person in personList" :key="person.id">
              <el-checkbox v-model="person.personChecked">{{person.name}}</el-checkbox>
            </div>
            <el-checkbox-group v-model="memberChecked" :max="1">
              <div class="person" v-for="person in personList" :key="person.ID">
                <el-checkbox :label="person.ID">{{person.Name}}</el-checkbox>
              </div>
            </el-checkbox-group>
            <el-button
              v-show="memberChecked.length && trainNochecked.length"
              type="primary"
              @click="toAddAssignList"
              size="small"
            >加入待分配列表</el-button>
          </div>
        </div>
      </div>
@@ -89,35 +115,51 @@
            size="mini"
            style="margin-left: 10px;"
          >
            <el-button slot="append" icon="el-icon-search" @click="searchTask"></el-button>
            <el-button slot="append" icon="el-icon-search" @click="renderTaskTable"></el-button>
          </el-input>
        </div>
      </div>
      <div class="body table-area">
      <div class="table-area">
        <div class="actions">
          <el-button type="primary" size="small" @click="distributeTask">分配任务</el-button>
          <el-button
            type="primary"
            size="small"
            @click="distributeTask"
            v-if="taskVideoChecked.length"
          >分配任务</el-button>
        </div>
        <el-table class="thbg" :data="taskTableData" ref="elTable">
          <el-table-column type="expand">
            <template slot-scope="props">
              <div class="video-item" v-for="video in props.videos" :key="video.id">{{video.name}}</div>
            </template>
          </el-table-column>
          <el-table-column prop="trainNo" label="机车号"></el-table-column>
        <el-table
          class="thbg"
          :data="taskTableData"
          ref="elTable"
          @selection-change="taskTableSelection"
        >
          <el-table-column type="selection" width="55"></el-table-column>
          <el-table-column prop="LocomotiveNumber" label="机车号"></el-table-column>
          <el-table-column label="视频数量">
            <template slot-scope="scope">
              <div>{{scope.row.videos.length}}</div>
              <div>{{scope.row.LKGList.length}}</div>
            </template>
          </el-table-column>
          <el-table-column prop="person" label="分配人"></el-table-column>
          <el-table-column prop="time" label="分配时间"></el-table-column>
          <el-table-column prop="handle" 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)">取消分配/指派</span>
                <span @click="toggleCollapse(scope.row)">查看/隐藏车次</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>
          </el-table-column>
          <el-table-column type="expand">
            <template slot-scope="scope">
              <div
                class="video-item"
                v-for="video in scope.row.LKGList"
                :key="video.ID"
              >{{video.VideoName}}</div>
            </template>
          </el-table-column>
        </el-table>
@@ -144,7 +186,7 @@
</template>

<script>
import { getOrganizeTree } from '@/api/shuohuang';
import { getOrganizeTree, getMemberByOrg, getVideoListByTrainNumber, addToAssignList, getTaskList, distributeTask, cancelMission } from '@/api/shuohuang';
export default {
  data () {
    return {
@@ -183,30 +225,119 @@
        }]
      },
      isShowUndistributedOnly: false,
      trainNoList: [
        { no: 'SS4B115', id: 'SS4B115', videos: [{ id: 'SS4B115', name: 'SS4B115_06_B节二端司机室_20201115_091500.mp4' }, { id: 'SS4B116', name: 'SS4B116_06_B节二端司机室_20201115_091500.mp4' }] },
        { no: 'SS5B115', id: 'SS5B115', videos: [{ id: 'SS5B116', name: 'SS5B116_06_B节二端司机室_20201115_091500.mp4' }] }
      ],
      trainNoList: [],
      trainNochecked: [],
      trainNoCurPage: 1,
      trainNoPageSize: 8,
      trainNoPageSizes: [5, 8, 12],
      trainNoTotal: 0,
      videoListSearchWord: '',
      actCollapseName: '',
      checkedOrg: {},
      orgTreeDialogVisible: false,
      organizeData: [],

      personList: [
        { name: '张三', id: 'zs' },
        { name: '李斯', id: 'ls' }
      ],
      personList: [],
      memberChecked: [],
      taskTableData: [],
      taskVideoChecked: [],
    }
  },
  mounted () {
    this.getOrganizeTreeData();
    this.refreshAll();
  },
  watch: {
    taskType (n, o) {
      debugger
      this.renderTaskTable();
    }
  },
  methods: {
    searchMemberByOrg(){
      debugger
      
    cancelDistribute (row) {
      cancelMission({ UniqeID: row.LKGList[0].UniqeID }).then(res => {
        if (res.success) {
          this.$notify({
            type: 'success',
            message: res.msg
          });
          this.refreshAll();
        }
      })
    },
    refreshAll () {
      this.trainNochecked = [];
      this.checkedOrg = {};
      this.memberChecked = [];
      this.searchMemberByOrg();
      this.renderVideoTable();
      this.renderTaskTable();
    },
    taskTableSelection (val) {
      this.taskVideoChecked = val
    },
    renderTaskTable () {
      let _this = this;
      let params = {
        IsPackage: 0,
        Status: this.taskType
      };
      getTaskList(params).then(res => {
        _this.taskTableData = res.data
      })
    },
    handleTrainNoSizeChange (size) {
      this.trainNoPageSize = size;
      this.renderVideoTable();
    },
    handleTrainNoCurChange () {
      this.renderVideoTable();
    },
    renderVideoTable () {
      let _this = this;
      let params = {
        KeyWord: this.videoListSearchWord,
        StartDate: this.videoSearchTime[0],
        EndDate: this.videoSearchTime[1],
        PageIndex: this.trainNoCurPage,
        PageSize: this.trainNoPageSize,
        Status: 0,
        IsNeed: 0
      };
      getVideoListByTrainNumber(params).then(res => {
        let arr = [];
        for (var key in res.data) {
          let obj = {};
          obj['no'] = key;
          obj['videos'] = res.data[key];
          obj.checked = false;
          arr.push(obj);
        }
        _this.trainNoList = arr;
        _this.trainNoTotal = res.total;
      });
    },
    toAddAssignList () {
      let _this = this;
      let params = {
        UserID: this.memberChecked[0],
        UniqeID: this.trainNochecked.join(',')
      };
      addToAssignList(params).then(res => {
        if (res.success) {
          this.$notify({
            type: 'success',
            message: res.msg
          });
          _this.refreshAll();
        }
      })
    },
    searchMemberByOrg () {
      let _this = this;
      getMemberByOrg({ DeptID: this.checkedOrg.id || '' }).then(res => {
        _this.personList = res.data;
        _this.orgTreeDialogVisible = false;
      })
    },
    deepNodeChildren (node) {
      if (node.ChildDept && node.ChildDept.length > 0) {
@@ -250,17 +381,19 @@
      })
    },
    distributeTask () {

      let _this = this;
      let arr = this.taskVideoChecked.map(train => train['LKGList'][0]['UniqeID'])
      let params = {
        UniqeID: arr.join(',')
      }
      distributeTask(params).then(res => {
        _this.renderTaskTable();
      })
    },
    searchVideoList () {

    },
    selOrg () {
      this.orgTreeDialogVisible = true;
    },
    searchTask () {

    }
  }
}
</script>
@@ -311,6 +444,15 @@
      .video-list {
        margin-top: 14px;
        text-align: left;
        .el-checkbox-group {
          margin-bottom: 20px;
          .video-detail {
            i {
              //color: #409EFF;
            }
            color: #888;
          }
        }
      }
    }
    .top-right {