web_dist/src/views/med-tec-mod/YiJiFeiYongLuRu.vue

<template>
  <el-container>
    <el-main style="margin-top: 10px">
      <el-row>
        <el-col>
          <el-tag effect="dark" size="small">住院号: {{ patient.inpatientNo }}</el-tag>
          <el-tag effect="dark" size="small" type="warning">患者姓名: {{ patient.name }}</el-tag>
          <el-tag effect="dark" size="small"> 床号: {{ patient.bedNo }}</el-tag>
          <el-tag effect="dark" size="small" type="warning">住院次数: {{ patient.admissTimes }}</el-tag>
          <el-tag effect="dark" size="small">性别: {{ cptSex(patient.sex) }}</el-tag>
          <el-tag effect="dark" size="small" type="warning">病房: {{ patient.wardName }}</el-tag>
          <el-tag effect="dark" size="small">入院日期: {{ patient.admissDate }}</el-tag>
          <el-tag effect="dark" size="small" type="warning">医保身份: {{ patient.responceTypeName }}</el-tag>
          <el-tag effect="dark" size="small">总费用: {{ patient.totalCharge }}</el-tag>
        </el-col>
        <el-col>
          住院号：
          <el-input style="width: 80px" v-model="queryTerm.inpatientNo"
                    @keyup.enter="getHuanZheXinXiClick"></el-input>
          <span v-show="queryTerm.zaiHuanChuYuan === 1">
        住院次数：<el-input-number :min="0" :precision="0" style="width: 60px" v-model="queryTerm.admissTimes"
                                  :controls="false"></el-input-number>
      </span>
          <el-divider direction="vertical"></el-divider>
          <el-switch active-color="#ff4949" inactive-color="#13ce66" active-text="出院" inactive-text="在院"
                     :active-value="1"
                     :inactive-value="0" v-model="queryTerm.zaiHuanChuYuan">
          </el-switch>
          <el-divider direction="vertical"></el-divider>
          项目名称：
          <el-select v-model="queryTerm.chargeCode" remote filterable clearable
                     :remote-method="remoteMethodChargeCode">
            <el-option v-for="item in chargeCodeNameData" :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-date-picker
              type="daterange"
              v-model="queryTerm.dateRange"
              placeholder="选择日期"
              style="width: 200px"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              :shortcuts="shortcuts"
          ></el-date-picker>
          <el-button
              @click="queryTerm.riQiPaiXu === 'DESC' ? (queryTerm.riQiPaiXu = 'ASC') : (queryTerm.riQiPaiXu = 'DESC')"
              type="success"
              :icon="queryTerm.riQiPaiXu === 'DESC' ? 'CaretBottom' : 'CaretTop'"
          >{{ queryTerm.riQiPaiXu === 'DESC' ? '降序' : '升序' }}
          </el-button>
          <el-select style="width: 70px" v-model="queryTerm.feiYongLeiXingCode">
            <el-option v-for="item in feiYongLeiXing" :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-select v-model="queryTerm.orderNo" style="width: 70px" @change="queryHuanZheFeiYong">
            <el-option v-for="item in yiZhuTuiFeiLeiXing" :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-select v-model="queryTerm.tuiFeiFlag" style="width: 70px" @change="queryHuanZheFeiYong">
            <el-option v-for="item in tuiFeiLeiXin" :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-select v-model="queryTerm.dept" style="width: 100px">
            <el-option v-for="(value,key) in deptList"
                       :value="key" :label="value"/>
          </el-select>
          <el-button type="primary" @click="getHuanZheXinXiClick">查询</el-button>
        </el-col>
      </el-row>
      <el-tabs v-model="elTabPane">
        <el-tab-pane label="已录入费用" name="ylrfy">
          <huan-zhe-fei-yong
              :init="tableDataHuanZheFeiYong"
              :patient="patient"
              @queryFeiYong="getHuanZheXinXiClick"
              @size="handleSizeChange"
              @current="handleCurrentChange"
              @execl="exportExecl"
          ></huan-zhe-fei-yong>
        </el-tab-pane>
        <el-tab-pane label="费用录入" name="fylr">
          <xiang-mu-lu-ru :patient="patient"
                          ref="xlmrRef"
                          @the-upload-is-successful="theUploadIsSuccessful"/>
        </el-tab-pane>
      </el-tabs>
    </el-main>
  </el-container>
</template>

<script setup>
import {ref} from 'vue'
import store from '@/store'
import {getHuanZheXinXi} from '@/api/zhu-yuan-yi-ji/yi-ji-fei-yong-lu-ru'
import {cptSex} from '@/utils/computed'
import {getChargeCode} from '@/api/inpatient/xiang-mu-lu-ru'
import {getHuanZheFeiYong} from '@/api/inpatient/xiang-mu-lu-ru'
import HuanZheFeiYong from '@/components/med-tec-mod/HuanZheFeiYong.vue'
import XiangMuLuRu from '@/components/med-tec-mod/YiJiXiangMuLuRu.vue'
import {yiZhuTuiFeiLeiXing, feiYongLeiXing, tuiFeiLeiXin} from '@/data'
import {shortcuts} from '@/data/shortcuts'
import {getDateRangeFormatDate} from '@/utils/date'
import {ElMessage, ElMessageBox} from 'element-plus'
import {downloadExcel} from '@/utils/excel'
import {getServerDateApi} from "@/api/public-api";
import {userInfoStore} from "@/utils/store-public";

