web_dist/src/components/zhu-yuan-yi-sheng/hui-zhen-shen-qing/TianJiaHuiZhenShenQing.vue

<template>
  <div style="width: 550px">
    <el-form
      ref="huiZhenShenQingForm"
      :model="huiZhenShenQing"
      :rules="huiZhenShenQingRules"
      label-width="100px"
    >
      <el-form-item label="会诊科室:" prop="reqDept1">
        <el-select
          style="width: 120px"
          v-model="huiZhenShenQing.huiZhenKeShi"
          :remote-method="remoteMethodHuiZhenKeShi"
          clearable
          filterable
          placeholder="根据拼音首字母查找"
          remote
          value-key="code"
          @change="huiZhenYiShengPanDuan"
        >
          <el-option
            v-for="item in deptList"
            :key="item.code"
            :label="item.name"
            :value="deptOptionValue(item)"
          >
            <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-form-item>
      <el-form-item label="会诊类别:" prop="hzLevel">
        <el-select v-model="huiZhenShenQing.hzLevel" placeholder="请选择">
          <el-option
            v-for="item in huiZhenLeiBieList"
            :key="item.code"
            :label="item.name"
            :value="item.code"
            clearable
          >
            <span style="color: #8492a6; font-size: 12px">{{ item.code }}</span>
            <el-divider direction="vertical" />
            <span>{{ item.name }}</span>
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="会诊级别:" prop="hzType">
        <el-select
          v-model="huiZhenShenQing.hzType"
          :remote-method="remoteMethodHuiZhenKeShi"
          clearable
          placeholder="请选择"
          @change="huiZhenYiShengPanDuan"
        >
          <el-option
            v-for="item in huiZhenTypeList"
            :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-form-item>
      <el-form-item label="会诊医生:" prop="hzDoctor1">
        <el-select
          v-model="huiZhenShenQing.hzDoctor1"
          clearable
          filterable
          remote
          @change="autofillData"
          :remote-method="inquireAboutTheConsultingDoctor"
        >
          <el-option
            v-for="item in huiZhenYiShengList"
            :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 style="color: #67c23a">{{ item.name }}</span>
            <el-divider direction="vertical"></el-divider>
            <span style="color: #e6a23c">{{ item.deptName }}</span>
            <el-divider direction="vertical"></el-divider>
            <span style="color: #a5673f">{{ item.empTitName }}</span>
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="自费:" prop="ybSelfFlag">
        <el-switch
          v-model="huiZhenShenQing.ybSelfFlag"
          :active-value="1"
          :inactive-value="0"
          active-color="#13ce66"
          active-text="是"
          inactive-color="#ff4949"
          inactive-text="否"
        >
        </el-switch>
      </el-form-item>
      <el-form-item label="紧急:" prop="emergencyFlag">
        <el-switch
          v-model="huiZhenShenQing.emergencyFlag"
          :active-value="1"
          :inactive-value="0"
          active-color="#13ce66"
          active-text="是"
          inactive-color="#ff4949"
          inactive-text="否"
        >
        </el-switch>
      </el-form-item>
      <el-form-item label="病情简介:" prop="reqComment">
        <el-input
          v-model="huiZhenShenQing.reqComment"
          :rows="6"
          placeholder="请输入内容"
          type="textarea"
        />
      </el-form-item>
      <el-form-item label="目前主要诊断:" prop="hzZd">
        <el-input
          v-model="huiZhenShenQing.hzZd"
          :rows="6"
          maxlength="6000"
          placeholder="请输入内容"
          show-word-limit
          type="textarea"
        />
      </el-form-item>
      <el-form-item label="会诊目的:" prop="hzMd">
        <el-input
          v-model="huiZhenShenQing.hzMd"
          :rows="6"
          placeholder="请输入内容"
          type="textarea"
        />
      </el-form-item>
      <el-button
        style="margin-left: 20px"
        type="success"
        v-el-btn="huiZhenShenQingClick"
      >
        申请
      </el-button>
      <el-tag style="margin-left: 20px"
        >申请人：{{ huiZhenShenQing.name }}</el-tag
      >
      <el-tag style="margin-left: 20px"
        >申请时间：{{ huiZhenShenQing.inputDate }}</el-tag
      >
    </el-form>
  </div>
</template>

<script name="TianJiaHuiZhenShenQing" setup>
import {
  getConsultingDoctorInfo,
  gethuiZhenLeiBie,
  huiZhenYiSheng,
  huoQuHuanZheZhuYaoZhenDuan,
  queryDept,
  submitHuiZhenShenQing,
} from "@/api/case-front-sheet";
import { ElMessageBox } from "element-plus";
import { huanZheXinXi } from "@/views/hospitalization/zhu-yuan-yi-sheng/public-js/zhu-yuan-yi-sheng";
import { getServerDateApi } from "@/api/public-api";
import { useUserStore } from "@/pinia/user-store";

const emit = defineEmits(["close", "successfulApplication"]);

//会诊申请的字段
const huiZhenShenQing = ref({
  inpatientNo: "", //住院号
  admissTimes: "", //住院次数
  reqTimes: "", //请求时间
  reqComment: "", //请求简介
  inputId: "", //输入人的id
  inputDate: "", //输入的时间
  reqDate: "", //请求的时间 和 上面那个一样
  deptCode: "", //科室 code
  wardCode: "", //病房 code 和上面的一样
  reqDept1: "", //请求的 科室
  reqDeptName: "", //请求科室的名字
  statusFlag: "", // 状态标志 1 未读 2 已读
  hzType: "", // 会诊的级别
  hzLevel: "", // 会诊的类别
  hzZd: "", //目前的主要诊断
  hzMd: "", //会诊的目的
  actOrderNo: "", //新开的医嘱号
  hzDoctor1: "", //会诊的医生
  name: "", // 申请人
  emergencyFlag: 0, // 医嘱紧急
  ybSelfFlag: 0, // 自费
  huiZhenKeShi: {},
});

