lis8.0-vue3/src/views/liswork/labItem/tab/base/Basic.vue

<template>
<!-- 基本资料 -->
<div>
  <el-form ref="formRef" :model="formData" size="small" class="form-inline" inline label-width="80px">
    <span class="text-span">基本参数：</span>
    <el-divider style="margin: 5px 0;"/>
    <el-form-item label="项目类别" prop="xmgl">
      <SelectTable v-model:data="formData.xmgl" :fields="xmglFields" :tableData="dictData.XMGL" label="label" value="value" objKey="value"  width="140px" placeholder="项目类别"
              size="small" />
    </el-form-item>
    <el-form-item label="英文缩写" prop="xmdh">
      <el-input placeholder="英文缩写" v-model="formData.xmdh"></el-input>
    </el-form-item>
    <el-form-item label="项目名称" prop="xmmc">
      <el-input placeholder="项目名称" v-model="formData.xmmc"></el-input>
    </el-form-item>
    <el-form-item label="单位" prop="dw">
      <el-input placeholder="单位" v-model="formData.dw"></el-input>
    </el-form-item>
    <el-form-item label="结果类别" prop="xmlb">
      <el-input placeholder="结果类别" v-model="formData.xmlb"></el-input>
    </el-form-item>
    <el-form-item label="阴阳性" prop="mrz">
      <el-input placeholder="阴阳性" v-model="formData.mrz"></el-input>
    </el-form-item>
    <el-form-item label="仪器大类" prop="yqdl">
      <el-input placeholder="仪器大类" v-model="formData.yqdl"></el-input>
    </el-form-item>
    <el-form-item label="允许CV(%)" prop="qccv" label-width="100px">
      <el-input placeholder="允许CV(%)" v-model="formData.qccv"></el-input>
    </el-form-item>
    <el-form-item label="稀释倍数" prop="xsbs">
      <el-input placeholder="稀释倍数" v-model="formData.xsbs"></el-input>
    </el-form-item>
    <el-form-item label="稀释倍数" prop="xsbs">
      <el-input placeholder="稀释倍数" v-model="formData.xsbs"></el-input>
    </el-form-item>
    <el-form-item label="whonet编码" prop="whocode" label-width="100px">
      <el-input placeholder="whonet编码" v-model="formData.whocode"></el-input>
    </el-form-item>
    <el-form-item label="Gram" prop="germflag">
      <el-input placeholder="Gram" v-model="formData.germflag"></el-input>
    </el-form-item>
    <el-form-item label="英文名称" prop="yymc">
      <el-input placeholder="英文名称" v-model="formData.yymc"></el-input>
    </el-form-item>
    <el-form-item label="项目ID" prop="xmid">
      <el-input placeholder="项目ID" disabled v-model="formData.xmid"></el-input>
    </el-form-item>
    <el-form-item prop="uflag">
      <el-checkbox value="uflag">停用</el-checkbox>
    </el-form-item>
    <el-form-item label="知识库编码" prop="knowledge" label-width="100px">
      <el-input placeholder="知识库编码" v-model="formData.knowledge"></el-input>
    </el-form-item>
    <el-form-item label="小数保留位数" prop="xsws" label-width="100px">
      <el-input placeholder="小数保留位数" v-model="formData.xsws"></el-input>
    </el-form-item>
    <el-form-item label="打印形式" prop="dylx">
      <el-input placeholder="打印形式" v-model="formData.dylx"></el-input>
    </el-form-item>
    <el-form-item label="总汇表代号" prop="zhbdh" label-width="100px">
      <el-input placeholder="总汇表代号" v-model="formData.zhbdh"></el-input>
    </el-form-item>
    <el-form-item label="报告单代号" prop="bgdh" label-width="90px">
      <el-input placeholder="报告单代号" v-model="formData.bgdh"></el-input>
    </el-form-item>
    <el-form-item label="价格" prop="jg">
      <el-input placeholder="价格" v-model="formData.jg"></el-input>
    </el-form-item>
    <el-form-item label="助记符" prop="zjf">
      <el-input placeholder="助记符" v-model="formData.zjf"></el-input>
    </el-form-item>
    <el-form-item label="测试方法" prop="csff">
      <el-input placeholder="测试方法" v-model="formData.csff"></el-input>
    </el-form-item>
    <el-form-item label="分组打印组号" prop="fzdyxh" label-width="100px">
      <el-input placeholder="分组打印组号" v-model="formData.fzdyxh"></el-input>
    </el-form-item>
    <el-form-item label="细菌项目类别" prop="itemclass" label-width="100px">
      <el-input placeholder="细菌项目类别" v-model="formData.itemclass"></el-input>
    </el-form-item>
    <span class="text-span">结果参考值计算：</span>
    <el-divider style="margin: 5px 0;"/>
    <el-form-item label="参考下限" prop="ckxx">
      <el-input placeholder="参考下限" v-model="formData.ckxx"></el-input>
    </el-form-item>
    <el-form-item label="参考上限" prop="cksx">
      <el-input placeholder="参考上限" v-model="formData.cksx"></el-input>
    </el-form-item>
    <el-form-item label="参考值" prop="dyckz" label-width="60px">
      <el-input placeholder="参考值" v-model="formData.dyckz"></el-input>
      <el-button type="primary" @click="multiRefClick">多行参考值向导...</el-button>
    </el-form-item>
    <el-form-item label="公式" prop="jsgs" label-width="40px" >
      <el-input placeholder="公式" v-model="formData.jsgs"></el-input>
      <el-button v-show="formData.jsxm === 'Y'" type="primary" @click="calcGuildeClick">向导...</el-button>
    </el-form-item>
    <el-form-item>
      <el-checkbox label="参考值与性别有关" v-model="ygxbCheck"></el-checkbox>
      <el-checkbox label="与年龄有关" v-model="ygnlCheck"></el-checkbox>
      <el-checkbox label="与标本有关" v-model="ygbbCheck"></el-checkbox>
      <el-checkbox label="与生理周期有关" v-model="ygzqCheck"></el-checkbox>
      <el-checkbox label="与诊断有关" v-model="ygzdCheck"></el-checkbox>
      <el-checkbox label="计算项目" v-model="jsxmCheck"></el-checkbox>
    </el-form-item>
    <span class="text-span">医学审核条件：</span>
    <el-divider style="margin: 5px 0;"/>
    <el-form-item label="项目结果不可能大于" prop="sjx" label-width="140px">
      <el-input placeholder="项目结果不可能大于" v-model="formData.sjx" style="width: 100px;"></el-input>
    </el-form-item>
    <el-form-item label="不可能小于" prop="xjx" label-width="90px">
      <el-input placeholder="不可能小于" v-model="formData.xjx" style="width: 100px;"></el-input>
    </el-form-item>
    <el-form-item label="病人两次检验结果在" prop="jgjg" label-width="140px">
      <el-input placeholder="病人两次检验结果在" v-model="formData.jgjg" style="width: 100px;"></el-input>
    </el-form-item>
    <!--计算属性-->
    <el-form-item label="天内不可能相差" prop="cp_jgz" label-width="120px">
      <el-input placeholder="天内不可能相差" v-model="formData.cp_jgz" style="width: 100px;"></el-input>
    </el-form-item>
    <!--报警条件-->
    <span class="text-span">报警条件</span>
    <el-divider style="margin: 5px 0;"/>
    <el-form-item label="危急值">
      <el-input placeholder="上限极值" v-model="formData.hlimt"></el-input>
      <el-input placeholder="下限极值" v-model="formData.llimit"></el-input>
      <el-button type="primary" @click="conditionClick">特定条件</el-button>
    </el-form-item>
    <el-form-item label="复查">
      <el-input placeholder="上限极值" v-model="formData.redoxx"></el-input>
      <el-input placeholder="下限极值" v-model="formData.redosx"></el-input>
    </el-form-item>
    <span class="text-span">其他参数</span>
    <el-divider style="margin: 5px 0;"/>
    <el-form-item label="国标编码">
      <el-input v-model="formData.val1"></el-input>
    </el-form-item>
    <el-form-item label="外部代码2">
      <el-input v-model="formData.val2"></el-input>
    </el-form-item>
    <el-form-item label="外部代码3">
      <el-input v-model="formData.val3"></el-input>
    </el-form-item>
    <el-form-item label="外部代码4">
      <el-input v-model="formData.val4"></el-input>
    </el-form-item>
    <el-form-item label="外部代码5">
      <el-input v-model="formData.val5"></el-input>
    </el-form-item>
  </el-form>

  <MultiRef :refData="formData.dyckz" v-model:dialog-table-visible="mulitDialogTableVisible" @closeWithReturn="closeWithReturnMultiRef" />
  <CalcGuilde v-model="calcDialogTableVisible" :form-data="formData" :text="formData.jsgs" @confirm="handleDialogConfirm"/>
  <Condition v-model="conditionTabVisible" :form-data="formData"/>
  
