platformFront/src/components/cdssManage/knowledge/AddKnowledge.vue

<template>
  <div class="wrapper">
    <crumbs
      :title="isEdit ? '知识图谱标准术语维护-修改' : '知识图谱标准术语维护-添加'"
      class="topBack"
      :param="$route.params"
      linkTo="KnowledgeManage"
    ></crumbs>
    <div class="AddPlanBox">
      <el-row :gutter="20">
        <el-col :span="16">
          <el-form ref="form" :model="form" label-width="110px" :rules="rules">
            <el-form-item label="术语分类" class="selectMedicine" prop="labelType">
              <el-select
                v-model="form.labelType"
                placeholder="请选择术语分类"
                clearable
                filterable
                style="width: 100%"
                :disabled="isEdit"
              >
                <el-option
                  v-for="item in terminologyData"
                  :label="item.name"
                  :value="item.val"
                  :key="item.orderNo"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="术语名称" prop="name">
              <el-input
                v-model.trim="form.name"
                placeholder="请输入术语名称"
                @blur="handlePinyin($event)"
                @input="handlePinyinInput"
                :disabled="form.labelType===''"
              ></el-input>
            </el-form-item>
            <el-form-item label="术语拼音" prop="pycode">
              <el-input
                v-model.trim="form.pycode"
                placeholder="请输入术语拼音"
                ref="pycode"
              ></el-input>
            </el-form-item>
            <!-- 诊断 -->
            <DiseaseForm v-if="form.labelType==='医保疾病名称'" :data="form" @handleInput="handleInput"></DiseaseForm>
            <!-- 手术和操作 -->
            <OperationForm
              v-else-if="form.labelType==='医保手术和操作名称'"
              ref="operationForm"
              :data="form"
              @handleInput="handleInput"
            ></OperationForm>
            <!-- 检查 | 检查子项 -->
            <PacsForm
              v-else-if="form.labelType==='辅助检查名称' || form.labelType === '辅助检查子项目名称'"
              :key="form.labelType"
              :data="form"
              @handleInput="handleInput"
            ></PacsForm>
            <!-- 检验细项 -->
            <PacsDetailForm
              v-else-if="form.labelType==='实验室检查名称' "
              :data="form"
              @handleInput="handleInput"
            ></PacsDetailForm>
            <!-- 实验室检查细项（开单合理性） -->
            <LabPacsForm
              v-else-if="form.labelType==='实验室检查' "
              :data="form"
              @handleInput="handleInput"
            ></LabPacsForm>
            <!-- 化验细项及结果（推理）-->
            <AssayForm
              v-else-if="form.labelType==='化验细项及结果' "
              ref="assayForm"
              :data="form"
              @handleInput="handleInput"
            ></AssayForm>
            <!-- 药物过敏原-->
            <DrugAllergensForm
              v-else-if="form.labelType==='药物过敏原'"
              ref="drugAllergensForm"
              :data="form"
              @handleInput="handleInput"
            ></DrugAllergensForm>
            <!-- 药品注册名称-->
            <DrugRegNameForm
              v-else-if="form.labelType==='药品注册名称' "
              :data="form"
              @handleInput="handleInput"
            ></DrugRegNameForm>
            <!-- 药品代码通用名-->
            <DrugGeneNameForm
              v-else-if="form.labelType==='药品代码通用名' "
              ref="drugGeneNameForm"
              :data="form"
              @handleInput="handleInput"
            ></DrugGeneNameForm>
            <!-- 体征 | 实验室检查危急值-->
            <CommonForm
              v-else-if="form.labelType==='实验室检查危急值' || form.labelType === '体征'"
              :key="form.labelType"
              :data="form"
              @handleInput="handleInput"
            ></CommonForm>
            <el-form-item label="静态术语标识">
              <span style="paddingLeft: 12px; color: #606266">{{form.is_kl === 1? '有' : '无'}}</span>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="onSubmit" :disabled="saveDisable">确定</el-button>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
