<template>
  <el-container style="width: max-content">
    <el-header style="height: 30px">
      检验名称：
      <el-autocomplete
          v-model="chaXunJianYanTiaoJian.orderName"
          :fetch-suggestions="querySearchAsync"
          clearable
          style="width: 120px"
          @keyup.enter="dianJiChaXunJianYan(0)"
      ></el-autocomplete>
      检验时间：
      <el-date-picker
          v-model="dateRange"
          :shortcuts="shortcuts"
          clearable
          end-placeholder="结束日期"
          placeholder="选择日期"
          range-separator="至"
          size="small"
          start-placeholder="开始日期"
          style="width: 280px"
          type="daterange"
      ></el-date-picker>
      <el-divider direction="vertical"></el-divider>
      <el-button icon="Search" type="primary" @click="dianJiChaXunJianYan(0)">查询</el-button>
      <el-button icon="View" type="primary" @click="dianJiChaKanHuanZheJianYan">查看患者检验</el-button>
      检验搜索查询：
      <xc-combo-grid :query-data-func="getJyItem" @rowClick="searchAdd">
        <el-table-column label="编码" prop="code"/>
        <el-table-column width="240" label="名称" prop="name"/>
        <el-table-column label="标本" prop="inspectStuffName"/>
        <el-table-column label="执行科室" prop="execUnitName"/>
      </xc-combo-grid>
    </el-header>
    <el-main>
      <el-tabs v-model="activeName">
        <el-tab-pane :name="1" label="新增检验">
          <tian-jia-jian-cha-jian-yan :jian-cha="false"/>
        </el-tab-pane>
        <el-tab-pane :name="0" label="历史信息">
          <el-table :data="jianYanShuJu" :height="windowSize.h / 1.5">
            <el-table-column label="医嘱号" prop="actOrderNo"></el-table-column>
            <el-table-column label="项目名称" prop="groupName"></el-table-column>
            <el-table-column label="执行科室" prop="execDeptName"></el-table-column>
            <el-table-column label="标本" prop="inspectStuffName"></el-table-column>
            <el-table-column label="申请备注" prop="reqComment" show-overflow-tooltip></el-table-column>
            <el-table-column label="申请时间" prop="reqDate" show-overflow-tooltip></el-table-column>
            <el-table-column label="申请科室" prop="reqDeptName"></el-table-column>
            <el-table-column label="申请医生" prop="reqDoctorName"></el-table-column>
            <el-table-column label="接受" prop="receiveFlagName"></el-table-column>
            <el-table-column label="操作" width="250" fixed="right">
              <template #default="scope">
                <el-popover :width="500"
                            trigger="click"
                            placement="left"
                            title="费用详情">
                  <template #reference>
                    <el-button icon="View" type="primary" text @click="viewFeeDetails(scope.row )">查看详情</el-button>
                  </template>
                  <el-table :data="feeDetailsData">
                    <el-table-column property="orderCode" label="检查编码"/>
                    <el-table-column property="occCode" label="收费编码"/>
                    <el-table-column property="name" label="名字"/>
                    <el-table-column property="amount" label="数量"/>
                    <el-table-column property="chargeAmount" label="金额"/>
                    <el-table-column property="unitPrice" label="单价"/>
                  </el-table>
                </el-popover>
                <el-button icon="Delete" type="danger" text @click="dianJiShanChu(scope.row, scope.$index)">删除
                </el-button>
              </template>
            </el-table-column>
          </el-table>
          <el-pagination
              :current-page="chaXunJianYanTiaoJian.currentPage"
              :page-size="chaXunJianYanTiaoJian.pageSize"
              :page-sizes="[10, 20, 30, 40]"
              :total="chaXunJianYanTiaoJian.currentPage"
              layout="total, sizes, prev, pager, next, jumper"
              @size-change="jianYanTiaoShu"
              @current-change="jianYanFenYe">
          </el-pagination>
        </el-tab-pane>
      </el-tabs>
    </el-main>
  </el-container>
</template>

