feat: [模板管理] lba002

src/components/Template/CustomTable.vue

@@ -756,6 +756,8 @@ export default {
 	color: #606266;
 	margin-top: 20px;
 	&.no-border {
+		box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+		border-radius: 5px 5px;
 		border: none;
 		.custom-table-cell {
 			border-right: none;

src/lang/en/template/lba.js

@@ -1,4 +1,11 @@
 //LBA
 export default {
-  lba001: {} //用的SP001
+  lba001: {}, //用的SP001
+  lba002: {
+    cztj: 'Work Condition',
+    czsj: 'Work Time',
+    jcbmc: 'Analysis Plate Name',
+    tjh: 'Add Row',
+    sc: 'Delete'
+  }
 }

src/lang/zh/template/lba.js

@@ -1,4 +1,11 @@
 //LBA
 export default {
-  lba001: {} //用的SP001
+  lba001: {}, //用的SP001
+  lba002: {
+    cztj: '操作条件',
+    czsj: '操作时间',
+    jcbmc: '检测板名称',
+    tjh: '添加行',
+    sc: '删除'
+  }
 }

src/views/business/comps/template/TemplateTable.vue

@@ -53,6 +53,7 @@ import PCR002 from "./comps/pcr/PCR002.vue";
 
 //LBA
 // LBA001-使用SP001
+import LBA002 from "./comps/lba/LBA002.vue";
 
 //ADA
 // ADA001-使用SP001
@@ -68,7 +69,9 @@ export default {
     //色谱
     SP001, SP003, SP00456,SP007, SP008, SP009, SP010, SP011, SP012, SP013, SP014, SP015, SP016, SP017, SP018,
     // PCR
-    PCR002
+    PCR002,
+    // PCR
+    LBA002
   },
   props: {
     sn: {
@@ -122,6 +125,7 @@ export default {
           'PCR002': 'PCR002',
           //LBA
           'LBA001': 'SP001',
+          'LBA002': 'LBA002',
           //样品
           'YP001': 'SP001',
           //ADA

src/views/business/comps/template/comps/lba/LBA002.vue

@@ -0,0 +1,257 @@
+<!-- 配体结合分析溶液配制记录表 -->
+<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.common.operationSteps" />
+
+					<CustomTable
+						:isBorder="false"
+						@blur="onHandleTableBlur"
+						:ref="`tableRef`"
+						:columns="tableStepColumns"
+						:formData="formData"
+						:prefixKey = "`table`"
+						fieldItemLabel = "template.common.operationSteps"
+					>
+						<template slot="operation" slot-scope="{ row, rowIndex, columns }" v-if="fillType!='actFill'">
+							<TableOpertaionDelete  :row="row" :rowIndex="rowIndex" :columns="columns"  @deleteRow="deleteRow" ></TableOpertaionDelete>
+						</template>
+					</CustomTable>
+
+					<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: "SP001",
+	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,
+						},
+						methodCode: {
+							label: 'template.common.methodCode',
+							type: "input",
+							fillType: "preFill",
+							maxlength: 50
+						},
+						versionNum: {
+							label: 'template.common.versionNumber',
+							type: "inputNumber",
+							fillType: "actFill",
+							prepend: "V",
+							maxlength: 50
+						},
+
+					}
+				},
+				{
+					type: "conditionItem",
+					label: 'template.lba.lba002.cztj',
+					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",
+						},
+					}
+				}
+			]
+		},
+		// 操作步骤表单配置
+		tableStepColumns() {
+			return [{
+				label: 'template.lba.lba002.jcbmc',
+				prop: 'mc',
+				bodyType: 'input',
+				bodySubType: 'span',
+				bodySubKey: 'bh',
+				bodyFillType: 'preFill',
+				width: 280,
+			}]
+		},
+	},
+	data() {
+		return {
+			formData: {},
+		};
+	},
+	mounted() {
+		const formData = this.getFormDataByTemplateData();
+		if(this.fillType === "actFill"){
+			this.getCode(formData);
+		}
+	},
+	methods: {
+		//获取目标溶液编号
+		getCode: debounce(async function (v) {
+			const {stepTableFormData = []} = v;
+			if(stepTableFormData && stepTableFormData.length>0 && !stepTableFormData[0].bh){
+				let postSn = []
+				for(let i=0;i<stepTableFormData.length;i++){
+					postSn.push({
+						pre:stepTableFormData[i].mc,
+						type:1
+					})
+				}
+				const snList = await this.getLatestSnArr(postSn)
+				for(let i=0;i<stepTableFormData.length;i++){
+					this.$refs.tableRef.updateDataSourceByRowIndex(i,{
+						bh: snList[i],
+					})
+				}
+
+				const params = {
+					type: "fieldChanged",
+					newRecord: null,
+					resourceList: null,
+				}
+				setTimeout(() => {
+					EventBus.$emit('onModifyRecord', params,)
+				}, 10);
+			}
+		}, 100),
+		//获取已填写的表单数据
+		getFilledFormData() {
+			return this.getFilledFormDataByRefs(["baseInfoRef",  "tableRef", "stepRef", "remarkRef"])
+		},
+		//获取填写完成的表单数据
+		async getFormData() {
+			let content = await this.validFormFields(["baseInfoRef",  "tableRef", "stepRef", "remarkRef"]);
+			return content;
+		},
+		getResource() {
+			let content = this.getFilledFormData();
+			//生成resource
+			let jcbList = []
+			if (this.fillType === "actFill") {
+				let tableList = content.stepTableFormData
+				if(tableList && tableList.length>0){
+					for(let i=0;i<tableList.length;i++){
+						//检测板
+						let item = tableList[i]
+						console.log('表格item:'+JSON.stringify(item))
+						jcbList.push({
+							bh: item.mc+item.bh,
+							studyId: this.formData.studyId,
+							studyFillFormId: this.formData.id
+						})
+					}
+				}
+			}
+			//使用的试剂、仪器
+			const stepResource = this.$refs.stepRef.getStepResource()
+			this.resourceTmp = stepResource.sjResource || []
+			this.yqResourceTmp = stepResource.yqResource || []
+			this.jcbListTmp = jcbList
+			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>