web_dist/src/views/medical-insurance/outpatient/MzRegister.vue

<template>
  <el-container>
    <el-header style="height: 35px; margin-top: 10px">
      <el-input v-model="patientId" style="width: 200px; margin-left: 2px" clearable placeholder="请输入">
        <template #prepend>门诊id</template>
      </el-input>
      <el-select v-model="medType" style="width: 120px" placeholder="医疗类别">
        <el-option v-for="item in medTypes" :key="item.code" :value="item.code" :label="item.name"></el-option>
      </el-select>

      <el-select v-model="admdvs" clearable filterable placeholder="参保地区" style="width: 180px">
        <el-option v-for="item in admdvses" :key="item.code" :label="item.name" :value="item.code">
          <span style="color: #8492a6; font-size: 12px">{{ item.code }}</span>
          <el-divider direction="vertical"></el-divider>
          <span>{{ item.name }}</span>
        </el-option>
      </el-select>

      <el-dropdown trigger="click" @command="receiptsOpts" style="margin-left: 8px">
        <el-button type="primary">
          处方&nbsp;<el-icon><ArrowDown /></el-icon>
        </el-button>
        <template #dropdown>
          <el-dropdown-menu>
            <el-dropdown-item icon="Document" command="require">获取门诊处方</el-dropdown-item>
            <el-dropdown-item icon="Delete" command="delete">删除所有处方</el-dropdown-item>
          </el-dropdown-menu>
        </template>
      </el-dropdown>
      <ReadCard :pat-no="patientId" @success="afterReadCard" />
      <el-dropdown trigger="click" @command="registor">
        <el-button type="primary">
          登记&nbsp;<el-icon><ArrowDown /></el-icon>
        </el-button>
        <template #dropdown>
          <el-dropdown-menu>
            <el-dropdown-item icon="CreditCard" command="execute">医保登记</el-dropdown-item>
            <el-dropdown-item icon="RefreshLeft" command="revoke">取消登记</el-dropdown-item>
          </el-dropdown-menu>
        </template>
      </el-dropdown>
      <el-dropdown trigger="click" @command="receiptsOpts" style="margin-left: 8px">
        <el-button type="primary">
          上传&nbsp;<el-icon><ArrowDown /></el-icon>
        </el-button>
        <template #dropdown>
          <el-dropdown-menu>
            <el-dropdown-item icon="Upload" command="upload">医保处方上传</el-dropdown-item>
            <el-dropdown-item icon="RefreshLeft" command="retract">撤销处方上传</el-dropdown-item>
            <el-dropdown-item divided icon="Edit" command="diags">普门诊断补录</el-dropdown-item>
          </el-dropdown-menu>
        </template>
      </el-dropdown>

      <el-dropdown trigger="click" @command="settlement" style="margin-left: 8px">
        <el-button type="primary">
          结算&nbsp;<el-icon><ArrowDown /></el-icon>
        </el-button>
        <template #dropdown>
          <el-dropdown-menu>
            <el-dropdown-item icon="SetUp" command="preSettlement">试算</el-dropdown-item>
            <el-dropdown-item icon="Stamp" command="realSettlement">结算</el-dropdown-item>
            <el-dropdown-item divided icon="RefreshLeft" command="cancelSettlement">取消结算</el-dropdown-item>
          </el-dropdown-menu>
        </template>
      </el-dropdown>
      <el-button type="danger" icon="Refresh" @click="clearinfo" style="margin-left: 8px"> 重置 </el-button>
    </el-header>
    <el-main>
      <el-row :gutter="5">
        <el-col :span="2">
          <el-table ref="timesTable" :data="unPaidReceipts" highlight-current-row :height="tableHeight" @row-click="clickTimes">
            <el-table-column label="就诊次数">
              <template #default="scope"> 第 {{ scope.row.times }} 次 </template>
            </el-table-column>
          </el-table>
        </el-col>
        <el-col :span="5">
          <el-table ref="ordersTable" :data="orderNos" highlight-current-row :height="tableHeight" @row-click="clickOrderNo">
            <el-table-column label="处方" width="60">
              <template #default="scope">
                <span v-html="colorStatus(scope.row)"></span>
              </template>
            </el-table-column>
            <el-table-column label="金额" width="60">
              <template #default="scope">
                {{ scope.row.totalFee.toFixed(2) }}
              </template>
            </el-table-column>
            <el-table-column label="操作">
              <template #default="scope">
                <el-button text icon="Check" @click="markMzFees" :disabled="scope.row.status"> 生成 </el-button>
                <el-button text icon="Delete" @click="unmarkMzFees(scope.row)" :disabled="!scope.row.status"> 撤销 </el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-col>
        <el-col :span="15">
          <div style="margin-left: 30px; position: relative">
            <img v-if="mzVisit.settledFlag === 1" :src="mzSettled" alt="" style="z-index: 999; width: 230px;
            position: absolute; top: 160px; left: 260px; background: rgba(255,255,255,.5)">
            <div class="receipt-title">长沙泰和医院处方笺</div>
            <el-divider></el-divider>
            <div class="receipt-head">
              <div>姓名：{{ mzVisit.name }}</div>
              <div>性别：{{ mzVisit.sex }}</div>
              <div>年龄：{{ mzVisit.age }} 岁</div>
            </div>
            <div class="receipt-head">
              <div>门诊号：{{ mzVisit.patientId }}</div>
              <div>科别：{{ mzVisit.visitDeptName }}</div>
              <div class="ellipsis-text" :title="mzVisit.icdText">临床诊断：{{ mzVisit.icdText }}</div>
            </div>
            <div class="receipt-head">
              <div>开具日期：{{ mzVisit.opDay }}</div>
              <div class="ellipsis-text">
                地址：<span :title="mzVisit.address">{{ mzVisit.address }}</span>
              </div>
              <div>电话：{{ mzVisit.phoneNo }}</div>
            </div>
            <el-divider></el-divider>
            <div :style="receiptBoxStyle">
              <div v-for="(item, index) in currentReceipts" :key="index">
                <div class="receipt-item">
                  <div class="w75">
                    <el-checkbox v-model="item.checked"></el-checkbox>
                    {{ index + 1 }}）{{ item.drugName }}&nbsp; （
                    <span v-if="item.specification">{{ item.specification }}</span>
                    <span v-else>{{ item.drugUnit }}</span>
                    ）
                  </div>
                  <div class="w25">&times;&nbsp;&nbsp;&nbsp;{{ item.quantity }}</div>
                </div>
                <div class="receipt-tips">
                  <span v-if="item.drugQuan"> 用法：{{ item.drugQuan }}{{ item.drugUnit }}/次 </span>
                  <span v-if="item.frequency"> {{ item.frequency }} </span>
                  <span v-if="item.orderDays"> {{ item.orderDays }}天 </span>
                  <span v-if="item.supplyCode"> {{ item.supplyCode }} </span>
                  <span v-if="item.instructionText"> 备注：{{ item.instructionText }} </span>
                </div>
                <div :style="{ color: item.nationalCode ? 'green' : 'red', fontWeight: 'bold', padding: '0 0 12px 64px' }">医保码：{{ item.nationalCode || '未匹配' }}</div>
              </div>
            </div>
            <el-divider></el-divider>
            <div class="receipt-head">
              <div style="font-size: 15px; width: 70%">医师：{{ mzVisit.doctorName }} / {{ mzVisit.doctorCode }} / <span v-html="highlightYbCode(mzVisit.doctorCode,mzVisit.doctorYbCode)"></span></div>
              <div style="font-size: 15px">
                总金额：<span style="font-size: 18px; font-weight: bold">￥{{ totalFee }}</span>
              </div>
            </div>
          </div>
        </el-col>
      </el-row>
    </el-main>
    <el-dialog title="个人信息" v-model="showInsuinfo" width="65%">
      <el-tag>参保信息</el-tag>
      <el-table :data="psnBaseinfo.insuinfo" @row-click="handleClickInsuinfo">
        <el-table-column property="balc" label="余额"></el-table-column>
        <el-table-column label="险种类型" prop="insutypeName"></el-table-column>
        <el-table-column label="人员类别" prop="psnTypeName"></el-table-column>
        <el-table-column label="参保状态" prop="psnInsuStasName"></el-table-column>
        <el-table-column property="psnInsuDate" label="个人参保日期"></el-table-column>
        <el-table-column property="pausInsuDate" label="暂停参保日期"></el-table-column>
        <el-table-column property="cvlservFlagName" label="公务员标志"></el-table-column>
        <el-table-column property="insuplcAdmdvs" label="参保地医保区划"></el-table-column>
        <el-table-column property="insuplcAdmdvsName" label="参保地名称"></el-table-column>
        <el-table-column property="empName" label="单位名称"></el-table-column>
      </el-table>
      <div style="height: 16px"></div>
      <el-tag>身份信息</el-tag>
      <el-table :data="psnBaseinfo.idetinfo" stripe height="180">
        <el-table-column label="人员身份类别" prop="psnIdetTypeName"></el-table-column>
        <el-table-column label="人员类别等级" prop="psnTypeLv"></el-table-column>
        <el-table-column label="备注" prop="memo"></el-table-column>
        <el-table-column label="开始时间" prop="begntime"></el-table-column>
        <el-table-column label="结束时间" prop="endtime"></el-table-column>
      </el-table>
    </el-dialog>

    <el-dialog title="请选择（慢特病备案信息）" v-model="showSpcChrAccts" width="40%">
      <el-table :data="spcChrDiseAccts" @row-click="uploadFees">
        <el-table-column property="opspDiseCode" label="病种编码"></el-table-column>
        <el-table-column property="opspDiseName" label="病种名称"></el-table-column>
        <el-table-column property="begndate" label="生效日期"></el-table-column>
        <el-table-column property="enddate" label="失效日期"></el-table-column>
      </el-table>
    </el-dialog>
    <el-dialog title="请选择生育病种" v-model="showMatnDises" width="60%">
      <el-table :data="matnDises" @row-click="uploadFees" stripe height="360">
        <el-table-column property="code" label="病种编码"></el-table-column>
        <el-table-column property="name" label="病种名称"></el-table-column>
        <el-table-column property="insutype" label="险种类型"></el-table-column>
        <el-table-column property="limitAmt" label="疾病限额"></el-table-column>
      </el-table>
    </el-dialog>
    <el-dialog title="普门诊断补录" v-model="showInputDiags" width="60%" :close-on-click-modal="false" :close-on-press-escape="false">
      <outpatient-diagnose-supply :med-type="medType" :mz-visit="mzVisit" @close="showInputDiags = false"></outpatient-diagnose-supply>
    </el-dialog>
  </el-container>
