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

@@ -58,7 +58,14 @@
 				/>
 				<div v-else style="background: #eee; border-radius: 8px; height: 200px;">
 					<el-row>
-						<el-form ref="AttrForm" :model="AttrForm" :rules="AttrFormRules"></el-form>
+						<el-form ref="AttrForm" :model="AttrForm" :rules="AttrFormRules">
+							<el-form-item v-for="field in attrFormFields" :key="field.prop" :prop="field.prop" :label="field.name">
+								<!-- 子窗口只给input吧，太麻烦了，有特殊需求就不用这个组件了 -->
+								<el-input v-model="AttrForm[field.prop]" clearable />
+								<!-- TODO: mounted里初始化AttrForm，configs里设置AttrFormRules，mounted里设置attrFormFields -->
+								<!-- TODO: 单独用一个组件来展示动态属性这一部分 -->
+							</el-form-item>
+						</el-form>
 					</el-row>
 					<el-row>
 						<el-button size="small" @click="showAddAttr = false">取消</el-button>
@@ -122,6 +129,7 @@ export default {
 	props: {
 		configs: {
 			/**
+			 * TODO: 定义及使用方式，应改用README.md文件记录
 			 * type: 'dialog' | 'drawer' | 'page'
 			 * fields: Array<string|object>
 			 * - fields.object: { name, type: 'number'|'textarea'|'select'|'date'|.., required: boolean,  validator: boolean(是否需要验证), [options]: any[], api: string(自动获取数据的接口，一般为getcode接口)}
@@ -161,7 +169,8 @@ export default {
 				// add more...
 			},
 			defaultPlaceholders: {}, // 自动根据 defaultNames 计算得来
-			/** 表单相关属性 */	
+			/** 表单相关属性 */
+
 			visible: false,
 			isEdit: false,
 			isDetail: false,
@@ -254,27 +263,12 @@ export default {
 
 			/** 单独设置 id */
 			this.$set(this.dataForm, 'id', null)
-
-			// TODO：delete next lines
-			console.log('dataform: ', this.dataForm)
-			console.log('rules: ', this.dataFormRules)
 		})
 	},
 	updated() {
 		this.isUpdated = true // 此时如果点击保存就会 emit(refreshDataList)
 	},
-	// beforeDestroy() {
+
-	// 缓存比较方案：
-	// 在组件快要销毁时，比较localStorage和dataForm里的值
-	// 如果有改变则 emit
-	// 否则直接销毁
-	// 清除localStorage里的缓存
-	// if (cached && compareCache(this.dataForm, localStorage...) || !isEdit) {
-	//   // 如果是编辑页面，并且已经更新了内容；或者是新增页面，就emit刷新列表
-	//   clearCache()
-	//   this.$emit('refreshDataList')
-	// }
-	// },
 	methods: {
 		getLabel(n, c) {
 			const opt = this.configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)]

src/views/modules/monitoring/product.vue

@@ -161,8 +161,8 @@ const addOrUpdateConfigs = {
 		tableConfigs: [
 			{ type: 'index', name: '序号' },
 			{ prop: 'createTime', name: '添加时间', filter: val => (val ? moment(val).format('YYYY-MM-DD hh:mm:ss') : '-') },
-			{ prop: 'name', name: '属性名' },
+			{ prop: 'name', name: '属性名', formField: true },
-			{ prop: 'code', name: '属性值' },
+			{ prop: 'code', name: '属性值', formField: true },
 			{ prop: 'operations', name: '操作', fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
 		]
 	}