Merge branch 'master' of http://182.151.8.209:9010/eln_TD/eln_web

src/components/Template/BaseInfoFormPcakge.vue

@@ -1,21 +1,22 @@
 <template>
     <div>
-        <LineLabel v-if="label" :label = "label"/>
+        <LineLabel v-if="label" :label="label" />
         <div v-for="(item, index) in formConfig" :key="index">
             <template v-if="item.type === 'cardItem'">
                 <div class="grid-container">
-                    <div v-for="(sItem, key) in item.config" class="form-item" :class="sItem.span == 1 ? 'full-row' : ''"
-                        :key="key">
+                    <div v-for="(sItem, key) in item.config" class="form-item"
+                        :class="sItem.span == 1 ? 'full-row' : ''" :key="key">
                         <template v-if="sItem.type === 'input'">
                             <div class="form-title">{{ sItem.label }}</div>
-                            <HandleFormItem @blur="onBlur(key, $event)" :item="sItem" v-model="formFields[key]" 
-                                @copy="onCopy(sItem, key)" :error="errors[key]" @update:error="errors[key] = false" 
+                            <HandleFormItem @blur="onBlur(key, $event)" :item="sItem" v-model="formFields[key]"
+                                @copy="onCopy(sItem, key)" :error="errors[key]" @update:error="errors[key] = false"
                                 :orange-bg="orangeBgFields[key]" />
                         </template>
                         <template v-else-if="sItem.type === 'inputNumber'">
                             <div class="form-title">{{ sItem.label }}</div>
-                            <HandleFormItem type = "inputNumber" @blur="onBlur(key, $event)" :item="sItem" @input = "onInputNumberChange(key, $event)"  v-model="formFields[key]" 
-                                @copy="onCopy(sItem, key)" :error="errors[key]" @update:error="errors[key] = false" 
+                            <HandleFormItem type="inputNumber" @blur="onBlur(key, $event)" :item="sItem"
+                                @input="onInputNumberChange(key, $event)" v-model="formFields[key]"
+                                @copy="onCopy(sItem, key)" :error="errors[key]" @update:error="errors[key] = false"
                                 :orange-bg="orangeBgFields[key]" />
                         </template>
                     </div>
@@ -27,19 +28,22 @@
                     <div v-for="(sItem, key) in item.config" class="c-Item  grid-container">
                         <div class="p-r-20">
                             <div class="form-title">{{ sItem.label }}</div>
-                            <div class="flex ">
+                            <div class="flex flex1">
                                 <HandleFormItem type="select" :item="sItem" v-model="formFields[key]"
-                                    @copy="onCopy(sItem, key)" @change="onSelectChange(key, $event)" :error="errors[key]" @update:error="errors[key] = false" 
+                                    @copy="onCopy(sItem, key)" @change="onSelectChange(key, $event)"
+                                    :error="errors[key]" @update:error="errors[key] = false"
                                     :orange-bg="orangeBgFields[key]" />
 
                             </div>
                         </div>
-                        <div  class="p-l-20">
+                        <div class="p-l-20">
                             <div v-show="isShowOther(formFields[key])">
                                 <div class="form-title">其他</div>
-                                <div class="flex">
-                                    <HandleFormItem @blur="onBlur(key, $event)" :item="getOtherItem(sItem)" v-model="formFields[sItem.otherCode]" 
-                                        @copy="onCopy(sItem, key)" :error="errors[sItem.otherCode]" @update:error="errors[sItem.otherCode] = false" />
+                                <div class="flex flex1">
+                                    <HandleFormItem @blur="onBlur(key, $event)" :item="getOtherItem(sItem)"
+                                        v-model="formFields[sItem.otherCode]" @copy="onCopy(sItem, key)"
+                                        :error="errors[sItem.otherCode]"
+                                        @update:error="errors[sItem.otherCode] = false" />
                                 </div>
                             </div>
 
@@ -52,29 +56,34 @@
                 <div class="form-item ">
                     <div class="form-title fs-16" v-if="item.label">{{ item.label }}</div>
                     <div class="grid-container gap2">
-                        <div v-for="(sItem, key) in item.config" class="c-Item" :class="getSpanClass(sItem)"
-                            :key="key">
+                        <div v-for="(sItem, key) in item.config" class="c-Item" :class="getSpanClass(sItem)" :key="key">
                             <div class="form-title" v-if="sItem.label">{{ sItem.label }}</div>
                             <div v-if="sItem.type === 'dateTime'" class="flex1">
                                 <HandleFormItem type="dateTime" :item="sItem" v-model="formFields[key]"
-                                    @copy="onCopy(sItem, key)" :error="errors[key]" @update:error="errors[key] = false" 
+                                    @copy="onCopy(sItem, key)" :error="errors[key]" @update:error="errors[key] = false"
                                     :orange-bg="orangeBgFields[key]" />
                             </div>
                             <div v-else-if="sItem.type === 'select'">
                                 <HandleFormItem type="select" :item="sItem" v-model="formFields[key]"
-                                    @copy="onCopy(sItem, key)" @change="onSelectChange(key, $event)" :error="errors[key]" @update:error="errors[key] = false" 
+                                    @copy="onCopy(sItem, key)" @change="onSelectChange(key, $event)"
+                                    :error="errors[key]" @update:error="errors[key] = false"
                                     :orange-bg="orangeBgFields[key]" />
                             </div>
                             <div v-else-if="sItem.type === 'input'">
