src/components/base-dialog/addOrUpdate/index.vue

@@ -6,14 +6,14 @@
 				<el-col v-for="c in COLUMN_PER_ROW" :key="`${n}+'col'+${c}`" :span="24 / COLUMN_PER_ROW">
 					<el-form-item
 						v-if="configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)]"
-						:prop="configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].name || configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)]"
+						:prop="configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].name"
 						:key="`${n}-col-${c}-item`"
 						:label="getLabel(n, c)"
 					>
 						<!-- 暂时先不实现部分输入方式 -->
 						<el-input
 							v-if="getType(n, c) === 'input'"
-							:placeholder="configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].placeholder || ''"
+							:placeholder="configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].placeholder || '...'"
 							v-model="dataForm[configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].name]"
 						/>
 						<el-radio v-if="getType(n, c) === 'radio'"></el-radio>
@@ -127,68 +127,64 @@ export default {
 			// 本组件只实现了'一行两列'的表单布局
 			return Math.ceil(this.configs.fields.length / COLUMN_PER_ROW)
 		}
-		// computedModel: {
-		// 	get(n, c) {
-		// 		return this.configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].name
-		// 			? dataForm[configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].name]
-		// 			: dataForm[configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)]]
-		// 	},
-		// 	set() {}
-		// }
 	},
 	mounted() {
 		this.$nextTick(() => {
+			/** 转换 configs.fields 的结构，把纯字符串转为对象 */
+			this.configs.fields = this.configs.fields.map(item => {
+				if (typeof item === 'string') {
+					return { name: item }
+				}
+				return item
+			})
+
 			/** 动态设置dataForm字段 */
 			this.configs.fields.forEach(item => {
-				if (typeof item === 'string') {
-					this.$set(this.dataForm, [item], '')
-				} else if (typeof item === 'object') {
-					this.$set(this.dataForm, [item.name], '')
-					if (item.api) {
-						/** 自动请求并填充 */
-						this.$http({
-							url: this.$http.adornUrl(item.api),
-							methods: 'get'
-						}).then(({ data: res }) => {
-							if (data & (data.code === 0)) {
-								this.dataFrom[item.name] = res.data // <=== 此处需要对接口
-							}
-						})
-					} // end if (item.api)
+				this.$set(this.dataForm, [item.name], '')
+				if (item.api) {
+					/** 自动请求并填充 */
+					this.$http({
+						url: this.$http.adornUrl(item.api),
+						methods: 'get'
+					}).then(({ data: res }) => {
+						if (data & (data.code === 0)) {
+							this.dataFrom[item.name] = res.data // <=== 此处需要对接口
+						}
+					})
+				} // end if (item.api)
 
-					if (item.required) {
-						const requiredRule = {
-							required: true,
-							message: '请输入必填项',
-							trigger: 'change'
+				if (item.required) {
+					const requiredRule = {
+						required: true,
+						message: '请输入必填项',
+						trigger: 'change'
+					}
+					/** 检查是否已经存在该字段的规则 */
+					const exists = this.dataFormRules[item.name] || null
+					/** 设置验证规则  */
+					if (exists) {
+						const unset = true
+						for (const rule of exists) {
+							if (rule.required) unset = false
 						}
-						/** 检查是否已经存在该字段的规则 */
-						const exists = this.dataFormRules[item.name] || null
-						/** 设置验证规则  */
-						if (exists) {
-							const unset = true
-							for (const rule of exists) {
-								if (rule.required) unset = false
-							}
-							if (unset) {
-								exists.push(requiredRule)
-							}
-						} else {
-							/** 不存在已有规则 */
-							this.$set(this.dataFormRules, [item.name], [requiredRule])
+						if (unset) {
+							exists.push(requiredRule)
 						}
-					} // end if (item.required)
+					} else {
+						/** 不存在已有规则 */
+						this.$set(this.dataFormRules, [item.name], [requiredRule])
+					}
+				} // end if (item.required)
 
-					if (item.rules) {
-						const exists = this.dataFormRules[item.name] || null
-						if (exists) {
-							// 浅拷贝过去
-							exists.push(...item.rules)
-						} else {
-							this.$set(this.dataFormRules, [item.name], [...item.rules])
-						}
-					} // end if (item.rules)
-				}
+				if (item.rules) {
+					const exists = this.dataFormRules[item.name] || null
+					if (exists) {
+						// 浅拷贝过去
+						exists.push(...item.rules)
+					} else {
+						this.$set(this.dataFormRules, [item.name], [...item.rules])
+					}
+				} // end if (item.rules)
 			})
 
 			/** 检查是否需要额外的组件 */
@@ -225,7 +221,7 @@ export default {
 			const opt = this.configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)]
 			if (opt) {
 				// if opt is valid
-				return typeof opt === 'string' ? this.defaultNames[opt] : opt.label ? opt.label : this.defaultNames[opt.name]
+				return opt.label ? opt.label : this.defaultNames[opt.name]
 			}
 		},
 		getType(n, c) {