import api from '@api/cdss.js';
import pinyin from '../../../js/Convert_Pinyin.js';
import DiseaseForm from './DiseaseForm';
import OperationForm from './OperationForm';
import PacsForm from './PacsForm';
import PacsDetailForm from './PacsDetailForm';
import LabPacsForm from './LabPacsForm';
import AssayForm from './AssayForm';
import DrugAllergensForm from './DrugAllergensForm';
import DrugRegNameForm from './DrugRegNameForm';
import DrugGeneNameForm from './DrugGeneNameForm';
import CommonForm from './CommonForm';
export default {
  components: {
    DiseaseForm,
    OperationForm,
    PacsForm,
    PacsDetailForm,
    LabPacsForm,
    AssayForm,
    DrugAllergensForm,
    DrugRegNameForm,
    DrugGeneNameForm,
    CommonForm
  },
  data() {
    let reg = /[\u4E00-\u9FA5\uF900-\uFA2D]/;
    let checkFrequency = (rule, value, callback) => {
      let pycode = this.$refs.pycode.value;
      if (reg.test(pycode && pycode.trim())) {
        callback('术语拼音仅支持字母、数字和标点符号');
      } else {
        callback();
      }
    };
    return {
      form: {
        age: '', //年龄
        alias: '', //别名（医保诊断名称、药物过敏原、药品注册名称）
        category: '', //诊断分类（医保诊断名称属性：1、2，无默认值）
        conflict_geiyao: '', //禁忌给药途径（药品注册名称属性）
        conflict_gender: '', //禁忌性别（药品注册名称属性）
        dept: '', //诊断所属科室（医保诊断名称属性）
        gender: '', //性别
        highriskcond: '', //高危条件（医保手术和操作属性）
        // id: 0,
        is_kl: 0, //静态知识标识（0-无，1-有，默认0）
        labelType: '', //术语类型-知识图谱标签类型（详情见字典）
        maxAge: '', // 最大值（实验室检查名称）
        maxval: '', //最小值（实验室检查名称）
        medtype: '', //药品类型（药物过敏原属性：药品、药品类别）
        minAge: '', //年龄下限（医保诊断名称属性）
        minval: '', //年龄上限（医保诊断名称属性）
        name: '', //术语名称
        opgrade: '', //手术等级（医保手术和操作属性：0、1、2、3、4，默认0）
        pycode: '', //拼音编码
        range: 0, //范围（0-范围内，1-范围外，默认0）
        result: '', //结果（药物过敏原、药品注册名称）
        risklevel: '', //药品高危级别（药品注册名称属性）
        special: '否', //特殊标志（化验细项及结果属性：是）
        status: 1, //状态（0-禁用，1-启用，默认1）
        unit: '', //单位（实验室检查名称、实验室检查、体征、实验室检查危急值）
        min_pack_num: null, //最小包装数量（药品代码通用名属性）
        reg_JiXin: '', //注册剂型（药品代码通用名属性）
        benWei_Code: '', //药品本位码（药品代码通用名属性）
        min_pack_unit: '', //最小包装单位（药品代码通用名属性）
        reg_GuiGe: '', //注册规格（药品代码通用名属性）
        pack_CaiLiao: '', //包装材质（药品代码通用名属性）
        producer: '', //药品企业（药品代码通用名属性）
        license_num: '', //批准文号（药品代码通用名属性）
        min_prod_unit: '', //最小制剂单位（药品代码通用名属性）
        stand_reg_JiXin: '' //标准注册剂型（药品代码通用名属性）
      },
      saveDisable: false, //保存按钮禁止点击
      rules: {
        labelType: [
          { required: true, message: '请选择术语分类', trigger: 'change' }
        ],
        name: [
          { required: true, message: '请输入术语名称', trigger: 'change' },
          { max: 100, message: '最多输入100字', trigger: 'blur' }
        ],
        pycode: [
          { required: true, message: '请输入术语拼音', trigger: 'change' },
          { max: 100, message: '最多输入100个字符', trigger: ['blur', 'change']},
          {
            required: true,
            validator: checkFrequency,
            trigger: ['blur', 'change']
          }
        ]
      },
      isEdit: false,
      terminologyData: [], // 术语分类
      nameFlag: '', // 判断术语名称是否被修改
      isValidate: true,
      id: '',
      isTrans: true // 拼音是否转换成功
    };
  },
  watch: {},
  computed: {},
  created() {
    this._initData();
  },
  mounted() {},
  methods: {
    // init
    _initData() {
      const { isEdit, data } = this.$route.params;
      this._getTerminologyData();
      if (isEdit) {
        this.isEdit = true;
        this.id = data.id;
        this.nameFlag = data.name; //判断术语名称是否被修改
        this._getEntitymanById(data.id);
      }
    },

    // 根据ID获取实例
    _getEntitymanById(id) {
      api.getEntitymanById({ id }).then(res => {
        if (res.data.code === '0') {
          this.form.age = res.data.data.age;
          this.form.alias = res.data.data.alias;
          this.form.category = res.data.data.category;
          this.form.conflict_geiyao = res.data.data.conflict_geiyao;
          this.form.conflict_gender = res.data.data.conflict_gender;
          this.form.dept = res.data.data.dept;
          this.form.gender = res.data.data.gender;
          this.form.highriskcond = res.data.data.highriskcond;
          this.form.is_kl = res.data.data.is_kl;
          this.form.labelType = res.data.data.labelType;
          this.form.maxAge = res.data.data.maxAge;
          this.form.maxval = res.data.data.maxval;
          this.form.medtype = res.data.data.medtype;
          this.form.minAge = res.data.data.minAge;
          this.form.minval = res.data.data.minval;
          this.form.name = res.data.data.name;
          this.form.opgrade = res.data.data.opgrade;
          this.form.pycode = res.data.data.pycode;
          this.form.range = res.data.data.range;
          this.form.result = res.data.data.result;
          this.form.risklevel = res.data.data.risklevel;
          this.form.special = res.data.data.special;
          this.form.status = res.data.data.status;
          this.form.unit = res.data.data.unit;
          this.form.min_pack_num = res.data.data.min_pack_num; //最小包装数量（药品代码通用名属性）
          this.form.reg_JiXin = res.data.data.reg_JiXin; //注册剂型（药品代码通用名属性）
          this.form.benWei_Code = res.data.data.benWei_Code; //药品本位码（药品代码通用名属性）
          this.form.min_pack_unit = res.data.data.min_pack_unit; //最小包装单位（药品代码通用名属性）
          this.form.reg_GuiGe = res.data.data.reg_GuiGe; //注册规格（药品代码通用名属性）
          this.form.pack_CaiLiao = res.data.data.pack_CaiLiao; //包装材质（药品代码通用名属性）
          this.form.producer = res.data.data.producer; //药品企业（药品代码通用名属性）
          this.form.license_num = res.data.data.license_num; //批准文号（药品代码通用名属性）
          this.form.min_prod_unit = res.data.data.min_prod_unit; //最小制剂单位（药品代码通用名属性）
          this.form.stand_reg_JiXin = res.data.data.stand_reg_JiXin; //标准注册剂型（药品代码通用名属性）
        }
      });
    },

    handleInput(data) {
      const { type } = data;
      if (type !== '') {
        this.form[type] = data.value;
      }
    },

    // 获取术语分类 字典
    _getTerminologyData() {
      api.getListDicCDSS().then(res => {
        if (res.data.code === '0') {
          this.terminologyData = res.data.data && res.data.data['8'];
        }
      });
    },

    // 处理参数
    _getParams() {
      const {
        age,
        alias,
        category,
        conflict_geiyao,
        conflict_gender,
        dept,
        gender,
        highriskcond,
        is_kl,
        labelType,
        maxAge,
        maxval,
        medtype,
        minAge,
        minval,
        name,
        opgrade,
        pycode,
        range,
        result,
        risklevel,
        special,
        status,
        unit,
        min_pack_num, //最小包装数量（药品代码通用名属性）
        reg_JiXin, //注册剂型（药品代码通用名属性）
        benWei_Code, //药品本位码（药品代码通用名属性）
        min_pack_unit, //最小包装单位（药品代码通用名属性）
        reg_GuiGe, //注册规格（药品代码通用名属性）
        pack_CaiLiao, //包装材质（药品代码通用名属性）
        producer, //药品企业（药品代码通用名属性）
        license_num, //批准文号（药品代码通用名属性）
        min_prod_unit, //最小制剂单位（药品代码通用名属性）
        stand_reg_JiXin //标准注册剂型（药品代码通用名属性）
      } = this.form;
      let params = {
        age, //年龄
        alias, //别名（医保诊断名称、药物过敏原、药品注册名称）
        category, //诊断分类（医保诊断名称属性：1、2，无默认值）
        conflict_geiyao, //禁忌给药途径（药品注册名称属性）
        conflict_gender, //禁忌性别（药品注册名称属性）
        dept, //诊断所属科室（医保诊断名称属性）
        gender, //性别
        highriskcond, //高危条件（医保手术和操作属性）
        is_kl, //静态知识标识（0-无，1-有，默认0）
        labelType, //术语类型-知识图谱标签类型（详情见字典）
        maxAge, // 最大值（实验室检查名称）
        maxval, //最小值（实验室检查名称）
        medtype, //药品类型（药物过敏原属性：药品、药品类别）
        minAge, //年龄下限（医保诊断名称属性）
        minval, //年龄上限（医保诊断名称属性）
        name, //术语名称
        opgrade, //手术等级（医保手术和操作属性：0、1、2、3、4，默认0）
        pycode, //拼音编码
        range, //范围（0-范围内，1-范围外，默认0）
        result, //结果（药物过敏原、药品注册名称）
        risklevel, //药品高危级别（药品注册名称属性）
        special, //特殊标志（化验细项及结果属性：是）
        status: 1, //状态（0-禁用，1-启用，默认1）
        unit, //单位（实验室检查名称、实验室检查、体征、实验室检查危急值）
        min_pack_num, //最小包装数量（药品代码通用名属性）
        reg_JiXin, //注册剂型（药品代码通用名属性）
        benWei_Code, //药品本位码（药品代码通用名属性）
        min_pack_unit, //最小包装单位（药品代码通用名属性）
        reg_GuiGe, //注册规格（药品代码通用名属性）
        pack_CaiLiao, //包装材质（药品代码通用名属性）
        producer, //药品企业（药品代码通用名属性）
        license_num, //批准文号（药品代码通用名属性）
        min_prod_unit, //最小制剂单位（药品代码通用名属性）
        stand_reg_JiXin //标准注册剂型（药品代码通用名属性）
      };
      if (this.isEdit) {
        params = { ...params, id: this.id };
      }
      return params;
    },
    onSubmit() {
      const { currentPage, isEdit } = this.$route.params;
      let numberpage = 1;
      if (isEdit) {
        numberpage = currentPage;
      }
      // if (this.isValidate === false || this.isTrans === false) return; // 术语名称已存在
      if (this.isValidate === false) return; // 术语名称已存在ss
      let goOn = true;
      if (this.form.labelType === '药物过敏原') {
        this.$refs.drugAllergensForm.$refs.drugAllergensForm &&
          this.$refs.drugAllergensForm.$refs.drugAllergensForm.validate(
            valid => {
              if (valid) {
              } else {
                goOn = false;
              }
            }
          );
      }
      if (this.form.labelType === '医保手术和操作名称') {
        this.$refs.operationForm.$refs.operationForm &&
          this.$refs.operationForm.$refs.operationForm.validate(valid => {
            if (valid) {
            } else {
              goOn = false;
            }
          });
      }
      // if (this.form.labelType === '化验细项及结果') {
      //   this.$refs.assayForm.$refs.assayForm &&
      //     this.$refs.assayForm.$refs.assayForm.validate(valid => {
      //       if (valid) {
      //       } else {
      //         goOn = false;
      //       }
      //     });
      // }
      if (this.form.labelType === '药品代码通用名') {
        this.$refs.drugGeneNameForm.$refs.drugGeneNameForm &&
          this.$refs.drugGeneNameForm.$refs.drugGeneNameForm.validate(valid => {
            if (valid) {
            } else {
              goOn = false;
            }
          });
      }
      this.$refs.form.validate(async valid => {
        if (valid) {
          if (!goOn) return;
          this.saveDisable = true;
          let params = this._getParams();
          if (this.isTrans === false) {
            this.saveDisable = false;
            return;
          }
          let res = await api.dataEntityVerify(params);
          if (!res.data.data) {
            this.$alert(`${res.data.msg}`, '提示', {
              confirmButtonText: '确定',
              type: 'warning'
            })
              .then(() => {
                api.saveEntity(params).then(res => {
                  if (res.data.code === '0') {
                    this.$message({
                      showClose: true,
                      message: '保存成功',
                      type: 'success',
                      duration: 1000
                    });
                    this.$router.push({
                      name: 'KnowledgeManage',
                      params: Object.assign({}, this.$route.params, {
                        currentPage: numberpage
                      })
                    });
                  } else if (res.data.code === '00020007') {
                    this.$message({
                      showClose: true,
                      message: res.data.msg,
                      type: 'error',
                      duration: 1000
                    });
                  } else {
                    this.$message({
                      showClose: true,
                      message: res.data.msg,
                      type: 'error',
                      duration: 1000
                    });
                  }
                  this.saveDisable = false;
                });
              })
              .catch(() => {
                this.saveDisable = false;
                this.$message({
                  showClose: true,
                  message: '保存失败',
                  type: 'error',
                  duration: 1000
                });
              });
          } else if (res.data.data) {
            api.saveEntity(params).then(res => {
              if (res.data.code === '0') {
                this.$message({
                  showClose: true,
                  message: '保存成功',
                  type: 'success',
                  duration: 1000
                });
                this.$router.push({
                  name: 'KnowledgeManage',
                  params: Object.assign({}, this.$route.params, {
                    currentPage: numberpage
                  })
                });
              } else if (res.data.code === '00020007') {
                this.$message({
                  showClose: true,
                  message: res.data.msg,
                  type: 'error',
                  duration: 1000
                });
              } else {
                this.$message({
                  showClose: true,
                  message: res.data.msg,
                  type: 'error',
                  duration: 1000
                });
              }
              this.saveDisable = false;
            });
          }
        } else {
          goOn = false;
        }
      });
    },

    handlePinyinInput(val) {
      this.isTrans = false;
    },

    // 处理拼音转换&验证唯一性
    handlePinyin(e) {
      if (this.nameFlag === e.target.value) {
        this.isTrans = true;
        this.isValidate = true; // 校验通过
        this.form.pycode = pinyin.getCamelChars(e.target.value);
      } else {
        const { is_kl, name, labelType } = this.form;
        let params = {
          is_kl,
          labelType,
          name,
          status: 0
        };
        api.isEntitymanExistCDSS(params).then(res => {
          if (res.data.code === '0') {
            // console.log(res.data.data, 'res.data.data');
            if (res.data.data === true) {
              this.isValidate = false; // 校验不通过
              // 已存在
              this.$refs.form.clearValidate();
              // 手动操作校验、展示登录错误信息
              this.rules.name.push({
                // js新增一个自定义校验
                validator: (rule, value, callback) => {
                  callback('术语名称已存在');
                },
                trigger: 'blur'
              });
              this.$refs.form.validateField('name'); // 手动校验
              this.rules.name = this.rules.name.slice(0, 1); // 删除校验
            } else {
              this.isValidate = true; // 校验通过
              this.isTrans = true;
              // 不存在
              this.form.pycode = pinyin.getCamelChars(e.target.value);
            }
          }
        });
      }
    }
  }
};
</script>
<style lang="less" scoped>
.wrapper {
  min-width: 940px;
  .AddPlanBox {
    padding: 20px 60px 120px 60px;
    margin: 70px 20px 0 20px;
    background: #fff;
  }
  .topBack {
    top: 0;
  }
  .el-button {
    float: right;
  }
}
</style>