<template>
  <div style="margin-top: -20px; margin-bottom: 16px; background: lightgray; padding: 8px 4px; color: black">临床诊断参考：{{ mzVisit.icdText }}</div>
  检索方法：<el-select v-model="searchMethod" style="width: 80px">
  <el-option v-for="item in searchMethods" :key="item.code" :label="item.name" :value="item.code"></el-option> </el-select
>&nbsp;
  <el-autocomplete v-model="diagItem.diagName" :fetch-suggestions="searchDiag" placeholder="请输入内容" clearable @select="handleSelectDiag" style="width: 220px">
    <template #default="{ item }">
      <div style="height: 40px">
        <div style="height: 16px; margin-top: 4px; font-size: 12px; color: #8492a6">
          {{ item.code }}
        </div>
        <div style="height: 16px">{{ item.name }}</div>
      </div>
    </template>
  </el-autocomplete>
  <el-select v-model="diagItem.diagType" placeholder="诊断类别" style="width: 120px">
    <el-option v-for="item in diagTypes" :key="item.code" :label="item.name" :value="item.code"></el-option>
  </el-select>
  <el-divider direction="vertical"></el-divider>
  <el-button type="primary" icon="Plus" @click="addDiag">添加到诊断列表</el-button>
  <el-button type="success" icon="Check" @click="saveDiag">保存诊断</el-button>
  <el-table :data="diags" stripe>
    <el-table-column prop="diagSrtNo" label="序号" width="40"></el-table-column>
    <el-table-column prop="diagType" label="诊断类别" width="60"></el-table-column>
    <el-table-column prop="diagCode" label="诊断编码"></el-table-column>
    <el-table-column prop="diagName" label="诊断名称"></el-table-column>
    <el-table-column prop="diagDept" label="诊断科室"></el-table-column>
    <el-table-column prop="diseDorNo" label="医生编码" width="80"></el-table-column>
    <el-table-column prop="diseDorName" label="医生姓名" width="80"></el-table-column>
    <el-table-column prop="diagTime" label="诊断时间"></el-table-column>
    <el-table-column label="操作">
      <template #default="scope">
        <el-button icon="Delete" text @click="deleteDiag(scope.$index)">删除</el-button>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
import {reactive, ref} from "vue";
import {increaseWeight, searchData} from "@/api/inpatient/dictionary";
import {ElMessage, ElMessageBox} from "element-plus";
import {clone} from "@/utils/clone";
import {saveSiMzDiags} from "@/api/medical-insurance/si-outpatient";

export default {
  props: {
    mzVisit: {
      type: Object,
      required: true
    },
    medType: {
      type: String,
      required: true
    }
  },
  emits: ['close'],
  setup(props, ctx) {
    const searchMethods = [
      { code: 'alpha', name: '首拼' },
      { code: 'code', name: '编码' },
      { code: 'name', name: '名称' },
    ]
    const searchMethod = ref('alpha')
    const diagItem = reactive({})
    const searchDiag = (queryString, cb) => {
      if (queryString && queryString.length > 1) {
        const param = {
          method: searchMethod.value,
          content: queryString,
          target: 'diag',
          medType: props.medType,
        }
        searchData(param).then((res) => {
          cb(res)
        })
      }
    }
    const handleSelectDiag = (item) => {
      increaseWeight({ code: 'diag', name: item.code }).then(() => {
        diagItem.diagCode = item.code
        diagItem.diagName = item.name
      })
    }
    const diagTypes = [
      { code: '1', name: '西医诊断' },
      { code: '2', name: '中医主病诊断' },
      { code: '3', name: '中医主证诊断' },
    ]
    const diags = ref([])
    const addDiag = () => {
      if (!diagItem.diagCode) {
        ElMessage({
          message: '请选择诊断！',
          type: 'warning',
          duration: 2500,
          showClose: true,
        })
        return
      }
      if (!diagItem.diagType) {
        ElMessage({
          message: '请选择诊断类别！',
          type: 'warning',
          duration: 2500,
          showClose: true,
        })
        return
      }
      diagItem.patNo = props.mzVisit.patientId
      diagItem.times = props.mzVisit.times
      diagItem.diagSrtNo = diags.value.length + 1
      diagItem.diagDept = props.mzVisit.visitDeptName
      diagItem.diseDorNo = props.mzVisit.doctorCode
      diagItem.diseDorName = props.mzVisit.doctorName
      diagItem.diagTime = props.mzVisit.opDay
      diagItem.valiFlag = '1'
      diags.value.push(clone(diagItem))
      diagItem.diagCode = ''
      diagItem.diagName = ''
      diagItem.diagType = ''
    }
    const deleteDiag = (index) => {
      diags.value.splice(index, 1)
      for (let i = 0; i < diags.value.length; i++) {
        const element = diags.value[i]
        element.diagSrtNo = i + 1
      }
    }
    const saveDiag = () => {
      if (diags.value.length === 0) {
        ElMessage({
          message: '没有要保存的诊断！',
          type: 'warning',
          duration: 2500,
          showClose: true,
        })
        return
      }
      saveSiMzDiags(diags.value).then((res) => {
        ElMessageBox.alert(res, '提示', {
          type: 'success',
          showCancelButton: false,
        }).then(() => {
          diags.value = []
          ctx.emit('close')
        })
      })
    }
    
    return {
      searchMethod,
      searchMethods,
      diagTypes,
      diagItem,
      diags,
      addDiag,
      deleteDiag,
      saveDiag,
      searchDiag,
      handleSelectDiag,
    }
  }
}
</script>