| @ -0,0 +1,202 @@ | |||
| <!-- 生物样品组织清洗记录表 --> | |||
| <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="baseInfoRef" :formConfig="baseInfoFormConfig" :formData="formData" /> | |||
| <TableList label="template.common.reagentInfo" :columns="sysjColumns" :dataSource="resource" /> | |||
| <TableList label="template.common.instrumentInfo" :columns="yqColumns" :dataSource="yqResource" /> | |||
| <LineLabel label="template.yp.yp005.ybsm" /> | |||
| <CustomTable | |||
| :ref="`tableRef`" | |||
| :columns="tableColumns" | |||
| :formData="formData" | |||
| :prefixKey = "`table`" | |||
| fieldItemLabel = "template.common.operationSteps" | |||
| :showOperation="fillType === 'preFill'" | |||
| > | |||
| <template slot="operation" slot-scope="{ row, rowIndex, columns }"> | |||
| <TableOpertaionDelete :row="row" :rowIndex="rowIndex" :columns="columns" @deleteRow="deleteRow" ></TableOpertaionDelete> | |||
| </template> | |||
| </CustomTable> | |||
| <LineLabel label="template.yp.yp005.qxbz" /> | |||
| <Step ref="stepRef" :formData="formData.stepData"></Step> | |||
| <BaseInfoFormPackage fieldItemLabel="template.common.remark" label="template.common.remark" | |||
| ref="remarkRef" :formConfig="remarkConig" :formData="formData" /> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| <!-- <button @click="onSave">保存</button> --> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import BaseInfoFormPackage from "@/components/Template/BaseInfoFormPackage"; | |||
| 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 { EventBus } from "@/utils/eventBus"; | |||
| import { uniqeResource } from "@/utils/calUnitTools"; | |||
| import { debounce } from 'lodash-es' | |||
| import TableOpertaionDelete from "@/components/Template/operation/TableOpertaionDelete.vue" | |||
| export default { | |||
| name: "YP003", | |||
| components: { BaseInfoFormPackage, LineLabel, TableList, Step, CustomTable,TableOpertaionDelete }, | |||
| mixins: [templateMixin], | |||
| props: { | |||
| fillType: { | |||
| type: String, | |||
| default: 'preFill', | |||
| }, | |||
| }, | |||
| computed: { | |||
| // 备注表单配置 | |||
| remarkConig() { | |||
| return [ | |||
| { | |||
| type: "cellItem", | |||
| config: { | |||
| remark: { | |||
| label: "", | |||
| type: "textarea", | |||
| fillType: "actFill", | |||
| span: 1, | |||
| placeholder: 'template.common.remarkPlaceholder', | |||
| maxlength: 1000, | |||
| rows: 5 | |||
| } | |||
| } | |||
| } | |||
| ] | |||
| }, | |||
| // 试验基本信息表单配置 | |||
| baseInfoFormConfig() { | |||
| return [ | |||
| { | |||
| type: "cardItem", | |||
| config: { | |||
| studyMc: { | |||
| label: 'template.common.testName', | |||
| type: "input", | |||
| disabled: true, | |||
| }, | |||
| studySn: { | |||
| label: 'template.common.testNumber', | |||
| type: "input", | |||
| disabled: true, | |||
| }, | |||
| } | |||
| }, | |||
| { | |||
| type: "conditionItem", | |||
| label: 'template.yp.yp005.qxtj', | |||
| config: { | |||
| pre: { | |||
| label: 'template.common.preFill', | |||
| type: "select", | |||
| multiple: true, | |||
| fillType: "preFill", | |||
| options: this.getDictOptions('business_pztj'), | |||
| otherCode: "preOther", | |||
| }, | |||
| act: { | |||
| label: 'template.common.actualFill', | |||
| type: "select", | |||
| fillType: "actFill", | |||
| otherCode: "actOther", | |||
| multiple: true, | |||
| compareTo: "pre", | |||
| options: this.getDictOptions('business_pztj') | |||
| } | |||
| } | |||
| }, | |||
| { | |||
| type: "cellItem", | |||
| label: 'template.lba.lba002.czsj', | |||
| config: { | |||
| startDate: { | |||
| label: 'template.common.startTime', | |||
| type: "input", | |||
| }, | |||
| endDate: { | |||
| label: 'template.common.endTime', | |||
| type: "input", | |||
| }, | |||
| } | |||
| } | |||
| ] | |||
| }, | |||
| // 样本说明 | |||
| tableColumns() { | |||
| return [{ | |||
| label: 'template.yp.yp003.dwbh', | |||
| prop: 'dwbh', | |||
| bodyType: 'input', | |||
| bodyFillType: 'actFill', | |||
| width: 280, | |||
| },{ | |||
| label: 'template.yp.yp005.zz', | |||
| prop: 'zz', | |||
| bodyType: 'input', | |||
| bodyFillType: 'actFill', | |||
| width: 280, | |||
| },{ | |||
| label: 'template.yp.yp005.qxsj', | |||
| prop: 'qxsj', | |||
| bodyType: 'input', | |||
| bodyFillType: 'actFill', | |||
| width: 280, | |||
| }] | |||
| }, | |||
| }, | |||
| data() { | |||
| return { | |||
| formData: {}, | |||
| }; | |||
| }, | |||
| mounted() { | |||
| }, | |||
| methods: { | |||
| //获取已填写的表单数据 | |||
| getFilledFormData() { | |||
| return this.getFilledFormDataByRefs(["baseInfoRef", "tableRef", "stepRef", "remarkRef"]) | |||
| }, | |||
| //获取填写完成的表单数据 | |||
| async getFormData() { | |||
| let content = await this.validFormFields(["baseInfoRef", "tableRef", "stepRef", "remarkRef"]); | |||
| return content; | |||
| }, | |||
| getResource() { | |||
| //使用的试剂、仪器 | |||
| const stepResource = this.$refs.stepRef.getStepResource() | |||
| this.resourceTmp = stepResource.sjResource || [] | |||
| this.yqResourceTmp = stepResource.yqResource || [] | |||
| return this.resourceTmp; | |||
| }, | |||
| //保存 | |||
| async onSave() { | |||
| let content = await this.$refs.stepRef.getFormData(); | |||
| console.log(content); | |||
| }, | |||
| // 删除表格行 | |||
| deleteRow(rowIndex) { | |||
| const tableRef = this.$refs['tableRef']; | |||
| if (tableRef) { | |||
| tableRef.deleteRow(rowIndex); | |||
| } | |||
| }, | |||
| } | |||
| }; | |||
| </script> | |||
| <style rel="stylesheet/scss" lang="scss"> | |||
| </style> | |||