-                                <HandleFormItem @blur="onBlur(key, $event)" :item="sItem" v-model="formFields[key]" 
-                                @copy="onCopy(sItem, key)" :error="errors[key]" @update:error="errors[key] = false" 
-                                :orange-bg="orangeBgFields[key]" />
+                                <HandleFormItem @blur="onBlur(key, $event)" :item="sItem" v-model="formFields[key]"
+                                    @copy="onCopy(sItem, key)" :error="errors[key]" @update:error="errors[key] = false"
+                                    :orange-bg="orangeBgFields[key]" />
                             </div>
                             <div v-else-if="sItem.type === 'textarea'">
-                                <HandleFormItem @blur="onBlur(key, $event)" type="textarea" :item="sItem" v-model="formFields[key]" 
-                                @copy="onCopy(sItem, key)" :error="errors[key]" @update:error="errors[key] = false" 
-                                :orange-bg="orangeBgFields[key]" />
+                                <HandleFormItem @blur="onBlur(key, $event)" type="textarea" :item="sItem"
+                                    v-model="formFields[key]" @copy="onCopy(sItem, key)" :error="errors[key]"
+                                    @update:error="errors[key] = false" :orange-bg="orangeBgFields[key]" />
                             </div>
+                            <div v-else-if="sItem.type === 'clickable'" class="flex1">
+                                <HandleFormItem type="clickable" @clickable="handleClickable(sItem, $event)"
+                                    :item="sItem" :value="formFields[key]" />
+                            </div>
+
                         </div>
                     </div>
 
@@ -82,57 +91,79 @@
             </template>
             <template v-else-if="item.type === 'step'">
                 <div class="grid-container gap2">
-                    <div v-for="(sItem, key) in item.config" class="c-Item flex item-center" :class="getSpanClass(sItem)"
-                        :key="key">
+                    <div v-for="(sItem, key) in item.config" class="c-Item flex item-center"
+                        :class="getSpanClass(sItem)" :key="key">
                         <div class="step-form-title" v-if="sItem.label">{{ sItem.label }}</div>
                         <div v-if="sItem.type === 'dateTime'" class="flex1">
                             <HandleFormItem type="dateTime" :item="sItem" v-model="formFields[key]"
-                                    @copy="onCopy(sItem, key)" :error="errors[key]" @update:error="errors[key] = false" 
-                                    :orange-bg="orangeBgFields[key]" />
+                                @copy="onCopy(sItem, key)" :error="errors[key]" @update:error="errors[key] = false"
+                                :orange-bg="orangeBgFields[key]" />
                         </div>
                         <div v-else-if="sItem.type === 'select'" class="flex flex1">
-                            <HandleFormItem type="select" :item="sItem" style="width: auto;flex:1" v-model="formFields[key]"
-                                @copy="onCopy(sItem, key)" @change="onSelectChange(key, $event)" :error="errors[key]" @update:error="errors[key] = false" 
-                                :orange-bg="orangeBgFields[key]" />
+                            <HandleFormItem type="select" :item="sItem" style="width: auto;flex:1"
+                                v-model="formFields[key]" @copy="onCopy(sItem, key)"
+                                @change="onSelectChange(key, $event)" :error="errors[key]"
+                                @update:error="errors[key] = false" :orange-bg="orangeBgFields[key]" />
                             <div v-show="isShowOther(formFields[key])" class="flex flex1">
                                 <div class="other-title">其他</div>
                                 <div class="flex">
-                                    <HandleFormItem @blur="onBlur(key, $event)" class="sub-select" :item="getOtherItem(sItem)" v-model="formFields[sItem.otherCode]" 
-                                        @copy="onCopy(sItem, key)" :error="errors[sItem.otherCode]" @update:error="errors[sItem.otherCode] = false" 
+                                    <HandleFormItem @blur="onBlur(key, $event)" :item="getOtherItem(sItem)"
+                                        v-model="formFields[sItem.otherCode]" @copy="onCopy(sItem, key)"
+                                        :error="errors[sItem.otherCode]" @update:error="errors[sItem.otherCode] = false"
                                         :orange-bg="orangeBgFields[sItem.otherCode]" />
                                 </div>
                             </div>
                         </div>
                         <div v-else-if="sItem.type === 'input'" class="flex flex1">
-                            <HandleFormItem @blur="onBlur(key, $event)" class="flex1" :item="sItem" v-model="formFields[key]" 
-                            @copy="onCopy(sItem, key)" :error="errors[key]" @update:error="errors[key] = false" 
-                            :orange-bg="orangeBgFields[key]" />
-                            <HandleFormItem v-if="sItem.subType === 'select'" type="select" class="sub-select" :item="getSubItem(sItem)" v-model="formFields[sItem.subKey]" 
-                            @copy="onCopy(sItem, key)" @change="onSelectChange(sItem.subKey, $event)" :error="errors[sItem.subKey]" @update:error="errors[sItem.subKey] = false" 
-                            :orange-bg="orangeBgFields[sItem.subKey]" />
+                            <HandleFormItem @blur="onBlur(key, $event)" class="flex1" :item="sItem"
+                                v-model="formFields[key]" @copy="onCopy(sItem, key)" :error="errors[key]"
+                                @update:error="errors[key] = false" :orange-bg="orangeBgFields[key]" />
+                            <HandleFormItem v-if="sItem.subType === 'select'" type="select" :item="getSubItem(sItem)"
+                                v-model="formFields[sItem.subKey]" @copy="onCopy(sItem, key)"
+                                @change="onSelectChange(sItem.subKey, $event)" :error="errors[sItem.subKey]"
+                                @update:error="errors[sItem.subKey] = false"
+                                :orange-bg="orangeBgFields[sItem.subKey]" />
                             <div v-else-if="sItem.subType === 'span'">{{ formFields[sItem.subKey] }}</div>
