<template>
  <div
      style="width: 99.3%; height: 99.5%; background-color: white;position: relative;border: 2px solid #9e9b9b; margin-left: 2px">
    <el-row style=" width: 100%;height: 100%; background-color: #d7dee6">
      <el-col :span="12" style="height: 100%;">
        <el-row style="height: 99%;margin-left: 4px">
          <el-table
              :data="processList_table"
              :header-cell-style="{background:'#F5F5F5'}"
              height="99%"
              stripe
              style="margin-top: 10px; width: 100%; height: 100%; border: 1px solid #9e9b9b; font-weight: lighter;color: #000;"
              tooltip-effect="dark"
          >
            <el-table-column align="center" label="编号" width="70px">
              <template #default="scope">
                <div style="white-space: pre-line !important;">{{ scope.row.质检项编号 }}</div>
              </template>
            </el-table-column>
            <el-table-column label="质检项描述" min-width="120px">
              <template #default="scope">
                <div style="white-space: pre-line !important;">{{ scope.row.质检项描述 }}</div>
              </template>
            </el-table-column>
            <el-table-column label="符合标准及条例" min-width="50px">
              <template #default="scope">
                <div style="white-space: pre-line !important;">{{ scope.row.符合标准及条例 }}</div>
              </template>
            </el-table-column>
          </el-table>
        </el-row>
        <!--<el-row style="margin-top: 5px;margin-left: 4px; height: 48%">-->
        <!--  <el-table-->
        <!--      :cell-class-name="cellClassName"-->
        <!--      :data="materialList_table"-->
        <!--      :header-cell-style="{background:'#F5F5F5'}"-->
        <!--      height="99%"-->
        <!--      stripe-->
        <!--      style="margin-top: 10px; width: 100%; height: 95%; border: 1px solid #9e9b9b"-->
        <!--      tooltip-effect="dark"-->
        <!--  >-->
        <!--    <el-table-column align="center" label=" " show-overflow-tooltip type="index" width="30px"/>-->
        <!--    <el-table-column align="center" label="零件图号" width="150px">-->
        <!--      <template #default="scope">-->
        <!--        {{ scope.row.零件图号 }}-->
        <!--      </template>-->
        <!--    </el-table-column>-->
        <!--    <el-table-column align="center" label="零件名称">-->
        <!--      <template #default="scope">-->
        <!--        {{ scope.row.零件名称 }}-->
        <!--      </template>-->
        <!--    </el-table-column>-->
        <!--    <el-table-column align="center" label="用量" width="80px">-->
        <!--      <template #default="scope">-->
        <!--        {{ scope.row.零件数量 }}-->
        <!--      </template>-->
        <!--    </el-table-column>-->
        <!--    &lt;!&ndash;            <el-table-column align="center" label="批次号" width="120">&ndash;&gt;-->
        <!--    &lt;!&ndash;              <template #default="scope">&ndash;&gt;-->
        <!--    &lt;!&ndash;                {{ scope.row.零件批号 }}&ndash;&gt;-->
        <!--    &lt;!&ndash;              </template>&ndash;&gt;-->
        <!--    &lt;!&ndash;            </el-table-column>&ndash;&gt;-->
        <!--    <el-table-column align="center" label="物料条码" min-width="130px">-->
        <!--      <template #default="scope">-->
        <!--        {{ scope.row.物料条码 }}-->
        <!--      </template>-->
        <!--    </el-table-column>-->
        <!--  </el-table>-->
        <!--</el-row>-->
      </el-col>
      <el-col :span="12" style="padding: 10px; height: 100%">
        <div id="ww" style="width: 100%; height: 100%; position: relative">
          <img :src="pic" style="height: 640px; width: 770px">
          <div v-for="(item, index) in tighteningPosition" :key="index" :class="changBP(item)"
               :style="{left:item.测量位置X + 'px', top: item.测量位置Y + 'px', height: item.控件高度 + 'px', width: item.控件宽度 + 'px'}"/>
          <mes-web-fun04 v-if="MesWebCode === 4"/>
          <mes-web-fun08 v-if="MesWebCode === 8"/>
          <mes-web-fun08 v-if="MesWebCode === 28"/>
          <mes-web-fun08 v-if="MesWebCode === 29"/>
          <mes-web-fun22 v-if="MesWebCode === 3"/>
          <div style="display: flex;margin: 10px 0 0 0">
            <!--<el-button style="height: 80px;width: 200px;font-size: 26px;"-->
            <!--           type="warning"-->
            <!--           @click="opNameInputDataForm.dataType = '';-->
            <!--           opNameInputDataForm.dataName = '';-->
            <!--           opNameInputDataForm.dataValue = '';-->
            <!--           getOpNameInputDataList(1)">录入数据-->
            <!--</el-button>-->
            <!--<el-button style="height: 80px;width: 200px;font-size: 26px;"-->
            <!--           type="warning"-->
            <!--           @click="opNameInputDataForm.dataType = '';-->
            <!--           opNameInputDataForm.dataName = '';-->
            <!--           opNameInputDataForm.dataValue = '';-->
            <!--           getOpNameInputDataList(1)">录入数据-->
            <!--</el-button>-->
            <el-button style="height: 80px;width: 200px;font-size: 26px;"
                       type="warning"
                       @click="getCheckDataInput">检查录入
            </el-button>
            <el-button style="height: 80px;width: 200px;font-size: 26px;"
                       type="warning"
                       @click="getImgCheckDirectFileList">QC指导文件
            </el-button>
          </div>
          <div style="display: flex;margin: 10px 0 0 0">
            <el-button v-if="$store.state.station.stationName == 'A20' || $store.state.station.stationName == 'A30'"
                       style="height: 80px;width: 200px;font-size: 26px;"
                       type="success"
                       @click="selectOrderForm">开始装配
            </el-button>
            <el-button v-if="$store.state.station.stationName == 'A20' || $store.state.station.stationName == 'A30'"
                       style="height: 80px;width: 200px;font-size: 26px;"
                       type="success"
                       @click="outLineOpNameWorkOver">装配完工
            </el-button>
            <el-button v-if="$store.state.station.stationName != 'A20' && $store.state.station.stationName != 'A30'"
                       style="height: 80px;width: 200px;font-size: 26px;"
                       type="success"
                       :disabled="checkButtonDisable"
                       @click="checkWorkOver">检查完成
            </el-button>
          </div>
        </div>
      </el-col>
    </el-row>
    <div id="smile" style="width: 100px; height: 100px; top: 180px; left: 1080px;position: absolute">
      <img v-if="smile === 1" src="../../assets/image/greenFace.png" style="width: 220px; height: 220px">
      <img v-else-if="smile === 2" src="../../assets/image/redFace.png" style="width: 220px; height: 220px">
      <img v-else-if="smile === 3" src="../../assets/image/MatchSuccess.png" style="width: 196px; height: 220px">
      <img v-else-if="smile === 4" src="../../assets/image/MatchFail.png" style="width: 196px; height: 220px">
      <img v-else src="../../assets/image/nothing.png">
    </div>
    <el-dialog :append-to-body="true" :visible.sync="imgCheckDialogFormVisible" center style="text-align: center"
               title="指导文件列表" width="850px">
      <div style="text-align: center">
        <el-form
            label-position="left"
            label-width="130px"
            style="width: 100%;margin: auto"
        >
          <el-table
              :data="imgCheckDirectFileList"
              max-height="365px"
              size="small"
              style="width: 100%; height: 280px; font-size: 20px; color: #000; border: 1px solid #9e9b9b"
          >
            <el-table-column
                align="center"
                label="排序"
                type="index"
                width="100">
            </el-table-column>
            <el-table-column align="center" label="文件名称" prop="文件名称"/>
            <el-table-column align="center" label="导入时间" prop="操作时间"/>
            <el-table-column align="center" label="查看文件" width="150">
              <template slot-scope="scope2">
                <el-button type="warning" @click="imgCheckDirectFile(scope2.row)">打开指导文件</el-button>
              </template>
            </el-table-column>
          </el-table>
          <!--底部按钮-->
          <div style="text-align: center; margin-top: 20px">
            <el-button class="el-icon-close" @click="imgCheckDialogFormVisible = false">关闭</el-button>
          </div>
        </el-form>
      </div>
    </el-dialog>
    <el-dialog v-el-drag-dialog :append-to-body="true" :visible.sync="opNameInputDataVisible" center
               style="text-align: center" title="录入数据" width="415px">
      <div style="text-align: center">
        <el-form
            :model="opNameInputDataForm"
            label-position="right"
            label-width="100px"
            style="width: 100%;margin: auto"
        >
          <el-form-item label="数据类型" prop="engineTypeValue" style="text-align: right;width: 90%">
            <el-select v-model="opNameInputDataForm.dataType" placeholder="请选择数据类型" size="small"
                       @change="getOpNameInputDataList(2,$event)">
              <el-option
                  v-for="item in opNameInputDataTypeList"
                  :key="item"
                  :label="item"
                  :value="item"
                  size="mini"/>
            </el-select>
          </el-form-item>
          <el-form-item label="数据名称" prop="engineTypeValue" style="text-align: right;width: 90%">
            <el-select
                v-model="opNameInputDataForm.dataName"
                placeholder="请选择数据名称"
                size="small"
            >
              <el-option
                  v-for="item in opNameInputDataNameList"
                  :key="item"
                  :label="item"
                  :value="item"
                  size="mini"/>
            </el-select>
          </el-form-item>
          <el-form-item
              label="记录值"
              prop="engineTypeValue" style="width: 90%">
            <el-input v-model="opNameInputDataForm.dataValue" placeholder="请输入记录值" size="small"
                      style="width:200px;"/>
          </el-form-item>
          <!--底部按钮-->
          <div style="text-align: center; margin-top: 20px">
            <el-button class="el-icon-check" type="primary" @click="opNameInputDataSubmit()">确定</el-button>
            <el-button class="el-icon-close" style="margin-left: 50px" @click="opNameInputDataVisible = false">关闭
            </el-button>
          </div>
        </el-form>
      </div>
    </el-dialog>
    <el-dialog v-el-drag-dialog :append-to-body="true" :visible.sync="checkDataInputVisible" center
               style="text-align: center" title="录入检查项" width="750px">
      <div style="text-align: center">
        <el-form
            :model="opNameInputDataForm"
            label-position="right"
            label-width="300px"
            max-height="600px"
            style="width: 100%;margin: left;overflow: auto"
        >
          <el-form-item
              :label="item.质检项分类 + '-' +item.质检项描述"
              prop="engineTypeValue" style="width: 90%" v-for="item in checkDataInputList" :key="item.ID">
            <el-input v-model="item.检验结果" :placeholder="item.符合标准及条例" size="small"
                      style="width:400px;"/>
          </el-form-item>
          <!--底部按钮-->
          <div style="text-align: center; margin-top: 20px;">
            <el-button class="el-icon-check" type="primary" @click="saveCheckInputDataList()">保存</el-button>
            <el-button class="el-icon-close" style="margin-left: 50px" @click="checkDataInputVisible = false">关闭
            </el-button>
          </div>
        </el-form>
      </div>
    </el-dialog>
  </div>
