web_dist/src/views/hospitalization/case-front-sheet/AllCaseFrontSheet.vue

<template>
  <el-container>
    <el-header height="36px" style="margin-top: 8px">
      <el-date-picker
        v-model="dateRange"
        type="daterange"
        range-separator="至"
        start-placeholder="开始日期"
        end-placeholder="结束日期"
        :shortcuts="shortcuts"
        style="width: 260px"
      ></el-date-picker>
      <el-select v-model="overviewParam.ward" style="width: 130px" placeholder="请选择科室" filterable clearable>
        <el-option v-for="item in userWards" :key="item.code" :value="item.code" :label="item.name"></el-option>
      </el-select>
      <el-select v-model="overviewParam.fileStatus" style="width: 90px">
        <el-option label="未签收" value="0"></el-option>
        <el-option label="已签收" value="1"></el-option>
      </el-select>
      <el-select v-model="overviewParam.lateFlag" style="width: 90px">
        <el-option label="全部" value="3"></el-option>
        <el-option label="迟交" value="1"></el-option>
        <el-option label="未迟交" value="0"></el-option>
      </el-select>
      <el-input v-model="overviewParam.bah" style="width: 110px" placeholder="住院号" clearable></el-input>
      <el-button type="primary" icon="el-icon-search" @click="searchPatient">检索</el-button>
      <el-button type="primary" icon="el-icon-check" @click="archiveBa">签收</el-button>
      <el-button type="primary" icon="el-icon-s-operation" @click="showAdvanceSearch = true">高级条件检索</el-button>
      <el-divider direction="vertical"></el-divider>

      <el-dropdown trigger="click" type="primary" @command="handleCommand">
        <el-button type="primary">功能菜单<i class="el-icon-arrow-down el-icon--right"></i> </el-button>
        <template #dropdown>
          <el-dropdown-menu>
            <el-dropdown-item icon="el-icon-printer" command="unSign">解除签收</el-dropdown-item>
            <el-dropdown-item icon="el-icon-printer" command="dismissCount" divided>出院患者统计</el-dropdown-item>
            <el-dropdown-item icon="el-icon-printer" command="exportLateData">导出迟交病案</el-dropdown-item>
            <el-dropdown-item icon="el-icon-printer" command="print1" divided>打印正面</el-dropdown-item>
            <el-dropdown-item icon="el-icon-printer" command="print2">打印反面</el-dropdown-item>
            <el-dropdown-item icon="el-icon-printer" command="confirmPrint">确认已打印</el-dropdown-item>
          </el-dropdown-menu>
        </template>
      </el-dropdown>
    </el-header>
    <el-container>
      <el-aside width="270px">
        <el-table :data="overview.slice((currentPage - 1) * 15, currentPage * 15)" :height="tableHeight" stripe highlight-current-row @row-click="fetchSheetInfo">
          <el-table-column label="姓名" width="70">
            <template #default="scope">
              <img class="sex-icon" :src="scope.row.sex === 1 ? maleIcon : femaleIcon" />
              {{ scope.row.name }}
            </template>
          </el-table-column>
          <el-table-column label="住院号-次数" width="80">
            <template #default="scope">
              <span style="font-weight: bold; color: black">{{ scope.row.bah }}</span
              >-{{ scope.row.times }}
            </template>
          </el-table-column>
          <el-table-column prop="doctorName" label="医生" width="60"></el-table-column>
          <el-table-column prop="signDate" label="签收日期"></el-table-column>
        </el-table>
        <el-pagination small :hide-on-single-page="false" :page-size="15" layout="prev, pager, next" @current-change="handleCurrentPageChange" :total="overview.length">
        </el-pagination>
      </el-aside>
      <el-main>
        <div style="display: flex">
          <div :style="mainInfo">
            <div id="headpage">
              <HeadPage :patient="sheet" :dics="dics" />
            </div>
            <div id="tailpage" style="margin-left: 70px">
              <TailPage :patient="sheet" :dics="dics" />
            </div>
          </div>
          <div class="page-wrapper" :style="messageArea">
            <div class="page-inner">
              <el-tag type="success" size="small">当前科室CD型病例比例：{{ cdPercentage }}</el-tag>
              <div style="border-bottom: 1px solid black; margin: 6px 0 6px 0"></div>
              <div v-show="forceVerifies.length > 0" style="padding: 8px 0 4px 0; font-weight: bold">以下条目为强制要求，请完善。</div>
              <div v-for="(item, index) in forceVerifies" :key="index" class="message-item" :style="messageColor(index)" @click="handleClickMessage(item.code, index)">
                {{ index + 1 }}、{{ item.name }}
              </div>
              <div v-show="adviceVerifies.length > 0" style="padding: 8px 0 4px 0; font-weight: bold">以下条目为建议执行，不做强制要求。</div>
              <div v-for="(item, index) in adviceVerifies" :key="index" style="padding: 6px; margin-bottom: 6px; border-radius: 4px; background: #eea7a752; color: #ff2b2b">
                {{ index + 1 }}、{{ item.name }}
              </div>
            </div>
          </div>
        </div>
      </el-main>
    </el-container>

    <el-dialog v-model="showAdvanceSearch" title="高级条件检索" width="380px">
      <div style="margin-top: 5px">
        <el-tag type="info">医生条件</el-tag>
        <div style="margin-top: 5px">
          &nbsp;&nbsp;医生姓名：<el-input v-model="advanceSearch.doctorName" style="width: 160px" clearable @click="showSearchData('advanceSearchDoctor')"></el-input>
        </div>
      </div>
      <div style="margin-top: 10px">
        <el-tag type="info">患者条件</el-tag>
        <div style="margin-top: 5px">
          &nbsp;&nbsp;诊断编码：<el-input v-model="advanceSearch.icdCode" style="width: 160px" clearable @click="showSearchData('advanceSearchDiag')"></el-input>
        </div>
        <div style="margin-top: 5px">
          &nbsp;&nbsp;手术编码：<el-input v-model="advanceSearch.surgeryCode" style="width: 160px" clearable @click="showSearchData('advanceSearchSurgery')"></el-input>
        </div>
        <div style="margin-top: 5px">
          &nbsp;&nbsp;患者性别：
          <el-select v-model="advanceSearch.sex" style="width: 100px" clearable>
            <el-option v-for="item in dics.getSexCode" :key="item.code" :value="item.code" :label="item.name"></el-option>
          </el-select>
        </div>
      </div>
      <div style="width: 100%; text-align: right; margin-top: 15px">
        <el-button icon="el-icon-search" type="primary" @click="doAdvanceSearch">开始检索</el-button>
      </div>
    </el-dialog>

    <el-dialog v-model="showSearch" title="数据搜索" width="700px">
      检索依据：
      <el-select v-model="searchMethod" style="width: 100px">
        <el-option v-for="item in searchMethods" :key="item.code" :label="item.name" :value="item.code"></el-option>
      </el-select>
      &nbsp;&nbsp;&nbsp;&nbsp; 搜索内容：
      <el-input
        ref="searchInput"
        v-model="searchContent"
        prefix-icon="el-icon-search"
        placeholder="请输入搜索内容"
        style="width: 160px"
        clearable
        @input="executeSearch"
      ></el-input>
      <el-table :data="searchResults" height="400" stripe highlight-current-row @row-click="handleSelectSearch">
        <el-table-column prop="code" label="编码" width="200"></el-table-column>
        <el-table-column prop="name" label="名称" width="450"></el-table-column>
      </el-table>
      <div style="margin-top: 15px; width: 100%; text-align: right">
        <el-button type="primary" icon="el-icon-arrow-left" @click="lastPage" :disabled="currentSRPage === 1">上一页</el-button>
        <el-button type="primary" icon="el-icon-arrow-right" @click="nextPage" :disabled="currentSRPage > 1 && searchResults.length < 10">下一页</el-button>
      </div>
    </el-dialog>
    <el-dialog v-model="showDismissCount" title="出院患者统计" width="70%">
      <el-date-picker v-model="dismissCountMonth" type="month" style="width: 110px" placeholder="请选择" :clearable="false"></el-date-picker>
      <el-select v-model="dismissCountType" style="width: 120px" @change="dismissCountdata = []">
        <el-option :value="1" label="按科室计数"></el-option>
        <el-option :value="2" label="按明细计数"></el-option>
        <el-option :value="3" label="死亡患者计数"></el-option>
      </el-select>
      <el-divider direction="vertical"></el-divider>
      <el-button icon="el-icon-search" type="primary" @click="fetchDismissCount">获取统计数据</el-button>
      <el-button icon="el-icon-download" type="primary" @click="exportDismissCount">导出Excel</el-button>
      <div v-if="dismissCountType === 1">
        <el-table :data="dismissCountdata" stripe height="360">
          <el-table-column prop="deptName" label="科室"></el-table-column>
          <el-table-column prop="dismissCount" label="出院人数"></el-table-column>
          <el-table-column prop="signedCount" label="已签收"></el-table-column>
          <el-table-column prop="unsignCount" label="未签收"></el-table-column>
        </el-table>
      </div>
      <div v-else>
        <el-table :data="dismissCountdata.slice((currentDismissCountPage - 1) * 10, currentDismissCountPage * 10)" stripe height="360">
          <el-table-column prop="patNo" label="住院号"></el-table-column>
          <el-table-column prop="times" label="住院次数"></el-table-column>
          <el-table-column prop="name" label="姓名"></el-table-column>
          <el-table-column prop="gender" label="性别"></el-table-column>
          <el-table-column prop="age" label="年龄"></el-table-column>
          <el-table-column prop="admissDate" label="入院时间"></el-table-column>
          <el-table-column v-if="dismissCountType === 2" prop="disDate" label="出院时间"></el-table-column>
          <el-table-column v-if="dismissCountType === 3" prop="disDate" label="死亡时间"></el-table-column>
          <el-table-column prop="inHospDays" label="住院天数"></el-table-column>
          <el-table-column prop="totalCharge" label="住院费用"></el-table-column>
          <el-table-column prop="admissDept" label="入院科室"></el-table-column>
          <el-table-column prop="disDept" label="出院科室"></el-table-column>
          <el-table-column prop="zkWard" label="转科科室"></el-table-column>
          <el-table-column prop="disDiag" label="出院主诊断"></el-table-column>
          <el-table-column prop="blfx" label="病例分型"></el-table-column>
          <el-table-column prop="kzr" label="科主任"></el-table-column>
          <el-table-column prop="zzys" label="主治医师"></el-table-column>
          <el-table-column prop="zyys" label="住院医师"></el-table-column>
          <el-table-column prop="fdcrb" label="法定传染病"></el-table-column>
        </el-table>
        <el-pagination
          :hide-on-single-page="false"
          :page-size="10"
          layout="prev, pager, next, total"
          @current-change="handleCurrentDismissCountPageChange"
          :total="dismissCountdata.length"
        >
        </el-pagination>
      </div>
    </el-dialog>
  </el-container>
