hanbaoshan
2021-01-19 1af0c937466d8f8df26aaddd72dbd702dd0f3033
src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue
@@ -151,19 +151,19 @@
              </div>
              <div class="video-info">
                <div class="base-info">
                  <div>
                  <div class="flex-box">
                    <label>车号:</label>
                    <span>{{data.CarNumber}}</span>
                  </div>
                  <div>
                  <div class="flex-box">
                    <label>车次:</label>
                    <span>{{data.TrainNumber}}</span>
                  </div>
                  <div>
                  <div class="flex-box">
                    <label>时间:</label>
                    <span>{{data.VideoDate}}</span>
                  </div>
                  <div>
                  <div class="flex-box">
                    <label>司机|副司机:</label>
                    <span>{{data.Driver1}}|{{data.Driver2}}</span>
                  </div>
@@ -208,9 +208,9 @@
          <el-table-column label="修改日期" prop="UpdatedAt" sortable></el-table-column>
          <el-table-column label="创建日期" prop="CreatedAt" sortable></el-table-column>
          <el-table-column label="操作">
            <template>
            <template slot-scope="scope">
              <div class="operation">
                <i class="el-icon-star-off" style="font-size: 18px;"></i>
                <i class="el-icon-star-off"  @click="toggleFollow(scope.row)"></i>
              </div>
            </template>
          </el-table-column>
@@ -272,23 +272,38 @@
                </div>
              </div>
              <div class="players" ref="playerWrap">
                <div
                  class="video-item"
                  :ref="`gridVideoItem_${index}`"
                  v-for="(item,index) in videoWrapArr"
                  :key="index"
                >
                  <template v-if="index<=videoArrs.length-1">
                    <div :class="{'currentPlayer':curVideo.ID==videoArrs[index].ID}">
                      {{videoArrs[index].ID}}
                      <img
                        :src="CLIP+videoArrs[index].VideoCover"
                        style="width:100px"
                      />
                <template v-if="guid==1">
                  <div
                    class="video-item"
                    :ref="`gridVideoItem_${index}`"
                    v-for="(item,index) in videoWrapArr"
                    :key="index"
                  >
                    <div class="currentPlayer">
                      {{curVideo.ID}}
                      <img :src="CLIP+curVideo.VideoCover" style="width:100px" />
                    </div>
                  </template>
                </div>
                  </div>
                </template>
                <template v-else>
                  <div
                    class="video-item"
                    :ref="`gridVideoItem_${index}`"
                    v-for="(item,index) in videoWrapArr"
                    :key="index"
                  >
                    <template v-if="index<=videoArrs.length-1">
                      <div :class="{'currentPlayer':curVideo.ID==videoArrs[index].ID}">
                        {{videoArrs[index].ID}}
                        <img
                          :src="CLIP+videoArrs[index].VideoCover"
                          style="width:100px"
                        />
                      </div>
                    </template>
                  </div>
                </template>
                <!-- <div
                  class="video-item"
                  :class="{'active':item.ID==curVideo.ID}"
@@ -534,7 +549,7 @@
    },
    removeCurLabel (ParentID, Time) {
      delLabel({ ParentID, Time }).then(res => {
      })
    },
    renderLabelOpts () {
@@ -548,11 +563,11 @@
      let label = this.labelOptions.find(label => label.ID == id);
      return label.Name;
    },
    checkVideo (video,index) {
    checkVideo (video, index) {
      this.curVideo = video;
      debugger
      if(index>0&&this.guid==1){
        this.videoWrapArr
      if (index > 0 && this.guid == 1) {
        //this.videoWrapArr =
      }
    },
    handleTabSizeChange (size) {
@@ -694,6 +709,7 @@
    },
    setGuid (guid) {
      let _this = this;
      this.guid = guid;
      // for(var i = 0; i < Math.pow(guid,2); i++){
      //   if(i>this.videoArrs.length-1){
      //       this.videoWrapArr[i] = this.videoArrs[i]
@@ -922,12 +938,12 @@
            padding: 0px 12px;
            border: 1px solid #ccc;
            &:hover {
              color: #6486e7;
              border-color: #6486e7;
              color: #7695ec;
              border-color: #7695ec;
            }
            &.checked {
              color: #3d68e1;
              border-color: #3d68e1;
              color: #409eff;
              border-color: #409eff;
            }
          }
        }
@@ -977,12 +993,15 @@
            padding: 2px 5px;
            cursor: pointer;
            border: 1px solid #eee;
            background-color: #ecf0fc;
            border-radius: 3px;
            color: #777;
            &.menu {
              margin-right: 10px;
            }
            &.current {
              border-color: #3d68e1;
              border-color: #409eff;
              background-color: #fff;
            }
          }
        }
@@ -1041,8 +1060,9 @@
          font-size: 20px;
          right: 10px;
          bottom: 10px;
          color: #ccc;
          .follow {
            color: #3d68e1;
            color: #409eff;
          }
        }
      }
@@ -1067,6 +1087,7 @@
      }
      .title-partment {
        font-size: 14px;
        font-weight: 500;
        color: #333;
        line-height: 18px;
        margin-bottom: 8px;
@@ -1075,6 +1096,9 @@
        background: #fff;
        padding: 10px;
        border-radius: 3px;
        .flex-box > label {
          color: #777;
        }
      }
      .title {
        font-size: 18px;
@@ -1092,6 +1116,9 @@
              color: #cacaca;
              padding-left: 12px;
              cursor: pointer;
              &.activegongge {
                color: #3d68e1;
              }
            }
          }
          .video-area {
@@ -1101,10 +1128,10 @@
              margin-right: 10px;
              .video-name {
                cursor: pointer;
                color: #666;
                color: #777;
                margin-bottom: 10px;
                &.current {
                  color: #3d68e1;
                  color: #409eff;
                }
                i {
                  padding-right: 4px;
@@ -1142,6 +1169,9 @@
                  font-size: 15px;
                  font-weight: bold;
                  color: #409eff;
                  span {
                    padding-right: 5px;
                  }
                  i[class^='el-icon'] {
                    padding: 3px;
                  }