<template>
  <xc-table :local-data="reqData" :height="220">
    <el-table-column fixed="left" width="150">
      <template #header>
        <el-button type="success" icon="Plus" title="添加申请" @click="addReqClick"/>
        <el-button type="primary" icon="Search" title="查询数据" @click="queryData"/>
      </template>
      <template #default="{row}">
        <el-button type="danger" icon="Delete" title="删除" @click="deleteClick(row)"/>
        <el-button type="warning" icon="Edit" title="编辑" @click="editClick(row)"/>
      </template>
    </el-table-column>
    <el-table-column label="住院号" prop="patNo" width="70"/>
    <el-table-column label="修改时间" prop="editDate" width="80"/>
    <el-table-column label="状态" prop="reqStatusName" width="50">
      <template #default="{row}">
        <span v-html="row.reqStatusHtml"></span>
      </template>
    </el-table-column>
    <el-table-column label="申请备注" prop="reqRemarks" show-overflow-tooltip/>
    <el-table-column label="审核备注" prop="reviewNotes" show-overflow-tooltip/>
  </xc-table>

  <xc-dialog-v2 v-model="dialog" width="30%" title="申请">
    <el-form label-width="80px" :rules="rules" ref="formRef" :model="fromData">
      <el-row>
        <el-col :span="24">
          <el-form-item label="住院号:" prop="inpatient">
            <el-input style="width: 120px" v-model="fromData.inpatientNo" @blur="model=$event.target.value.trim()"/>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="次数:" prop="times">
            <el-input-number v-model="fromData.times" :min="1"/>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="时间:" prop="editDate">
            <el-date-picker type="date"
                            :disabled-date="disabledDate"
                            v-model="fromData.editDate"
                            value-format="YYYY-MM-DD"
                            format="YYYY-MM-DD"/>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="备注:" prop="reqRemarks">
            <el-input type="textarea" rows="3" maxlength="50" show-word-limit v-model="fromData.reqRemarks"/>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="">
            <el-button @click="submit">提交</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </xc-dialog-v2>
</template>

<script setup name='EmrApply'>
import XcTable from "@/components/xiao-chan/xc-table/XcTable.vue";
import XcDialogV2 from "@/components/xiao-chan/dialog/XcDialogV2.vue";
import {deleteDisEmrDis, getDisReqEmr, saveDisEmrReq} from "@/api/zhu-yuan-yi-sheng/emr-patient";
import {getServerDateApi} from "@/api/public-api";
import moment from "moment";

let reqData = $ref([])
let dialog = $ref(false)
let fromData = $ref({
  patNo: '',
  inpatient: '',
  times: 1,
  editDate: null,
  reqRemarks: '',
})
let formRef = $ref(null)

let rules = $ref({
  inpatientNo: [{required: true, message: '字段值不可为空'}],
  reqRemarks: [{required: true, message: '字段值不可为空'}],
  editDate: [{required: true, message: '字段值不可为空'}],
})

const addReqClick = () => {
  fromData = {
    patNo: '',
    inpatient: '',
    times: 1,
    editDate: null,
    reqRemarks: '',
  }
  dialog = true
}

// 点击编辑
const editClick = (val) => {
  let temp = val.patNo.split("_")
  fromData = val
  fromData.inpatientNo = temp[0]
  fromData.times = parseInt(temp[1])
  dialog = true
}

// 确认申请
const submit = () => {
  formRef.validate(valid => {
    if (!valid) return
    fromData.patNo = fromData.inpatientNo + '_' + fromData.times
    saveDisEmrReq(fromData).then((res) => {
      dialog = false
      queryData()
    })
  })
}

// 删除申请
const deleteClick = (val) => {
  deleteDisEmrDis(val.patNo).then(() => {
    queryData()
  })
}

const queryData = () => {
  getDisReqEmr(1).then((res) => {
    reqData = res
  })
}

let newDate = null
let manDate = null
const disabledDate = (time) => {
  return time.getTime() < newDate.getTime() || time.getTime() > manDate.getTime()
}

onMounted(async () => {
  queryData()
  newDate = new Date(await getServerDateApi())
  manDate = new Date(moment(newDate).add(7, 'days'))
})

</script>

<style scoped lang="scss">

</style>