</template>

<script>
import { yesOrNo, haveOrNot, searchMethods, autopsies } from './common'
import { computed, onActivated, onMounted, reactive, ref, watchEffect } from 'vue'
import store from '@/store'
import { operations } from '@/data/index'
import {
  basOutPatients,
  executeAdvanceSearch,
  executeConfirmPrint,
  executePrintVerify,
  executeSaveVerify,
  executeUnArchiveBa,
  getAllDictionary,
  getAllWards,
  getSheetInfo,
  sheetSearch,
  analyzeDismissCount,
} from '@/api/case-front-sheet'
import maleIcon from '@/assets/male-icon.png'
import femaleIcon from '@/assets/female-icon.png'
import { ElMessage, ElMessageBox } from 'element-plus'
import { shortcuts } from '@/data/shortcuts'
import { formatDate, getOneMonthOffset } from '@/utils/date'
import { initLodop, getLodop } from '@/utils/c-lodop'
import { formatMonth } from '@/utils/date'
import HeadPage from '../../../components/inpatient/frontsheet-printpage/HeadPage.vue'
import TailPage from '../../../components/inpatient/frontsheet-printpage/TailPage.vue'
import { Export } from '../../../utils/ExportExcel'
export default {
  components: {
    HeadPage,
    TailPage,
  },
  setup() {
    const cdStyle = computed(() => {
      return {
        position: 'absolute',
        top: '77px',
        left: '590px',
      }
    })
    const currentPage = ref(1)
    const handleCurrentPageChange = (val) => {
      currentPage.value = val
    }
    const userWards = ref([])
    const windowSize = store.state.app.windowSize
    const tableHeight = windowSize.h - 75
    const overview = ref([])
    const sheet = ref({
      disdiagList: [{}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}],
      surgeryList: [{}, {}, {}, {}, {}],
    })
    const mainInfo = {
      height: windowSize.h - 45 + 'px',
      padding: '0 20px',
      overflowY: 'scroll',
    }
    const dics = ref({})
    const overviewParam = reactive({
      ward: '',
      start: '',
      end: '',
      fileStatus: '0',
      lateFlag: '3',
      bah: '',
    })
    const cdPercentage = ref('')
    const isLateDataMode = ref(false)
    const searchPatient = () => {
      overviewParam.start = formatDate(dateRange.value[0])
      overviewParam.end = formatDate(dateRange.value[1])
      basOutPatients(overviewParam).then((res) => {
        isLateDataMode.value = overviewParam.lateFlag === '1'
        cdPercentage.value = res.cdPercentage
        overview.value = res.list
        if (res.list.length === 1) {
          fetchSheetInfo(res.list[0])
        }
      })
    }

    const dateRange = ref([])

    const fetchSheetInfo = (row) => {
      if (row.bah !== sheet.value.bah || row.times !== sheet.value.admissTimes) {
        forceVerifies.value = []
        adviceVerifies.value = []
      }

      getSheetInfo(row.bah, row.times, 2).then((res) => {
        sheet.value = res
      })
    }

    const showSearch = ref(false)
    const insertDiag = ref(false)
    watchEffect(() => {
      if (showSearch.value) {
        searchResults.value = []
        setTimeout(() => {
          searchInput.value.focus()
        }, 300)
      } else {
        insertDiag.value = false
      }
    })
    const searchInput = ref(null)
    const searchUrl = ref('')
    const searchTargetCode = ref('')
    const searchTargetName = ref('')
    const searchContent = ref('')
    const currentSRPage = ref(1)
    const lastPage = () => {
      currentSRPage.value -= 1
      fetchSearchData()
    }
    const nextPage = () => {
      currentSRPage.value += 1
      fetchSearchData()
    }
    const fetchSearchData = () => {
      const param = {
        method: searchMethod.value,
        target: searchUrl.value,
        content: searchContent.value,
        responceType: sheet.value.responceType,
        page: currentSRPage.value,
        ybType: sheet.value.ybType,
        treatType: sheet.value.treatType,
      }
      sheetSearch(param).then((res) => {
        searchResults.value = res
      })
    }
    const executeSearch = () => {
      if (searchContent.value.length < 2 && searchContent.value !== '-') return
      currentSRPage.value = 1
      if (searchContent.value === '-') {
        searchResults.value = [{ code: '-', name: '-' }]
      } else {
        fetchSearchData()
      }
    }

    const showDismissCount = ref(false)
    const dismissCountdata = ref([])
    const dismissCountMonth = ref(formatMonth(new Date()))
    const dismissCountType = ref(1)
    const fetchDismissCount = () => {
      dismissCountMonth.value = formatMonth(dismissCountMonth.value)
      analyzeDismissCount(dismissCountType.value, dismissCountMonth.value).then((res) => {
        dismissCountdata.value = res
      })
    }
    const exportDismissCount = () => {
      if (dismissCountdata.value.length === 0) {
        ElMessage({
          message: '没有可以导出的数据！',
          type: 'warning',
          duration: 2000,
          showClose: true,
        })
        return
      }
      let name = ''
      let title = {}
      if (dismissCountType.value === 1) {
        title = {
          deptName: '科室',
          dismissCount: '出院人数',
          signedCount: '已签收',
          unsignCount: '未签收',
        }
        name = '科室出院人数统计'
      } else {
        title = {
          patNo: '住院号',
          times: '住院次数',
          name: '姓名',
          gender: '性别',
          age: '年龄',
          admissDate: '入院时间',
          admissDept: '入院科室',
          zkWard: '转科科室',
          disDate: dismissCountType.value === 2 ? '出院时间' : '死亡时间',
          inHospDays: '住院天数',
          totalCharge: '住院费用',
          disDept: '出院科室',
          disDiag: '出院主诊断',
          blfx: '病例分型',
          kzr: '科主任',
          zzys: '主治医师',
          zyys: '住院医师',
          fdcrb: '法定传染病',
        }
        name = dismissCountType.value === 2 ? '出院明细统计' : '死亡患者统计'
      }
      const fileName = `【${dismissCountMonth.value}】${name}`
      Export(dismissCountdata.value, title, fileName)
    }
    const handleCommand = (val) => {
      switch (val) {
        case 'dismissCount':
          showDismissCount.value = true
          break
        case 'exportLateData':
          exportLateDataExel()
          break
        case 'print1':
          beforePrint(1)
          break
        case 'print2':
          beforePrint(2)
          break
        case 'confirmPrint':
          confirmCopyPrint()
          break
        case 'unSign':
          unArchiveBa()
          break
      }
    }

    const exportLateDataExel = () => {
      if (!isLateDataMode.value) {
        ElMessage({
          message: '请先查询迟交病案。',
          type: 'warning',
          duration: 2500,
          showClose: true,
        })
        return
      }
      if (overview.value.length === 0) {
        ElMessage({
          message: '没有可以导出的数据！',
          type: 'warning',
          duration: 2000,
          showClose: true,
        })
        return
      }
      const title = {
        name: '姓名',
        genderName: '性别',
        bah: '住院号',
        times: '住院次数',
        bedNo: '床位',
        admissDate: '入院时间',
        disDate: '出院时间',
        deptName: '出院科室',
        doctorName: '管床医生',
        lateDays: '迟交天数',
        signDate: '签收日期',
      }
      Export(overview.value, title, '迟交病案')
    }

    const searchMethod = ref('alpha')
    const searchResults = ref([])
    const showSearchData = (flag) => {
      if (flag === 'advanceSearchDoctor') {
        searchUrl.value = 'employee'
        searchTargetCode.value = 'advanceSearch'
        searchTargetName.value = 'doctor'
      } else if (flag === 'advanceSearchDiag') {
        searchUrl.value = 'normalDiag'
        searchTargetCode.value = 'advanceSearch'
        searchTargetName.value = 'icd'
      } else {
        searchUrl.value = 'surgery'
        searchTargetCode.value = 'advanceSearch'
        searchTargetName.value = 'surgery'
      }
      showSearch.value = true
    }

    const showAdvanceSearch = ref(false)
    const advanceSearch = reactive({
      doctorCode: '',
      doctorName: '',
      icdCode: '',
      icdName: '',
      surgeryCode: '',
      surgeryName: '',
      sex: null,
    })
    const doAdvanceSearch = () => {
      advanceSearch.start = formatDate(dateRange.value[0])
      advanceSearch.end = formatDate(dateRange.value[1])
      if (!advanceSearch.doctorName) {
        advanceSearch.doctorCode = ''
      }
      executeAdvanceSearch(advanceSearch).then((res) => {
        overview.value = res
        showAdvanceSearch.value = false
      })
    }

    const handleSelectSearch = (item) => {
      switch (searchTargetName.value) {
        case 'doctor':
          advanceSearch.doctorCode = item.code
          advanceSearch.doctorName = item.name
          break
        case 'icd':
          advanceSearch.icdCode = item.code
          advanceSearch.icdName = item.name
          break
        case 'surgery':
          advanceSearch.surgeryCode = item.code
          advanceSearch.surgeryName = item.name
          break
      }
      searchContent.value = ''
      showSearch.value = false
    }

    const nullPatient = () => {
      if (!sheet.value.bah) {
        ElMessage({
          message: '请先选择患者！',
          type: 'warning',
          duration: 2500,
          showClose: true,
        })
        return true
      }
      return false
    }
    const beforePrint = (flag) => {
      if (nullPatient()) return
      const param = {
        sheet: sheet.value,
      }
      executePrintVerify(param)
        .then(() => {
          execPrint(flag)
        })
        .catch((e) => {
          forceVerifies.value = e.data.force
          adviceVerifies.value = e.data.advice
          if (e.data.force.length === 0) {
            execPrint(flag)
          }
        })
    }
    const execPrint = (flag) => {
      LODOP = getLodop()
      const prntStyle = `<style>*{font-size:10pt} table,th,td {border: 1px solid black;border-collapse: collapse;} td,th {height: 24px;padding-left: 4px;}</style>`
      const prntContent = flag === 1 ? document.getElementById('headpage').innerHTML : document.getElementById('tailpage').innerHTML
      let pagePrint = prntStyle + '<body>' + prntContent + '</body>'
      LODOP.PRINT_INIT('casefrontsheet')
      LODOP.SET_PRINT_PAGESIZE(1, '210mm', '297mm', '')
      LODOP.SET_PRINT_MODE('FULL_WIDTH_FOR_OVERFLOW', true) // 整宽不变形
      LODOP.ADD_PRINT_HTM('2mm', '0.5mm', '209.5mm', '295mm', pagePrint)
      LODOP.SET_PRINT_STYLE('ItemType', 3)
      LODOP.PREVIEW()
    }

    const archiveBa = () => {
      if (nullPatient()) {
        return
      }
      const param = {
        opType: 2,
        sheet: sheet.value,
      }
      executeSaveVerify(param)
        .then((res) => {
          ElMessage({
            message: '操作成功。',
            type: 'success',
            duration: 2500,
            showClose: true,
          })
        })
        .catch((e) => {
          forceVerifies.value = e.data
        })
    }

    const unArchiveBa = () => {
      if (nullPatient()) {
        return
      }

      ElMessageBox.confirm('是否确认解除签收患者【' + sheet.value.name + '】的病案首页？', '提示', {
        type: 'warning',
        confirmButtonText: '解除签收',
        cancelButtonText: '取消',
      })
        .then(() => {
          const param = {
            opType: 3,
            sheet: sheet.value,
          }
          executeUnArchiveBa(param).then((res) => {
            ElMessage({
              message: res,
              type: 'success',
              duration: 2500,
              showClose: true,
            })
          })
        })
        .catch(() => {})
    }

    const confirmCopyPrint = () => {
      if (nullPatient()) {
        return
      }
      if (sheet.value.fileStatus === 2) {
        ElMessageBox.alert('此病案首页已确认过打印！', '提示', {
          showCancelButton: false,
          type: 'warning',
        }).then(() => {})
        return
      }
      ElMessageBox.confirm('是否确认患者【' + sheet.value.name + '】的病案首页已打印，此操作将不可逆转！', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          executeConfirmPrint({ sheet: sheet.value }).then(() => {
            ElMessage({
              message: '操作成功',
              type: 'success',
              duration: 2500,
              showClose: true,
            })
          })
        })
        .catch(() => {})
    }

    const messageArea = {
      width: windowSize.w - 1380 + 'px',
      height: windowSize.h - 65 + 'px',
      padding: '0 16px',
      overflowY: 'scroll',
    }

    const forceVerifies = ref([])
    const adviceVerifies = ref([])
    const currentMessageIndex = ref(null)
    const messageColor = (id) => {
      return currentMessageIndex.value === id
        ? {
            background: '#ff2b2b',
            color: 'white',
          }
        : {
            background: '#eea7a752',
            color: '#ff2b2b',
          }
    }
    const handleClickMessage = (id, index) => {
      currentMessageIndex.value = index
      let ele = document.getElementById(id)
      let i = 0
      let timer = setInterval(() => {
        ele.style.background = i % 2 == 0 ? '#fd4343' : 'transparent'
        i++
        if (i > 5) {
          clearInterval(timer)
        }
      }, 500)
    }

    const currentDismissCountPage = ref(1)
    const handleCurrentDismissCountPageChange = (val) => {
      currentDismissCountPage.value = val
    }

    onActivated(() => {
      initLodop()
    })

    onMounted(() => {
      getAllDictionary().then((res) => {
        res.getOperations = operations
        res.getYesOrNo = yesOrNo
        res.getHaveOrNot = haveOrNot
        res.getAutopsies = autopsies
        dics.value = res
        getAllWards().then((res1) => {
          userWards.value = res1
          const t = getOneMonthOffset()
          dateRange.value[0] = t.start
          dateRange.value[1] = t.end
        })
      })
    })

    return {
      currentPage,
      handleCurrentPageChange,
      forceVerifies,
      adviceVerifies,
      messageColor,
      handleClickMessage,
      messageArea,
      cdStyle,
      maleIcon,
      femaleIcon,
      userWards,
      searchPatient,
      tableHeight,
      overview,
      mainInfo,
      sheet,
      dics,
      overviewParam,
      cdPercentage,
      searchMethods,
      fetchSheetInfo,
      showSearchData,
      showSearch,
      searchInput,
      searchContent,
      searchMethod,
      searchResults,
      currentSRPage,
      executeSearch,
      lastPage,
      nextPage,
      beforePrint,
      handleSelectSearch,
      dateRange,
      shortcuts,
      handleCommand,
      showAdvanceSearch,
      advanceSearch,
      doAdvanceSearch,
      showDismissCount,
      dismissCountdata,
      dismissCountMonth,
      dismissCountType,
      fetchDismissCount,
      exportDismissCount,
      archiveBa,
      currentDismissCountPage,
      handleCurrentDismissCountPageChange,
    }
  },
}
</script>