<script name="JianYanShenQing" setup>
import {computed, ref, watch} from 'vue'
import {shortcuts} from '@/data/shortcuts'
import store from '@/store'
import {getDateRangeFormatDate, getFormatDatetime} from '@/utils/date'
import {
  huanZheXinXi,
  xuanZhongJianCha,
  youWuXuanZheHuanZhe
} from '@/views/hospitalization/zhu-yuan-yi-sheng/public-js/zhu-yuan-yi-sheng'
import {
  getJyItem,
  huoQuJianYan,
  huoQuJianYanJianChaMing,
  shanChuJianChaJianYan, viewInspectionItemDetails
} from '@/api/zhu-yuan-yi-sheng/jian-yan-jian-cha-shen-qing'
import router from '@/router'
import {ElMessageBox} from 'element-plus'
import {getServerDateApi} from '@/api/public-api'
import TianJiaJianChaJianYan from "@/components/zhu-yuan-yi-sheng/jian-cha-shen-qing/TianJiaJianChaJianYan";
import XcComboGrid from "@/components/xiao-chan/combo-grid/XcComboGrid.vue";
import {xcMessage} from "@/utils/xiaochan-element-plus";

const windowSize = computed(() => {
  return store.state.app.windowSize
})


const dateRange = ref(null)
const jianYanShuJu = ref([])

const activeName = ref(1)

const chaXunJianYanTiaoJian = ref({
  orderName: '',
  startTime: '',
  endTime: '',
  currentPage: 1,
  pageSize: 20,
  total: 0,
  patNo: '',
  times: '',
})

const dianJiChaXunJianYan = (val) => {
  chaXunJianYanTiaoJian.value.total = val
  let dateS = getDateRangeFormatDate(dateRange.value)
  chaXunJianYanTiaoJian.value.startTime = dateS.startTime
  chaXunJianYanTiaoJian.value.endTime = dateS.endTime
  chaXunJianYanTiaoJian.value.patNo = huanZheXinXi.value.inpatientNo
  chaXunJianYanTiaoJian.value.times = huanZheXinXi.value.admissTimes
  huoQuJianYan(chaXunJianYanTiaoJian.value).then((res) => {
    if (val === 0) {
      chaXunJianYanTiaoJian.value.total = res.total
    }
    jianYanShuJu.value = res.records
  })
}

const jianYanTiaoShu = (val) => {
  chaXunJianYanTiaoJian.value.currentPage = 1
  chaXunJianYanTiaoJian.value.pageSize = val
  dianJiChaXunJianYan(0)
}

const jianYanFenYe = (val) => {
  chaXunJianYanTiaoJian.value.currentPage = val
  dianJiChaXunJianYan(chaXunJianYanTiaoJian.value.total)
}

const querySearchAsync = (val, cb) => {
  if (youWuXuanZheHuanZhe()) return
  huoQuJianYanJianChaMing(val, huanZheXinXi.value.inpatientNo, huanZheXinXi.value.admissTimes, huanZheXinXi.value.bedNo, '2').then((res) => {
    cb(res)
  })
}

let feeDetailsData = $ref([])

const viewFeeDetails = ({orderCode}) => {
  viewInspectionItemDetails(orderCode).then((res) => {
    feeDetailsData = res
  })
}

const dianJiShanChu = (row, index) => {
  ElMessageBox.confirm(`您确定要删除【${row.orderName}】吗？`, '提示')
      .then(() => {
        shanChuJianChaJianYan(row.reqNo, row.inpatientNo, row.admissTimes).then((res) => {
          jianYanShuJu.value.splice(index, 1)
        })
      })
      .catch(() => {
      })
}

// 点击查看患者检验
const dianJiChaKanHuanZheJianYan = () => {
  if (youWuXuanZheHuanZhe()) return
  let end = ''
  getServerDateApi().then((res) => {
    end = getFormatDatetime(res, 'YYYY-MM-DD')
    router.push({
      name: 'inspectionReportIndex',
      params: {
        passRule: true,
        patNo: huanZheXinXi.value.inpatientNo,
        start: huanZheXinXi.value.admissDate,
        end: end,
      },
    })
  })
}

const searchAdd = async (val) => {
  let temp = {
    orderType: "",
    execDept: val.execUnit,
    execDeptName: val.execUnitName,
    inspectStuff: val.inspectStuff,
    inspectStuffName: val.inspectStuffName,
    orderCode: val.code,
    startTime: await getServerDateApi(),
    orderName: val.name,
    checkFlag: "0",
    jzFlag: 0,
    ybSelfFlag: 0
  }
  if (xuanZhongJianCha.value.weiBianMa.indexOf(temp.orderCode) > -1) {
    xcMessage.error('请勿重复添加。')
  } else {
    xuanZhongJianCha.value.weiBianMa.push(temp.orderCode)
    xuanZhongJianCha.value.data.push(temp)
  }
}

watch(
    () => huanZheXinXi.value,
    () => {
      dianJiChaXunJianYan(0)
    }
)
</script>

<style scoped></style>