-                            <HandleFormItem v-else-if="sItem.subType === 'clickable'" type="clickable" @clickable="handleClickable(sItem,$event)" class="sub-select" :item="getClickableItem(sItem)" :value="formFields[sItem.subKey]" 
-                            />
+                            <HandleFormItem v-else-if="sItem.subType === 'clickable'" type="clickable"
+                                @clickable="handleClickable(sItem, $event)" :item="getClickableItem(sItem)"
+                                :value="formFields[sItem.subKey]" />
+                            <div v-show="isShowOther(formFields[sItem.subKey])" class="flex flex1">
+                                <div class="other-title">其他</div>
+                                <div class="flex">
+                                    <HandleFormItem @blur="onBlur(key, $event)" :item="getOtherItem(sItem)"
+                                        v-model="formFields[sItem.otherCode]" @copy="onCopy(sItem, key)"
+                                        :error="errors[sItem.otherCode]" @update:error="errors[sItem.otherCode] = false"
+                                        :orange-bg="orangeBgFields[sItem.otherCode]" />
+                                </div>
+                            </div>
                             <!-- <div class="clickable" :class="getFillType(sItem.subFillType)" v-else-if = "sItem.subType ==='clickable'" @click="handleClickable(sItem,$event)">
                                 <span v-if="formFields[sItem.subKey]">{{ formFields[sItem.subKey] }}</span>
                                 <span v-else class="default-placeholder-text">请选择</span>
                             </div> -->
                         </div>
                         <div v-else-if="sItem.type === 'inputNumber'" class="flex flex1">
-                            <HandleFormItem type = "inputNumber" @blur="onBlur(key, $event)" class="flex1" :item="sItem" @input = "onInputNumberChange(key, $event)" :value = "formFields[key]" 
-                            @copy="onCopy(sItem, key)" :error="errors[key]" @update:error="errors[key] = false" 
-                            :orange-bg="orangeBgFields[key]" />
-                            <HandleFormItem v-if="sItem.subType === 'select'" type="select" class="sub-select" :item="getSubItem(sItem)" v-model="formFields[sItem.subKey]" 
-                            @copy="onCopy(sItem, key)" @change="onSelectChange(sItem.subKey, $event)" :error="errors[sItem.subKey]" @update:error="errors[sItem.subKey] = false" 
-                            :orange-bg="orangeBgFields[sItem.subKey]" />
+                            <HandleFormItem type="inputNumber" @blur="onBlur(key, $event)" class="flex1" :item="sItem"
+                                @input="onInputNumberChange(key, $event)" :value="formFields[key]"
+                                @copy="onCopy(sItem, key)" :error="errors[key]" @update:error="errors[key] = false"
+                                :orange-bg="orangeBgFields[key]" />
+                            <HandleFormItem v-if="sItem.subType === 'select'" type="select" :item="getSubItem(sItem)"
+                                v-model="formFields[sItem.subKey]" @copy="onCopy(sItem, key)"
+                                @change="onSelectChange(sItem.subKey, $event)" :error="errors[sItem.subKey]"
+                                @update:error="errors[sItem.subKey] = false"
+                                :orange-bg="orangeBgFields[sItem.subKey]" />
                             <div v-else-if="sItem.subType === 'span'">{{ formFields[sItem.subKey] }}</div>
-                              <HandleFormItem v-else-if="sItem.subType === 'clickable'" @clickable="handleClickable(sItem,$event)" type="clickable" class="sub-select" :item="getClickableItem(sItem)" :value="formFields[sItem.subKey]" 
-                            />
+                            <HandleFormItem v-else-if="sItem.subType === 'clickable'"
+                                @clickable="handleClickable(sItem, $event)" type="clickable"
+                                :item="getClickableItem(sItem)" :value="formFields[sItem.subKey]" />
                             <!-- <div class="clickable" :class="getFillType(sItem.subFillType)" v-else-if = "sItem.subType ==='clickable'" @click="handleClickable(sItem,$event)">
                                 <span v-if="formFields[sItem.subKey]">{{ formFields[sItem.subKey] }}</span>
                                 <span v-else class="default-placeholder-text">请选择</span>
                             </div> -->
                         </div>
+                        <div v-else-if="sItem.type === 'clickable'" class="flex flex1">
+                            <HandleFormItem type="clickable" @clickable="handleClickable(sItem, $event)"
+                                :error="errors[key]" :item="sItem" :value="formFields[key]" />
+                        </div>
                     </div>
                 </div>
             </template>