<style scoped>
:deep(.el-dialog__body) {
  padding-top: 0;
}
.keyboard {
  margin-left: 5px;
  padding: 0.2rem 0.4rem;
  font-size: 87.5%;
  color: #fff;
  background-color: #212529;
  border-radius: 0.2rem;
}

select,
input {
  outline: none;
  border: none;
  height: 20px;
  line-height: 20px;
  border-radius: 0;
  background: transparent;
  border-bottom: 1px solid #333333;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
input[type='number'] {
  -moz-appearance: textfield;
}
select ::-ms-expand {
  display: none;
}
textarea {
  outline: none;
  border: none;
  background-color: transparent;
}
table th {
  border: 1px solid black;
  text-align: center;
}
table td {
  border: 1px solid black;
}

.page-inner {
  padding: 10px 0 0 0;
  border-radius: 12px;
  text-align: justify;
}

.message-item {
  padding: 6px;
  margin-bottom: 6px;
  border-radius: 4px;
}

.message-item:hover {
  cursor: pointer;
}
.page-wrapper {
  position: relative;
  margin: 0 auto;
  background: #fff;
  border-radius: 20px;
  text-align: justify;
  /* 高斯模糊，过滤器 */
  filter: drop-shadow(0px 0px 15px #bbb);
}
</style>