luojie
1 week ago
12 changed files with 397 additions and 58 deletions
Split View
Diff Options
-
+40 -6src/components/Template/BaseInfoFormPcakge.vue
-
+26 -8src/components/Template/CustomTable.vue
-
+45 -13src/components/Template/HandleFormItem.vue
-
+6 -5src/components/Template/Step.vue
-
+6 -1src/lang/en/template/commonTemplate.js
-
+6 -1src/lang/zh/template/commonTemplate.js
-
+3 -1src/views/business/comps/template/TemplateTable.vue
-
+240 -0src/views/business/comps/template/comps/dl/SYWZPZJHB.vue
-
+8 -8src/views/business/comps/template/comps/sp/SWYPBQGZYZBB.vue
-
+6 -6src/views/business/comps/template/comps/sp/SWYPFXCBYPZB.vue
-
+6 -7src/views/business/comps/template/comps/sp/SWYPFXRYPZB.vue
-
+5 -2src/views/business/comps/template/mixins/templateMixin.js
+ 40
- 6
src/components/Template/BaseInfoFormPcakge.vue
View File
+ 26
- 8
src/components/Template/CustomTable.vue
View File
+ 45
- 13
src/components/Template/HandleFormItem.vue
View File
+ 6
- 5
src/components/Template/Step.vue
View File
+ 6
- 1
src/lang/en/template/commonTemplate.js
View File
+ 6
- 1
src/lang/zh/template/commonTemplate.js
View File
+ 3
- 1
src/views/business/comps/template/TemplateTable.vue
View File
+ 240
- 0
src/views/business/comps/template/comps/dl/SYWZPZJHB.vue
View File
| @ -0,0 +1,240 @@ | |||
| <!-- 试验物质配制计划表 --> | |||
| <template> | |||
| <div> | |||
| <div class="detail-container"> | |||
| <div class="detail-title"><img src="@/assets/images/detail-title.png">试验物质配制计划表<img | |||
| src="@/assets/images/detail-title.png" /></div> | |||
| <div class="detail-content"> | |||
| <div class="content"> | |||
| <BaseInfoFormPcakge label="试验基本信息" ref="baseInfoRef" :formConfig="baseInfoFormConfig" | |||
| :formData="formData" /> | |||
| <LineLabel label="计划信息" /> | |||
| <div class="template-form-item"> | |||
| <BaseInfoFormPcakge ref="stepFormPackageRef" :formConfig="stepFormConfig" @blur="onHandleBlur" | |||
| :formData="formData" /> | |||
| <CustomTable @blur="onHandleTableBlur" :showHeaderSelect="fillType === 'actFill'" :showOperation="fillType === 'actFill'" ref="stepTableRef" :columns="stepColumns" | |||
| :formData="formData" > | |||
| <template slot="operation" slot-scope="{ row, rowIndex}"> | |||
| <TableOpertaion :fillType="fillType" :row="row" :rowIndex="rowIndex" @deleteRow="deleteRow"></TableOpertaion> | |||
| </template> | |||
| </CustomTable> | |||
| <div class="add-row"> | |||
| <el-button type="primary" plain @click="addRow">添加行</el-button> | |||
| </div> | |||
| </div> | |||
| <BaseInfoFormPcakge label="特别说明" ref="remarkRef" :formConfig="remarkConig" :formData="formData" /> | |||
| </div> | |||
| </div> | |||
| <button @click="onSave">保存</button> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import BaseInfoFormPcakge from "@/components/Template/BaseInfoFormPcakge"; | |||
| import LineLabel from "@/components/Template/LineLabel"; | |||
| import templateMixin from "../../mixins/templateMixin"; | |||
| import CustomTable from '@/components/Template/CustomTable.vue'; | |||
| import TableOpertaion from "@/components/Template/operation/TableOpertaion.vue" | |||
| export default { | |||
| name: "SYWZPZJHB", | |||
| components: { BaseInfoFormPcakge, LineLabel, CustomTable, TableOpertaion }, | |||
| mixins: [templateMixin], | |||
| props: { | |||
| value: { | |||
| type: {}, | |||
| default: () => { }, | |||
| }, | |||
| fillType: { | |||
| type: String, | |||
| default: 'preFill', | |||
| }, | |||
| }, | |||
| watch: { | |||
| value: { | |||
| immediate: true, | |||
| handler(v) { | |||
| } | |||
| }, | |||
| fillType: { | |||
| immediate: true, | |||
| handler(v) { | |||
| console.log(v,"fillType") | |||
| } | |||
| }, | |||
| }, | |||
| computed: { | |||
| // 备注表单配置 | |||
| remarkConig() { | |||
| return [ | |||
| { | |||
| type: "cellItem", | |||
| config: { | |||
| remark: { | |||
| label: "", | |||
| type: "textarea", | |||
| fillType: "actFill", | |||
| span: 1, | |||
| placeholder: "请输入特别说明", | |||
| maxlength: 1000, | |||
| rows: 5 | |||
| } | |||
| } | |||
| } | |||
| ] | |||
| }, | |||
| // 试验基本信息表单配置 | |||
| baseInfoFormConfig() { | |||
| return [ | |||
| { | |||
| type: "cardItem", | |||
| config: { | |||
| studyMc: { | |||
| label: "试验名称", | |||
| type: "input", | |||
| disabled: true, | |||
| }, | |||
| studySn: { | |||
| label: "试验编号", | |||
| type: "input", | |||
| disabled: true, | |||
| }, | |||
| } | |||
| }, | |||
| ] | |||
| }, | |||
| // 操作步骤表单配置 | |||
| stepFormConfig() { | |||
| return [ | |||
| { | |||
| type: "step", | |||
| config: { | |||
| drawTime: { | |||
| label: "领取时间", | |||
| type: "dateTime", | |||
| fillType: "actFill", | |||
| }, | |||
| analyzeTime: { | |||
| label: "分析时间", | |||
| type: "dateTime", | |||
| fillType: "actFill", | |||
| }, | |||
| testSubstance: { | |||
| label: "试验物质", | |||
| type: "input", | |||
| fillType: "actFill", | |||
| }, | |||
| configFrequency: { | |||
| label: "配置频率", | |||
| type: "input", | |||
| fillType: "actFill", | |||
| }, | |||
| } | |||
| } | |||
| ] | |||
| }, | |||
| // 步骤表格列配置 | |||
| stepColumns() { | |||
| return [ | |||
| { | |||
| label: "给药剂量或组别", | |||
| prop: "startSolutionCode", | |||
| width: 280, | |||
| bodyType: "input", | |||
| bodyFillType: "actFill", | |||
| bodyMaxlength: 10, | |||
| }, | |||
| { | |||
| label: "配制浓度", | |||
| prop: "preparationConcentration", | |||
| width: 280, | |||
| headerSelectKey: "preparationConcentrationUnit", | |||
| fillType: "actFill", | |||
| headerOptions: this.$store.state.template.volumeOptions, | |||
| defaultValue: "mg", | |||
| bodyType: "inputNumber", | |||
| bodyFillType: "actFill", | |||
| bodyMaxlength: 10, | |||
| }, | |||
| { | |||
| label: "配制体积", | |||
| prop: "preparationVolume", | |||
| width: 280, | |||
| headerSelectKey: "preparationVolumeUnit", | |||
| fillType: "actFill", | |||
| headerOptions: this.$store.state.template.volumeOptions, | |||
| bodyType: "inputNumber", | |||
| bodyFillType: "actFill", | |||
| bodyMaxlength: 10, | |||
| }, | |||
| ] | |||
| }, | |||
| }, | |||
| data() { | |||
| return { | |||
| selectReagentVisible: false, | |||
| subSolutionVisible: false, | |||
| currentSubKey: "",//当前点击的子项key | |||
| dataSource: [], | |||
| stepTableDataSource: [], | |||
| }; | |||
| }, | |||
| mounted() { | |||
| this.formData = { | |||
| headerSelectFields: { | |||
| preparationVolumeUnit: "ml", | |||
| preparationConcentrationUnit: "ul", | |||
| } | |||
| } | |||
| }, | |||
| methods: { | |||
| async getFormData() { | |||
| const baseData = await this.$refs.baseInfoRef.getFormData(); | |||
| const stepFormData = await this.$refs.stepFormPackageRef.getFormData(); | |||
| const stepTableFormData = await this.$refs.stepTableRef.getFormData(); | |||
| const remarkData = await this.$refs.remarkRef.getFormData(); | |||
| if(!stepTableFormData.stepTableFormData.length){ | |||
| this.$message.error("请添加计划信息"); | |||
| return; | |||
| } | |||
| return { | |||
| ...baseData, | |||
| ...stepFormData, | |||
| ...remarkData, | |||
| ...stepTableFormData | |||
| } | |||
| }, | |||
| async onSave() { | |||
| const formData = await this.getFormData(); | |||
| // const formData = await this.$refs.stepTableRef.getFormData(); | |||
| console.log(formData, "formData") | |||
| }, | |||
| // 添加行 | |||
| addRow() { | |||
| this.$refs.stepTableRef.addRow({ | |||
| startSolutionCode: "", | |||
| preparationConcentration: "", | |||
| preparationVolume: "", | |||
| }) | |||
| } | |||
| } | |||
| }; | |||
| </script> | |||
| <style rel="stylesheet/scss" lang="scss"> | |||
| .mt-20 { | |||
| margin-top: 20px; | |||
| } | |||
| .add-row{ | |||
| display: flex; | |||
| justify-content: center; | |||
| margin-top: 20px; | |||
| } | |||
| </style> | |||