</div>
</template>

<script setup lang="ts">
import { formatDict,getDictData ,dictData} from '@/hooks';
import MultiRef from './child/MultiRef.vue';
import CalcGuilde from './child/CalcGuilde.vue';
import SelectTable from '@/components/SelectTable/index.vue'
import Condition from './child/Condition.vue';

const props = defineProps({
  dataList: {
    type: Object ,  //Object as PropType<XmInfoNew>
    required: false
  }
});

const modelParam = defineModel<any>()

const formRef = ref();
const formData = ref<any>({});
const mulitDialogTableVisible = ref(false)
const calcDialogTableVisible = ref(false)
const conditionTabVisible = ref(false)
const xmglFields = ref([
  { prop: 'value', label: '代号', width: 80, enablePinyinSearch: true },
  { prop: 'label', label: '名称', enablePinyinSearch: true },
])

computed(() => {
  switch(formData.value.jgbz){
    case '1':
      formData.value.cp_jgz = formData.value.jgz;
      break;
    case '2':
      formData.value.cp_jgz = formData.value.jgz + '%';
      break;
  }
});

const jsxmCheck = computed({
  get(){
    return formData.value.jsxm === 'Y'
  },
  set(checked: boolean){
    formData.value.jsxm = checked ? 'Y' : 'N';
  }
})