</template>

<script>

import { mapGetters } from 'vuex'
import MesWebFun04 from './LowerRight/MesWebFun04.vue'
import MesWebFun08 from './LowerRight/MesWebFun08.vue'
import MesWebFun22 from './LowerRight/MesWebFun22.vue'

export default {
  components: {
    MesWebFun04,
    MesWebFun08,
    MesWebFun22
  },
  data() {
    return {
      MesWebCode: Number(this.$store.state.station.MesWebCode),
      file_is_show: true,
      subscription: {
        topic: '',
        qos: 0
      },
      publication: {
        topic: '',
        qos: 0,
        payload: ''
      },
      imgCheckDialogFormVisible: false,
      opNameInputDataVisible: false,
      imgCheckDirectFileList: [],
      opNameInputDataTypeList: [],
      opNameInputDataNameList: [],
      opNameInputDataForm: {
        opName: '',
        order: '',
        engineID: '',
        engineType: '',
        dataType: '',
        dataName: '',
        dataValue: '',
        jobNumber: ''
      },
      checkButtonDisable: true,
      checkDataInputVisible: false,
      checkDataInputList: []
    }
  },
  created() {
    this.initData()
    // console.log('this.$store.state.station.MesWebCode', this.$store.state.station.MesWebCode)
  },
  computed: {
    // ...mapState({
    //   processList_table: state => this.$store.state.operationGuide.processList_table
    // })
    ...mapGetters([
      'processList_table',
      'materialList_table',
      'pic',
      'tighteningPosition',
      'smile',
      'tempDataObject'
    ])
  },
  watch: {
    // 监听变量数据的某个对象
    'tempDataObject.checkWorkOverIsShow': {
      handler(newV, oldV) {
        console.log('tempDataObject.checkWorkOverIsShow 发生了改变！！！！', newV)
        if (newV == 1) {
          this.checkButtonDisable = true
        } else if (newV == 0) {
          this.checkButtonDisable = false
        }
      },
      deep: true
    }
  },
  methods: {
    initData() {
      setTimeout(() => {
        this.publication.topic = window.g.mqttPublishTopic
        this.publication.payload = 'WEB|IniSingalToWeb|' + this.$store.state.station.stationName + '|' + '1'
        const result = window.g.mqttClient.doPublish(this.publication)
      }, 500)
    },
    changBP(item) {
      if (item.nowStateCode === 1) {
        return 'green'
      } else if (item.nowStateCode === 2) {
        return 'blue'
      } else if (item.nowStateCode === 0) {
        return 'red'
      } else if (item.nowStateCode === 10) {
        return 'redRectangle'
      } else if (item.nowStateCode === 11) {
        return 'greenRectangle'
      } else if (item.nowStateCode === 12) {
        return 'blueRectangle'
      } else if (item.nowStateCode === 4) {
        return 'StartWorkCircle'
      } else if (item.nowStateCode === 14) {
        return 'blinkRectangle'
      }
    },
    cellClassName({ row, column }) {
      //
      if (row.是否完成扫描物料条码 === '0' && column.label === '物料条码') {
        return 'materialList-row'
      } else {
        return ''
      }
    },
    // 查询指导文件列表
    getImgCheckDirectFileList(row) {
      var param = []
      param[0] = ['工位号', this.$store.state.station.stationName]
      var Data = this.CreateData('11', '基础数据_操作指南指导文件_查询', param)
      this.ExecDatabase(Data).then(response => {
        console.log(response)
        if (response.data.length > 0) {
          this.imgCheckDirectFileList = response.data
          this.imgCheckDialogFormVisible = true
        } else {
          this.$message.error('该工位无操作指南指导文件，请添加后查看')
        }
      })
    },
    outLineOpNameWorkOver() {
      if (this.$store.state.station.statusValue[6].status == 0) {
        this.$message({
          type: 'warning',
          message: '请在允许工作后再进行此操作！'
        })
        return
      }
      this.$confirm(`请确认是否生产完成，完成后不可重新录入该工件数据`, '提示', {
        dangerouslyUseHTMLString: true,
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        var param = []
        param[0] = ['工位号', this.$store.state.station.stationName]
        var Data = this.CreateData('11', '电子看板_工序内容_临时表_填写项_校验', param)
        this.ExecDatabase(Data).then(response => {
          if (response.data[0].result == 1) {
            this.publication.topic = window.g.mqttPublishTopic
            this.publication.payload = 'WEB|outLineOpNameWorkOver|' + this.$store.state.station.stationName + '|' + 1
            const result = window.g.mqttClient.doPublish(this.publication)
            if (result === true) {
              this.$notify.success({
                title: '提示',
                message: '工件完工成功！',
                position: 'bottom-right',
                offset: 170
              })
            } else {
              this.$notify.error({
                title: '提示',
                message: '工件完工失败！',
                position: 'bottom-right',
                offset: 170
              })
            }
          } else {
            this.$message.error(response.data[0].msg)
          }
        })
      })
    },
    checkWorkOver() {
      if (this.$store.state.station.statusValue[6].status == 0) {
        this.$message({
          type: 'warning',
          message: '请在允许工作后再进行此操作！'
        })
        return
      }
      this.$confirm(`请确认检查项是否都检查完成，请确认后放行工件`, '提示', {
        dangerouslyUseHTMLString: true,
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        var param = []
        param[0] = ['工位号', this.$store.state.station.stationName]
        var Data = this.CreateData('11', '电子看板_工序内容_临时表_填写项_校验', param)
        this.ExecDatabase(Data).then(response => {
          if (response.data[0].result == 1) {
            this.publication.topic = window.g.mqttPublishTopic
            this.publication.payload = 'WEB|checkWorkOver|' + this.$store.state.station.stationName + '|' + 1
            const result = window.g.mqttClient.doPublish(this.publication)
            if (result === true) {
              this.$notify.success({
                title: '提示',
                message: '工件检查完成',
                position: 'bottom-right',
                offset: 170
              })
            } else {
              this.$notify.error({
                title: '提示',
                message: '工件检查失败！',
                position: 'bottom-right',
                offset: 170
              })
            }
          } else {
            this.$message.error(response.data[0].msg)
          }
        })
      })
    },
    selectOrderForm(EngineID) {
      if (EngineID) {
        this.publication.topic = window.g.mqttPublishTopic
        this.publication.payload = 'WEB|SelectOrderForm|' + this.$store.state.station.stationName + '|' + EngineID
        const result = window.g.mqttClient.doPublish(this.publication)
        if (result === true) {
          // this.$notify.success({
          //   title: '提示',
          //   message: '工件编号选择成功！',
          //   position: 'bottom-right',
          //   offset: 170
          // })
        } else {
          this.$notify.error({
            title: '提示',
            message: '生产请求发送失败！',
            position: 'bottom-right',
            offset: 170
          })
        }
      } else {
        this.$notify.error({
          title: '提示',
          message: '请选择工件编号再发送！',
          position: 'bottom-right',
          offset: 170
        })
      }
    },
    // 查询
    getOpNameInputDataList(type, dataType = null) {
      if (this.$store.state.station.statusValue[3].status != 1) {
        this.$message({
          type: 'warning',
          message: '当前无工作中工件，请在传递机型后再进行此操作！'
        })
        return
      }

      if (!this.$store.state.station.engineValue.EngineID) {
        this.$message({
          type: 'warning',
          message: '请确认工位当前存在工件，工件信息完善！'
        })
        return
      }

      if (type === 1) {
        this.opNameInputDataTypeList = []
      } else {
        this.opNameInputDataNameList = []
      }
      var param = []
      param[0] = ['工位号', this.$store.state.station.stationName]
      param[1] = ['数据类型', dataType]
      param[2] = ['type', type]
      var Data = this.CreateData('11', 'MES_工位手动录入_基本表_工位_查询', param)
      this.ExecDatabase(Data).then(response => {
        if (response.data.length > 0) {
          for (const item of response.data) {
            if (type === 1) {
              this.opNameInputDataTypeList.push(item.Value)
            } else if (type === 2) {
              this.opNameInputDataNameList.push(item.Value)
            }
          }
          this.opNameInputDataVisible = true
        } else {
          this.$message.error('该工位无工位录入项，请在管理系统中添加后再试！')
        }
      })
    },
    // 检查项录入
    getCheckDataInput() {
      if (this.$store.state.station.statusValue[3].status != 1) {
        this.$message({
          type: 'warning',
          message: '当前无工作中工件，请在传递机型后再进行此操作！'
        })
        return
      }

      if (!this.$store.state.station.engineValue.EngineID) {
        this.$message({
          type: 'warning',
          message: '请确认工位当前存在工件，工件信息完善！'
        })
        return
      }

      var param = []
      param[0] = ['工位号', this.$store.state.station.stationName]
      var Data = this.CreateData('11', '电子看板_工序内容_临时表_填写项_查询', param)
      this.ExecDatabase(Data).then(response => {
        if (response.data.length > 0) {
          this.checkDataInputVisible = true
          this.checkDataInputList = response.data
        } else {
          this.checkDataInputList = []
          this.$message.error('该工件无录入项或已提交录入结果！')
        }
      })
    },
    // 提交修改
    opNameInputDataSubmit() {
      if (this.$store.state.station.statusValue[3].status != 1) {
        this.$message({
          type: 'warning',
          message: '当前无工作中工件，请在传递机型后再进行此操作！'
        })
        return
      }
      if (!this.opNameInputDataForm.dataType || !this.opNameInputDataForm.dataName || !this.opNameInputDataForm.dataValue) {
        this.$message({
          type: 'warning',
          message: '请将信息填写完善后再进行保存！'
        })
        return
      }

      if (!this.$store.state.station.engineValue.EngineID) {
        this.$message({
          type: 'warning',
          message: '请确认工位当前存在工件，工件信息完善！'
        })
        return
      }

      var param = []
      param[0] = ['工位号', this.$store.state.station.stationName]
      param[1] = ['订单号', this.$store.state.station.engineValue.OrderForm]
      param[2] = ['工件编号', this.$store.state.station.engineValue.EngineID]
      param[3] = ['机型', this.$store.state.station.engineValue.EngineType]
      param[4] = ['数据类型', this.opNameInputDataForm.dataType]
      param[5] = ['数据名称', this.opNameInputDataForm.dataName]
      param[6] = ['记录值', this.opNameInputDataForm.dataValue]
      param[7] = ['操作者工号', this.$store.state.station.stationUserCount]
      var Data = this.CreateData('12', 'MES_工位手动录入_记录表_增加', param)
      this.ExecDatabase(Data).then(response => {
        if (response.data[0].result === '1') {
          this.$message({
            message: '保存成功',
            type: 'success'
          })
          this.opNameInputDataVisible = false
        } else {
          this.$message.error('保存失败，请确认当前工件信息是否完善')
        }
      })
    },
    // 保存检验项列表数据
    saveCheckInputDataList() {
      for (const item of this.checkDataInputList) {
        var param = []
        param[0] = ['ID', item.ID]
        param[1] = ['检验结果', item.检验结果]
        var Data = this.CreateData('12', '电子看板_工序内容_临时表_填写项_保存', param)
        this.ExecDatabase(Data).then(response => {
          if (response.data[0].result != '1') {
            this.$message.error('保存数据失败！')
          }
        })
      }
      this.$message.success('保存成功！')
      this.checkDataInputVisible = false
    },
    // 预览指导文件按钮
    imgCheckDirectFile(row) {
      var param = []
      param[0] = ['ID', row.ID]
      var Data = this.CreateData('11', '基础数据_操作指南指导文件_查看文件', param)
      this.ExecDatabase(Data).then(response => {
        console.log(response)
        if (response.data.length > 0) {
          this.pdfSrc = this.solvePdfUr1(response.data[0].指导文件)
          window.open(this.pdfSrc, '_blank')
          // this.imgCheckDialogFormVisible = true // 查看点检文件
          console.log(this.pdfSrc)
        } else {
          this.$message.error('该工位此点检项目无指导文件，请设置后查看')
        }
      })
    },
    // 处理pdf 二进制流
    solvePdfUr1(content, type, fileName) {
      const bstr = atob(content)
      let n = bstr.length
      const u8arr = new Uint8Array(n)
      while (n--) {
        u8arr[n] = bstr.charCodeAt(n)
      }
      // 确定解析格式，可能可以变成img，没有深入研究
      const blob = new Blob([u8arr], { type: 'application/pdf;chartset=UTF-8' })
      return window.URL.createObjectURL(blob)
    }
  }
}
</script>