const dangQianShiJian = new Date()
const deptList = userInfoStore.value.partTimeDeptMap

const xlmrRef = ref()

const queryTerm = ref({
  inpatientNo: '',
  admissTimes: 0,
  zaiHuanChuYuan: '',
  dateRange: [dangQianShiJian, dangQianShiJian],
  riQiPaiXu: 'DESC',
  chargeCode: '',
  orderNo: 2,
  feiYongLeiXingCode: 0,
  dept: store.state.user.info.deptCode === '3100000' ? '' : store.state.user.info.deptCode,
  currentPage: 1,
  pageSize: 30,
  total: 0,
  tuiFeiFlag: 0,
})

const total = ref(0)

const elTabPane = ref('ylrfy')
const patient = ref({})

const tableDataHuanZheFeiYong = ref([])

const getHuanZheXinXiClick = () => {
  if (queryTerm.value.zaiHuanChuYuan === 0) {
    queryTerm.value.admissTimes = 0
  }
  if (patient.inpatientNo === queryTerm.value.inpatientNo) {
    queryHuanZheFeiYong()
  } else {
    getHuanZheXinXi(queryTerm.value.inpatientNo, queryTerm.value.zaiHuanChuYuan, queryTerm.value.admissTimes)
        .then((res) => {
          console.log(res)
          console.log(xlmrRef)
          xlmrRef.value.updateDeptAndWard(res.admissDept, res.zkWard)
          patient.value = res
          patient.value.feiYongLeiXingCode = queryTerm.value.feiYongLeiXingCode
          queryTerm.value.admissTimes = res.admissTimes
          queryHuanZheFeiYong()
          // 第一个参数病区， 第二个参数科室 ， 这里是需要反过来的

        })
        .catch(() => {
          patient.value = {}
          tableDataHuanZheFeiYong.value = []
        })
  }
}

const queryHuanZheFeiYong = () => {
  if (elTabPane.value !== 'ylrfy') return
  let dateRangeS = getDateRangeFormatDate(queryTerm.value.dateRange)
  queryTerm.value.startTime = dateRangeS.startTime
  queryTerm.value.endTime = dateRangeS.endTime
  queryTerm.value.currentPage = 1
  queryTerm.value.total = 0
  getHuanZheFeiYong(queryTerm.value)
      .then((res) => {
        total.value = res.total
        patient.value.total = total.value
        tableDataHuanZheFeiYong.value = res
      })
      .catch(() => {
        tableDataHuanZheFeiYong.value = []
      })
}

const handleHuanZheFeiYong = () => {
  if (elTabPane.value !== 'ylrfy') return
  let dateRangeS = getDateRangeFormatDate(queryTerm.value.dateRange)
  queryTerm.value.startTime = dateRangeS.startTime
  queryTerm.value.endTime = dateRangeS.endTime
  queryTerm.value.total = total.value
  getHuanZheFeiYong(queryTerm.value)
      .then((res) => {
        res.total = total.value
        tableDataHuanZheFeiYong.value = res
      })
      .catch(() => {
        tableDataHuanZheFeiYong.value = []
      })
}

// 根据项目名称来查询
const chargeCodeNameData = ref([])

/**
 * 远程搜索
 */
const remoteMethodChargeCode = (val) => {
  if (val.length >= 2) {
    getChargeCode(val).then((res) => {
      chargeCodeNameData.value = res
    })
  }
}

// 分页
const handleSizeChange = (val) => {
  queryTerm.value.pageSize = val.val
  patient.value.pageSize = val.val
  queryHuanZheFeiYong()
}

const handleCurrentChange = (val) => {
  queryTerm.value.currentPage = val.val
  handleHuanZheFeiYong()
}

// 导出excel 表格
const exportExecl = () => {
  if (total.value > 0) {
    ElMessageBox.prompt('导出文件名字', '提示', {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      inputPattern: /\S/,
      inputErrorMessage: '文件名不能为空 (∩•̀ω•́)⊃-*⋆',
    })
        .then(({value}) => {
          queryTerm.value.total = total.value
          const data = {
            param: queryTerm.value,
            url: '/xmlr/exportExcel',
            fileName: `${value}.xlsx`,
          }
          setTimeout(() => {
            downloadExcel(data)
          }, 500)
        })
        .catch((e) => {
        })
  } else {
    ElMessage.error('请先查询出数据')
  }
}

const theUploadIsSuccessful = async () => {
  elTabPane.value = 'ylrfy'
  let now = await getServerDateApi()
  queryTerm.value.dateRange = [now, now]
  queryTerm.value.feiYongLeiXingCode = 0
  queryTerm.value.orderNo = 2
  queryTerm.value.tuiFeiFlag = 0
  queryHuanZheFeiYong()
}

</script>

<style></style>