const ygzqCheck =  computed({
  get(){
    return formData.value.ygzq === 'Y'
  },
  set(checked: boolean){
    formData.value.ygzq = checked ? 'Y' : 'N';
  }
})

const ygzdCheck =  computed({
  get(){
    return formData.value.ygzd === 'Y'
  },
  set(checked: boolean){
    formData.value.ygzd = checked ? 'Y' : 'N';
  }
})

const ygbbCheck =  computed({
  get(){
    return formData.value.ygbb === 'Y'
  },
  set(checked: boolean){
    formData.value.ygbb = checked ? 'Y' : 'N';
  }
})

const ygnlCheck =  computed({
  get(){
    return formData.value.ygnl === 'Y'
  },
  set(checked: boolean){
    formData.value.ygnl = checked ? 'Y' : 'N';
  }
})

const ygxbCheck =  computed({
  get(){
    return formData.value.ygxb === 'Y'
  },
  set(checked: boolean){
    formData.value.ygxb = checked ? 'Y' : 'N';
  }
})

watch(
  () => modelParam.value,
  (newVal:any) => {
    formData.value = {...newVal }; 
  },
  { immediate: true,deep: true } 
);

//多行参考值
const multiRefClick = () => {
  if(formData.value.dyckz){
    mulitDialogTableVisible.value = true
  }
}

const closeWithReturnMultiRef = (val: string) => {
  formData.value.dyckz = val;
  mulitDialogTableVisible.value = false;
}

const handleDialogConfirm = (val:string) => {
  formData.value.jsgs = val;
  calcDialogTableVisible.value = false
}

//计算向导
const calcGuildeClick = () => {
  if(formData.value.jsxm){
    calcDialogTableVisible.value = true
  }
  
}
//危急值特定条件
const conditionClick = () => {
  if(formData.value.xmid){
    conditionTabVisible.value = true
  }
  
}

onActivated(async () => {
  await getDictData('XMGL');
})

</script>


<style scoped lang="scss">
.form-inline {
  padding: 10px;
  background-color: #f5f7fa;
  height: auto;
  .el-input {
    width: 150px;
  }
  .el-form-item {
    margin-right: 10px;
    margin-bottom: 2px;
  }
  .text-span {
    font-weight: bold;
    font-size: 16px;
    color: #333;
    display: block;
  }
}
</style>