</template>

<script>
import { onMounted, reactive, ref } from 'vue'
import { admdvses } from '@/data'
import {
  deleteAllMzReceipts,
  deleteMzReceipt,
  getMzReceipts,
  insertSiMzFees,
  outpatientPreSettlement,
  outpatientRegistration,
  revokeOutpatientFeeDetails,
  revokeOutpatientRegistration,
  uploadOutpatientFeeDetails,
  outpatientSettlement,
  revokeOutpatientSettlement,
} from '@/api/medical-insurance/si-outpatient'
import { cptInsutype } from '@/utils/computed'
import { ElMessage, ElMessageBox } from 'element-plus'
import store from '@/store'
import { obtainBasicPersonInfo, querySpecialChronicDiseasesAccreditation, queryMzMatnDises } from '@/api/medical-insurance/si-query'
import { getMedTypesByFlag } from '@/api/medical-insurance/si-dict'
import ReadCard from '@/components/medical-insurance/readcard/Index.vue'
import mzSettled from '@/assets/mz-settled.png'
import OutpatientDiagnoseSupply from '@/components/medical-insurance/outpatient-diagnose-supply/Index.vue'

export default {
  components: {
    ReadCard,
    OutpatientDiagnoseSupply,
  },
  setup() {
    //todo 完成业务后清除原读卡数据
    const medType = ref(null)
    const admdvs = ref(null)
    const medTypes = ref([])
    const patientId = ref('')
    const readCardBizType = ref('')
    const times = ref(null)
    const windowSize = store.state.app.windowSize
    const tableHeight = windowSize.h - 55
    const receiptBoxStyle = {
      height: tableHeight - 280 + 'px',
      overflowY: 'auto',
    }
    const unPaidReceipts = ref([])
    const showInsuinfo = ref(false)
    const psnBaseinfo = ref({})
    const mzVisit = ref({})
    const receipts = ref({})
    const orderNos = ref([])
    const currentReceipts = ref([])
    const totalFee = ref(null)
    const timesTable = ref(null)
    const ordersTable = ref(null)
    const currentOrder = ref({})
    const spcChrDiseAccts = ref([])
    const showSpcChrAccts = ref(false)
    const matnDises = ref([])
    const showMatnDises = ref(false)
    const showInputDiags = ref(false)

    const nullPatientId = () => {
      if (!patientId.value) {
        ElMessage({
          message: '请输入门诊id号！',
          type: 'warning',
          duration: 2500,
          showClose: true,
        })
        return true
      }
      return false
    }

    const registor = (command) => {
      if (nullPatientId()) {
        return
      }
      if (nullTimes()) {
        return
      }
      const param = {
        patNo: patientId.value,
        medType: medType.value,
        admdvs: admdvs.value,
        times: times.value,
        needSaving: 1,
      }
      if (command === 'execute') {
        if (!medType.value) {
          ElMessage({
            message: '请先选择医疗类别！',
            type: 'warning',
            duration: 2500,
            showClose: true,
          })
          return
        }
        obtainBasicPersonInfo(param).then((res) => {
          times.value = res.times
          psnBaseinfo.value = res
          showInsuinfo.value = true
        })
      } else {
        revokeOutpatientRegistration(param).then((res) => {
          ElMessage({
            message: res,
            type: 'success',
            duration: 2000,
            showClose: true,
          })
        })
      }
    }

    const nullTimes = () => {
      if (!times.value) {
        ElMessage({
          message: '请先获取门诊处方！',
          type: 'warning',
          duration: 2500,
          showClose: true,
        })
        return true
      }
      return false
    }

    const receiptsOpts = (command) => {
      if (nullPatientId()) {
        return
      }
      if (command !== 'require') {
        if (nullTimes()) {
          return
        }
      }
      const param = {
        patNo: patientId.value,
        times: times.value,
      }
      switch (command) {
        case 'require':
          fetchReceipts(param)
          break
        case 'delete':
          deleteAllMzReceipts(param).then((res) => {
            ElMessage({
              message: res,
              type: 'success',
              duration: 2000,
              showClose: true,
            })
            fetchReceipts(param)
          })
          break
        case 'upload':
          qrySpcChrDiseAcct(param)
          break
        case 'retract':
          revokeOutpatientFeeDetails(param).then((res) => {
            ElMessage({
              message: res,
              type: 'success',
              duration: 2000,
              showClose: true,
            })
          })
          break
        case 'diags':
          showInputDiags.value = true
          break
      }
    }

    const fetchReceipts = (param) => {
      clearReadCardData()
      getMzReceipts(param)
        .then((res) => {
          unPaidReceipts.value = res
          setTimeout(() => {
            timesTable.value.setCurrentRow(res[0])
            clickTimes(res[0])
          }, 100)
        })
        .catch(() => {
          unPaidReceipts.value = []
          orderNos.value = []
          currentReceipts.value = []
        })
    }

    const markMzFees = () => {
      if (currentReceipts.value.length === 0) {
        ElMessage({
          message: '请先选择要保存的处方！',
          type: 'warning',
          duration: 2500,
          showClose: true,
        })
        return
      }
      ElMessageBox.confirm('是否将选中处方生成医保处方？', '提示', {
        type: 'warning',
        confirmButtonText: '生成',
        cancelButtonText: '取消',
      })
        .then(() => {
          insertSiMzFees(currentReceipts.value).then(() => {
            currentOrder.value.status = true
            ElMessage({
              message: '已成功生成医保处方。',
              type: 'success',
              duration: 2500,
              showClose: true,
            })
          })
        })
        .catch(() => {})
    }

    const qrySpcChrDiseAcct = (param) => {
      if (medType.value === '51') {
        queryMzMatnDises().then((res) => {
          matnDises.value = res
          showMatnDises.value = true
        })
      } else if (medType.value === '14') {
        querySpecialChronicDiseasesAccreditation(param).then((res) => {
          spcChrDiseAccts.value = res
          showSpcChrAccts.value = true
        })
      } else {
        uploadFees(param)
      }
    }

    const uploadFees = (row) => {
      if (medType.value === '51') {
        row.patNo = patientId.value
        row.times = times.value
        row.opspDiseCode = row.code
        row.opspDiseName = row.name
      }
      uploadOutpatientFeeDetails(row).then((res) => {
        times.value = res.times
        showSpcChrAccts.value = false
        showMatnDises.value = false
        mzPreSetl()
      })
    }

    const readCardData = reactive({
      mdtrtCertType: null,
      readCardResult: null,
      readCardBizType: null,
    })

    const clearReadCardData = () => {
      readCardData.mdtrtCertType = null
      readCardData.readCardResult = null
      readCardData.readCardBizType = null
    }

    const afterReadCard = (result) => {
      readCardData.mdtrtCertType = result.mdtrtCertType
      readCardData.readCardResult = result.readCardResult
      readCardData.readCardBizType = result.readCardBizType
    }

    const handleClickInsuinfo = (row) => {
      const param = {
        patNo: patientId.value,
        times: times.value,
        name: mzVisit.value.name,
        insutype: row.insutype,
        psnType: row.psnType,
        insuplcAdmdvs: row.insuplcAdmdvs,
        empName: row.empName,
        balc: row.balc,
        mdtrtCertType: readCardData.mdtrtCertType,
        readCardResult: readCardData.readCardResult,
        readCardBizType: readCardData.readCardBizType,
      }
      outpatientRegistration(param).then((res) => {
        showInsuinfo.value = false
        clearReadCardData()
        ElMessage({
          message: res,
          type: 'success',
          duration: 2000,
          showClose: true,
        })
      })
    }

    const clickOrderNo = (row) => {
      currentOrder.value = row
      currentReceipts.value = receipts.value[row.orderNo]
      totalFee.value = row.totalFee.toFixed(2)
    }

    const clickTimes = (row) => {
      mzVisit.value = row.mzVisit
      receipts.value = row.mzReceipts
      orderNos.value = row.orderNos
      times.value = row.times
      currentReceipts.value = []
      setTimeout(() => {
        ordersTable.value.setCurrentRow(orderNos.value[0])
        clickOrderNo(orderNos.value[0])
      }, 100)
    }

    const colorStatus = (row) => {
      return row.status ? `<span style="color: green">第${row.orderNo}张</span>` : `<span style="color: red">第${row.orderNo}张</span>`
    }

    const unmarkMzFees = (row) => {
      ElMessageBox.confirm('是否将选中处方从医保处方中删除？', '提示', {
        type: 'warning',
        confirmButtonText: '确定',
        cancelButtonText: '取消',
      })
        .then(() => {
          deleteMzReceipt(row).then(() => {
            currentOrder.value.status = false
            ElMessage({
              message: '已成功删除医保处方。',
              type: 'success',
              duration: 2500,
              showClose: true,
            })
          })
        })
        .catch(() => {})
    }

    const settlement = (command) => {
      if (nullPatientId() || nullTimes()) {
        return
      }
      switch (command) {
        case 'preSettlement':
          mzPreSetl()
          break
        case 'realSettlement':
          chooseWhetherUseAcctFlag()
          break
        case 'cancelSettlement':
          revokeMzSettle()
          break
      }
    }

    const mzPreSetl = () => {
      const param = {
        staffId: store.state.user.info.code,
        patNo: patientId.value,
        times: times.value,
        mdtrtCertType: readCardData.mdtrtCertType,
        readCardResult: readCardData.readCardResult,
        readCardBizType: readCardData.readCardBizType,
      }
      outpatientPreSettlement(param).then((res) => {
        const message = '医保处方总费用：' + res.totalCost + '，医保报销金额：' + res.fundPay + '。'
        ElMessageBox.alert(message, '试算成功', {
          type: 'success',
          showCancelButton: false,
        }).then(() => {})
      })
    }

    const chooseWhetherUseAcctFlag = () => {
      ElMessageBox.confirm('是否使用个人账户？', '提示', {
        type: 'warning',
        confirmButtonText: '不使用',
        cancelButtonText: '使用',
        distinguishCancelAndClose: true,
        closeOnClickModal: false,
        closeOnPressEscape: false,
      }).then(() => {
        mzSettle('0')
      }).catch((action) => {
        if (action === 'cancel') {
          mzSettle('1')
        }
      })
    }

    const mzSettle = (useAcctFlag) => {
      const param = {
        patNo: patientId.value,
        times: times.value,
        acctUsedFlag: useAcctFlag,
        mdtrtCertType: readCardData.mdtrtCertType,
        readCardResult: readCardData.readCardResult,
        readCardBizType: readCardData.readCardBizType,
      }
      outpatientSettlement(param).then((res) => {
        clearReadCardData()
        const message = '医保处方总费用：' + res.totalCost + '，医保报销金额：' + res.fundPay + '。'
        ElMessageBox.alert(message, '结算成功', {
          type: 'success',
          showCancelButton: false,
        }).then(() => {})
      })
    }

    const revokeMzSettle = () => {
      const param = {
        patNo: patientId.value,
        times: times.value,
      }
      revokeOutpatientSettlement(param).then((res) => {
        ElMessageBox.alert('撤销门诊结算成功', '提示', {
          type: 'success',
          showCancelButton: false,
        })
      })
    }

    const clearinfo = () => {
      patientId.value = ''
      times.value = null
      unPaidReceipts.value = []
      psnBaseinfo.value = {}
      mzVisit.value = {}
      receipts.value = {}
      orderNos.value = []
      currentReceipts.value = []
      totalFee.value = null
      timesTable.value = null
      ordersTable.value = null
      currentOrder.value = {}
      spcChrDiseAccts.value = []
    }

    const highlightYbCode = (hisCode, ybCode) => {
      if (!hisCode) {
        return ''
      }
      return ybCode ? `<span>${ybCode}</span>` : '<span style="color: red">医师无医保编码</span>'
    }

    onMounted(() => {
      getMedTypesByFlag('clinic').then((res) => {
        medTypes.value = res
      })
    })

    return {
      medType,
      medTypes,
      admdvs,
      admdvses,
      patientId,
      readCardBizType,
      cptInsutype,
      receiptBoxStyle,
      tableHeight,
      showInsuinfo,
      psnBaseinfo,
      mzVisit,
      receipts,
      orderNos,
      currentReceipts,
      totalFee,
      ordersTable,
      timesTable,
      unPaidReceipts,
      spcChrDiseAccts,
      showSpcChrAccts,
      matnDises,
      showMatnDises,
      showInputDiags,
      mzSettled,
      afterReadCard,
      clickTimes,
      colorStatus,
      clickOrderNo,
      handleClickInsuinfo,
      uploadFees,
      clearinfo,
      markMzFees,
      unmarkMzFees,
      registor,
      receiptsOpts,
      settlement,
      highlightYbCode,
    }
  },
}
</script>

<style scoped>
.receipt-title {
  width: 100%;
  text-align: center;
  font-weight: bold;
  font-size: 20px;
  height: 32px;
  line-height: 32px;
}
.receipt-head {
  display: flex;
  height: 22px;
  line-height: 22px;
}
.receipt-head > div {
  width: 33%;
  padding-right: 20px;
}
.receipt-item {
  display: flex;
}
.receipt-tips {
  margin: 0 0 0 64px;
}
.receipt-tips > span {
  margin-right: 15px;
}
.w75 {
  width: 70%;
  font-size: 15px;
}
.w75 * {
  font-size: 15px;
}
.w25 {
  width: 25%;
  font-size: 15px;
  color: #0f5e0f;
  font-weight: bold;
}
</style>