diff --git a/src/App.vue b/src/App.vue index 5346a74..d64ea38 100644 --- a/src/App.vue +++ b/src/App.vue @@ -309,4 +309,14 @@ export default { margin-top: 10px; } } +.template-form-item { + background: #fff; + padding: 20px; + border-radius: 8px; + box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + margin-top: 24px; + padding: 24px; + border-radius: 5px 5px; + +} diff --git a/src/components/Template/BaseInfoFormPcakge.vue b/src/components/Template/BaseInfoFormPcakge.vue index 16b057d..e8015ee 100644 --- a/src/components/Template/BaseInfoFormPcakge.vue +++ b/src/components/Template/BaseInfoFormPcakge.vue @@ -63,6 +63,37 @@ + @@ -104,6 +135,10 @@ export default { }, methods: { + handleClickable(sItem){ + console.log(sItem) + this.$emit("clickable",sItem) + }, //根据span判断一行显示几列 getSpanClass(sItem){ const spanArr = ["full-row","","three-row"] @@ -112,12 +147,19 @@ export default { } return "" }, + //获取其他下拉框的配置 getOtherItem(sItem){ return { label:"其他", fillType: sItem.fillType, } }, + getSubItem(sItem){ + return { + label: sItem.label, + options: sItem.subOptions || [], + } + }, isShowOther(v = []) { // 确保v是数组类型,以避免类型错误 const arr = Array.isArray(v) ? v : [v]; @@ -177,6 +219,11 @@ export default { result[otherCode] = formData[otherCode] || ''; config[otherCode] = { label: "其他", type: "input" } } + if (currentConfig.subKey) { + const { subKey } = currentConfig; + result[subKey] = formData[subKey] || ''; + config[subKey] = { label: currentConfig.label, type: currentConfig.subType } + } }); // 处理可能存在的直接otherCode字段 @@ -295,6 +342,14 @@ export default { font-weight: normal; color: #606266; } +.step-title{ + font-size: 14px; + font-weight: normal; + color: #606266; + width: 150px; + text-align: right; + padding-right: 10px; +} .p-r-20{ padding-right: 20px; } @@ -315,8 +370,16 @@ export default { .flex { display: flex; } - +.other-title{ + width: 50px; + text-align: right; + margin: 0 10px; +} .mr-24 { margin-right: 24px; } +.sub-select{ + width: auto; + margin-left: 10px; +} \ No newline at end of file diff --git a/src/views/business/comps/template/comps/sp/SWYPFXRYPZB.vue b/src/views/business/comps/template/comps/sp/SWYPFXRYPZB.vue index efff979..3e82d4d 100644 --- a/src/views/business/comps/template/comps/sp/SWYPFXRYPZB.vue +++ b/src/views/business/comps/template/comps/sp/SWYPFXRYPZB.vue @@ -14,6 +14,9 @@ +
+ +
@@ -63,19 +66,18 @@ export default { ], storageFormConfig:[ { - type:"cellItem", + type:"conditionItem", config:{ - storageCondition:{ - label:"存储条件", - type:"input", - }, storageCondition1:{ label:"存储条件", type:"select", + fillType:"preFill", options:[ - {label:"正常",value:"1"}, - {label:"特殊",value:"2"}, + {label:"白光",value:"1"}, + {label:"黄光",value:"3"}, + {label:"其他",value:"-1"}, ], + otherCode:"other1", }, } @@ -154,13 +156,46 @@ export default { } } ], + stepFormConfig:[ + { + type:"step", + config:{ + startDate:{ + label:"目标溶液名称", + type:"input", + }, + endDate:{ + label:"目标溶液编号", + type:"input", + subType:"span", + subKey:"targetCode1", + }, + target:{ + label:"目标溶液预计浓度", + type:"input", + subType:"select", + subKey:"taget1", + subOptions:[ + {label:"mg",value:"mg"}, + {label:"ng",value:"ng"}, + ], + }, + target:{ + label:"目标溶液预计浓度", + type:"input", + subType:"clickable", + subKey:"taget1c", + }, + } + } + ], formData:{} }; }, mounted() { setTimeout(()=>{ this.formData = { - code:"code1",name:"name1",act:["1","-1"] + code:"code1",name:"name1",act:["1","-1"],taget1:"mg",targetCode1:"123456",taget1c:"可点击" } },3000) }, @@ -168,8 +203,9 @@ export default { async onSave(){ // const result1 = await this.$refs.baseInfo.getFormData(); // const result2 = await this.$refs.storageCondition.getFormData(); - const result3 = await this.$refs.stepRef.getFormData(); - console.log(result3,"reee") + // const result3 = await this.$refs.stepRef.getFormData(); + const result = await this.$refs.stepFormPackage.getFormData(); + console.log(result,"reee") } } };