|
|
|
@ -0,0 +1,333 @@ |
|
|
|
<!-- 供试品部给药制剂取样/前处理记录表 --> |
|
|
|
<template> |
|
|
|
<div> |
|
|
|
<div class="detail-container"> |
|
|
|
<div class="detail-title"><img src="@/assets/images/detail-title.png">{{ formData.bdmc }}<img |
|
|
|
src="@/assets/images/detail-title.png" /></div> |
|
|
|
<div class="detail-content"> |
|
|
|
<div class="content"> |
|
|
|
<BaseInfoFormPackage fieldItemLabel="template.common.baseInfo" label="template.common.baseInfo" |
|
|
|
:ref="refConfig.baseInfoRef" :formConfig="baseInfoFormConfig" :formData="formData" /> |
|
|
|
<TableList label="template.common.gyzjInfo" :columns="gyzjColumns" :dataSource="resourceGyzj" /> |
|
|
|
<TableList label="template.common.sjInfo" :columns="sjColumns" :dataSource="resourceSj" /> |
|
|
|
<TableList label="template.common.instrumentInfo" :columns="yqColumns" :dataSource="yqResource" /> |
|
|
|
<LineLabel label="取样进样信息" /> |
|
|
|
<el-button class="mt-20" v-if="fillType === 'preFill'" type="primary" @click="onAdd">新增</el-button> |
|
|
|
<el-button class="mt-20" v-if="fillType === 'actFill'" type="primary" @click="onExport">导出</el-button> |
|
|
|
<div v-for="(item, index) in formData.ybsmDataList" :key="item.id" class="template-form-item"> |
|
|
|
<div class="config-header"> |
|
|
|
<div></div> |
|
|
|
<el-popconfirm title="确认删除当前数据?" @confirm="deleteConfig(item)"> |
|
|
|
<el-button slot="reference" v-if="fillType === 'preFill'" type="text" |
|
|
|
icon="el-icon-delete">{{ |
|
|
|
$t('template.common.deleteBtn') |
|
|
|
}}</el-button> |
|
|
|
</el-popconfirm> |
|
|
|
</div> |
|
|
|
<BaseInfoFormPackage fieldItemLabel="取样进样信息" :ref="`ybsmFormPackageRef${index}`" |
|
|
|
:formConfig="ybsmFormConfig" @blur="onHandleBlur" :formData="item" /> |
|
|
|
<CustomTable :ref="`ybsmTableRef${index}`" :columns="ybsmColumns" |
|
|
|
prefix = "qy" |
|
|
|
:showOperation="fillType === 'actFill' || fillType === 'preFill'" :showAddRow="fillType === 'preFill'" |
|
|
|
@onAddRow="() => addTableRow(index)" |
|
|
|
fieldItemLabel="取样进样信息" |
|
|
|
:formData="item"> |
|
|
|
<template slot="operation" slot-scope="{ row, rowIndex, columns }"> |
|
|
|
<TableOpertaionDelete :row="row" :rowIndex="rowIndex" :columns="columns" |
|
|
|
@deleteRow="() => deleteTableRow(rowIndex, index)"> |
|
|
|
</TableOpertaionDelete> |
|
|
|
</template> |
|
|
|
</CustomTable> |
|
|
|
<CustomTable :ref="`jyTableRef${index}`" :columns="yjColumns" |
|
|
|
prefix = "jy" |
|
|
|
fieldItemLabel="取样进样信息" |
|
|
|
:showOperation="fillType === 'actFill'" :showAddRow="false" |
|
|
|
:formData="{stepTableFormData:item.jyStepTableFormData || [], headerSelectFields: item.jyHeaderSelectFields || {}}"> |
|
|
|
<template slot="operation" slot-scope="{ row, rowIndex, columns }"> |
|
|
|
<TableOpertaionDelete :row="row" :rowIndex="rowIndex" :columns="columns" |
|
|
|
@deleteRow="() => deleteTableRow(rowIndex, index)"> |
|
|
|
</TableOpertaionDelete> |
|
|
|
</template> |
|
|
|
</CustomTable> |
|
|
|
</div> |
|
|
|
<LineLabel label="二次稀释信息" /> |
|
|
|
<el-button class="mt-20" v-if="fillType === 'preFill'" type="primary" @click="onAdd('ecDataList')">新增</el-button> |
|
|
|
<el-button class="mt-20" v-if="fillType === 'actFill'" type="primary" @click="onExport('ec')">导出</el-button> |
|
|
|
<div v-for="(item, index) in formData.ecDataList" :key="item.id" class="template-form-item"> |
|
|
|
<div class="config-header"> |
|
|
|
<div></div> |
|
|
|
<el-popconfirm title="确认删除当前数据?" @confirm="deleteConfig(item, 'ecDataList')"> |
|
|
|
<el-button slot="reference" v-if="fillType === 'preFill'" type="text" |
|
|
|
icon="el-icon-delete">{{ |
|
|
|
$t('template.common.deleteBtn') |
|
|
|
}}</el-button> |
|
|
|
</el-popconfirm> |
|
|
|
</div> |
|
|
|
<BaseInfoFormPackage fieldItemLabel="二次稀释信息" :ref="`ecFormPackageRef${index}`" |
|
|
|
:formConfig="ecFormConfig" @blur="onHandleBlur" :formData="item" /> |
|
|
|
<CustomTable :ref="`ecTableRef${index}`" :columns="yjColumns" |
|
|
|
prefix = "ec" |
|
|
|
fieldItemLabel="二次稀释信息" |
|
|
|
:showOperation="fillType === 'preFill' ||fillType === 'actFill'" |
|
|
|
:formData="item"> |
|
|
|
<template slot="operation" slot-scope="{ row, rowIndex, columns }"> |
|
|
|
<TableOpertaionDelete :row="row" :rowIndex="rowIndex" :columns="columns" |
|
|
|
@deleteRow="() => deleteTableRow(rowIndex, index)"> |
|
|
|
</TableOpertaionDelete> |
|
|
|
</template> |
|
|
|
</CustomTable> |
|
|
|
</div> |
|
|
|
<Step :ref="`stepRef`" :formData="formData.stepData || []"></Step> |
|
|
|
|
|
|
|
<BaseInfoFormPackage fieldItemLabel="template.common.remark" label="template.common.remark" |
|
|
|
:ref="refConfig.remarkRef" :formConfig="remarkConig" :formData="formData" /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- <button @click="onSave">保存</button> --> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import BaseInfoFormPackage from "@/components/Template/BaseInfoFormPackage"; |
|
|
|
import TableOpertaionDelete from "@/components/Template/operation/TableOpertaionDelete"; |
|
|
|
|
|
|
|
import LineLabel from "@/components/Template/LineLabel"; |
|
|
|
import TableList from "@/components/Template/Table"; |
|
|
|
import Step from "@/components/Template/Step"; |
|
|
|
import templateMixin from "../../mixins/templateMixin"; |
|
|
|
import CustomTable from '@/components/Template/CustomTable.vue'; |
|
|
|
import { uniqeResource } from "@/utils/calUnitTools"; |
|
|
|
import { getuuid, justUpdateFilledFormData } from "@/utils/index"; |
|
|
|
import { getBaseInfoFormConfig, getRemarkFormConfig, getYbsmFormConfig, getQyTableColumns,getJyTableColumns,getEcFormConfig } from "../../formConfig/gsp/gsp015"; |
|
|
|
const refConfig = { |
|
|
|
baseInfoRef: "baseInfoRef", |
|
|
|
remarkRef: "remarkRef", |
|
|
|
stepRef: "stepRef", |
|
|
|
} |
|
|
|
const compRefs = Object.values(refConfig); |
|
|
|
export default { |
|
|
|
name: "SP0021", |
|
|
|
components: { BaseInfoFormPackage, LineLabel, TableList, Step, CustomTable, TableOpertaionDelete }, |
|
|
|
mixins: [templateMixin], |
|
|
|
props: { |
|
|
|
fillType: { |
|
|
|
type: String, |
|
|
|
default: 'preFill', |
|
|
|
}, |
|
|
|
sn: { |
|
|
|
type: String, |
|
|
|
default: '', |
|
|
|
}, |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
// 备注表单配置 |
|
|
|
remarkConig() { |
|
|
|
return getRemarkFormConfig(this) |
|
|
|
}, |
|
|
|
// 试验基本信息表单配置 |
|
|
|
baseInfoFormConfig() { |
|
|
|
return getBaseInfoFormConfig(this) |
|
|
|
}, |
|
|
|
// 样本说明 |
|
|
|
ybsmFormConfig() { |
|
|
|
return getYbsmFormConfig(this) |
|
|
|
}, |
|
|
|
// 样本说明表格列 |
|
|
|
ybsmColumns() { |
|
|
|
return getQyTableColumns(this) |
|
|
|
}, |
|
|
|
//进样表格列 |
|
|
|
yjColumns() { |
|
|
|
return getJyTableColumns(this) |
|
|
|
}, |
|
|
|
// 二次稀释表单配置 |
|
|
|
ecFormConfig() { |
|
|
|
return getEcFormConfig(this) |
|
|
|
}, |
|
|
|
}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
refConfig, |
|
|
|
currentIndex: -1, |
|
|
|
}; |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
|
|
|
|
}, |
|
|
|
methods: { |
|
|
|
//新增样本说明表格行 |
|
|
|
addTableRow(index) { |
|
|
|
console.log(this.formData.ybsmDataList,"ybsmDataList") |
|
|
|
this.$refs[`ybsmTableRef${index}`][0].addRow({ |
|
|
|
id: getuuid(), |
|
|
|
}) |
|
|
|
this.$refs[`jyTableRef${index}`][0].addRow({ |
|
|
|
id: getuuid(), |
|
|
|
}) |
|
|
|
}, |
|
|
|
onExport() { |
|
|
|
|
|
|
|
}, |
|
|
|
//删除样本说明 |
|
|
|
deleteConfig(item,type="ybsmDataList") { |
|
|
|
if (this.formData[type].length > 1) { |
|
|
|
const configIndex = this.formData[type].findIndex(config => config.id === item.id); |
|
|
|
if (configIndex > -1) { |
|
|
|
const newList = [...this.formData[type]] |
|
|
|
newList.splice(configIndex, 1); |
|
|
|
this.$set(this.formData, type, newList); |
|
|
|
this.$nextTick(() => { |
|
|
|
//通知后端保存数据 |
|
|
|
justUpdateFilledFormData(); |
|
|
|
}) |
|
|
|
} |
|
|
|
} else { |
|
|
|
this.$message.warning('至少保留一条数据'); |
|
|
|
} |
|
|
|
|
|
|
|
}, |
|
|
|
//新增样本说明 |
|
|
|
onAdd(type = "ybsmDataList") { |
|
|
|
if (!this.formData[type]) { |
|
|
|
this.$set(this.formData, type, []); |
|
|
|
} |
|
|
|
let defaultInfo = { |
|
|
|
id: getuuid(), |
|
|
|
stepData: [], |
|
|
|
} |
|
|
|
// 添加新的平行配制配置 |
|
|
|
this.formData[type].push(defaultInfo); |
|
|
|
}, |
|
|
|
|
|
|
|
// 删除表格行 |
|
|
|
deleteTableRow(rowIndex, index) { |
|
|
|
this.$refs[`ybsmTableRef${index}`][0].deleteRow(rowIndex) |
|
|
|
this.$refs[`jyTableRef${index}`][0].deleteRow(rowIndex) |
|
|
|
}, |
|
|
|
//获取已填写的表单数据 |
|
|
|
getFilledFormData() { |
|
|
|
// 基础表单数据 |
|
|
|
const baseData = this.getFilledFormDataByRefs(compRefs); |
|
|
|
const ybsmDataList = this.formData.ybsmDataList.map((item, index) => { |
|
|
|
const ybsmFormData = this.$refs[`ybsmFormPackageRef${index}`][0]?.getFilledFormData() || {}; |
|
|
|
const ybsmTableData = this.$refs[`ybsmTableRef${index}`][0]?.getFilledFormData() || []; |
|
|
|
const jyTableData = this.$refs[`jyTableRef${index}`][0]?.getFilledFormData() || []; |
|
|
|
return { |
|
|
|
...ybsmFormData, |
|
|
|
...ybsmTableData, |
|
|
|
jyStepTableFormData:jyTableData.stepTableFormData, |
|
|
|
jyHeaderSelectFields: jyTableData.headerSelectFields, |
|
|
|
}; |
|
|
|
}); |
|
|
|
const ecDataList = this.formData.ecDataList.map((item, index) => { |
|
|
|
const ecFormData = this.$refs[`ecFormPackageRef${index}`][0]?.getFilledFormData() || {}; |
|
|
|
const ecTableData = this.$refs[`ecTableRef${index}`][0]?.getFilledFormData() || []; |
|
|
|
return { |
|
|
|
...ecFormData, |
|
|
|
...ecTableData, |
|
|
|
}; |
|
|
|
}); |
|
|
|
return { |
|
|
|
...baseData, |
|
|
|
ybsmDataList, |
|
|
|
ecDataList |
|
|
|
}; |
|
|
|
}, |
|
|
|
//获取填写完成的表单数据 |
|
|
|
async getFormData() { |
|
|
|
|
|
|
|
const refs = []; |
|
|
|
const {ecDataList = [],ybsmDataList = []} = this.formData |
|
|
|
|
|
|
|
// 验证多个样本说明项 |
|
|
|
for (let index = 0; index < ybsmDataList.length; index++) { |
|
|
|
// 验证样本说明表单 |
|
|
|
refs.push(`ybsmFormPackageRef${index}`) |
|
|
|
refs.push(`ybsmTableRef${index}`) |
|
|
|
refs.push(`jyTableRef${index}`) |
|
|
|
} |
|
|
|
for (let index = 0; index < ecDataList.length; index++) { |
|
|
|
// 验证样本说明表单 |
|
|
|
refs.push(`ecFormPackageRef${index}`) |
|
|
|
refs.push(`ecTableRef${index}`) |
|
|
|
} |
|
|
|
// 基础表单验证 |
|
|
|
let content = await this.validFormFields([...compRefs, ...refs]); |
|
|
|
if (!content) return false; |
|
|
|
// 获取所有数据 |
|
|
|
return this.getFilledFormData(); |
|
|
|
}, |
|
|
|
getResource() { |
|
|
|
let content = this.getFilledFormData(); |
|
|
|
//生成resource |
|
|
|
let tmpResource = [] |
|
|
|
if (this.fillType === "actFill") { |
|
|
|
//配置的试剂 |
|
|
|
tmpResource.push({ |
|
|
|
mc: content.targetName, |
|
|
|
bh: content.targetCode + content.targetCodeSn, |
|
|
|
ph: '', |
|
|
|
ndz: content.targetActConcentration + content.targetActConcentrationUnit, |
|
|
|
nd: content.targetActConcentration, |
|
|
|
nddw: content.targetActConcentrationUnit, |
|
|
|
ly: 'ELN配制', |
|
|
|
sxrq: content.expireDate, |
|
|
|
kc: content.targetActVolume, |
|
|
|
kcdw: content.targetActVolumeUnit, |
|
|
|
syl: null, |
|
|
|
type: null, |
|
|
|
elnType: this.product, |
|
|
|
syldw: content.targetActVolumeUnit, |
|
|
|
yxzq: content.effectivePeriod, |
|
|
|
yxzqdw: content.effectivePeriodUnit, |
|
|
|
}) |
|
|
|
} |
|
|
|
//使用的试剂、仪器 |
|
|
|
let allSjResource = []; |
|
|
|
let allYqResource = []; |
|
|
|
// 收集所有样本说明项的步骤资源 |
|
|
|
const stepResource = this.$refs[`stepRef`]?.getStepResource() || { sjResource: [], yqResource: [] }; |
|
|
|
allSjResource = [...allSjResource, ...(stepResource.sjResource || [])]; |
|
|
|
allYqResource = [...allYqResource, ...(stepResource.yqResource || [])]; |
|
|
|
this.resourceTmp = uniqeResource(tmpResource, allSjResource) |
|
|
|
this.yqResourceTmp = allYqResource |
|
|
|
return this.resourceTmp; |
|
|
|
}, |
|
|
|
//保存 |
|
|
|
async onSave() { |
|
|
|
let content = await this.getFormData(); |
|
|
|
console.log(content); |
|
|
|
|
|
|
|
}, |
|
|
|
} |
|
|
|
}; |
|
|
|
</script> |
|
|
|
<style rel="stylesheet/scss" lang="scss"> |
|
|
|
.mt-20 { |
|
|
|
margin-top: 20px; |
|
|
|
} |
|
|
|
|
|
|
|
.print-btn { |
|
|
|
margin-bottom: 20px; |
|
|
|
} |
|
|
|
|
|
|
|
.config-header { |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
align-items: center; |
|
|
|
margin-bottom: 15px; |
|
|
|
font-weight: bold; |
|
|
|
font-size: 16px; |
|
|
|
color: #303133; |
|
|
|
} |
|
|
|
|
|
|
|
.config-header .el-button { |
|
|
|
color: #f56c6c; |
|
|
|
font-size: 14px; |
|
|
|
} |
|
|
|
|
|
|
|
.config-header .el-button:hover { |
|
|
|
color: #f78989; |
|
|
|
} |
|
|
|
</style> |