<template>
  <div id="operation-record" style="background: #fff; padding: 10px 20px 50px 20px;page-break-after:always">
    <div v-if="!onlyRead && isPlatform" style="display: flex;justify-content: space-between">
      <div>
        <el-switch
          v-model="connectFlag"
          disabled
          active-color="#13ce66"
          inactive-color="#ff4949"
          active-text="已连接"
          inactive-text="已断开"
        />
      </div>
      <div style="position: fixed;z-index: 999;right: 90px;">
        <el-button v-print="print" size="small" @click="handleSaveTable">打印</el-button>
        <el-button type="primary" size="small" @click="handleSaveTable">保存</el-button>
        <el-button type="danger" size="small" @click="handleDelete">删除</el-button>
      </div>
    </div>
    <div id="optomeFunc" style="width: 840px;padding-right: 8px" class="printBox">
      <div v-if="!isDev" class="flex j-c" style="padding-bottom: 8px">
        <img width="320" src="@/assets/img/xianganlogo.png">
      </div>
      <p style="color:#000000;font-size:24px;font-weight: 700;letter-spacing: 10px;text-align:center;margin-bottom: 10px;word-spacing: 3px">
        验光报告单
      </p>
      <div style="display: flex;justify-content: space-around">
        <span class="bold">登记号：<el-input v-model="dataForm.patientId" style="width: 95px" placeholder="" /></span>
        <span class="bold">姓名：<el-input v-model="dataForm.patientName" style="width: 90px" placeholder="" /></span>
        <span class="bold">性别：<el-input v-model="dataForm.patientSex" style="width: 60px" placeholder="" /></span>
        <span class="bold">年龄：<el-input v-model="dataForm.patientAge" style="width: 60px" placeholder="" /></span>
        <span class="bold">屈光发育档案：
          <el-select v-model="dataForm.qgFyda" placeholder="" clearable style="display: inline-block;width: 100px">
            <el-option
              v-for="item in fileList"
              :key="item.id"
              :label="item.name"
              :value="item.name"
            />
          </el-select>
        </span>
      </div>
      <div class="operation-record-table">
        <el-table :data="tableData" :span-method="objectSpanMethod" border style="width: 100%; margin-top: 5px">
          <el-table-column label="" width="" align="center" :resizable="false">
            <template slot-scope="scope">
              <div v-if="scope.row.name == '1'">
                <div class="width-180 center">
                  瞳孔状态
                </div>
              </div>
              <div v-else-if="scope.row.name == '基本信息'">
                <div class="width-180 center">
                  基本信息
                </div>
              </div>
              <div v-else-if="scope.row.name == '3'">
                <div class="width-180 center">
                  右眼
                </div>
              </div>
              <div v-else-if="scope.row.name == '4'">
                <div class="width-180 center">
                  左眼
                </div>
              </div>
              <div v-else-if="scope.row.name == '5'">
                <div class="width-180 center">
                  左眼
                </div>
              </div>
              <div v-else-if="scope.row.name == '最终处方'">
                <div class="width-180 center">
                  <el-button type="text" plain style="font-size: 16px;padding: 3px 8px" @click="copyData">最终处方</el-button>
                  <div style="display: flex;flex-wrap: wrap;">
                    <div v-for="(item,index) in remoteUse" :key="index" class="check" style="margin-left: 22px;font-size: 14px" @click="item.isSelect = !item.isSelect">
                      <input type="checkbox" :checked="item.isSelect">
                      <div>{{ item.name }}</div>
                    </div>
                  </div>
                </div>
              </div>
              <p v-else>{{ scope.row.name }}</p>
            </template>
          </el-table-column>
          <el-table-column label="" width="" :resizable="false">
            <template slot-scope="scope">
              <div v-if="scope.row.name == '1'">
                <div class="">
                  <div style="display: flex;flex-wrap: wrap">
                    <el-select v-model="dataForm.tongk" clearable placeholder="" style="width: 100%">
                      <el-option
                        v-for="item in pupil"
                        :key="item.id"
                        :label="item.name"
                        :value="item.name"
                      />
                    </el-select>
                  </div>
                </div>
              </div>
              <div v-if="scope.row.name == '3'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.ygjcDsOd" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '4'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.ygjcDsOs" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '5'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.zzcfDsOs" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '基本信息'">
                <div class="width-100 center">
                  <el-select v-model="dataForm.slType" clearable placeholder="" style="width: 100%" @change="selectVision">
                    <el-option
                      v-for="item in visionList"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    />
                  </el-select>
                </div>
              </div>
              <div v-if="scope.row.name == '最终处方'">
                <div class="width-100 center" style="text-align: center">
                  右眼
                </div>
              </div>
              <div v-if="scope.row.name == '配镜建议'">
                <div style="display: flex">
                  <div style="display: flex;flex-wrap: wrap">
                    <div v-for="(item,index) in suggest" :key="index" class="check" @click="item.isSelect = !item.isSelect">
                      <input type="checkbox" :checked="item.isSelect">
                      <div>{{ item.name }}</div>
                    </div>
                  </div>
                  <div style="margin-left: 26px">
                    <span>其他:</span>
                    <el-select v-model="dataForm.pjyjQt" clearable placeholder="" style="width: 220px;display: inline-block">
                      <el-option
                        v-for="item in others"
                        :key="item.id"
                        :label="item.name"
                        :value="item.name"
                      />
                    </el-select>
                  </div>
                </div>
              </div>
              <div v-if="scope.row.name == '备注'">
                <div>
                  <el-input v-model="dataForm.beiZhu" type="textarea" :autosize="{ minRows: 1, maxRows: 3}" placeholder="" />
                </div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="" width="" :resizable="false">
            <template slot-scope="scope">
              <div v-if="scope.row.name == '基本信息'">
                <div class="width-180 center">
                  右眼
                </div>
              </div>
              <div v-if="scope.row.name == '验光检查'">
                <div class="width-180 center">
                  球镜(DS)
                </div>
              </div>
              <div v-if="scope.row.name == '1'">
                <div class="width-180 center">
                  检查方法
                </div>
              </div>
              <div v-if="scope.row.name == '3'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.ygjcDcOd" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '4'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.ygjcDcOs" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '5'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.zzcfDcOs" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '最终处方'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.zzcfDsOd" placeholder="" />
                </div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="" width="" :resizable="false">
            <template slot-scope="scope">
              <div v-if="scope.row.name == '基本信息'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.slOd" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '验光检查'">
                <div class="width-100 center">
                  柱镜(DC)
                </div>
              </div>
              <div v-if="scope.row.name == '1'">
                <div>
                  <div style="display: flex;flex-wrap: wrap">
                    <el-select v-model="dataForm.jianchaFangfa" clearable placeholder="">
                      <el-option
                        v-for="item in examine"
                        :key="item.id"
                        :label="item.name"
                        :value="item.name"
                      />
                    </el-select>
                  </div>
                </div>
              </div>
              <div v-if="scope.row.name == '3'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.ygjcAOd" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '4'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.ygjcAOs" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '5'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.zzcfAOs" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '最终处方'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.zzcfDcOd" placeholder="" />
                </div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="" width="" :resizable="false">
            <template slot-scope="scope">
              <div v-if="scope.row.name == '基本信息'">
                <div class="width-180 center">
                  左眼
                </div>
              </div>
              <div v-if="scope.row.name == '验光检查'">
                <div class="width-180 center">
                  轴位(A)
                </div>
              </div>
              <div v-if="scope.row.name == '3'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.ygjcVaOd" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '4'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.ygjcVaOs" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '5'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.zzcfVaOs" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '最终处方'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.zzcfAOd" placeholder="" />
                </div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="" width="" :resizable="false">
            <template slot-scope="scope">
              <div v-if="scope.row.name == '基本信息'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.slOs" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '验光检查'">
                <div class="width-180 center">
                  矫正视力(VA)
                </div>
              </div>
              <div v-if="scope.row.name == '3'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.ygjcAddOd" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '4'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.ygjcAddOs" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '5'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.zzcfAddOs" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '最终处方'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.zzcfVaOd" placeholder="" />
                </div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="" width="" :resizable="false">
            <template slot-scope="scope">
              <div v-if="scope.row.name == '验光检查'">
                <div class="width-180 center">
                  下加光(ADD)
                </div>
              </div>
              <div v-if="scope.row.name == '3'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.ygjcVaOd" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '4'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.zzcfAddOd" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '5'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.zzcfAddOd" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '最终处方'">
                <div class="width-100 center">
                  <el-input v-model="dataForm.zzcfAddOd" placeholder="" />
                </div>
              </div>
            </template>
          </el-table-column>
        </el-table>
        <div style="display: flex;justify-content: space-between">
          <div class="width-180" style="text-align: left">
            <span style="display: inline-block;margin-top: 12px">视光师:</span>
            <img v-if="dataForm.ygsSign" :src="dataForm.ygsSign" alt="" style="width: 80px;height: 50px;border-style:none;">
          </div>
          <div class="width-180" style="text-align: left">
            <el-input v-model="dataForm.ysSign" placeholder="" style="margin-top: 12px">
              <template slot="prepend">医师:</template>
            </el-input>
          </div>
          <div class="width-180" style="text-align: left;margin-top: 12px">
            日期：<el-date-picker
              v-model="dataForm.riQi"
              type="date"
              placeholder="选择日期"
            />
          </div>
        </div>
        <p style="text-align: left;margin-top: 12px;font-size: 14px">说明：1.持本报告单配镜仅供参考。              2.本报告单有效期3个月</p>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  props: {
    isDev: {
      type: Boolean
    },
    isSearch: {
      type: String,
      default: ''
    },
    patientId: {
      type: String,
      default: ''
    },
    caseId: {
      type: String,
      default: ''
    },
    isPlatform: {
      type: Boolean,
      default: true
    },
    onlyRead: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      connectFlag: false, // 连接
      ws: null, // 建立的连接
      lockReconnect: false, // 是否真正建立连接
      timeout: 28 * 1000, // 30秒一次心跳
      timeoutObj: null, // 心跳心跳倒计时
      serverTimeoutObj: null, // 心跳倒计时
      timeoutnum: null, // 断开 重连倒计时
      dataForm: {
        id: '',
        jzNumber: '',
        idList: [],
        patientId: '',
        patientName: '',
        patientSex: '',
        patientAge: '',
        qgFyda: '', // 屈光发育档案
        ygsSign: '', // 视光师
        ysSign: '', // 医师
        riQi: '', // 日期
        slType: '', // 视力类型
        slOs: '', // 左眼视力
        slOd: '', // 右眼视力
        tongk: '', // 瞳孔
        jianchaFangfa: '',
        ygjcDsOd: '',
        ygjcDsOs: '',
        ygjcDcOd: '',
        ygjcDcOs: '',
        ygjcAOd: '',
        ygjcAOs: '',
        ygjcVaOd: '',
        ygjcVaOs: '',
        ygjcAddOd: '',
        ygjcAddOs: '',
        zzcfAOd: '',
        zzcfAOs: '',
        zzcfAddOd: '',
        zzcfAddOs: '',
        zzcfDcOd: '',
        zzcfDcOs: '',
        zzcfDsOd: '',
        zzcfDsOs: '',
        zzcfVaOs: '',
        zzcfVaOd: '',
        zzcfCheck: '',
        pjyjCheck: '', // 配镜建议
        pjyjQt: '', // 配镜建议-其他
        beiZhu: '' // 备注
      },
      fileList: [
        {
          name: '是',
          id: '1'
        }, {
          name: '否',
          id: '2'
        }],
      visionList: [
        {
          name: '裸眼视力',
          id: '1'
        }, {
          name: '矫正视力',
          id: '2'
        }],
      pupil: [
        {
          name: '正常瞳孔',
          id: '1'
        }, {
          name: '复方托吡卡胺',
          id: '2'
        }, {
          name: '美多丽',
          id: '3'
        }, {
          name: '赛飞杰',
          id: '4'
        }, {
          name: '阿托品',
          id: '5'
        }
      ],
      examine: [
        {
          name: '检影',
          id: '1'
        }, {
          name: '综合',
          id: '2'
        }
      ],
      remoteUse: [
        {
          name: '远用',
          isSelect: false
        }, {
          name: '近用',
          isSelect: false
        }
      ],
      suggest: [
        {
          name: '单光',
          isSelect: false
        }, {
          name: '离焦镜片',
          isSelect: false
        }, {
          name: '软镜',
          isSelect: false
        }, {
          name: 'RGP',
          isSelect: false
        }, {
          name: 'OK镜',
          isSelect: false
        }
      ],
      others: [
        {
          name: '抗疲劳',
          id: '1'
        }, {
          name: '渐进',
          id: '2'
        }, {
          name: '低视力助视器',
          id: '3'
        }],
      originTableData: [],
      tableData: [
        {
          name: '基本信息'
        }, {
          name: '1'
        }, {
          name: '验光检查'
        }, {
          name: '3'
        }, {
          name: '4'
        }, {
          name: '最终处方'
        }, {
          name: '5'
        }, {
          name: '配镜建议'
        }, {
          name: '备注'
        }],
      print: {
        id: 'optomeFunc'
      }
    }
  },
  watch: {
    caseId: {
      handler: function(newV, oldV) {
        this.queryForm()
        if (this.isSearch === '3') {
          this.initWebSoket()
        }
      }
    }
  },
  destroyed() {
    if (this.isSearch === '3') {
      this.connectFlag = false
      clearTimeout(this.timeoutnum)
      clearTimeout(this.timeoutObj)
      clearTimeout(this.serverTimeoutObj)
      this.ws.close()
    }
  },
  mounted() {
    this.queryForm()
    this.getPatientData()
    if (this.isSearch === '3') {
      this.initWebSoket()
    }
  },
  methods: {
    // 设置签名
    setSign() {
      const userData = JSON.parse(window.sessionStorage.getItem('qg-userData'))
      const date = this.$moment().format('YYYY-MM-DD')
      const mzName = window.sessionStorage.getItem('mzDoctorName')
      this.dataForm.tongk = '正常瞳孔'
      this.dataForm.jianchaFangfa = '综合'
      this.dataForm.ygsSign = userData.signImgBase
      this.dataForm.ysSign = mzName
      this.dataForm.riQi = date
    },
    setVision() {
      const data = window.sessionStorage.getItem('shili') ? JSON.parse(window.sessionStorage.getItem('shili')) : []
      const one = data.length ? data[0].odVan : ''
      const two = data.length ? data[0].odVag : ''
      if (two && !one) {
        this.dataForm.slType = '2'
        this.selectVision('2')
      } else {
        this.dataForm.slType = '1'
        this.selectVision('1')
      }
    },
    selectVision(id) {
      const data = window.sessionStorage.getItem('shili') ? JSON.parse(window.sessionStorage.getItem('shili')) : []
      if (id === '1') {
        // 裸眼视力
        this.dataForm.slOd = data.length ? data[0].odVan : ''
        this.dataForm.slOs = data.length ? data[0].osVan : ''
      } else {
        this.dataForm.slOd = data.length ? data[0].odVag : ''
        this.dataForm.slOs = data.length ? data[0].osVag : ''
      }
    },
    copyData() {
      this.dataForm.zzcfDsOd = this.dataForm.ygjcDsOd
      this.dataForm.zzcfDcOd = this.dataForm.ygjcDcOd
      this.dataForm.zzcfAOd = this.dataForm.ygjcAOd
      this.dataForm.zzcfVaOd = this.dataForm.ygjcVaOd
      this.dataForm.zzcfAddOd = this.dataForm.ygjcAddOd
      this.dataForm.zzcfDsOs = this.dataForm.ygjcDsOs
      this.dataForm.zzcfDcOs = this.dataForm.ygjcDcOs
      this.dataForm.zzcfAOs = this.dataForm.ygjcAOs
      this.dataForm.zzcfVaOs = this.dataForm.ygjcVaOs
      this.dataForm.zzcfAddOs = this.dataForm.ygjcAddOs
    },
    async getPatientData() {
      const { data: res } = await this.$http.get(
        '/patient/view/getPatientData',
        {
          params: {
            patientId: this.patientId
          }
        }
      )
      if (res.code === 0) {
        const data = res.data
        this.dataForm.patientId = data.patientId
        this.dataForm.patientName = data.patientName
        this.dataForm.patientSex = data.patientSex
        this.dataForm.patientAge = data.patientAge
      } else {
        this.$message.error(res.msg)
      }
    },
    async queryForm() {
      const { data: res } = await this.$http.get(
        '/ygbgd/getYgbgdInfo',
        {
          params: {
            patientId: this.patientId,
            caseId: this.caseId
          }
        }
      )
      if (res.code === 0) {
        this.dataForm = res.data
        if (!this.dataForm.id) {
          await this.queryProject()
          this.setVision()
          this.setSign()
        }
        this.dataForm.jzNumber = window.sessionStorage.getItem('jzNumber')
        this.handleStr(this.dataForm.pjyjCheck, this.suggest)
        this.handleStr(this.dataForm.zzcfCheck, this.remoteUse)
      } else {
        this.$message.error(res.msg)
      }
    },
    // 获取报告单id
    async queryProject() {
      const project = window.sessionStorage.getItem('projectItem') ? JSON.parse(window.sessionStorage.getItem('projectItem')) : []
      const { data: res } = await this.$http.get(
        '/patient/getZlItemDict',
        {
          params: {
            caseName: '验光报告单'
          }
        }
      )
      if (res.code === 0) {
        const data = res.data || []
        const list = []
        if (data.length) {
          for (let i = 0; i < data.length; i++) {
            for (let j = 0; j < project.length; j++) {
              if (data[i].itemId === project[j].porjectCode) {
                list.push(project[j].id)
              }
            }
          }
          this.dataForm.idList = list
        }
      } else {
        this.$message.error(res.msg)
      }
    },
    reconnect() { // 重新连接
      const that = this
      if (that.lockReconnect) {
        return
      }
      that.lockReconnect = true
      // 没连接上会一直重连，设置延迟避免请求过多
      that.timeoutnum && clearTimeout(that.timeoutnum)
      that.timeoutnum = setTimeout(function() {
        // 新连接
        that.initWebSoket()
        that.lockReconnect = false
      }, 5000)
    },
    resetHeart() { // 重置心跳
      const that = this
      // 清除时间
      clearTimeout(that.timeoutObj)
      clearTimeout(that.serverTimeoutObj)
      // 重启心跳
      that.start()
    },
    start() { // 开启心跳
      const self = this
      self.timeoutObj && clearTimeout(self.timeoutObj)
      self.serverTimeoutObj && clearTimeout(self.serverTimeoutObj)
      self.timeoutObj = setTimeout(function() {
        // 这里发送一个心跳，后端收到后，返回一个心跳消息，
        if (self.ws.readyState == 1) { // 如果连接正常
          self.ws.send('heartCheck')
        } else { // 否则重连
          self.reconnect()
        }
        self.serverTimeoutObj = setTimeout(function() {
          // 超时关闭
          self.ws.close()
        }, self.timeout)
      }, self.timeout)
    },
    initWebSoket() {
      // wss://127.0.0.1:8030/data
      // const url = 'ws://47.110.224.240:8036/xiangan-crf/websocket/0071'
      // const url = 'ws://192.168.0.167:8036/xiangan-crf/websocket/0071'
      try {
        const url = 'ws://127.0.0.1:8030/data'
        const self = this
        this.ws = new WebSocket(url)
        this.ws.onopen = function() {
          console.log('连接成功')
          self.connectFlag = true
          self.start()
        }
        this.ws.onclose = function() {
          self.connectFlag = false
          self.reconnect()
        }
        this.ws.onerror = function() {
          self.connectFlag = false
          self.reconnect()
        }
        this.ws.onmessage = function(msg) {
          const message = JSON.parse(msg.data)
          // const data = JSON.parse(msg.data)
          // const message = JSON.parse(data.msgTxt)
          self.dataForm.ygjcDsOd = message.RData.DS
          self.dataForm.ygjcDcOd = message.RData.DC
          self.dataForm.ygjcAOd = message.RData.AXIS
          self.dataForm.ygjcVaOd = message.RData.VA
          self.dataForm.ygjcAddOd = message.RData.ADD
          self.dataForm.ygjcDsOs = message.LData.DS
          self.dataForm.ygjcDcOs = message.LData.DC
          self.dataForm.ygjcAOs = message.LData.AXIS
          self.dataForm.ygjcVaOs = message.LData.VA
          self.dataForm.ygjcAddOs = message.LData.ADD
          self.resetHeart()
        }
      } catch (e) {
        console.log(e)
      }
    },
    // 处理字符串
    handleStr(string, array) {
      if (string) {
        const data = string.split(',')
        array.forEach(item => {
          data.forEach(row => {
            if (item.name === row) {
              item.isSelect = true
            }
          })
        })
      } else {
        array.forEach(item => {
          item.isSelect = false
        })
      }
      return array
    },
    // 处理数组
    handleCheck(array) {
      if (array && array.length) {
        const temp = []
        array.forEach(item => {
          if (item.isSelect) {
            temp.push(item.name)
          }
        })
        return temp.join(',')
      }
    },
    handleSaveTable() {
      this.dataForm.pjyjCheck = this.handleCheck(this.suggest)
      this.dataForm.zzcfCheck = this.handleCheck(this.remoteUse)
      this.$http.post('/ygbgd/saveYgbgd', this.dataForm).then(({ data: res }) => {
        if (res.code !== 0) {
          return this.$message.error(res.msg)
        }
        this.$message({
          message: this.$t('prompt.success'),
          type: 'success',
          duration: 500,
          onClose: () => {
            this.queryForm()
          }
        })
      }).catch(() => {})
    },
    handleDelete() {
      const params = {
        id: this.caseId
      }
      this.$confirmFun('你确定要删除吗？').then(async() => {
        await this.deleteNewForm()
        const { data: res } = await this.$http.post('/case/delete', params)
        if (res.code === 0) {
          this.$message.success('删除成功')
          await this.$parent.getFormList()
        } else {
          this.$message.error(res.msg)
        }
      })
    },
    async deleteNewForm() {
      const params = {
        id: this.caseId
      }
      const { data: res } = await this.$http.post('/ygbgd/delYgbgdInfo', params)
      if (res.code === 0) {
      } else {
        this.$message.error(res.msg)
      }
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        if (rowIndex === 0 || rowIndex === 5) {
          // [0,0][0,3][0,6] 合并单元格 3行合并1列
          return {
            rowspan: 2,
            colspan: 1
          }
        }
        if (rowIndex === 2) {
          return {
            rowspan: 3,
            colspan: 1
          }
        }
        // [0,11] 最后一行 9列合并城1行
        if (rowIndex === 9) {
          return {
            rowspan: 1,
            colspan: 9
          }
        }
      } else if (columnIndex === 1) {
        if (rowIndex === 7 || rowIndex === 8) {
          return {
            rowspan: 1,
            colspan: 8
          }
        }
        if (rowIndex === 1) {
          return {
            rowspan: 1,
            colspan: 2
          }
        }
      } else if (columnIndex === 3) {
        if (rowIndex === 0) {
          return {
            rowspan: 1,
            colspan: 2
          }
        }
        if (rowIndex === 1) {
          return {
            rowspan: 1,
            colspan: 3
          }
        }
      } else if (columnIndex === 5) {
        if (rowIndex === 0) {
          return {
            rowspan: 1,
            colspan: 3
          }
        }
      } else if (rowIndex === 7 || rowIndex === 8) {
        if (columnIndex === 2 || columnIndex === 3 || columnIndex === 4 || columnIndex === 5 || columnIndex === 6) {
          return {
            rowspan: 0,
            colspan: 0
          }
        }
      }
    }
  }
}
</script>
<style lang="scss" scoped>
#operation-record {
  height: 100%;
  overflow: auto;
  .check {
    cursor: pointer;
    user-select: none;
    display: flex;
    margin-right: 18px;
    input{
      -webkit-appearance: checkbox !important;
      margin-right: 5px;
    }
  }
  .flex{
    display: flex;
  }
  .j-c{
    justify-content: center;
  }
  .btnBox{
    display: flex;
    justify-content: flex-end;
  }
  .operation-record-table {
    width: 100%;
    ::v-deep .el-input-group__append, ::v-deep .el-input-group__prepend{
      background-color: transparent;
      color: #606266;
      border: none;
    }
    ::v-deep .el-table__header-wrapper{
      display: none;
    }
    .operation-text {
      font-weight: 700;
    }
    .text {
      font-weight: 700;
    }
    .sign {
      cursor: pointer;
      color: #46a1ff;
      font-weight: 400;
    }
  }
  .center {
    text-align: center;
  }
  .left {
    text-align: left;
  }
  .width-50 {
    .el-input {
      width: 50px;
    }
  }
  .width-70 {
    .el-input {
      width: 70px;
    }
  }
  .width-100 {
    .el-input {
      width: 100px;
    }
  }
  .width-120 {
    .el-input {
      width: 120px;
    }
  }
  .width-160 {
    .el-input {
      width: 160px;
    }
  }
  .width-80 {
    .el-input {
      width: 80px;
    }
  }
  .width-180 {
    .el-input {
      width: 180px;
    }
  }
  ::v-deep .el-input__inner {
    font-size: 16px;
    border: none;
    height: 26px !important;
    line-height: 26px !important;
    text-align: center;
    border-bottom: 1px solid #8e8c8c;
    border-radius: 0;
    padding: 0;
  }
  ::v-deep .el-textarea__inner{
    border: none;
  }
  ::v-deep .el-input__prefix {
    display: none;
  }
  ::v-deep .el-date-editor.el-input,
  ::v-deep  .el-date-editor.el-input__inner {
    width: 140px;
  }
  ::v-deep .el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell {
    background: none !important;
  }
  .has-gutter {
    display: none;
    .cell {
      font-weight: 700;
    }
    .el-table__cell {
      background: #ced4d9;
    }
  }
  ::v-deep .el-table__cell{
    padding: 2px !important;
  }
  //::v-deep .el-table .el-table__cell{
  //  padding: 3px 0;
  //}
}
#optomeFunc{
  page-break-inside: avoid !important;
  .check {
    cursor: pointer;
    user-select: none;
    display: flex;
    margin-right: 18px;
    align-items: center;
    input{
      -webkit-appearance: checkbox !important;
      margin-right: 5px;
    }
  }
  .flex{
    display: flex;
  }
  .j-c{
    justify-content: center;
  }
  ::v-deep .el-input__inner {
    padding: 0;
    border: none;
    height: 26px !important;
    line-height: 26px !important;
    text-align: center;
    border-radius: 0;
    border-bottom: 1px solid #8e8c8c;
  }
  .operation-record-table{
    ::v-deep .el-input__inner {
      padding: 0;
      border: none;
      text-align: center;
      border-radius: 0;
    }
    ::v-deep .el-input-group__append, ::v-deep .el-input-group__prepend{
      background-color: transparent;
      color: #606266;
      border: none;
    }
    ::v-deep .el-table__header-wrapper{
      display: none;
    }
    ::v-deep .el-input__prefix {
      display: none;
    }
  }
  .bold{
    font-weight: 700;
  }
  ::v-deep .el-table th {
    border-color: #8e8c8c !important;
  }
  ::v-deep .el-table td {
    border-color: #8e8c8c !important;
  }
  ::v-deep .el-table--group,
  ::v-deep .el-table--border {
    border: 1px solid #8e8c8c !important;
    border-bottom: none !important;
  }
  ::v-deep .el-input__inner, .el-input-group__prepend {
    font-size: 16px;
  }
  ::v-deep .el-table__cell{
    padding: 2px 0 !important;
  }
  ::v-deep .el-textarea__inner{
    border: none;
  }
  ::v-deep .el-input__suffix-inner{
    //display: none;
  }
  ::v-deep .el-icon-arrow-up{
    display: none;
  }
}
</style>
<style lang="scss">
@media print {
  img {
    box-shadow: none !important;
    -webkit-print-color-adjust: exact;
  }
}
</style>