<style scoped>
::v-deep.el-table .materialList-row {
  background: rgba(255, 255, 0, 0.5) !important;
}

.blue {
  position: absolute;
  width: 45px;
  height: 45px;
  background-image: url("../../assets/image/bule.png");
  background-size: 100% 100%;
}

.blueRectangle {
  position: absolute;
  width: 45px;
  height: 45px;
  background-image: url("../../assets/image/bluerectangle.png");
  background-size: 100% 100%;
}

.red {
  position: absolute;
  width: 45px;
  height: 45px;
  background-image: url("../../assets/image/red.png");
  background-size: 100% 100%;
}

.redRectangle {
  position: absolute;
  width: 45px;
  height: 45px;
  background-image: url("../../assets/image/redrectangle.png");
  background-size: 100% 100%;
}

.green {
  position: absolute;
  width: 45px;
  height: 45px;
  background-image: url("../../assets/image/green.png");
  background-size: 100% 100%;
}

.greenRectangle {
  position: absolute;
  width: 45px;
  height: 45px;
  background-image: url("../../assets/image/greenrectangle.png");
  background-size: 100% 100%;
}

.StartWorkCircle {
  position: absolute;
  width: 45px;
  height: 45px;
  background-size: 100% 100%;
  background-image: url("../../assets/image/StartWorkCircle.gif");
}

.blinkRectangle {
  position: absolute;
  width: 45px;
  height: 45px;
  background-image: url("../../assets/image/blinkrectangle.gif");
  background-size: 100% 100%;
  background-color: #81e2ff;
}

::v-deep.el-table .el-table__row .cell {
  line-height: 26px;
  font-size: 26px !important;
}

::v-deep.el-table th.el-table__cell > .cell {
  font-size: 22px;
  color: #2f2f2f;
}
</style>
