<template>
  <div style="height: 5%">
    医嘱
    <el-radio-group v-model="radio">
      <el-radio :label="0">临时</el-radio>
      <el-radio :label="1">长期</el-radio>
    </el-radio-group>
    <el-divider direction="vertical"/>
    <el-select v-model="orderType" style="width: 90px">
      <el-option :value="1" label="全部"/>
      <el-option :value="2" label="已停止"/>
      <el-option :value="3" label="当前"/>
      <el-option :value="4" label="今日"/>
    </el-select>
  </div>

  <div style="height: 95%">
    <el-auto-resizer>
      <template #default="{ height, width }">
        <xc-table-v3 :columns="columns" :data="tempList" :height="height"/>
      </template>
    </el-auto-resizer>
  </div>


</template>

<script setup name='EmrOrderList' lang="tsx">
import {computed, defineProps, Ref, ref, h, onMounted} from "vue";
import {
  huoQuYiZhuShuJu
} from "@/api/zhu-yuan-yi-sheng/yi-zhu-lu-ru";
import {getFormatDatetime} from "@/utils/date";
import {getServerDateApi} from "@/api/public-api";
import XcTableV3 from "@/components/xiao-chan/xc-table-v3/XcTableV3.vue";
import {XcColumn} from "@/components/xiao-chan/xc-table-v3/XcColumn";
import {patInfo} from './emr-tools-store'

const list: Ref<Array<any>> = ref([])
const radio = ref(1)
const orderType = ref(3)

const columns: XcColumn[] = [
  {
    type: 'index',
    title: '序号'
  },
  {key: 'startTime', title: '开始时间', width: 150},
  {key: 'actOrderNo', title: '医嘱号', width: 90},
  {
    key: 'orderGroup', title: '组', width: 20,
    cellRenderer: ({row}) => (
        <span style="color: red"> {row.orderGroup}</span>
    )
  },
  {
    key: 'orderName', title: '医嘱名称',
  },
  {
    key: 'frequCode', title: '给药方式', width: 90
  },
  {
    title: '确认',
    children: [
      {key: 'signerName', title: '确认医生', width: 120},
      {key: 'executer1', title: '确认护士', width: 120}
    ]
  },
  {
    title: '停止',
    children: [
      {key: 'endTime', title: '停止时间', width: 220},
      {key: 'modifierName', title: '停止医生', width: 120},
      {key: 'executer1', title: '停止护士', width: 120}
    ]
  },
]

let newDate = ''
getServerDateApi().then(res => {
  newDate = res as any
})

const tempList = computed(() => {
  return list.value.filter(item => {
    let onceFlag = false
    let type = false
    if (radio.value === 0 && item.frequCode === 'ONCE') {
      onceFlag = true
    } else if (radio.value === 1 && item.frequCode !== 'ONCE') {
      onceFlag = true
    }
    if (orderType.value === 1) {
      type = true
    }
    if (orderType.value === 2) {
      type = item.statusFlag === '5'
    }
    if (orderType.value === 3) {
      type = item.statusFlag === '3' || item.statusFlag === '4'
    }
    if (orderType.value === 4) {
      type = getFormatDatetime(newDate, 'YYYY-MM-DD') === getFormatDatetime(item.startTime, 'YYYY-MM-DD')
    }
    return onceFlag && type
  })
})

const open = () => {
  huoQuYiZhuShuJu({
    patNo: patInfo.value.inpatientNo,
    times: patInfo.value.admissTimes
  }).then(res => {
    list.value = res as any
    console.log(res)
  })
}

onMounted(() => {
  open()
})

</script>

<style scoped lang="scss">


</style>
