From 032e35e41cc81eba5da48ac82c9ce5b3fea7d614 Mon Sep 17 00:00:00 2001 From: xy <271556543@qq.com> Date: Fri, 3 Jan 2025 17:58:24 +0800 Subject: [PATCH] 1 --- .env.development | 4 +- src/utils/formBuilder.js | 88 ++++++++++++++++++++++------------ src/views/flow/DesktopForm.vue | 2 +- 3 files changed, 61 insertions(+), 33 deletions(-) diff --git a/.env.development b/.env.development index 879d33c..974c161 100644 --- a/.env.development +++ b/.env.development @@ -2,7 +2,7 @@ ENV = 'development' # base api -VUE_APP_BASE_API='https://cz-hjjc.115.langye.net' -VUE_APP_UPLOAD_API='https://cz-hjjc.115.langye.net/api/upload-file' +VUE_APP_BASE_API='http://cz-hjjc-test.115.langye.net' +VUE_APP_UPLOAD_API='http://cz-hjjc-test.115.langye.net/api/upload-file' VUE_APP_PREVIEW=//view.langye.net/preview/onlinePreview VUE_APP_MODULE_NAME=oa diff --git a/src/utils/formBuilder.js b/src/utils/formBuilder.js index 631e856..8bdecbc 100644 --- a/src/utils/formBuilder.js +++ b/src/utils/formBuilder.js @@ -16,6 +16,7 @@ import { flowList } from "@/api/flow"; * @return {VNode} 主表单包含el-form-item 子表单表单组件 **/ export default function formBuilder(device, info, h, row, pWrite = false,pReadable = false,pname) { + let target = row ? row : this.form let formItem; //下拉选项 let options = []; @@ -183,17 +184,26 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab }); break; case "select": + const getSelectValue = () => { + if (!!info.multiple) { + return target[info.name] ? target[info.name].toString()?.split(/,|\|/).map(i => isNaN(Number(i)) ? i : Number(i)) : [] + } else { + return target[info.name] + } + } formItem = h( formBuilderMap(device).get(info.type), { props: { - value: row ? row[info.name] : this.form[info.name], + value: getSelectValue(), clearable: true, placeholder: info.help_text, multiple: !!info.multiple, 'multiple-limit': info.multiple, + 'collapse-tags': true, filterable: true, - 'allow-create': !!info.is_select2_tag + 'allow-create': !!info.is_select2_tag, + 'default-first-option': true }, style: { width: "100%", @@ -203,9 +213,7 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab }, on: { input: (e) => { - row - ? this.$set(row, info.name, e) - : this.$set(this.form, info.name, e); + this.$set(target, info.name, e.toString()) }, }, }, @@ -263,6 +271,7 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab 'limit-size': uploadSize / 1024 / 1024, // vxeupload 单位Mb 'limit-count': info.multiple ? 20 : 1, multiple: !!info.multiple, + 'name-field': 'original_name', readonly: pReadable, 'upload-method': ({ file }) => { const formData = new FormData() @@ -281,14 +290,21 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab row[info.name].push({ response: response.data.data, name: response.data.data.original_name, - url: response.data.data.url + url: response.data.data.url, + original_name: response.data.data.original_name }) + if (row[info.name].length > (info.multiple ? 20 : 1)) { + row[info.name].shift() + } } else { this.$message.error("上传失败") } }).catch(err => { window.$_uploading = false }) + }, + 'remove-method': _ => { + row[info.name] = [] } } } @@ -444,7 +460,7 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab formBuilderMap(device).get(info.type), { props: { - value: row ? (row[info.name] ? row[info.name].toString()?.split(',').map(i => Number(i)) : []) : (this.form[info.name] ? this.form[info.name].toString()?.split(',').map(i => Number(i)) : []), + value: row ? (row[info.name] ? row[info.name].toString()?.split(/,|\|/).map(i => isNaN(Number(i)) ? i : Number(i)) : []) : (this.form[info.name] ? this.form[info.name].toString()?.split(/,|\|/).map(i => Number(i)) : []), clearable: true, placeholder: info.help_text, multiple: !!info.multiple, @@ -480,7 +496,7 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab formBuilderMap(device).get(info.type), { props: { - value: row ? row[info.name] : this.form[info.name], + value: row ? (row[info.name] ? row[info.name].toString()?.split(/,|\|/).map(i => isNaN(Number(i)) ? i : Number(i)) : []) : (this.form[info.name] ? this.form[info.name].toString()?.split(/,|\|/).map(i => isNaN(Number(i)) ? i : Number(i)) : []), clearable: true, placeholder: info.help_text, multiple: true, @@ -495,8 +511,8 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab on: { input: (e) => { row - ? this.$set(row, info.name, e) - : this.$set(this.form, info.name, e); + ? this.$set(row, info.name, e.toString()) + : this.$set(this.form, info.name, e.toString()); }, }, }, @@ -685,13 +701,13 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab false, ); }, - [subField.type === 'file' ? 'default' : false]: ({ row: myrow }) => { + [['file', 'choices', 'choice', 'select', 'radio'].indexOf(subField.type) !== -1 ? 'default' : false]: ({ row: myrow }) => { return formBuilder.bind(this)( device, subField, h, myrow, - info._writeable, + false, true, ); } @@ -712,7 +728,7 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab color: "#333", }, }, - this.form[info.name] ? moment(this.form[info.name]).format("YYYY年MM月DD日") : '' + target[info.name] ? moment(target[info.name]).format("YYYY年MM月DD日") : '' ); break; case "datetime": @@ -723,14 +739,31 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab color: "#333", }, }, - this.form[info.name] ? moment(this.form[info.name]).format("YYYY年MM月DD日 HH时mm分") : '' + target[info.name] ? moment(target[info.name]).format("YYYY年MM月DD日 HH时mm分") : '' ); break; case "select": + const getDetailSelectValue = () => { + let res = '' + if (!!info.multiple) { + res = target[info.name] ? target[info.name].toString()?.split(/,|\|/).map(i => isNaN(Number(i)) ? i : Number(i)) : [] + } else { + res = target[info.name] + } + if (res instanceof Array) { + return options?.filter((i) => + typeof i === "object" + ? res.indexOf(i.id) !== -1 + : res.indexOf(i) !== -1 + )?.map(i => typeof i === 'object' ? i.name : i)?.toString() + } else { + return res + } + } let findValue = options.find((i) => typeof i === "object" - ? i.id == this.form[info.name] - : i === this.form[info.name] + ? i.id == target[info.name] + : i === target[info.name] ); formItem = h( "span", @@ -739,13 +772,7 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab color: "#333", }, }, - info.multiple ? this.form[info.name]?.toString()?.split(/,|\|/)?.map(j => { - return options.find((i) => - typeof i === "object" - ? i.id == j - : i === j - )?.name; - })?.toString() : typeof findValue === "object" ? findValue.name : findValue + getDetailSelectValue() ); break; case "choice": @@ -756,7 +783,7 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab color: "#333", }, }, - this.form[info.name]?.toString()?.split(/,|\|/).map(j => { + target[info.name]?.toString()?.split(/,|\|/).map(j => { return options.find((i) => i.id == j)?.name; })?.toString() ); @@ -764,8 +791,8 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab case "choices": let findChoicesValue = options.find((i) => typeof i === "object" - ? i.id == this.form[info.name] - : i === this.form[info.name] + ? i.id == target[info.name] + : i === target[info.name] ); formItem = h( "span", @@ -774,7 +801,7 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab color: "#333", }, }, - info.multiple ? this.form[info.name]?.toString()?.split(/,|\|/).map(j => { + info.multiple ? target[info.name]?.toString()?.split(/,|\|/).map(j => { return options.find((i) => typeof i === "object" ? i.id == j @@ -802,7 +829,7 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab color: "#333", }, }, - this.form[info.name]?.toString()?.split(',')?.map(j => { + target[info.name]?.toString()?.split(',')?.map(j => { let flow = this.flows[info.name]?.find((i) => i.id == j ) @@ -841,6 +868,7 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab ); break; case "file": + console.log(row ? row[info.name] : '') formItem = row ? h( 'vxe-upload', @@ -928,7 +956,7 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab color: "#333", }, }, - this.form[info.name] + target[info.name] ); } } @@ -1053,7 +1081,7 @@ export default function formBuilder(device, info, h, row, pWrite = false,pReadab value: row ? row[info.name] : this.form[info.name], clearable: true, placeholder: info.help_text, - rules: myRules.map(rule => { + rules: myRules?.map(rule => { if (rule.hasOwnProperty('required')) { return rule } else if (rule.hasOwnProperty('pattern')) { diff --git a/src/views/flow/DesktopForm.vue b/src/views/flow/DesktopForm.vue index 8870737..9444161 100644 --- a/src/views/flow/DesktopForm.vue +++ b/src/views/flow/DesktopForm.vue @@ -273,7 +273,7 @@ export default { props: { model: this.form, "label-position": "right", - "label-width": "120px", + "label-width": "140px", rules: this.rules, "inline-message": true, },