[FE]修改细节样式

security-protection-platform/src/modules/access/component/instrumentRecord/index.vue

        <t-button color="primary" @click="btnsearch">查询</t-button>
        <t-button @click="reset">重置</t-button>
      </div>
      <t-button color="primary" icon="upload" style="width:128px;height:32px" class="upload">导出至Excel</t-button>
       <t-button  icon="upload" style="width:128px;height:32px" class="upload">导出至Excel</t-button>
    </div> -->
    <div class="track-container">
            </div>
          </div>
          <div class="btns">
            <t-button color="primary" icon="upload" style="width:128px;height:32px" class="upload">导出至Excel</t-button>
            <t-button icon="upload" style="width:128px;height:32px" class="upload">导出至Excel</t-button>
            <t-dropdown :visibled="customVisibled" trigger-mode="custom">
              <t-button slot="trigger" color="secondary" icon="tile-four-outline" @click="onTriggerClick"></t-button>
              <t-button slot="trigger" color="secondary" icon="tile-four-outline" class="trigger-button" @click="onTriggerClick"></t-button>
              <div slot="popper">
                <div style="border-radius: 5px;padding: 20px 20px 20px 20px;background-color: white;">
                  <t-checkbox-group v-model="social" vertical @change="checkAllGroupChange">

security-protection-platform/src/modules/access/component/io-record/index.vue

        <t-button @click="reset">重置</t-button>
      </div>
      <t-button color="primary" icon="upload" style="width:128px;height:32px" class="upload">导出至Excel</t-button>
       <t-button  icon="upload" style="width:128px;height:32px" class="upload">导出至Excel</t-button>
    </div> -->
    <div class="track-container">
            </div>
          </div>
          <div class="btns">
            <t-button color="primary" icon="upload" style="width:128px;height:32px" class="upload">导出至Excel</t-button>
            <t-button icon="upload" style="width:128px;height:32px" class="upload">导出至Excel</t-button>
            <t-dropdown :visibled="customVisibled" trigger-mode="custom">
              <t-button slot="trigger" color="secondary" icon="tile-four-outline" @click="onTriggerClick"></t-button>
              <t-button slot="trigger" color="secondary" icon="tile-four-outline" class="trigger-button" @click="onTriggerClick"></t-button>
              <div slot="popper">
                <div style="border-radius: 5px;padding: 20px 20px 20px 20px;background-color: white;">
                  <t-checkbox-group v-model="social" vertical @change="checkAllGroupChange">
      <t-table-column v-if="columns[4].show" :formatter="date_formatter" label="职务" prop="employeePositionZh" width="80px">
      </t-table-column>
      <t-table-column v-if="columns[5].show" :formatter="date_formatter" prop="simi" label="相似度" width="75px">
        <template v-slot="{row}">
          {{ getSimi(row) }}
        </template>
      </t-table-column>
      <t-table-column v-if="columns[6].show" :formatter="date_formatter" label="进出时间" prop="taskExecuteTime" width="160px">
      </t-table-column>
      } else {
        return cellValue
      }
    },
    getSimi (row) {
      return (row.simi.split('%')[0] - 0).toFixed(2) + '%'
    }
    // //将分数转换为小数
    // toPoint (percent) {

security-protection-platform/src/modules/aialarm/index.vue

        <t-button color="primary" @click="btnsearch">查询</t-button>
        <t-button @click="reset">重置</t-button>
      </div>
      <t-button color="primary" icon="upload" style="width:128px;height:32px" class="upload">导出至Excel</t-button>
       <t-button  icon="upload" style="width:128px;height:32px" class="upload">导出至Excel</t-button>
    </div> -->
    <div class="track-container">
            </div>
          </div>
          <div class="btns">
            <t-button color="primary" icon="upload" style="width:128px;height:32px" class="upload">导出至Excel</t-button>
            <t-button icon="upload" style="width:128px;height:32px" class="upload">导出至Excel</t-button>
            <t-dropdown :visibled="customVisibled" trigger-mode="custom">
              <t-button slot="trigger" color="secondary" icon="tile-four-outline" @click="onTriggerClick"></t-button>
              <t-button slot="trigger" color="secondary" icon="tile-four-outline" class="trigger-button" @click="onTriggerClick"></t-button>
              <div slot="popper">
                <div style="border-radius: 5px;padding: 20px 20px 20px 20px;background-color: white;">
                  <t-checkbox-group v-model="social" vertical @change="checkAllGroupChange">

