朔黄人员管理页面调试

hanbaoshan

2021-01-28 262119fd58357f1d930d65a6e3252176d29b2ce5

朔黄人员管理页面调试

 public/index.html

@@ -367,9 +367,9 @@
      cursor: pointer;
    }

    /* .flex-box{
    .flex-box{
      display: flex;
    } */
    }
    .el-button--primary {
      color: #FFFFFF;
      background-color: #3D68E1 !important;

 src/api/shuohuang.ts

@@ -119,10 +119,17 @@
    method: 'post',
    data
  })
export const uploadDirectory = (data:any) =>{
export const uploadDirectory = (data:any) =>
  request({
    url:'/data/api-c/user/uploadMulti',
    method:'post',
    data
  })

export const uploadFile = (data:any) =>{
  request({
    url:'/data/api-c/user/uploadFile',
    method:'post',
    data
  })
}

 src/pages/datapush/index/RightEvent.vue

@@ -184,11 +184,59 @@
        <b>规则</b>
        <div class="div-border" v-html="taskEditData.eventTxt"></div>
      </div>
      <div class="config-item">
        <b>推送字段</b>
        <el-button type="primary" size="mini" @click="pushFieldDialog=true">设置</el-button>
      </div>
      <div class="save-btn">
        <el-button type="info" size="small" @click="onCancle" style="color:#222">取消</el-button>
        <el-button type="primary" @click="eventPushsSave" size="small">保存</el-button>
      </div>
    </div>
    <el-dialog
      :visible="pushFieldDialog"
      :append-to-body="false"
      :close-on-click-modal="false"
      class="dialog-push-field"
      @close="pushFieldDialog=false"
    >
      <div slot="title" class="slot-title">
        <p>请选择想要推送的字段</p>
        <div class="right">
          <el-checkbox v-model="allFieldChecked"></el-checkbox>
        </div>
      </div>
      <div class="check-area" v-for="configObj in pushFields" :key="configObj.id">
        <div class="header">
          <div class="title">{{configObj.name}}</div>
          <div class="right">
            <el-checkbox v-model="configObj.checked" @change="toggleConfigCheck(configObj)">全选</el-checkbox>
          </div>
        </div>
        <div class="flex-box flex-wrap">
          <div class="param flex-box" v-for="param in configObj.children" :key="param.id">
            <el-checkbox v-model="param.checked"></el-checkbox>
            <span class="param-name">{{param.name}}</span>
            <el-input
              v-model="param.alias"
              size="mini"
              :ref="`input_${param.id}`"
              @input="varifyField(param)"
              :style="{color:param.error?'red':'',borderColor:param.error?'red':''}"
            ></el-input>
          </div>
        </div>
      </div>
      <div slot="footer" class="text-center">
        <el-button size="small">取消</el-button>
        <el-button
          size="small"
          type="primary"
          :disabled="disabledPushFieldSet"
          @click="submitPushFieldSet"
        >保存</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
@@ -208,11 +256,11 @@
    }
  },
  computed: {
    urls() {
    urls () {
      return this.taskEditData.urls
    }
  },
  data() {
  data () {
    return {
      taskEditData: {},
      dataList: [],
@@ -236,11 +284,15 @@
        operatorTypeOpionts: {},
        ruleValueOptions: []
      },
      pushFieldDialog: false,
      pushFields: [],
      allFieldChecked: false,
      disabledPushFieldSet: true,
    };
  },
  watch: {
    eventObject: {
      handler(newVal, oldVal) {
      handler (newVal, oldVal) {
        this.taskEditData.enable = this.eventObject.enable;
        if (newVal !== oldVal) {
          if (this.taskEditData.id !== newVal.id) {
@@ -273,31 +325,107 @@
        }
      },
      deep: true
    },
    pushFields: {
      handler (n, o) {
        let _this = this;
        let flag = false;
        n.forEach(configObj => {
          let notChecked = configObj.children.find(param => !param.checked);
          if (!notChecked) {
            configObj.checked = true;
          } else {
            configObj.checked = false;
          }
          let someoneChecked = configObj.children.find(param => param.checked);
          if (someoneChecked) {
            flag = true
          }

        });
        if (flag) {
          this.disabledPushFieldSet = false;
        } else {
          this.disabledPushFieldSet = true;
        }
      },
      deep: true
    }
  },
  created() {
  created () {
    this.reAdd();
  },
  mounted() {
    // 加载字典字典
  mounted () {
    // 加载字典
    this.findByType();
    this.getCameras();
    this.getTasks();
    this.getPushFields();
  },
  methods: {
    addUrl() {
    varifyField (param) {
      var reg = /^[A-Za-z]+[0-9-_]?$/;
      if (!reg.test(param.alias)) {
        this.$message('请输入合法字段名');
        debugger
        param.error = true;
      } else {
        param.error = false;
      }
      // this.pushFields.forEach(configObj => {
      //   configObj.children.find(param => param.error)
      // })

    },
    submitPushFieldSet () {
      let flag = false;
      this.pushFields.forEach(configObj => {
        let errorOne = configObj.children.find(param => param.checked && param.error);
        if (errorOne) {
          this.$notify({
            type: 'error',
            message: '请将选中字段输入合法字段名'
          })
          flag = true
        }
      });
      if(flag){
        return
      }
      alert('submit')
    },
    toggleConfigCheck (configObj) {
      configObj.children.forEach(child => {
        child.checked = configObj.checked
      })
    },
    getPushFields () {
      this.pushFields = [
        {          id: 'sxjxx', name: '摄像机信息', checked: false, alias: '',
          children: [
            { name: '摄像机ID', checked: false, alias: 'cameraID', id: 'cameraID', children: null },
            { name: '摄像机名称', checked: false, alias: 'cameraName', id: 'cameraName', children: null },
            { name: '摄像机地址', checked: false, alias: 'cameraAddr', id: 'cameraAddr', children: null },
            { name: '摄像机址', checked: false, alias: 'cameraAdr', id: 'cameraAdr', children: null }
          ]        },
        {          id: 'cjxx', name: '场景信息', checked: false, alias: '',
          children: [{ name: '场景ID', checked: false, alias: 'taskId', id: 'tskId', children: null }]        },
      ];

    },
    addUrl () {
      this.taskEditData.urls.push({
        checked: true,
        hash: Math.random().toString(36).substr(2),
        url: "",
      });
    },
    delUrl(index) {
    delUrl (index) {
      this.$set(this.taskEditData.urls, index, this.baseRule)
      this.taskEditData.urls.splice(index, 1)
    },
    // 保存
    async eventPushsSave() {
    async eventPushsSave () {
      // 判断保存的ip是否符合格式要求
      if (this.taskEditData.urls.length < 1) {
        this.$notify({
@@ -372,7 +500,7 @@
      }
    },
    // 查找字典
    async findByType() {
    async findByType () {
      let res = await findDictionaryByType();
      if (res && res.success) {
        this.dictionary = Object.assign(this.dictionary, res.data)
@@ -386,7 +514,7 @@
        })
      }
    },
    async getCameras() {
    async getCameras () {
      let rsp = await findByEventTopic({ topic: 'camera', type: 'name' });
      if (rsp && rsp.success) {
        this.dictionary['camera'] = rsp.data
@@ -402,7 +530,7 @@
        })
      }
    },
    async getTasks() {
    async getTasks () {
      this.dictionary['task'] = []
      let rsp = await getTaskList();
      if (rsp && rsp.success) {
@@ -419,22 +547,22 @@
      }
    },
    // 新建配置
    createSet() {
    createSet () {
      this.dataList.push(JSON.parse(JSON.stringify(this.baseRule)));
    },
    cleanSet() {
    cleanSet () {
      this.dataList.splice(0, this.dataList.length);
    },
    // 添加子规则
    addRule() {
    addRule () {
      this.dataList.push(JSON.parse(JSON.stringify(this.baseRule)));
    },
    // 删除子规则
    delRule(index) {
    delRule (index) {
      this.dataList.splice(index, 1);
    },
    // 规则中下拉框的选择回调
    selectTopic(rule, resetNext = false) {
    selectTopic (rule, resetNext = false) {
      rule.topicTypeOptions.forEach(element => {
        if (element.value === rule.topic_type) {
          rule.topicArgOptions = element.children;
@@ -445,7 +573,7 @@
        }
      });
    },
    selectArg(rule, resetNext = false) {
    selectArg (rule, resetNext = false) {
      let argInfo = rule.topicArgOptions.filter(arg => {
        return arg.value === rule.topic_arg
      })
@@ -464,7 +592,7 @@
        this.selectOperator(rule, resetNext)
      }
    },
    selectOperator(rule, resetNext = false) {
    selectOperator (rule, resetNext = false) {
      if (rule.operator_type === "option") {
        rule.ruleValueOptions = this.dictionary[rule.topic_type] ? this.dictionary[rule.topic_type] : []
        rule.rule_values = rule.rule_value.split(",")
@@ -475,11 +603,11 @@
        rule.rule_values = [];
      }
    },
    selectValue(rule, val) {
    selectValue (rule, val) {
      rule.rule_value = val.join(",")
    },
    // 根据value返回对应的name
    getNameByValue(arr, value) {
    getNameByValue (arr, value) {
      let s = arr.find(item => {
        return item.value === value;
      });
@@ -487,7 +615,7 @@
      return s.name;
    },
    // 清空重新新增
    reAdd() {
    reAdd () {
      this.taskEditData = {
        id: "",
        name: "",
@@ -516,7 +644,7 @@
      };
      this.dataList = [];
    },
    onCancle() {
    onCancle () {
      this.$emit('onCancle')
    }
  }
@@ -574,7 +702,12 @@
      margin-left: 895px;
    }
  }

  .config-item {
    margin: 20px 0;
    b {
      margin-right: 10px;
    }
  }
  .el-button--text {
    text-decoration: unset;
  }
@@ -604,5 +737,72 @@
    color: #3d68e1;
    line-height: 39px;
  }
  .dialog-push-field {
    .el-button--primary.is-disabled,
    .el-button--primary.is-disabled:hover {
      background-color: #9eb4f0 !important;
      border-color: #9eb4f0 !important;
    }
    .el-dialog {
      width: 910px;
      height: 700px;
      .el-dialog__body {
        padding-top: 14px;
        height: 540px;
        overflow-y: auto;
      }
    }
    .text-center {
      text-align: center;
    }
    .slot-title {
      position: relative;
      .right {
        position: absolute;
        top: 0;
        right: 30px;
      }
    }
    .check-area {
      padding-bottom: 10px;
      .header {
        position: relative;
        background: #efefef;
        line-height: 30px;
        margin-bottom: 14px;
        font-weight: bold;
        .title {
          border-left: 3px solid #2481fa;
          padding-left: 10px;
        }
        .right {
          position: absolute;
          top: 0;
          right: 30px;
        }
      }
      .flex-box.flex-wrap {
        flex-wrap: wrap;
      }
      .param.flex-box {
        word-break: keep-all;
        align-items: center;
        margin: 0 10px;
        min-width: 260px;
        margin-bottom: 10px;
        .param-name {
          margin: 0 5px;
        }
        .el-input {
          border-color: #dcdfe6;
          color: #606266;
          .el-input__inner {
            color: inherit;
            border-color: inherit;
          }
        }
      }
    }
  }
}
</style>

 src/pages/shuohuangMonitorAnalyze/components/charts/line.vue

@@ -16,7 +16,7 @@
    initLineChart () {
      this.$nextTick(() => {
        let dom = this.$echarts.init(this.$refs['lineChart']);
        dom.setOption(this.options);
        dom && dom.setOption(this.options);
      })
    }
  }

 src/pages/shuohuangMonitorAnalyze/components/memberManage.vue

@@ -98,6 +98,15 @@
            </template>
          </el-table-column>
        </el-table>
        <el-pagination
          @size-change="handleTableSizeChange"
          @current-change="renderMemberTable"
          :current-page.sync="PageIndex"
          :page-size="PageSize"
          :page-sizes="pageSizes"
          layout="total,sizes, prev, pager, next"
          :total="tableTotal"
        ></el-pagination>
      </div>
    </div>
    <el-dialog
@@ -196,12 +205,16 @@
        <p class="tip">
          *请提前根据文件模板中的要求收集人员信息，在一个文件夹中存放人员照片和EXCEL文件
          (
          <a href="javascript:;" @mouseover="showDemo=true" @mouseout="showDemo=false">示例</a>),点击
          <a
            href="javascript:;"
            @mouseover="showDemo=true"
            @mouseout="showDemo=false"
          >示例</a>),点击
          <a href="javascript:;">下载模板.excel</a>
          <img class="tip-demo" v-if="showDemo" :src="`${publicPath}images/shuohuang/tip.jpg`" alt />
        </p>
        <div class="flex-box">
          <label>上传文件:</label>
          <label>上传文件夹:</label>
          <el-button size="mini" type="primary" @click="uploadDirectoryTrigger">点击上传</el-button>
          <input ref="directoryInput" @change="importDirectory" hidden type="file" webkitdirectory />
        </div>
@@ -211,15 +224,6 @@
          <el-table-column prop="time" label="上传时间"></el-table-column>
          <el-table-column prop="state" label="状态"></el-table-column>
        </el-table>
        <el-pagination
          @size-change="handleTableSizeChange"
          @current-change="renderMemberTable"
          :current-page.sync="PageIndex"
          :page-size="PageSize"
          :page-sizes="pageSizes"
          layout="total,sizes, prev, pager, next"
          :total="tableTotal"
        ></el-pagination>
      </div>
    </el-dialog>
  </div>
@@ -227,7 +231,7 @@

<script>

import { getShuohuangDepartTree, getOrganizeTree, getMemberList, updateMemberInfo, addMember, updateUnit, uploadMemberPic, uploadDirectory } from '@/api/shuohuang'
import { getShuohuangDepartTree, getOrganizeTree, getMemberList, updateMemberInfo, addMember, updateUnit, uploadMemberPic, uploadDirectory, uploadFile } from '@/api/shuohuang'

export default {
  data () {
@@ -276,7 +280,6 @@
  },
  methods: {
    nodeContextMenu (e, data, node, comp) {
      debugger
      this.showMenu = true;
      this.menuTop = e.pageY;
      this.menuLeft = e.pageX;
@@ -310,8 +313,9 @@
    memberSave () {
      this.$refs['memberForm'].validate((valid) => {
        if (valid) {
          let params = Object.assign({DeptID:this.curLeftTreeNode.id},this.memberEditForm);
          if (this.memberEditForm.ID) {
            updateMemberInfo(this.memberEditForm).then(res => {
            updateMemberInfo(params).then(res => {
              if (res.success) {
                this.$notify({
                  type: 'success',
@@ -319,16 +323,19 @@
                });
                this.memberEditDialogVisible = false;
                this.renderMemberTable();
                this.searchLeftTreeData();
              }
            })
          } else {
            addMember(this.memberEditForm).then(res => {
            addMember(params).then(res => {
              if (res.success) {
                this.$notify({
                  type: 'success',
                  message: res.msg
                })
                this.renderMemberTable();
                this.memberEditDialogVisible = false;
                this.searchLeftTreeData();
              }
            })
          }
@@ -338,11 +345,10 @@
      })
    },
    delMember (member) {
      member.IsDel = true;
      member.IsDel = '1';
      this.memberUpdate(member);
    },
    editMember (member) {
      debugger
      this.memberEditDialogVisible = true;
      this.memberEditForm = member;
    },
@@ -354,11 +360,12 @@
            message: res.msg
          });
          this.renderMemberTable();
          this.searchLeftTreeData();
        }
      })
    },
    checkNode (a, b, c) {
      if (a.children) {
      if (a.hasOwnProperty('children')) {
        this.curLeftTreeNode = a;
        this.deptId = a.id;
        this.renderMemberTable();
@@ -379,6 +386,7 @@
      }
      getMemberList(params).then(res => {
        _this.tableData = res.data;
        _this.tableTotal = res.total;
      })
    },
    uploadPic () {
@@ -387,19 +395,18 @@
    uploadDirectoryTrigger () {
      this.$refs['directoryInput'].click();
    },
    // uploadExeclTrigger(){
    //   this.$refs['excelInput'].click();
    // },
    importDirectory () {
      //this.$refs['directoryInput'].files //文件夹map
      let formData = new FormData;
      formData.append('File', this.$refs['directoryInput'].files)
      debugger
      // uploadDirectory(formData).then(res=>{
      //   debugger
      for(var file in this.$refs['directoryInput'].files){
        formData.append('files', this.$refs['directoryInput'].files[file])
      }
      //formData.append('files', this.$refs['directoryInput'].files)

      // })

      uploadDirectory(formData).then(res=>{
        debugger
          
      })
    },

    handleRemove () {
@@ -423,8 +430,10 @@
    },

    deepNodeChildren (node) {
      var arr1 = [];
      var arr2 = [];
      if (node.ChildDept && node.ChildDept.length > 0) {
        return node.ChildDept.map(child => {
        arr1 = node.ChildDept.map(child => {
          let childObj = {};
          childObj.id = child.ID;
          childObj.label = child.Name;
@@ -437,8 +446,9 @@
          }
          return childObj;
        });
      } else if (node.UserLst && node.UserLst.length > 0) {
        return node.UserLst.map(child => {
      }
      if (node.UserLst && node.UserLst.length > 0) {
        arr2 = node.UserLst.map(child => {
          let childObj = {};
          childObj.id = child.ID;
          childObj.label = child.Name;
@@ -446,6 +456,7 @@
          return childObj;
        });
      }
      return arr1.concat(arr2)
    },
    getOrganizeTreeData () {
      let _this = this;
@@ -472,9 +483,13 @@
          return obj
        });
        this.$nextTick(() => {
          _this.$refs['leftTreeNodes'].setCurrentNode(_this.treeData[0]);
          _this.curLeftTreeNode = _this.treeData[0];
          _this.checkNode(_this.treeData[0]);
          if(!Object.keys(_this.curLeftTreeNode).length){
            _this.curLeftTreeNode = _this.treeData[0];
            _this.$refs['leftTreeNodes'].setCurrentNode(_this.treeData[0]);
          }else{
            _this.$refs['leftTreeNodes'].setCurrentNode(_this.curLeftTreeNode);
          }
          _this.checkNode(_this.curLeftTreeNode);
        })

      })
@@ -542,6 +557,9 @@
        .el-form-item__label {
          width: 100px;
        }
        .el-form-item__error {
          left: 120px;
        }
      }
    }
    .el-input {

 src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue

@@ -117,14 +117,14 @@
      <div class="header-bar clearfix">
        <div class="left">
          <div>
            <el-select v-model="watch" size="mini">
              <el-option value label="全部"></el-option>
              <el-option value="1" label="未关注"></el-option>
              <el-option value="2" label="已关注"></el-option>
            <el-select v-model="IsFollow" size="mini" @change="filterSearchData">
              <el-option value='' label="全部"></el-option>
              <el-option :value="false" label="未关注"></el-option>
              <el-option :value="true" label="已关注"></el-option>
            </el-select>
          </div>
          <div>
            <el-select v-model="settle" size="mini">
            <el-select v-model="settle" size="mini" >
              <el-option value label="全部"></el-option>
              <el-option value="1" label="未处理"></el-option>
              <el-option value="2" label="已处理"></el-option>
@@ -255,6 +255,7 @@
    return {
      CLIP: 'http://192.168.20.113/',
      keyword: '',
      IsFollow: '',
      searchTime: [this.$moment(new Date().getTime() - 3600 * 1000 * 24 * 5).format("YYYY-MM-DD HH:mm:ss"), this.$moment(new Date()).format("YYYY-MM-DD HH:mm:ss")],
      curTabPage: 1,
      curTablePage: 1,
@@ -308,7 +309,6 @@
      highLevelConfigs: [],
      showAdvance: true,
      fixedOneLineHeight: 40,
      watch: '',
      settle: '',
      showType: 'menu',
      tableData: [
@@ -318,8 +318,7 @@
      tabData: [
        { id: 'ss1', no: 'SS4B115', frequency: '8084', time: '2020-09-21 20:45:08', driver: '张三', marks: ['未呼唤、呼唤不标准', '学习司机未应答'], markType: 1, tags: ['进出站', '司机离岗'], follow: true },
        { id: 'ss2', no: 'SS4B115', frequency: '8084', time: '2020-09-21 20:45:08', driver: '张三', marks: [], markType: 0, tags: ['进出站', '司机离岗'], follow: false }
      ],

      ], 
      videoDialogVisible: false,
      hiddenDanger: 1,
      labelDialogVisible: false,
@@ -339,7 +338,6 @@
  },
  methods: {
    handleTabSizeChange (size) {
      debugger
      this.tabPageSize = size;
      this.filterSearchData()
    },
@@ -353,13 +351,22 @@
    //二级查询
    filterSearchData () {
      let _this = this;
      let isFollow = '';
      if(this.IsFollow === ''){
        isFollow = ''
      }else if(!!this.IsFollow){
        isFollow = '1'
      }else{
        isFollow = '0'
      }
      let query = {
        KeyWord: this.keyword,
        StartDate: this.searchTime[0],
        EndDate: this.searchTime[1],
        PageIndex: this.showType == 'list' ? this.curTablePage : this.showType == 'list',
        PageSize: this.showType == 'list' ? this.tablePageSize : this.tabPageSize,
        IsDetail: this.showType == 'list'
        IsDetail: this.showType == 'list',
        IsFollow: isFollow
      };
      let filterQuerys = [];
      this.checkedConfigs.forEach(config => {
@@ -393,7 +400,8 @@
        EndDate: this.searchTime[1],
        PageIndex: this.showType == 'list' ? this.curTablePage : this.showType == 'list',
        PageSize: this.showType == 'list' ? this.tablePageSize : this.tabPageSize,
        IsDetail: this.showType == 'list'
        IsDetail: this.showType == 'list',
        IsFollow: this.IsFollow
      };
      this.optionalConfigs = [];
      this.highLevelConfigs = [];
@@ -543,6 +551,9 @@
<style lang="scss">
.search-for-video-analyze {
  padding: 20px 30px;
  .flex-box{
    display: flex;
  }
  .filter-area {
    .input-area {
      display: flex;

 src/pages/shuohuangMonitorAnalyze/components/taskManage.vue

@@ -73,7 +73,7 @@
          </div>
        </div>
      </div>
      <div class="top-right partment">
      <div class="top-right partment" style="max-height: 500px; overflow-y:auto;">
        <div class="header">
          <div class="title">人员列表</div>
        </div>

 src/pages/shuohuangMonitorAnalyze/components/videoAnalyze.vue

@@ -97,7 +97,7 @@
            <el-radio :label="0">无异常</el-radio>
            <el-radio :label="1">有异常</el-radio>
          </el-radio-group>
          

          <el-button
            icon="el-icon-plus"
            size="mini"
@@ -204,15 +204,15 @@
    }
  },
  watch: {
    'curVideo.LableLst':{
      handler(n,o){
        if(n.length>0){
    'curVideo.LableLst': {
      handler (n, o) {
        if (n.length > 0) {
          this.isUnusual = 1
        }else{
        } else {
          this.isUnusual = 0
        }
      },
      deep:true
      deep: true
    },
    videoDetails: {
      handler (newVal, oldVal) {
@@ -228,16 +228,16 @@
    this.getVideos(this.videoDetails);
  },
  methods: {
    checkCurVideo(index){
      if(this.relativeVideos[index]){
        this.curVideo = this.relativeVideos[index]
    checkCurVideo (index) {
      if (this.relativeVideos[index]) {
        this.curVideo = this.relativeVideos[index];
        this.refreshCurVideoLabel(this.curVideo);
      }
    },
    getVideos (video) {
      let _this = this;
      getRelatedVideoInfo({ UniqeID: video.UniqeID }).then(res => {
        console.log(res)
        
        res.data.forEach(element => {
          element.marks = _this.mergeMarks(element)
          console.log(element.marks)
@@ -245,10 +245,10 @@
        _this.curVideo = res.data[0];
        _this.videoArrs = res.data;
        _this.relativeVideos = res.data;
        this.$nextTick(()=>{
        this.$nextTick(() => {
          _this.$refs[`player_${_this.curVideo.ID}`][0].init();
        })
        

      })
    },
    renderLabelOpts () {
@@ -257,15 +257,24 @@
        _this.labelOptions = res.data
      })
    },
    refreshCurVideoLabel (video) {
      getRelatedVideoInfo({ UniqeID: video.UniqeID }).then(res => {
        res.data.forEach(d => {
          if(d.ID === video.ID){
            video.LableLst = d.LableLst
          }
          // let someVideo = _this.videoArrs.find(video => video.ID === d.ID);
          // someVideo.LableLst = d.LableLst
        })
      })
    },
    checkVideo (video, index) {
      this.refreshCurVideoLabel(video);
      this.curVideo = video;
      this.$nextTick(()=>{
      this.$nextTick(() => {
        this.$refs[`player_${this.curVideo.ID}`][0].init();
      })
      
      if (index > 0 && this.guid == 1) {
        //this.videoWrapArr = 
      }

    },

    setGuid (guid) {
@@ -279,12 +288,10 @@
      //     }
      // }
      this.videoWrapArr = Math.pow(guid, 2);

      this.$nextTick(() => {
        for (var i = 0; i < Math.pow(guid, 2); i++) {
          this.$refs[`gridVideoItem_${i}`][0].style.width = this.$refs['playerWrap'].offsetWidth / guid + 'px';
          this.$refs[`gridVideoItem_${i}`][0].style.height = this.$refs['playerWrap'].offsetHeight / guid + 'px';

        }
      })
    },
@@ -305,28 +312,32 @@
          }
        }
      })
      

      let query = {
        ID: this.selectedLabelId,
        ParentID: this.isCheckAllVideo ? tempArr.join(',') : this.curVideo.ID + '',
        Time: Math.round(this.setLabelTime) + '',
        Codes: this.labelCheckedList.join(','),
        Desc: desc.join(',')
        Desc: desc.join('，')
      };
      editLabel(query).then(rsp => {
        if (rsp && rsp.success) {
          _this.labelDialogVisible = false;

          _this.videoArrs.forEach(video=>{
            video.LableLst = []
          });
          this.$set(_this.curVideo,'LableLst',[]);
          //_this.curVideo.LableLst = [];
          rsp.data.forEach(label=>{
            let someVideo = _this.videoArrs.find(video=>video.ID === label.ParentID);
            someVideo.LableLst.push(label);
            if(label.ParentID == _this.curVideo.ID){
               _this.curVideo.LableLst.push(label)
            }
          })
          //_this.curVideo.LableLst = rsp.data;
          this.$message.success("添加成功")
          // getRelatedVideoInfo({ UniqeID: _this.videoDetails.UniqeID }).then(res => {
          //   res.data.forEach(d => {
          //     let someVideo = _this.videoArrs.find(video => video.ID === d.ID);
          //     someVideo.LableLst = d.LableLst
          //   })
          // })

          this.$message.success("添加成功")
          // 标注
          _this.setMarks(this.curVideo)
        } else {
@@ -344,16 +355,18 @@
    },
    editCurLabel (mark) {
      this.selectedLabelId = mark.ID;
      this.labelCheckedList = mark.Codes.split(",");
      this.labelCheckedList = mark.Codes.split(" ,");
      this.labelDialogVisible = true;
    },
    removeCurLabel (mark) {
      let _this = this;
      delLabel({ ID: mark.ID, ParentID: this.curVideo.ID }).then(rsp => {
        if (rsp && rsp.success) {
          this.curVideo.LableLst = rsp.data;
          _this.curVideo.LableLst = rsp.data;
          this.$message.success("删除成功")
          // 标注
          this.setMarks(this.curVideo)
          debugger
          _this.setMarks(_this.curVideo)
        } else {
          this.$message.warning(rsp.msg)
        }
@@ -469,7 +482,7 @@
          }
        }
      }
      .fixed-height-box{
      .fixed-height-box {
        height: 200px;
        overflow-y: auto;
      }