// 会诊医生
const huiZhenYiShengList = ref([]);
// 科室
const deptList = ref([]);
//会诊类别集合
const huiZhenLeiBieList = ref();
// 表格
const huiZhenShenQingForm = ref(null);
// 用户信息
const userInfo = useUserStore().userInfo;
// 会诊科室 option 的 值
const deptOptionValue = item => {
  item.dept = true;
  return JSON.stringify(item);
};

//会诊医生判断 ， 要会诊医生在这个科室的 才可以
const huiZhenYiShengPanDuan = val => {
  popUpPrompt = false;
  try {
    val = JSON.parse(val);
  } catch (e) {}
  if (val.dept) {
    huiZhenShenQing.value.reqDeptName = val.name;
    huiZhenShenQing.value.reqDept1 = val.code;
  }
  huiZhenShenQing.value.hzDoctor1 = null;
  if (huiZhenShenQing.value.reqDept1 && huiZhenShenQing.value.hzType) {
    huiZhenYiSheng(
      huiZhenShenQing.value.reqDept1,
      huiZhenShenQing.value.hzType
    ).then(res => {
      huiZhenYiShengList.value = res;
    });
  } else {
    huiZhenYiShengList.value = [];
  }
};

//远程搜索会诊科室
const remoteMethodHuiZhenKeShi = val => {
  if (val !== "" && val.length > 0) {
    queryDept(val)
      .then(res => {
        deptList.value = res;
      })
      .catch(() => {
        deptList.value = [];
      });
  }
};

// 数据校验
const huiZhenShenQingRules = ref({
  reqDept1: [
    { required: true, message: "会诊科室不能为空", trigger: "change" },
  ],
  // hzType: [{required: true, message: '会诊的级别不能为空', trigger: 'change'}],
  hzLevel: [
    { required: true, message: "会诊的类别不能为空", trigger: "change" },
  ],
  reqComment: [
    { required: true, message: "病情简介不能为空", trigger: "blur" },
  ],
  hzZd: [
    { required: true, message: "目前主要诊断不能为空", trigger: "blur" },
    {
      min: 3,
      max: 6000,
      message: "长度在 3 到 6000 个字符",
      trigger: "blur",
    },
  ],
  hzMd: [{ required: true, message: "会诊目的不能为空", trigger: "blur" }],
});
//点击申请
const huiZhenShenQingClick = async () => {
  const form = unref(huiZhenShenQingForm);
  if (!form) return;
  await form.validate();
  await ElMessageBox.confirm("请认真审核申请信息", "提示", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "info",
  });
  huiZhenShenQing.value.inpatientNo = huanZheXinXi.value.inpatientNo;
  huiZhenShenQing.value.admissTimes = huanZheXinXi.value.admissTimes;
  huiZhenShenQing.value.deptCode = huiZhenShenQing.value.wardCode =
    huanZheXinXi.value.zkWard;
  await submitHuiZhenShenQing(huiZhenShenQing.value);
  emit("successfulApplication");
};

let popUpPrompt = false;
const inquireAboutTheConsultingDoctor = val => {
  getConsultingDoctorInfo(val).then(res => {
    if (res) {
      popUpPrompt = true;
      huiZhenYiShengList.value = res;
    }
  });
};

const autofillData = async val => {
  if (!popUpPrompt) return;
  if (!val) return;
  await nextTick();
  ElMessageBox.confirm("是否要自动填充数据。", "提示", {
    type: "info",
    distinguishCancelAndClose: true,
  })
    .then(() => {
      let res = {};
      for (let i = 0, len = huiZhenYiShengList.value.length; i < len; i++) {
        let item = huiZhenYiShengList.value[i];
        if (item.code === val) {
          res = item;
          break;
        }
      }

      let dept = { code: res.deptCode, name: res.deptName, dept: true };

      huiZhenShenQing.value.huiZhenKeShi = JSON.stringify(dept);
      deptList.value = [dept];
      huiZhenShenQing.value.reqDept1 = res.deptCode;
      huiZhenShenQing.value.reqDeptName = res.deptName;
      if (res.empTitCode === "3") {
        huiZhenShenQing.value.hzType = "1";
      } else if (res.empTitCode === "1") {
        huiZhenShenQing.value.hzType = "3";
      }
    })
    .catch(action => {
      if (action === "cancel") {
        huiZhenShenQing.value = {};
      } else {
        huiZhenShenQing.value.hzDoctor1 = "";
        huiZhenYiShengPanDuan({ code: "" });
      }
    });
};

onMounted(() => {
  huiZhenShenQing.value.name = userInfo.name;
  getServerDateApi().then(res => {
    huiZhenShenQing.value.inputDate = res;
  });
  gethuiZhenLeiBie().then(res => {
    huiZhenLeiBieList.value = res;
  });
  huoQuHuanZheZhuYaoZhenDuan(
    huanZheXinXi.value.inpatientNo,
    huanZheXinXi.value.admissTimes
  ).then(res => {
    if (res !== null && res.length > 0) {
      for (let i = 0; i < res.length; i++) {
        huiZhenShenQing.value.hzZd += res[i].name + "，";
      }
    }
  });
});

let huiZhenTypeList = [
  { code: "1", name: "主治医师" },
  { code: "2", name: "副主任医生" },
  { code: "3", name: "主任医生" },
];
</script>

<style scoped></style>