security-protection-platform/src/modules/attendance/abnormal/index.vue

              </div>
            </div>
            <div class="btns">
              <t-button color="primary">
              <t-button>
                <t-icon size="14" icon="upload-outline"></t-icon> 导出至Excel
              </t-button>
              <t-dropdown :visibled="customVisibled" trigger-mode="custom">
                <t-button slot="trigger" color="secondary" icon="tile-four-outline" @click="onTriggerClick"></t-button>
                <t-button slot="trigger" color="secondary" icon="tile-four-outline" class="trigger-button" @click="onTriggerClick"></t-button>
                <div slot="popper">
                  <div style="border-radius: 5px;padding: 20px 20px 20px 20px;background-color: white;">
                    <t-checkbox-group v-model="social" vertical @change="checkAllGroupChange">

security-protection-platform/src/modules/attendance/report/index.vue

                  </div>
                </div>
                <div class="btns">
                  <t-button color="primary">
                  <t-button>
                    <t-icon size="14" icon="upload-outline"></t-icon> 导出至Excel
                  </t-button>
                  <t-dropdown :visibled="customVisibled0" trigger-mode="custom">
                    <t-button slot="trigger" color="secondary" icon="tile-four-outline" @click="onTriggerClick"></t-button>
                    <t-button slot="trigger" color="secondary" icon="tile-four-outline" class="trigger-button" @click="onTriggerClick"></t-button>
                    <div slot="popper">
                      <div style="border-radius: 5px;padding: 20px 20px 20px 20px;background-color: white;">
                        <t-checkbox-group v-model="social0" vertical @change="checkAllGroupChange">
                  </div>
                </div>
                <div class="btns">
                  <t-button color="primary">
                  <t-button>
                    <t-icon size="14" icon="upload-outline"></t-icon> 导出至Excel
                  </t-button>
                  <t-dropdown :visibled="customVisibled1" trigger-mode="custom">
                    <t-button slot="trigger" color="secondary" icon="tile-four-outline" @click="onTriggerClick"></t-button>
                    <t-button slot="trigger" color="secondary" icon="tile-four-outline" class="trigger-button" @click="onTriggerClick"></t-button>
                    <div slot="popper">
                      <div style="border-radius: 5px;padding: 20px 20px 20px 20px;background-color: white;">
                        <t-checkbox-group v-model="social1" vertical @change="checkAllGroupChange">

security-protection-platform/src/modules/dashboard/index.vue

<template>
  <div class="index" style="overflow:hidden;">
    <div :style="`background-image: url(${imgBg})`" class="top" >
    <div :style="`background-image: url(${imgBg})`" class="top">
      <img src="@/assets/images/AsiainfoLogo.png" class="top-logo">
      <div style="position: absolute;top:50%;left:54%;transform: translate(-50%,-50%);vertical-align: middle; color: white; font-size: 14px">
        <b> | AISI安防一体化平台</b></div>
        <b> | AISI安防一体化平台</b>
      </div>
    </div>
    <div>
      <div class="time"><span style="color: #00d8f3;font-size: 21px;">{{ nowDate | dateFormat }}</span></div>
          <div id="doughnut" style="height: 100%;width: 100%"></div>
        </div>
        <div :style="`height:34%;margin-top: 3%;`" class="body-left-item">
          <div :style="`background-image: url(${titleImgBg})`" class="title" id="div1">
          <div id="div1" :style="`background-image: url(${titleImgBg})`" class="title">
            <span class="title-span">告警分析</span>
          </div>
          <div id="bar" style="height: 100%;width: 100%"></div>
        </div>
        <!--        <video-player ref="videoPlayer" :options="videoOptions" :playsinline="true" class="vjs-custom-skin videoPlayer"></video-player>-->
        <div id="div11">
          <video-player v-if="videoOptions !== {}" ref="videoPlayer" :options="videoOptions" :playsinline="true"  id="div111" class="vjs-custom-skin videoPlayer">
          <video-player v-if="videoOptions !== {}" id="div111" ref="videoPlayer" :options="videoOptions" :playsinline="true" class="vjs-custom-skin videoPlayer">
          </video-player>
        </div>