@@ -149,7 +180,7 @@ export default {
         LineLabel
     },
     props: {
-        label:{//当前表单的标题
+        label: {//当前表单的标题
             type: String,
             default: "",
         },
@@ -175,7 +206,7 @@ export default {
             immediate: true,
             deep: true, // 深度监听，以便检测嵌套对象变化
             handler(v) {
-                if(v){
+                if (v) {
                     this.handleFormField();
                 }
             }
@@ -191,6 +222,10 @@ export default {
     mounted() {
         this.handleFormField();
     },
+    unmounted() {
+        console.log("unmounted")
+        this.formFields = {};//清空当前填写的数据
+    },
 
     methods: {
         getFillType(type) {
@@ -201,21 +236,21 @@ export default {
             }
             return typeObj[type] || ""
         },
-        onInputNumberChange(key, val){
+        onInputNumberChange(key, val) {
             this.formFields[key] = val;
             // 清除该表单项的错误状态
             if (this.errors[key]) {
                 this.$set(this.errors, key, false);
             }
         },
-        updateFormData(key, value){
+        updateFormData(key, value) {
             this.formFields[key] = value;
             // 清除该表单项的错误状态
             if (this.errors[key]) {
                 this.$set(this.errors, key, false);
             }
         },
-        batchUpdateFormData(data){
+        batchUpdateFormData(data) {
             Object.keys(data).forEach(key => {
                 this.formFields[key] = data[key];
                 // 清除该表单项的错误状态
@@ -224,36 +259,37 @@ export default {
                 }
             })
         },
-        handleClickable(sItem,event){
-            if(this.$store.state.template.templateStatus !== 'actFill'){
+        handleClickable(sItem, event) {
+            console.log("clickable", sItem)
+            if (this.$store.state.template.templateStatus !== 'actFill') {
                 return
             }
-            this.$emit("clickable",sItem)
+            this.$emit("clickable", sItem)
         },
         //根据span判断一行显示几列
-        getSpanClass(sItem){
-            const spanArr = ["full-row","","three-row"]
-            if(sItem.span){
-                return spanArr[sItem.span-1]
+        getSpanClass(sItem) {
+            const spanArr = ["full-row", "", "three-row"]
+            if (sItem.span) {
+                return spanArr[sItem.span - 1]
             }
             return ""
         },
         //获取其他下拉框的配置
-        getOtherItem(sItem){
+        getOtherItem(sItem) {
             return {
-                label:"其他",
+                label: "其他",
                 fillType: sItem.fillType,
                 maxlength: sItem.otherMaxlength || 50,
             }
         },
-        getClickableItem(sItem){
+        getClickableItem(sItem) {
             return {
                 label: "",
                 type: "clickable",
                 fillType: sItem.subFillType || sItem.fillType,
             }
         },
-        getSubItem(sItem){
+        getSubItem(sItem) {
             return {
                 label: "",
                 options: sItem.subOptions || [],
@@ -264,7 +300,7 @@ export default {
             // 确保v是数组类型，以避免类型错误
             const arr = Array.isArray(v) ? v : [v];
             //和凡哥商量，只要value为负数都显示其他
-            return arr.some(item => item<0);
+            return arr.some(item => item < 0);
         },
         // 根据formConfig回填form表单数据
         handleFormField() {
@@ -276,16 +312,16 @@ export default {
                 if (item.config) {
                     // 合并配置项
                     config = { ...config, ...item.config }
-                    
+
                     // 处理每个配置项
                     Object.keys(item.config).forEach(key => {
                         const currentConfig = item.config[key];
                         let value = formData[key];
-                        
+
                         // 如果formFields中已经有值，保持原值（用户输入或之前设置的值）
-                        if (formFields[key] !== null && 
-                            formFields[key] !== undefined && 
-                            formFields[key] !== ''&&
+                        if (formFields[key] !== null &&
+                            formFields[key] !== undefined &&
+                            formFields[key] !== '' &&
                             typeof formFields[key] !== 'object'
                         ) {
                             // 保留原值，不使用formData中的值
@@ -294,20 +330,20 @@ export default {
                             // 使用formData中的值
                             result[key] = value;
                         }
-                        
+
                         // 处理特殊字段 - "其他"字段
                         if (currentConfig.otherCode) {
                             const { otherCode } = currentConfig;
                             result[otherCode] = formData[otherCode] || '';
-                            config[otherCode] = { label: "其他", parentKey:key, type: "input",fillType:currentConfig.fillType,otherCode }
+                            config[otherCode] = { label: "其他", parentKey: key, type: "input", fillType: currentConfig.fillType }
                         }
                         if (currentConfig.subKey) {
                             const { subKey } = currentConfig;
                             result[subKey] = formData[subKey] || '';
-                            config[subKey] = { label: currentConfig.label,subKey, type: currentConfig.subType,fillType:currentConfig.subFillType || currentConfig.fillType }
+                            config[subKey] = { label: currentConfig.label, subKey, type: currentConfig.subType, fillType: currentConfig.subFillType || currentConfig.fillType }
                         }
                     });
-                    
+
                     // 处理可能存在的直接otherCode字段
                     if (item.config?.otherCode) {
                         config[item.config?.otherCode] = item.config?.otherCode;
@@ -340,19 +376,33 @@ export default {
             const { formFields, allFieldsConfig } = this;
             const { templateStatus } = this.$store.state.template;
             const errors = [];
-            
+
             // 清空之前的错误状态
             this.errors = {};
-            
+
             for (const key in allFieldsConfig) {
+                const o = allFieldsConfig[key];
+                if (o.otherCode) {//
+                    if (o.type === "select") {
+                        const isSelectedOther = this.isShowOther(formFields[key]);
+                        if (!isSelectedOther) {//如果其他选项没有被选择，清空其他字段
+                            formFields[o.otherCode] = "";
+                        }
+                    }else if(o.subType === "select"){
+                          const isSelectedOther = this.isShowOther(formFields[o.subKey]);
+                        if (!isSelectedOther) {//如果其他选项没有被选择，清空其他字段
+                            formFields[o.otherCode] = "";
+                        }
+                    }
+
+                }
                 if (this.isValueEmpty(formFields[key])) {
-                    const o = allFieldsConfig[key];
                     // 其他字段需要判断是否显示再校验   
                     if (o.label === "其他" && !this.isShowOther(formFields[o.parentKey])) {
                         continue
                     }
                     //span的字段不校验
-                    if(o.type === "span"){
+                    if (o.type === "span") {
                         continue
                     }
                     if (o.fillType == templateStatus && !o.disabled) {
@@ -362,19 +412,19 @@ export default {
                         } else {
                             prefix = "选择";
                         }
-                        
+
                         const errorItem = {
                             field: key,
                             label: o.label,
                             error: `请${prefix}${o.label}`
                         };
-                        
+
                         errors.push(errorItem);
                         this.$set(this.errors, key, true);
                     }
                 }
             }
-            
+
             return {
                 valid: errors.length === 0,
                 errors: errors
@@ -405,7 +455,7 @@ export default {
                 }
             });
         },
-        getFormDataByKey(key){
+        getFormDataByKey(key) {
             return this.formFields[key];
         },
         onBlur(key, val) {
@@ -414,7 +464,7 @@ export default {
             if (currentFieldConfig && currentFieldConfig.fillType === "actFill" && currentFieldConfig.compareTo) {
                 const compareToKey = currentFieldConfig.compareTo;
                 const compareToValue = this.formFields[compareToKey];
-                
+
                 // 比较当前值和compareTo值，如果不相等则设置橙色背景
                 if (val !== compareToValue) {
                     this.$set(this.orangeBgFields, key, true);
@@ -423,20 +473,20 @@ export default {
                     this.$set(this.orangeBgFields, key, false);
                 }
             }
-            
-            this.$emit("blur", { key, value: val ,...this.formFields});
+
+            this.$emit("blur", { key, value: val, ...this.formFields });
         },
         onSelectChange(key, val) {
             // 获取对应的配置
             const currentConfig = this.allFieldsConfig[key];
-            
+
             // // 确保多选下拉框的值是数组类型
             // if (currentConfig && currentConfig.multiple) {
             //     // 多选情况，确保值为数组类型
             //     this.formFields[key] = Array.isArray(val) ? val : (val ? [val] : []);
             // } else {
-                // 单选情况
-                this.formFields[key] = val;
+            // 单选情况
+            this.formFields[key] = val;
             // }
             this.$emit("select", { key, value: val });
             // 清除该表单项的错误状态
@@ -462,8 +512,9 @@ export default {
     /* 默认2列 */
     gap: 0 20px;
 }
-.gap2{
-    gap:0 64px;
+
+.gap2 {
+    gap: 0 64px;
 }
 
 .w-100 {
@@ -485,6 +536,7 @@ export default {
 .full-row {
     grid-column: span 2;
 }
+
 .three-row {
     grid-column: span 3;
 }
@@ -495,24 +547,29 @@ export default {
         margin-bottom: 16px;
     }
 }
-.eo{
-      &:nth-child(even) {
+
+.eo {
+    &:nth-child(even) {
         padding-left: 20px;
     }
+
     &:nth-child(odd) {
         padding-right: 20px;
     }
 }
-.default-placeholder-text{
+
+.default-placeholder-text {
     color: #C0C4CC;
 }
+
 .form-title {
     margin-bottom: 12px;
     font-size: 14px;
     font-weight: normal;
     color: #606266;
 }
-.step-form-title{
+
+.step-form-title {
     font-size: 14px;
     font-weight: normal;
     color: #606266;
@@ -520,10 +577,12 @@ export default {
     text-align: right;
     padding-right: 10px;
 }
-.p-r-20{
+
+.p-r-20 {
     padding-right: 20px;
 }
-.p-l-20{
+
+.p-l-20 {
     padding-left: 20px;
 }
 
@@ -540,33 +599,24 @@ export default {
 .flex {
     display: flex;
 }
-.other-title{
-    width: 50px; 
+
+.other-title {
+    width: 50px;
     text-align: right;
     margin: 0 10px;
+    font-size: 14px;
+    font-weight: normal;
+    color: #606266;
 }
+
 .mr-24 {
     margin-right: 24px;
 }
-.sub-select{
+
+.sub-select {
     width: 100px;
     margin-left: 10px;
 }
-.clickable{
-    cursor: pointer;
-    width: auto;
-    margin-left: 10px;
-    min-width: 100px;
-    height: 28px;
-    border-radius: 4px;
-    border:1px solid #4ea2ff;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    font-size: 14px;
-    font-weight: normal;
-    color: #606266;
-}
 
 .orange-border {
     border-color: #f9c588;

src/components/Template/HandleFormItem.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="flex w-100">
+    <div class="flex flex1">
         <div class="flex1 flex">
             <el-input v-if="type === 'input'" :maxlength="item.maxlength || 50" :disabled="getDisabled()"
                 :class="getFillTypeStyle() + (orangeBg ? ' orange-bg' : '')" @blur="onBlur"
@@ -89,7 +89,8 @@ export default {
     },
     watch: {
         value(newVal) {
-            this.inputValue = newVal
+            this.inputValue = newVal;
+            console.log(newVal,"newVal")
         }
     },
     filters: {
@@ -318,10 +319,10 @@ export default {
 }
 
 .error-border {
-
     .el-input-group__prepend,input,
     textarea,
     .el-select,
+    .clickable,
     .el-date-editor {
         border-color: #f56c6c;
 
@@ -364,21 +365,25 @@ export default {
 .clickable{
     cursor: pointer;
     width: auto;
-    margin-left: 10px;
+    // margin-left: 10px;
     min-width: 100px;
     height: 28px;
     border-radius: 4px;
     border:1px solid #4ea2ff;
     display: flex;
     align-items: center;
-    justify-content: center;
+    padding:0 15px;
     font-size: 14px;
     font-weight: normal;
     color: #606266;
+    flex:1;
     &.disabled{
         cursor: not-allowed;
         color: #c0c4cc;
         background-color: #f5f7fa;
     }
+    &.error-border{
+        border-color: #f56c6c !important;
+    }
 }
 </style>

src/views/business/comps/template/comps/gy/MJYLQSQD.vue

@@ -1,30 +1,30 @@
-<!-- 试验物质配制计划表 -->
+<!-- 麻醉/精神药品配制/领取申请单 -->
 <template>
 	<div>
 		<div class="detail-container">
-			<div class="detail-title"><img src="@/assets/images/detail-title.png">试验物质配制计划表<img
+			<div class="detail-title"><img src="@/assets/images/detail-title.png">{{formData.templateMc || "麻醉/精神药品配制/领取申请单"}}<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="计划信息" />
+					<LineLabel label="基本信息" />
 					<div class="template-form-item">
-						<BaseInfoFormPcakge  ref="stepFormPackageRef" :formConfig="stepFormConfig" @blur="onHandleBlur"
+						<BaseInfoFormPcakge @clickable = "onClickSybh" ref="baseInfoRef" :formConfig="baseInfoFormConfig"
 							: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>
-					<BaseInfoFormPcakge label="特别说明" ref="remarkRef" :formConfig="remarkConig" :formData="formData" />
+					
+					<BaseInfoFormPcakge label="备注" ref="remarkRef" :formConfig="remarkConig" :formData="formData" />
 
 				</div>
 			</div>
-			<button @click="onSave">保存</button>
 		</div>
+			<SelectReagentDialog 
+			type = "MJYLQSQD"
+			title = "请选择试验/部门"
+			:searchForm="searchForm"
+			@submit="onDialogSubmit"
+			@cancel="visible=false"
+			ref="selectReagentDialogRef" :visible.sync="visible" >
+			</SelectReagentDialog>
 	</div>
 </template>
 
@@ -33,11 +33,13 @@ 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"
+import TableOpertaion from "@/components/Template/operation/TableOpertaion.vue";
+import SelectReagentDialog from "../../dialog/SelectReagentDialog.vue";
 
 export default {
 	name: "MJYLQSQD",
-	components: { BaseInfoFormPcakge, LineLabel, CustomTable, TableOpertaion },		
+	dicts:["business_gyjl","business_gynd","business_dwzs","business_dwsl","business_dwtz","business_sywzmc"],
+	components: { BaseInfoFormPcakge, LineLabel, CustomTable, TableOpertaion,SelectReagentDialog },		
 	mixins: [templateMixin],
 	props: {
 		value: {
@@ -76,7 +78,7 @@ export default {
 							type: "textarea",
 							fillType: "actFill",
 							span: 1,
-							placeholder: "请输入特别说明",
+							placeholder: "请输入备注",
 							maxlength: 1000,
 							rows: 5
 						}
@@ -88,120 +90,127 @@ export default {
 		baseInfoFormConfig() {
 			return [
 				{
-					type: "cardItem",
+					type: "step",
 					config: {
-						studyMc: {
-							label: "试验名称",
-							type: "input",
-							disabled: true,
+						syNo: {
+							label: "试验编号或部门名称",
+							type: "clickable",
+							fillType: "actFill",
 						},
-						studySn: {
-							label: "试验编号",
+						SD: {
+							label: "SD/部长",
 							type: "input",
+							fillType: "actFill",
 							disabled: true,
 						},
-
-					}
-				},
-			]
-		},
-		// 操作步骤表单配置
-		stepFormConfig() {
-			return [
-				{
-					type: "step",
-					config: {
-						drawTime: {
-							label: "领取时间",
+						sywzmc: {
+							label: "试验物质名称",
+							type: "select",
+							fillType: "actFill",
+							otherCode: "sywzmcOther",
+							options: this.getDictOptions('business_sywzmc'),
+						},
+						gyjl: {
+							label: "给药剂量",
+							type: "select",
+							fillType: "actFill",
+							otherCode: "gyjlOther",
+							options: this.getDictOptions('business_gyjl'),
+						},
+						xynd: {
+							label: "需要浓度",
+							type: "select",
+							fillType: "actFill",
+							otherCode: "xyndOther",
+							options: this.getDictOptions('business_gynd'),
+						},
+						xyl: {
+							label: "需要量",
+							type: "inputNumber",
+							fillType: "actFill",
+						},
+						xysj: {
+							label: "需要时间",
 							type: "dateTime",
 							fillType: "actFill",
 						},
-						analyzeTime: {
-							label: "分析时间",
+						yjghsj: {
+							label: "预计归还时间",
 							type: "dateTime",
 							fillType: "actFill",
 						},
-						testSubstance: {
-							label: "试验物质",
+						dwzs: {
+							label: "动物种属",
+							type: "select",
+							fillType: "actFill",
+							otherCode: "dwzsOther",
+							options: this.getDictOptions('business_dwzs'),
+						},
+						dwpjtz: {
+							label: "动物平均体重",
 							type: "input",
 							fillType: "actFill",
+							subType: "select",
+							subFillType: "actFill",
+							subKey: "dwtzUnit",
+							subOptions: this.getDictOptions('business_dwtz'),
 						},
-						configFrequency: {
-							label: "配置频率",
+						dwsl: {
+							label: "动物数量",
 							type: "input",
 							fillType: "actFill",
+							subType: "select",
+							subFillType: "actFill",
+							subKey: "dwzsUnit",
+							otherCode: "dwslOther",
+							subOptions: this.getDictOptions('business_dwsl'),
 						},
+
 					}
-				}
-			]
-		},
-		// 步骤表格列配置
-		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: [],
-
+			visible:false,
+			searchForm: {
+				symc: {
+					label:"试验名称",
+				},
+				sybh: {
+					label:"试验编号",
+				},
+				createUser: {
+					label:"创建人",
+				},
+			},
 		};
 	},
 	mounted() {
 	},
 	methods: {
-		
+		onDialogSubmit(selectedId,currentRow){
+			this.$refs.baseInfoRef.batchUpdateFormData({
+				syNo: currentRow.syNo,
+				SD: currentRow.SD,
+			});
+			console.log(currentRow,"currentRow")
+			this.visible = false;
+		},
+		// 试验编号或部门名称点击事件
+		onClickSybh() {
+			this.visible = true;
+			// this.$refs.baseInfoRef.setClickable("syNo", true);
+		},
 		async getFormData() {
-			return await this.validFormFields(["baseInfoRef", "stepFormPackageRef","stepTableRef","remarkRef"]);
+			return await this.validFormFields(["baseInfoRef","remarkRef"]);
 		},
 		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>

src/views/business/comps/template/comps/gy/SYWZPZJHB.vue

@@ -2,7 +2,7 @@
 <template>
 	<div>
 		<div class="detail-container">
-			<div class="detail-title"><img src="@/assets/images/detail-title.png">试验物质配制计划表<img
+			<div class="detail-title"><img src="@/assets/images/detail-title.png">{{formData.templateMc || "试验物质配制计划表"}}<img
 					src="@/assets/images/detail-title.png" /></div>
 			<div class="detail-content">
 				<div class="content">

src/views/business/comps/template/comps/sp/SWYPBQGZYZBB.vue

@@ -2,7 +2,7 @@
 <template>
 	<div>
 		<div class="detail-container">
-			<div class="detail-title"><img src="@/assets/images/detail-title.png">生物样品标曲工作液制备表<img
+			<div class="detail-title"><img src="@/assets/images/detail-title.png">{{formData.templateMc || $t('template.common.pageTitle')}}<img
 					src="@/assets/images/detail-title.png" /></div>
 			<div class="detail-content">
 				<div class="content">

src/views/business/comps/template/comps/sp/SWYPFXCBYPZB.vue

@@ -2,7 +2,7 @@
 <template>
 	<div>
 		<div class="detail-container">
-			<div class="detail-title"><img src="@/assets/images/detail-title.png">生物样品分析储备液配制表<img
+			<div class="detail-title"><img src="@/assets/images/detail-title.png">{{formData.templateMc || $t('template.common.pageTitle')}}<img
 					src="@/assets/images/detail-title.png" /></div>
 			<div class="detail-content">
 				<div class="content">

src/views/business/comps/template/comps/sp/SWYPFXRYPZB.vue

@@ -2,7 +2,7 @@
 <template>
 	<div>
 		<div class="detail-container">
-			<div class="detail-title"><img src="@/assets/images/detail-title.png">{{ $t('template.common.pageTitle') }}<img
+			<div class="detail-title"><img src="@/assets/images/detail-title.png">{{formData.templateMc || $t('template.common.pageTitle')}}<img
 					src="@/assets/images/detail-title.png" /></div>
 			<div class="detail-content">
 				<div class="content">

src/views/business/comps/template/comps/sp/SWYPNBGZYZBB.vue

@@ -2,7 +2,7 @@
 <template>
 	<div>
 		<div class="detail-container">
-			<div class="detail-title"><img src="@/assets/images/detail-title.png">生物样品内标工作液制备表<img
+			<div class="detail-title"><img src="@/assets/images/detail-title.png">{{formData.templateMc || $t('template.common.pageTitle')}}<img
 					src="@/assets/images/detail-title.png" /></div>
 			<div class="detail-content">
 				<div class="content">

src/views/business/comps/template/dialog/SelectReagentDialog.vue

@@ -1,13 +1,31 @@
 <template>
-    <el-dialog title="选择试剂" @close="onCancel" :visible.sync="visible" append-to-body>
-        <SelectTable :columns="columns"  
+    <el-dialog :title="title" @close="onCancel" :visible.sync="visible" append-to-body>
+        <!-- 麻醉/精神药品配制/领取申请单 -->
+         <div  v-if="type === 'MJYLQSQD'" class="header-row">
+            <el-radio-group v-model="radio">
+                <el-radio :label="1">试验</el-radio>
+                <el-radio :label="2">
+                    部门 
+                </el-radio>
+            </el-radio-group>
+              <el-select v-model="depart" filterable placeholder="请选择">
+                <el-option
+                v-for="item in options"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+                </el-option>
+            </el-select>
+         </div>
+     
+        <SelectTable v-if = "isShowTable" :columns="columns"  
             :selectedId="selectedId"
             :searchForm="searchForm"
             :listApi="listApi"
             @radioSelect="handleSelect"/>
         <template slot="footer" class="dialog-footer">
             <el-button @click="onCancel">取消</el-button>
-            <el-button :disabled="!selectedId" type="primary" @click="onSubmit">确定</el-button>
+            <el-button :disabled="isDisabled" type="primary" @click="onSubmit">确定</el-button>
         </template>
     </el-dialog>
 </template>
@@ -21,26 +39,41 @@ export default {
         SelectTable,
     },
     props: {
+        type: {
+            type: String,
+            default: "",
+        },
         visible: {
             type: Boolean,
             default: false,
         },
-    },
-    data() {
-        return {
-            listApi: getReagentList,
-            searchForm: {
-                name: {
-                    label:"试剂名称",
-                },
-                code: {
-                    label:"试剂编号",
-                },
-                vol: {
-                    label:"所属试验",
-                },
+        title: {
+            type: String,
+            default: "选择试剂",
+        },
+        listApi: {
+            type: Function,
+            default: getReagentList,
+        },
+        searchForm: {
+            type: Object,
+            default: () => {
+                return {
+                        name: {
+                            label:"试剂名称",
+                        },
+                        code: {
+                            label:"试剂编号",
+                        },
+                        vol: {
+                            label:"所属试验",
+                        },
+                    }
             },
-            columns: [
+        },
+        columns: {
+            type: Array,
+            default: () => [
                 {
                     prop: 'name',
                     label: '试剂名称',
@@ -66,7 +99,42 @@ export default {
                     label: '所属试验',
                 },
             ],
+        },
+    },
+    data() {
+        return {
             selectedId: "",
+            currentRow: {},
+            radio:1,
+            depart:"",
+            options:[
+                {
+                    value:1,
+                    label:"部门1",
+                },
+                {
+                    value:2,
+                    label:"部门",
+                },
+            ]   
+        }
+    },
+    computed: {
+        isShowTable() {
+            if(this.type === 'MJYLQSQD') {
+                return this.radio === 1;
+            }
+            return true;    
+        },
+        isDisabled() {
+            if(this.type === 'MJYLQSQD') {
+                if(this.radio === 1) {//选择试验的时候必须要选中一项才能点击确定
+                    return !this.selectedId;
+                }else{
+                    return !this.depart;
+                }
+            }
+            return !this.selectedId;
         }
     },
     methods: {
@@ -74,13 +142,29 @@ export default {
             this.$emit('cancel');
         },
         onSubmit() {
-            this.$emit('submit', this.selectedId);
+            let row = this.currentRow;
+            if(this.type === 'MJYLQSQD') {
+               if(this.radio === 1) {
+                    row = {syNo:row.ss,SD:row.code};
+               }else{
+                    const o = this.options.find(item => item.value === this.depart);
+                    row = {syNo:o.label,SD:o.value};
+               }
+            }
+            this.$emit('submit', this.selectedId,row);
         },
         handleSelect(code,row) {
             this.selectedId = code;
+            this.currentRow = row;
         },
     }
 }
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+    .header-row{
+        display: flex;
+        align-items: center;
+        padding: 20px 0;
+    }
+</style>

src/views/business/comps/template/mixins/templateMixin.js

@@ -10,13 +10,13 @@ export default {
   watch: {
     templateData: {
       immediate: true,
+      deep: true,
       handler(v) {
         if (v) {
           let n = { ...v };
           if (v.bdnr) {
             this.formData = { ...n, ...JSON.parse(v.bdnr) };
           }
-          this.templateDetail = n;
           this.setTemplateData(n);
         }
       }

src/views/business/study/comp/sqbd/Bj.vue

@@ -74,7 +74,7 @@
             </el-row>
           </el-form>
         </div>
-        <div class="content" v-show="showIndex == 2">
+        <div class="content" v-if="showIndex == 2">
           <TemplateTable ref="templateTable" :sn="form.templateSn" :templateData="form" fillType="actFill" />
         </div>
       </div>

vue.config.js

@@ -34,8 +34,8 @@ module.exports = {
     proxy: {
       // detail: https://cli.vuejs.org/config/#devserver-proxy
       [process.env.VUE_APP_BASE_API]: {
-        target: `http://localhost:8080`,
-          // target: `http://39.99.251.173:8080`,
+        // target: `http://localhost:8080`,
+          target: `http://39.99.251.173:8080`,
         changeOrigin: true,
         pathRewrite: {
           ['^' + process.env.VUE_APP_BASE_API]: ''