|
|
|
@ -2,30 +2,32 @@ |
|
|
|
<template> |
|
|
|
<div> |
|
|
|
<div class="detail-container"> |
|
|
|
<div class="detail-title"><img src="@/assets/images/detail-title.png">生物样品分析溶液配制表<img |
|
|
|
<div class="detail-title"><img src="@/assets/images/detail-title.png">{{ $t('template.common.pageTitle') }}<img |
|
|
|
src="@/assets/images/detail-title.png" /></div> |
|
|
|
<div class="detail-content"> |
|
|
|
<div class="content"> |
|
|
|
<BaseInfoFormPcakge label = "试验基本信息" ref = "baseInfo" :formConfig = "formConfig" :formData = "formData"/> |
|
|
|
<LineLabel label = "试验试剂信息"/> |
|
|
|
<TableList :columns = "sysjColumns" :dataSource = "dataSource"/> |
|
|
|
<LineLabel label = "仪器使用信息"/> |
|
|
|
<TableList :columns = "yqsColumns" :dataSource = "dataSource"/> |
|
|
|
<BaseInfoFormPcakge label = "存储条件" ref = "storageConditionRef" :formConfig = "storageFormConfig" :formData = "formData"/> |
|
|
|
<LineLabel label = "操作步骤"/> |
|
|
|
<BaseInfoFormPcakge :label="$t('template.common.baseInfo')" ref="baseInfoRef" :formConfig="baseInfoFormConfig" |
|
|
|
:formData="formData" /> |
|
|
|
<TableList :label="$t('template.common.reagentInfo')" :columns="sysjColumns" :dataSource="dataSource" /> |
|
|
|
<TableList :label="$t('template.common.instrumentInfo')" :columns="yqsColumns" :dataSource="dataSource" /> |
|
|
|
<BaseInfoFormPcakge :label="$t('template.common.storageCondition')" ref="storageConditionRef" :formConfig="storageFormConfig" |
|
|
|
:formData="formData" /> |
|
|
|
<LineLabel :label="$t('template.common.operationSteps')" /> |
|
|
|
<div class="template-form-item"> |
|
|
|
<BaseInfoFormPcakge ref = "stepFormPackage" :formConfig = "stepFormConfig" :formData = "formData"/> |
|
|
|
<BaseInfoFormPcakge ref="stepFormPackageRef" :formConfig="stepFormConfig" |
|
|
|
@blur = "onHandleBlur" |
|
|
|
:formData="formData" /> |
|
|
|
</div> |
|
|
|
<Step ref = "stepRef"></Step> |
|
|
|
<BaseInfoFormPcakge label = "备注" ref = "remarkRef" :formConfig = "remarkConig" :formData = "formData"/> |
|
|
|
<Step ref="stepRef" :formData="formData"></Step> |
|
|
|
<BaseInfoFormPcakge :label="$t('template.common.remark')" ref="remarkRef" :formConfig="remarkConig" :formData="formData" /> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- <button @click = "onSave">保存</button> --> |
|
|
|
<!-- <button @click = "onSave">{{ $t('template.SWYPFXRYPZB.saveBtn') }}</button> --> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
|
<script> |
|
|
|
import BaseInfoFormPcakge from "@/components/Template/BaseInfoFormPcakge"; |
|
|
|
import LineLabel from "@/components/Template/LineLabel"; |
|
|
|
@ -33,19 +35,11 @@ import TableList from "@/components/Template/Table"; |
|
|
|
import Step from "@/components/Template/Step"; |
|
|
|
import templateMixin from "../../mixins/templateMixin"; |
|
|
|
import CustomTable from '@/components/Template/CustomTable.vue'; |
|
|
|
const mgOptions = [ |
|
|
|
{label:"mg",value:"mg"}, |
|
|
|
{label:"ng",value:"ng"}, |
|
|
|
]; |
|
|
|
const conditionOptions = [ |
|
|
|
{label:"条件1",value:"1"}, |
|
|
|
{label:"条件2",value:"2"}, |
|
|
|
{label:"条件3",value:"3"}, |
|
|
|
{label:"其他",value:"-1"}, |
|
|
|
]; |
|
|
|
import moment from 'moment'; |
|
|
|
|
|
|
|
export default { |
|
|
|
name: "SWYPFXRYPZB", |
|
|
|
components: { BaseInfoFormPcakge,LineLabel,TableList,Step,CustomTable }, |
|
|
|
components: { BaseInfoFormPcakge, LineLabel, TableList, Step, CustomTable }, |
|
|
|
mixins: [templateMixin], |
|
|
|
props: { |
|
|
|
value: { |
|
|
|
@ -65,220 +59,253 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
dataSource:[{name:"名称1"}], |
|
|
|
sysjColumns:[ |
|
|
|
{label:"试剂名称",prop:"reagentName"}, |
|
|
|
{label:"编号",prop:"reagentCode"}, |
|
|
|
{label:"批号",prop:"reagentNo"}, |
|
|
|
{label:"浓度/含量/纯度",prop:"concentration"}, |
|
|
|
{label:"来源",prop:"source"}, |
|
|
|
{label:"失效日",prop:"expireDate"}, |
|
|
|
], |
|
|
|
yqsColumns:[ |
|
|
|
{label:"仪器名称",prop:"instrumentName"}, |
|
|
|
{label:"仪器型号",prop:"instrumentModel"}, |
|
|
|
{label:"仪器编号",prop:"instrumentCode"}, |
|
|
|
{label:"下次测试/校准/检定日期",prop:"nextTestDate"}, |
|
|
|
], |
|
|
|
storageFormConfig:[ |
|
|
|
{ |
|
|
|
type:"conditionItem", |
|
|
|
config:{ |
|
|
|
storageCondition1:{ |
|
|
|
label:"存储条件", |
|
|
|
type:"select", |
|
|
|
fillType:"preFill", |
|
|
|
options:conditionOptions, |
|
|
|
otherCode:"other1", |
|
|
|
computed: { |
|
|
|
storageFormConfig() { |
|
|
|
return [ |
|
|
|
{ |
|
|
|
type: "conditionItem", |
|
|
|
config: { |
|
|
|
storageCondition1: { |
|
|
|
label: this.$t('template.common.storageConditionLabel'), |
|
|
|
type: "select", |
|
|
|
fillType: "preFill", |
|
|
|
options: this.$store.state.template.conditionOptions, |
|
|
|
otherCode: "other1", |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
], |
|
|
|
remarkConig:[ |
|
|
|
]; |
|
|
|
}, |
|
|
|
remarkConig() { |
|
|
|
return [ |
|
|
|
{ |
|
|
|
type:"cellItem", |
|
|
|
config:{ |
|
|
|
remark:{ |
|
|
|
label:"", |
|
|
|
type:"textarea", |
|
|
|
fillType:"actFill", |
|
|
|
span:1, |
|
|
|
placeholder:"请输入备注", |
|
|
|
maxlength:500, |
|
|
|
rows:5 |
|
|
|
type: "cellItem", |
|
|
|
config: { |
|
|
|
remark: { |
|
|
|
label: "", |
|
|
|
type: "textarea", |
|
|
|
fillType: "actFill", |
|
|
|
span: 1, |
|
|
|
placeholder: this.$t('template.common.remarkPlaceholder'), |
|
|
|
maxlength: 500, |
|
|
|
rows: 5 |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
], |
|
|
|
formConfig: [ |
|
|
|
] |
|
|
|
}, |
|
|
|
baseInfoFormConfig() { |
|
|
|
return [ |
|
|
|
{ |
|
|
|
type:"cardItem", |
|
|
|
config:{ |
|
|
|
name:{ |
|
|
|
label:"试验名称", |
|
|
|
type:"input", |
|
|
|
disabled:true, |
|
|
|
type: "cardItem", |
|
|
|
config: { |
|
|
|
bdmc: { |
|
|
|
label: this.$t('template.common.testName'), |
|
|
|
type: "input", |
|
|
|
disabled: true, |
|
|
|
}, |
|
|
|
code:{ |
|
|
|
label:"试验编号", |
|
|
|
type:"input", |
|
|
|
disabled:true, |
|
|
|
bdbh: { |
|
|
|
label: this.$t('template.common.testNumber'), |
|
|
|
type: "input", |
|
|
|
disabled: true, |
|
|
|
}, |
|
|
|
methodCode:{ |
|
|
|
label:"方法编号", |
|
|
|
type:"input", |
|
|
|
fillType:"preFill", |
|
|
|
copyFrom:"name",//复制哪个字段 |
|
|
|
methodCode: { |
|
|
|
label: this.$t('template.common.methodCode'), |
|
|
|
type: "input", |
|
|
|
fillType: "preFill", |
|
|
|
maxlength:50 |
|
|
|
}, |
|
|
|
versionNum:{ |
|
|
|
label:"版本号", |
|
|
|
type:"input", |
|
|
|
fillType:"actFill" |
|
|
|
versionNum: { |
|
|
|
label: this.$t('template.common.versionNumber'), |
|
|
|
type: "input", |
|
|
|
fillType: "actFill" |
|
|
|
}, |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
{ |
|
|
|
type:"conditionItem", |
|
|
|
label:"试验配制条件", |
|
|
|
config:{ |
|
|
|
pre:{ |
|
|
|
label:"预填", |
|
|
|
type:"select", |
|
|
|
multiple:true, |
|
|
|
fillType:"preFill", |
|
|
|
options:conditionOptions, |
|
|
|
otherCode:"other1", |
|
|
|
type: "conditionItem", |
|
|
|
label: this.$t('template.common.testConfigurationConditions'), |
|
|
|
config: { |
|
|
|
pre: { |
|
|
|
label: this.$t('template.common.preFill'), |
|
|
|
type: "select", |
|
|
|
multiple: true, |
|
|
|
fillType: "preFill", |
|
|
|
options: this.$store.state.template.conditionOptions, |
|
|
|
otherCode: "other1", |
|
|
|
}, |
|
|
|
act:{ |
|
|
|
label:"实际", |
|
|
|
type:"select", |
|
|
|
fillType:"actFill", |
|
|
|
otherCode:"other2", |
|
|
|
multiple:true, |
|
|
|
options:conditionOptions |
|
|
|
act: { |
|
|
|
label: this.$t('template.common.actualFill'), |
|
|
|
type: "select", |
|
|
|
fillType: "actFill", |
|
|
|
otherCode: "other2", |
|
|
|
multiple: true, |
|
|
|
options: this.$store.state.template.conditionOptions |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
{ |
|
|
|
type:"cellItem", |
|
|
|
label:"配置时间", |
|
|
|
config:{ |
|
|
|
startDate:{ |
|
|
|
label:"开始时间", |
|
|
|
type:"input", |
|
|
|
type: "cellItem", |
|
|
|
label: this.$t('template.common.configurationTime'), |
|
|
|
config: { |
|
|
|
createTime: { |
|
|
|
label: this.$t('template.common.startTime'), |
|
|
|
type: "input", |
|
|
|
}, |
|
|
|
endDate:{ |
|
|
|
label:"结束时间", |
|
|
|
type:"input", |
|
|
|
endTime: { |
|
|
|
label: this.$t('template.common.endTime'), |
|
|
|
type: "input", |
|
|
|
}, |
|
|
|
} |
|
|
|
} |
|
|
|
], |
|
|
|
stepFormConfig:[ |
|
|
|
] |
|
|
|
}, |
|
|
|
stepFormConfig() { |
|
|
|
return [ |
|
|
|
{ |
|
|
|
type:"step", |
|
|
|
config:{ |
|
|
|
targetName:{ |
|
|
|
label:"目标溶液名称", |
|
|
|
type:"input", |
|
|
|
fillType:"preFill", |
|
|
|
type: "step", |
|
|
|
config: { |
|
|
|
targetName: { |
|
|
|
label: this.$t('template.common.targetSolutionName'), |
|
|
|
type: "input", |
|
|
|
fillType: "preFill", |
|
|
|
maxlength:50 |
|
|
|
}, |
|
|
|
targetCode:{ |
|
|
|
label:"目标溶液编号", |
|
|
|
type:"input", |
|
|
|
subType:"span", |
|
|
|
fillType:"preFill", |
|
|
|
subKey:"targetCode1", |
|
|
|
targetCode: { |
|
|
|
label: this.$t('template.common.targetSolutionCode'), |
|
|
|
type: "input", |
|
|
|
subType: "span", |
|
|
|
fillType: "preFill", |
|
|
|
subKey: "targetCode1", |
|
|
|
maxlength:20 |
|
|
|
}, |
|
|
|
targetPreConcentration:{ |
|
|
|
label:"目标溶液预计浓度", |
|
|
|
type:"input", |
|
|
|
subType:"select", |
|
|
|
subKey:"targetPreConcentrationUnit", |
|
|
|
fillType:"preFill", |
|
|
|
subOptions:mgOptions, |
|
|
|
targetPreConcentration: { |
|
|
|
label: this.$t('template.common.targetPreConcentration'), |
|
|
|
type: "inputNumber", |
|
|
|
subType: "select", |
|
|
|
subKey: "targetPreConcentrationUnit", |
|
|
|
fillType: "preFill", |
|
|
|
subOptions: this.$store.state.template.mgOptions, |
|
|
|
maxlength:10 |
|
|
|
}, |
|
|
|
targetActConcentration:{ |
|
|
|
label:"目标溶液实际浓度", |
|
|
|
type:"input", |
|
|
|
subType:"select", |
|
|
|
subKey:"targetActConcentrationUnit", |
|
|
|
fillType:"actFill", |
|
|
|
subFillType:"preFill", |
|
|
|
subOptions:mgOptions, |
|
|
|
targetActConcentration: { |
|
|
|
label: this.$t('template.common.targetActConcentration'), |
|
|
|
type: "inputNumber", |
|
|
|
subType: "select", |
|
|
|
subKey: "targetActConcentrationUnit", |
|
|
|
fillType: "actFill", |
|
|
|
subFillType: "preFill", |
|
|
|
subOptions: this.$store.state.template.mgOptions, |
|
|
|
copyFrom: "targetPreConcentration",//复制哪个字段 |
|
|
|
maxlength:10 |
|
|
|
}, |
|
|
|
targetPreVolume:{ |
|
|
|
label:"目标溶液预计体积", |
|
|
|
type:"input", |
|
|
|
subType:"select", |
|
|
|
subKey:"targetPreVolumeUnit", |
|
|
|
subOptions:mgOptions, |
|
|
|
fillType:"preFill", |
|
|
|
targetPreVolume: { |
|
|
|
label: this.$t('template.common.targetPreVolume'), |
|
|
|
type: "inputNumber", |
|
|
|
subType: "select", |
|
|
|
subKey: "targetPreVolumeUnit", |
|
|
|
subOptions: this.$store.state.template.volumeOptions, |
|
|
|
fillType: "preFill", |
|
|
|
maxlength:10 |
|
|
|
}, |
|
|
|
targetActVolume:{ |
|
|
|
label:"目标溶液实际体积", |
|
|
|
type:"input", |
|
|
|
subType:"select", |
|
|
|
subKey:"targetActVolumeUnit", |
|
|
|
fillType:"actFill", |
|
|
|
subFillType:"preFill", |
|
|
|
subOptions:mgOptions, |
|
|
|
targetActVolume: { |
|
|
|
label: this.$t('template.common.targetActVolume'), |
|
|
|
type: "inputNumber", |
|
|
|
subType: "select", |
|
|
|
subKey: "targetActVolumeUnit", |
|
|
|
fillType: "actFill", |
|
|
|
subFillType: "preFill", |
|
|
|
subOptions: this.$store.state.template.volumeOptions, |
|
|
|
copyFrom: "targetPreVolume",//复制哪个字段 |
|
|
|
maxlength:10 |
|
|
|
}, |
|
|
|
effectivePeriod:{ |
|
|
|
label:"有效周期", |
|
|
|
type:"input", |
|
|
|
subType:"select", |
|
|
|
subKey:"effectivePeriodUnit", |
|
|
|
fillType:"preFill", |
|
|
|
subOptions:[ |
|
|
|
{label:"小时",value:"hour"}, |
|
|
|
{label:"天",value:"day"}, |
|
|
|
], |
|
|
|
effectivePeriod: { |
|
|
|
label: this.$t('template.common.effectivePeriod'), |
|
|
|
type: "inputNumber", |
|
|
|
subType: "select", |
|
|
|
subKey: "effectivePeriodUnit", |
|
|
|
fillType: "preFill", |
|
|
|
subOptions: this.$store.state.template.effectivePeriodOptions, |
|
|
|
maxlength:10 |
|
|
|
}, |
|
|
|
expireDate:{ |
|
|
|
label:"失效日", |
|
|
|
type:"input", |
|
|
|
expireDate: { |
|
|
|
label: this.$t('template.common.expireDate'), |
|
|
|
type: "input", |
|
|
|
}, |
|
|
|
} |
|
|
|
} |
|
|
|
] |
|
|
|
}, |
|
|
|
}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
dataSource: [], |
|
|
|
sysjColumns: [ |
|
|
|
{ label: this.$t('template.common.reagentName'), prop: "reagentName" }, |
|
|
|
{ label: this.$t('template.common.reagentCode'), prop: "reagentCode" }, |
|
|
|
{ label: this.$t('template.common.reagentNo'), prop: "reagentNo" }, |
|
|
|
{ label: this.$t('template.common.concentration'), prop: "concentration" }, |
|
|
|
{ label: this.$t('template.common.source'), prop: "source" }, |
|
|
|
{ label: this.$t('template.common.reagentExpireDate'), prop: "expireDate" }, |
|
|
|
], |
|
|
|
formData:{} |
|
|
|
yqsColumns: [ |
|
|
|
{ label: this.$t('template.common.instrumentName'), prop: "instrumentName" }, |
|
|
|
{ label: this.$t('template.common.instrumentModel'), prop: "instrumentModel" }, |
|
|
|
{ label: this.$t('template.common.instrumentCode'), prop: "instrumentCode" }, |
|
|
|
{ label: this.$t('template.common.nextTestDate'), prop: "nextTestDate" }, |
|
|
|
], |
|
|
|
formData: {} |
|
|
|
}; |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
setTimeout(()=>{ |
|
|
|
if(this.fillType === "preFill"){ |
|
|
|
this.formData = { |
|
|
|
// code:"code1",name:"name1",act:["1","-1"],taget1:"mg",targetCode1:"123456",taget1c:"可点击" |
|
|
|
effectivePeriodUnit:"days",//设置默认值 |
|
|
|
createTime: "2026-01-02 18:05:36",//设置默认值 |
|
|
|
targetPreConcentration:2, |
|
|
|
} |
|
|
|
|
|
|
|
},3000) |
|
|
|
} |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
async getFormData(){ |
|
|
|
const baseData = await this.$refs.baseInfo.getFormData(); |
|
|
|
async getFormData() { |
|
|
|
const baseData = await this.$refs.baseInfoRef.getFormData(); |
|
|
|
const conditionData = await this.$refs.storageConditionRef.getFormData(); |
|
|
|
const stepFormData = await this.$refs.stepFormPackageRef.getFormData(); |
|
|
|
const stepData = await this.$refs.stepRef.getFormData(); |
|
|
|
const stepFormData = await this.$refs.stepFormPackage.getFormData(); |
|
|
|
if (!stepData.length) { |
|
|
|
this.$message.error(this.$t('template.common.addStepError')); |
|
|
|
return; |
|
|
|
} |
|
|
|
const remarkData = await this.$refs.remarkRef.getFormData(); |
|
|
|
return { |
|
|
|
...baseData, |
|
|
|
...conditionData, |
|
|
|
...stepData, |
|
|
|
...stepFormData, |
|
|
|
stepData: stepFormData, |
|
|
|
...remarkData |
|
|
|
} |
|
|
|
}, |
|
|
|
async onSave(){ |
|
|
|
async onSave() { |
|
|
|
const formData = await this.getFormData(); |
|
|
|
console.log(formData,"formData") |
|
|
|
console.log(formData, "formData") |
|
|
|
}, |
|
|
|
onHandleBlur(fields){ |
|
|
|
const {key ,effectivePeriodUnit,effectivePeriod} = fields; |
|
|
|
const {createTime} = this.formData; |
|
|
|
console.log(fields) |
|
|
|
if(key ==="effectivePeriod"){//有效周期失焦 |
|
|
|
const start = moment(createTime); |
|
|
|
const end = start.add(Number(effectivePeriod), effectivePeriodUnit).format("YYYY-MM-DD HH:mm:ss"); |
|
|
|
this.$refs.stepFormPackageRef.updateFormField("expireDate", end); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
</script> |
|
|
|
<style rel="stylesheet/scss" lang="scss"> |
|
|
|
.mt-20{ |
|
|
|
.mt-20 { |
|
|
|
margin-top: 20px; |
|
|
|
} |
|
|
|
</style> |
luojie
1 week ago