test #47
@@ -38,80 +38,7 @@
 | 
			
		||||
			@close="cancel"
 | 
			
		||||
			@cancel="cancel"
 | 
			
		||||
			@confirm="submitForm">
 | 
			
		||||
			<DialogForm
 | 
			
		||||
				v-if="open"
 | 
			
		||||
				ref="form"
 | 
			
		||||
				:dataForm="form"
 | 
			
		||||
				:rows="[
 | 
			
		||||
					[
 | 
			
		||||
						{
 | 
			
		||||
							select: true,
 | 
			
		||||
							label: '产线',
 | 
			
		||||
							url: '/base/production-line/listAll',
 | 
			
		||||
							prop: 'productionId',
 | 
			
		||||
							rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
							bind: {
 | 
			
		||||
								filterable: true,
 | 
			
		||||
							},
 | 
			
		||||
						},
 | 
			
		||||
					],
 | 
			
		||||
					[
 | 
			
		||||
						{
 | 
			
		||||
							select: true,
 | 
			
		||||
							label: '工段',
 | 
			
		||||
							url: '/base/workshop-section/listAll',
 | 
			
		||||
							prop: 'sectionId',
 | 
			
		||||
							rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
						},
 | 
			
		||||
						// {
 | 
			
		||||
						// 	select: true,
 | 
			
		||||
						//   url: '', //
 | 
			
		||||
						// 	label: '检测内容',
 | 
			
		||||
						// 	prop: 'inspectionDetContent',
 | 
			
		||||
						// 	rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
						// },
 | 
			
		||||
					],
 | 
			
		||||
					[
 | 
			
		||||
						{
 | 
			
		||||
							input: true,
 | 
			
		||||
							label: '按钮盒识别码',
 | 
			
		||||
							prop: 'buttonId',
 | 
			
		||||
							rules: [
 | 
			
		||||
								{
 | 
			
		||||
									type: 'number',
 | 
			
		||||
									message: '请输入数字',
 | 
			
		||||
									trigger: 'blur',
 | 
			
		||||
									transform: (val) => Number(val),
 | 
			
		||||
								},
 | 
			
		||||
							],
 | 
			
		||||
						},
 | 
			
		||||
					],
 | 
			
		||||
					[{ input: true, label: '按钮盒模式', prop: 'model' }],
 | 
			
		||||
					[
 | 
			
		||||
						{
 | 
			
		||||
							input: true,
 | 
			
		||||
							label: '按钮值',
 | 
			
		||||
							prop: 'keyValue',
 | 
			
		||||
							rules: [
 | 
			
		||||
								{
 | 
			
		||||
									type: 'number',
 | 
			
		||||
									message: '请输入100以内的数字',
 | 
			
		||||
									trigger: 'blur',
 | 
			
		||||
									transform: (val) => Number(val) <= 100 && Number(val),
 | 
			
		||||
								},
 | 
			
		||||
							],
 | 
			
		||||
							bind: { type: 'number', min: 0, max: 100 },
 | 
			
		||||
						},
 | 
			
		||||
					],
 | 
			
		||||
					[
 | 
			
		||||
						{
 | 
			
		||||
							textarea: true,
 | 
			
		||||
							label: '检测内容',
 | 
			
		||||
							prop: 'inspectionDetContent',
 | 
			
		||||
							rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
						},
 | 
			
		||||
					],
 | 
			
		||||
				]" />
 | 
			
		||||
			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" />
 | 
			
		||||
		</base-dialog>
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
@@ -134,6 +61,69 @@ export default {
 | 
			
		||||
	components: {},
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			rows: [
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						select: true,
 | 
			
		||||
						label: '产线',
 | 
			
		||||
						url: '/base/production-line/listAll',
 | 
			
		||||
						prop: 'productionId',
 | 
			
		||||
						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
						bind: {
 | 
			
		||||
							filterable: true,
 | 
			
		||||
						},
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						select: true,
 | 
			
		||||
						label: '工段',
 | 
			
		||||
						url: '/base/workshop-section/listAll',
 | 
			
		||||
						prop: 'sectionId',
 | 
			
		||||
						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						input: true,
 | 
			
		||||
						label: '按钮盒识别码',
 | 
			
		||||
						prop: 'buttonId',
 | 
			
		||||
						rules: [
 | 
			
		||||
							{
 | 
			
		||||
								type: 'number',
 | 
			
		||||
								message: '请输入数字',
 | 
			
		||||
								trigger: 'blur',
 | 
			
		||||
								transform: (val) => Number(val),
 | 
			
		||||
							},
 | 
			
		||||
						],
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[{ input: true, label: '按钮盒模式', prop: 'model' }],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						input: true,
 | 
			
		||||
						label: '按钮值',
 | 
			
		||||
						prop: 'keyValue',
 | 
			
		||||
						rules: [
 | 
			
		||||
							{
 | 
			
		||||
								type: 'number',
 | 
			
		||||
								message: '请输入100以内的数字',
 | 
			
		||||
								trigger: 'blur',
 | 
			
		||||
								transform: (val) => Number(val) <= 100 && Number(val),
 | 
			
		||||
							},
 | 
			
		||||
						],
 | 
			
		||||
						bind: { type: 'number', min: 0, max: 100 },
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						textarea: true,
 | 
			
		||||
						label: '检测内容',
 | 
			
		||||
						prop: 'inspectionDetContent',
 | 
			
		||||
						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
			],
 | 
			
		||||
			searchBarFormConfig: [
 | 
			
		||||
				{
 | 
			
		||||
					type: 'input',
 | 
			
		||||
 
 | 
			
		||||
@@ -108,6 +108,18 @@ export default {
 | 
			
		||||
			},
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	watch: {
 | 
			
		||||
		rows: {
 | 
			
		||||
			handler() {
 | 
			
		||||
				console.log('watch triggered!');
 | 
			
		||||
				this.$nextTick(() => {
 | 
			
		||||
					this.handleOptions('watch');
 | 
			
		||||
				});
 | 
			
		||||
			},
 | 
			
		||||
			deep: true,
 | 
			
		||||
			immediate: false,
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	mounted() {
 | 
			
		||||
		// 处理 options
 | 
			
		||||
		this.handleOptions();
 | 
			
		||||
@@ -125,32 +137,18 @@ export default {
 | 
			
		||||
			const response = await this.$axios(url);
 | 
			
		||||
			return response.data;
 | 
			
		||||
		},
 | 
			
		||||
		handleOptions() {
 | 
			
		||||
		async handleOptions(trigger = 'monuted') {
 | 
			
		||||
			// console.log("[dialogForm:handleOptions]")
 | 
			
		||||
			const promiseList = [];
 | 
			
		||||
			this.rows.forEach((cols) => {
 | 
			
		||||
				cols.forEach(async (opt) => {
 | 
			
		||||
					if (opt.onChange) {
 | 
			
		||||
						this.$watch(`form.${opt.prop}`, {
 | 
			
		||||
							handler: (val) => {
 | 
			
		||||
								this.$emit(opt.onChange.emit, val);
 | 
			
		||||
							},
 | 
			
		||||
							immediate: true,
 | 
			
		||||
						});
 | 
			
		||||
					}
 | 
			
		||||
					if (opt.listen) {
 | 
			
		||||
						// 注册监听时间
 | 
			
		||||
						this.$on(opt.listen, (val) => {
 | 
			
		||||
							alert(val);
 | 
			
		||||
						});
 | 
			
		||||
					}
 | 
			
		||||
					if (opt.value) {
 | 
			
		||||
				cols.forEach((opt) => {
 | 
			
		||||
					if (opt.value && !this.form[opt.prop]) {
 | 
			
		||||
						// 默认值
 | 
			
		||||
						this.form[opt.prop] = opt.value;
 | 
			
		||||
					}
 | 
			
		||||
 | 
			
		||||
					if (opt.options) {
 | 
			
		||||
						this.optionListOf[opt.prop] = opt.options;
 | 
			
		||||
						this.$set(this.optionListOf, opt.prop, opt.options);
 | 
			
		||||
					} else if (opt.url) {
 | 
			
		||||
						// 如果是下拉框,或者新增模式下的输入框,才去请求
 | 
			
		||||
						if (opt.select || (opt.input && !this.form?.id)) {
 | 
			
		||||
@@ -179,19 +177,23 @@ export default {
 | 
			
		||||
								}
 | 
			
		||||
							});
 | 
			
		||||
						}
 | 
			
		||||
						try {
 | 
			
		||||
							// this.formLoading = true;
 | 
			
		||||
							// console.log("[dialogForm:handleOptions:promiseList]", promiseList)
 | 
			
		||||
							await Promise.all(promiseList.map((fn) => fn()));
 | 
			
		||||
							this.formLoading = false;
 | 
			
		||||
							// console.log("[dialogForm:handleOptions:optionListOf]", this.optionListOf)
 | 
			
		||||
						} catch (error) {
 | 
			
		||||
							console.log('[dialogForm:handleOptions:error]', error);
 | 
			
		||||
							this.formLoading = false;
 | 
			
		||||
						}
 | 
			
		||||
					}
 | 
			
		||||
				});
 | 
			
		||||
			});
 | 
			
		||||
 | 
			
		||||
			// 如果是 watch 触发的,不需要执行进一步的请求
 | 
			
		||||
			if (trigger == 'watch') {
 | 
			
		||||
				this.formLoading = false;
 | 
			
		||||
				return;
 | 
			
		||||
			}
 | 
			
		||||
			try {
 | 
			
		||||
				await Promise.all(promiseList.map((fn) => fn()));
 | 
			
		||||
				this.formLoading = false;
 | 
			
		||||
				// console.log("[dialogForm:handleOptions:optionListOf]", this.optionListOf)
 | 
			
		||||
			} catch (error) {
 | 
			
		||||
				console.log('[dialogForm:handleOptions:error]', error);
 | 
			
		||||
				this.formLoading = false;
 | 
			
		||||
			}
 | 
			
		||||
			if (!promiseList.length) this.formLoading = false;
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
 
 | 
			
		||||
@@ -38,107 +38,7 @@
 | 
			
		||||
			@close="cancel"
 | 
			
		||||
			@cancel="cancel"
 | 
			
		||||
			@confirm="submitForm">
 | 
			
		||||
			<DialogForm
 | 
			
		||||
				v-if="open"
 | 
			
		||||
				ref="form"
 | 
			
		||||
				:dataForm="form"
 | 
			
		||||
				:rows="[
 | 
			
		||||
					[
 | 
			
		||||
						{
 | 
			
		||||
							select: true,
 | 
			
		||||
							label: '检测内容ID',
 | 
			
		||||
							url: '/base/quality-inspection-det/listAll',
 | 
			
		||||
							prop: 'inspectionDetId',
 | 
			
		||||
							labelKey: 'content',
 | 
			
		||||
							rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
							bind: {
 | 
			
		||||
								filterable: true,
 | 
			
		||||
							},
 | 
			
		||||
						},
 | 
			
		||||
						{
 | 
			
		||||
							select: true,
 | 
			
		||||
							label: '来源',
 | 
			
		||||
							prop: 'source',
 | 
			
		||||
							value: 1, // 默认手动
 | 
			
		||||
							options: [
 | 
			
		||||
								{ label: '手动', value: 1 },
 | 
			
		||||
								{ label: '自动', value: 2 },
 | 
			
		||||
							],
 | 
			
		||||
							bind: {
 | 
			
		||||
								filterable: true,
 | 
			
		||||
							},
 | 
			
		||||
						},
 | 
			
		||||
						// {
 | 
			
		||||
						// 	input: true,
 | 
			
		||||
						// 	label: '',
 | 
			
		||||
						// 	prop: 'buttonId',
 | 
			
		||||
						// 	rules: [
 | 
			
		||||
						// 		{
 | 
			
		||||
						// 			type: 'number',
 | 
			
		||||
						// 			message: '请输入数字',
 | 
			
		||||
						// 			trigger: 'blur',
 | 
			
		||||
						// 			transform: (val) => Number(val),
 | 
			
		||||
						// 		},
 | 
			
		||||
						// 	],
 | 
			
		||||
						// },
 | 
			
		||||
					],
 | 
			
		||||
					[
 | 
			
		||||
						// 此方案必须,工段(含listen)字段必须在产线字段(含onChange)之前
 | 
			
		||||
						{
 | 
			
		||||
							select: true,
 | 
			
		||||
							label: '工段',
 | 
			
		||||
							url: '/base/workshop-section/listAll',
 | 
			
		||||
							prop: 'sectionId',
 | 
			
		||||
							listen: 'productionLineChange', // 对应上面 emit
 | 
			
		||||
							rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
						},
 | 
			
		||||
						{
 | 
			
		||||
							select: true,
 | 
			
		||||
							label: '产线',
 | 
			
		||||
							url: '/base/production-line/listAll',
 | 
			
		||||
							prop: 'productionLineId',
 | 
			
		||||
							onChange: { emit: 'productionLineChange' },
 | 
			
		||||
							rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
						},
 | 
			
		||||
					],
 | 
			
		||||
					[
 | 
			
		||||
						{
 | 
			
		||||
							input: true,
 | 
			
		||||
							label: '检测人员',
 | 
			
		||||
							prop: 'checkPerson',
 | 
			
		||||
							rules: [
 | 
			
		||||
								// {
 | 
			
		||||
								// 	type: 'number',
 | 
			
		||||
								// 	message: '请输入数字',
 | 
			
		||||
								// 	trigger: 'blur',
 | 
			
		||||
								// 	transform: (val) => Number(val),
 | 
			
		||||
								// },
 | 
			
		||||
							],
 | 
			
		||||
						},
 | 
			
		||||
						{
 | 
			
		||||
							datetime: true,
 | 
			
		||||
							label: '检测时间',
 | 
			
		||||
							prop: 'checkTime',
 | 
			
		||||
							bind: {
 | 
			
		||||
								format: 'yyyy-MM-dd HH:mm:ss',
 | 
			
		||||
								'value-format': 'timestamp',
 | 
			
		||||
								// 'value-format': 'yyyy-MM-dd HH:mm:ss',
 | 
			
		||||
								clearable: true,
 | 
			
		||||
							},
 | 
			
		||||
						},
 | 
			
		||||
					],
 | 
			
		||||
					[
 | 
			
		||||
						{
 | 
			
		||||
							textarea: true,
 | 
			
		||||
							label: '检测内容',
 | 
			
		||||
							prop: 'inspectionDetContent',
 | 
			
		||||
							value: '',
 | 
			
		||||
							rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
						},
 | 
			
		||||
					],
 | 
			
		||||
					[{ textarea: true, label: '描述', prop: 'explainText' }],
 | 
			
		||||
					[{ input: true, label: '备注', prop: 'remark' }],
 | 
			
		||||
				]" />
 | 
			
		||||
			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" />
 | 
			
		||||
		</base-dialog>
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
@@ -164,6 +64,80 @@ export default {
 | 
			
		||||
	mixins: [basicPageMixin],
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			rows: [
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						select: true,
 | 
			
		||||
						label: '检测内容ID',
 | 
			
		||||
						url: '/base/quality-inspection-det/listAll',
 | 
			
		||||
						prop: 'inspectionDetId',
 | 
			
		||||
						labelKey: 'content',
 | 
			
		||||
						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
						bind: {
 | 
			
		||||
							filterable: true,
 | 
			
		||||
						},
 | 
			
		||||
					},
 | 
			
		||||
					{
 | 
			
		||||
						select: true,
 | 
			
		||||
						label: '来源',
 | 
			
		||||
						prop: 'source',
 | 
			
		||||
						value: 1, // 默认手动
 | 
			
		||||
						options: [
 | 
			
		||||
							{ label: '手动', value: 1 },
 | 
			
		||||
							{ label: '自动', value: 2 },
 | 
			
		||||
						],
 | 
			
		||||
						bind: {
 | 
			
		||||
							filterable: true,
 | 
			
		||||
						},
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						select: true,
 | 
			
		||||
						label: '产线',
 | 
			
		||||
						url: '/base/production-line/listAll',
 | 
			
		||||
						prop: 'productionLineId',
 | 
			
		||||
						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
					},
 | 
			
		||||
					{
 | 
			
		||||
						select: true,
 | 
			
		||||
						label: '工段',
 | 
			
		||||
						url: '/base/workshop-section/listAll', // 这个 url 其实可加可不加,因为下面会更新 options
 | 
			
		||||
						options: [], // 这个options也可加可不加, 因为下面会更新 options
 | 
			
		||||
						prop: 'sectionId',
 | 
			
		||||
						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						input: true,
 | 
			
		||||
						label: '检测人员',
 | 
			
		||||
						prop: 'checkPerson',
 | 
			
		||||
					},
 | 
			
		||||
					{
 | 
			
		||||
						datetime: true,
 | 
			
		||||
						label: '检测时间',
 | 
			
		||||
						prop: 'checkTime',
 | 
			
		||||
						bind: {
 | 
			
		||||
							format: 'yyyy-MM-dd HH:mm:ss',
 | 
			
		||||
							'value-format': 'timestamp',
 | 
			
		||||
							// 'value-format': 'yyyy-MM-dd HH:mm:ss',
 | 
			
		||||
							clearable: true,
 | 
			
		||||
						},
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						textarea: true,
 | 
			
		||||
						label: '检测内容',
 | 
			
		||||
						prop: 'inspectionDetContent',
 | 
			
		||||
						value: '',
 | 
			
		||||
						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[{ textarea: true, label: '描述', prop: 'explainText' }],
 | 
			
		||||
				[{ input: true, label: '备注', prop: 'remark' }],
 | 
			
		||||
			],
 | 
			
		||||
			searchBarFormConfig: [
 | 
			
		||||
				{
 | 
			
		||||
					type: 'select',
 | 
			
		||||
@@ -296,6 +270,31 @@ export default {
 | 
			
		||||
		this.getList();
 | 
			
		||||
		this.getProductLineList();
 | 
			
		||||
	},
 | 
			
		||||
	watch: {
 | 
			
		||||
		// 注册弹窗里产线改变时的监听事件
 | 
			
		||||
		'form.productionLineId': {
 | 
			
		||||
			handler: function (val) {
 | 
			
		||||
				if (val == null) return;
 | 
			
		||||
				this.$axios('/base/workshop-section/listByParentId', {
 | 
			
		||||
					params: {
 | 
			
		||||
						id: val,
 | 
			
		||||
					},
 | 
			
		||||
				}).then((response) => {
 | 
			
		||||
					this.$set(
 | 
			
		||||
						this.rows[1][1], // 这里索引是硬编码,所以当 this.rows 里数据顺序改变时,此处也要改
 | 
			
		||||
						'options',
 | 
			
		||||
						response.data.map((item) => {
 | 
			
		||||
							return {
 | 
			
		||||
								label: item.name,
 | 
			
		||||
								value: item.id,
 | 
			
		||||
							};
 | 
			
		||||
						})
 | 
			
		||||
					);
 | 
			
		||||
				});
 | 
			
		||||
			},
 | 
			
		||||
			immediate: true,
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		/** 获取搜索栏的产线列表 */
 | 
			
		||||
		getProductLineList() {
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user