import 'vue-video-player/src/custom-theme.css'
import 'videojs-flash'
import videojs from 'video.js'
import EventBus from "../../bus";
import EventBus from '../../bus'
window.videojs = videojs
require('video.js/dist/lang/zh-CN.js')
    setInterval(() => { // 识别记录
      this.initRecognition()
    }, 5000)
    // console.log(textDom.nextSibling)
    // textDom.nextSibling.nodeValue = ''
    // EventBus.$on('sendAiData', (msg) => { // 获取镜屏推送消息
    //   console.log('已接收镜屏消息...')
    //   var oDiv = document.getElementById("div111");
    // })
  },
  methods: {
    testHKK(box, alarmMemo) {
    testHKK (box, alarmMemo) {
      var width = box[2] - box[0]
      var height = box[3] - box[1]
      var oDiv = document.getElementById("div111");
      var oDiv = document.getElementById('div111')
      // var aBox = this.getByClass(oDiv,"vjs-tech");
      // alert(aBox.length);
      var e = oDiv;
      var div = document.createElement("div");
      var e = oDiv
      var div = document.createElement('div')
      // div.className = "form-group";
      var del = document.createElement('p')
      var x = 10 + this.hkk
      this.hkk ++
      del.innerHTML = '<div class="hkk" style="color: white;border: 2px solid #00d8f3;position: absolute;top: ' + box[1] + 'px;left: ' + box[0] + 'px;width: ' + width + 'px;height: ' + height + 'px;"> ' + alarmMemo + ' </div>';
      div.appendChild(del);
      e.appendChild(div);
      setTimeout(function() {
        del.remove();
      this.hkk++
      del.innerHTML = '<div class="hkk" style="color: white;border: 2px solid #00d8f3;position: absolute;top: ' + box[1] + 'px;left: ' + box[0] + 'px;width: ' + width + 'px;height: ' + height + 'px;"> ' + alarmMemo + ' </div>'
      div.appendChild(del)
      e.appendChild(div)
      setTimeout(function () {
        del.remove()
      }, 3000)
    },
    findInArr(arr,n){
      for(var i=0;i<arr.length;i++){
        if(arr[i] == n){
          return true;
    findInArr (arr, n) {
      for (var i = 0; i < arr.length; i++) {
        if (arr[i] == n) {
          return true
        }
      }
      return false;
      return false
    },
    getByClass(oParent,sClass){
      var ret = [];
      var aEle = oParent.getElementsByTagName("*");
      for(var i = 0; i < aEle.length; i++){
        var _aTmp = aEle[i].className.split(" ");
        if(this.findInArr(_aTmp,sClass)){
          ret.push(aEle[i]);
    getByClass (oParent, sClass) {
      var ret = []
      var aEle = oParent.getElementsByTagName('*')
      for (var i = 0; i < aEle.length; i++) {
        var _aTmp = aEle[i].className.split(' ')
        if (this.findInArr(_aTmp, sClass)) {
          ret.push(aEle[i])
        }
      }
      return ret;
      return ret
    },
    async createMyButton () {
      this.$nextTick(() => {
        let start = document.getElementsByClassName('vjs-play-control vjs-control vjs-button')
        let volume = document.getElementsByClassName('vjs-volume-panel vjs-control vjs-volume-panel-horizontal')
        let text = document.getElementsByClassName('vjs-live-control vjs-control')
        // 删除直播文本节点
        let textDoms = document.querySelectorAll('.vjs-live-control .vjs-live-display .vjs-control-text')
        textDoms.forEach(item => {
          // 这样设置没用 不知道为啥 明明在nextTick中 真正的“直播”文本节点还是没选到
          item.nextSibling.nodeValue = ''
          // item.nextSibling.data = ''
        })
        bars.forEach((item, index) => {
          time.forEach(item => {
            item.remove()
          data = data.slice(0, 4)
        }
        data.forEach(e => {
          if (e.employeeName == null || e.employeeName == ''){
          if (e.employeeName == null || e.employeeName == '') {
            e.employeeCode = '未识别成功'
          }
          e.simi = e.simi.split('.')[0] + '%'
.vjs-tech {
  pointer-events: none;
}
.checkedIndex{
.checkedIndex {
  border: 1px solid #009bf3;
}
</style>

security-protection-platform/src/modules/system/assignment/index.vue

                <t-icon icon="trash" size="16"></t-icon>删除
              </t-button>
              <t-dropdown :visibled="customVisibled" trigger-mode="custom">
                <t-button slot="trigger" color="secondary" icon="tile-four-outline" @click="onTriggerClick"></t-button>
                <t-button slot="trigger" color="secondary" icon="tile-four-outline" class="trigger-button" @click="onTriggerClick"></t-button>
                <div slot="popper">
                  <div style="border-radius: 5px;padding: 20px 20px 20px 20px;background-color: white;">
                    <t-checkbox-group v-model="social" vertical @change="checkAllGroupChange">

security-protection-platform/src/modules/system/devicemana/index.vue

                <t-icon icon="trash" size="16"></t-icon>删除
              </t-button>
              <t-dropdown :visibled="customVisibled" trigger-mode="custom">
                <t-button slot="trigger" color="secondary" icon="tile-four-outline" @click="onTriggerClick"></t-button>
                <t-button slot="trigger" color="secondary" icon="tile-four-outline" class="trigger-button" @click="onTriggerClick"></t-button>
                <div slot="popper">
                  <div style="border-radius: 5px;padding: 20px 20px 20px 20px;background-color: white;">
                    <t-checkbox-group v-model="social" vertical @change="checkAllGroupChange">

security-protection-platform/src/modules/usermana/index.vue

                <t-icon icon="trash" size="16"></t-icon>删除
              </t-button>
              <t-dropdown :visibled="customVisibled" trigger-mode="custom">
                <t-button slot="trigger" color="secondary" icon="tile-four-outline" @click="onTriggerClick"></t-button>
                <t-button slot="trigger" color="secondary" icon="tile-four-outline" class="trigger-button" @click="onTriggerClick"></t-button>
                <div slot="popper">
                  <div style="border-radius: 5px;padding: 20px 20px 20px 20px;background-color: white;">
                    <t-checkbox-group v-model="social" vertical @change="checkAllGroupChange">

security-protection-platform/src/modules/workorder/index.vue

              <t-button color="primary" @click="cardReplacementModal=true">
                <t-icon icon="plus-circle-outline" size="16"></t-icon> 补卡
              </t-button>
              <t-button color="primary">
              <t-button>
                <t-icon icon="upload" size="16"></t-icon> 导出至Excel
              </t-button>
              <t-button color="primary" @click="importWorkOrderModal=true">
              <t-button @click="importWorkOrderModal=true">
                <t-icon icon="download" size="16"></t-icon> 导入
              </t-button>
              <a href="javascript:;"> 模板下载 <t-icon icon="cloud-download-outline" size="16" style="lineHeight:24px"></t-icon></a>
              <t-dropdown :visibled="customVisibled" trigger-mode="custom">
                <t-button slot="trigger" color="secondary" icon="tile-four-outline" @click="onTriggerClick"></t-button>
                <t-button slot="trigger" color="secondary" icon="tile-four-outline" class="trigger-button" @click="onTriggerClick"></t-button>
                <div slot="popper">
                  <div style="border-radius: 5px;padding: 20px 20px 20px 20px;background-color: white;">
                    <t-checkbox-group v-model="social" vertical @change="checkAllGroupChange">

security-protection-platform/src/styles/index.scss

@import './variables.scss';
@import './sidebar.scss';
@import "./variables.scss";
@import "./sidebar.scss";
body {
  // height: 100%;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-family: PingFangSC-Regular, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
  font-family: PingFangSC-Regular, Hiragino Sans GB, Microsoft YaHei, Arial,
    sans-serif;
}
label {
  display: block;
  line-height: 32px;
  font-size: 16px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
    Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  color: #2c3e50;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.text-center {
  text-align: center
  text-align: center;
}
.sub-navbar {
  text-align: right;
  padding-right: 20px;
  transition: 600ms ease position;
  background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%);
  background: linear-gradient(
    90deg,
    rgba(32, 182, 249, 1) 0%,
    rgba(32, 182, 249, 1) 0%,
    rgba(33, 120, 241, 1) 100%,
    rgba(33, 120, 241, 1) 100%
  );
  .subtitle {
    font-size: 20px;
.multiselect--active {
  z-index: 1000 !important;
}
// 解决筛选按钮的错位问题
.trigger-button {
  transform: translateY(1.5px);
}