Showing
4 changed files
with
500 additions
and
233 deletions
src/hooks/queryFormData.js
0 → 100644
| 1 | +/* | ||
| 2 | + * @Date: 2024-08-14 13:22:31 | ||
| 3 | + * @LastEditors: hookehuyr hookehuyr@gmail.com | ||
| 4 | + * @LastEditTime: 2024-08-14 13:37:52 | ||
| 5 | + * @FilePath: /data-table/src/hooks/queryFormData.js | ||
| 6 | + * @Description: 文件描述 | ||
| 7 | + */ | ||
| 8 | +import { queryFormAPI } from "@/api/form.js"; | ||
| 9 | +import { Cookies, $, _, axios, storeToRefs, mainStore, Toast, useTitle, } from "@/utils/generatePackage.js"; | ||
| 10 | + | ||
| 11 | +// 获取表单设置 | ||
| 12 | +const store = mainStore(); | ||
| 13 | +const { formSetting, formInfo, successInfo } = storeToRefs(store); | ||
| 14 | + | ||
| 15 | +const form_name = ref('') | ||
| 16 | +const form_code = $route.query.code ? $route.query.code : ''; | ||
| 17 | +const page_type = $route.query.page_type ? $route.query.page_type : 'add'; | ||
| 18 | +const data_id = $route.query.data_id ? $route.query.data_id : null; | ||
| 19 | +const flow_node_code = $route.query.flow_node_code ? $route.query.flow_node_code :formSetting.value.flow_node_code; // flow_node_code 表示随机选择的流程节点的ID | ||
| 20 | +// 强制后台检查标识 | ||
| 21 | +const force_back = $route.query.force_back ? $route.query.force_back : ''; | ||
| 22 | + | ||
| 23 | +const form_flow_process_list = ref([]); | ||
| 24 | +const active_flow_process = ref([]); | ||
| 25 | + | ||
| 26 | +const PHeader = ref({}); | ||
| 27 | +const PCommit = ref({}); | ||
| 28 | + | ||
| 29 | +const { data, flow_process_list, code } = await queryFormAPI({ form_code, page_type, data_id, flow_node_code, force_back }); // flow_node_code 表示随机选择的流程节点的ID | ||
| 30 | +const form_data = data; | ||
| 31 | +// 处理审批意见显示 | ||
| 32 | +if (code) { | ||
| 33 | + setTimeout(() => { | ||
| 34 | + form_flow_process_list.value = flow_process_list; // 上中下游节点的审批意见 | ||
| 35 | + if (flow_process_list?.length) { | ||
| 36 | + active_flow_process.value.push(flow_process_list[0]['created_time']); | ||
| 37 | + // nextTick(() => { | ||
| 38 | + // // 全部展开 | ||
| 39 | + // collapseRef.value?.toggleAll(true); | ||
| 40 | + // }) | ||
| 41 | + } | ||
| 42 | + }, 1000); | ||
| 43 | +} | ||
| 44 | +// 缓存表单信息 | ||
| 45 | +store.changeFormInfo(data); | ||
| 46 | +// 表单网页标题 | ||
| 47 | +useTitle(form_data.name); | ||
| 48 | +form_name.value = form_data.name; | ||
| 49 | +// 重构数据结构 | ||
| 50 | +let page_header = {}; | ||
| 51 | +let page_commit = {}; | ||
| 52 | +let page_form = []; | ||
| 53 | +form_data.field_list.forEach((element) => { | ||
| 54 | + if (element.tag === "page_header") { | ||
| 55 | + // 页眉组件 | ||
| 56 | + page_header = element; | ||
| 57 | + } else if (element.tag === "page_commit") { | ||
| 58 | + // 提交按钮 | ||
| 59 | + page_commit = element; | ||
| 60 | + } else { | ||
| 61 | + page_form.push(element); | ||
| 62 | + } | ||
| 63 | +}); | ||
| 64 | +/** 页眉属性 | ||
| 65 | + * @param label 表单标题 | ||
| 66 | + * @param banner_type 页眉类型:["文字", "单张图", "轮播图"] text=文字,image=单张图,carousel=轮播图 | ||
| 67 | + * @param banner_url 页眉图片地址 | ||
| 68 | + * @param description 描述内容 | ||
| 69 | + * @param invisible 页眉展示 | ||
| 70 | + */ | ||
| 71 | +if (page_header) { | ||
| 72 | + PHeader.value = { | ||
| 73 | + label: page_header.label, | ||
| 74 | + description: page_header.description, | ||
| 75 | + type: page_header.banner_type, | ||
| 76 | + cover: page_header.banner_url, | ||
| 77 | + banner: page_header.banner, | ||
| 78 | + visible: !page_header.invisible, | ||
| 79 | + flow_node_name: formSetting.value.flow_node_name ? formSetting.value.flow_node_name : '', // 节点名称 | ||
| 80 | + }; | ||
| 81 | +} | ||
| 82 | +if (page_commit) { | ||
| 83 | + PCommit.value = { | ||
| 84 | + text: page_commit.text, | ||
| 85 | + visible: !page_commit.invisible, | ||
| 86 | + }; | ||
| 87 | +} | ||
| 88 | + | ||
| 89 | +// TODO:待完善,集合组保存的字段和值怎么处理,都是单条数据都要合并到相应的 group_field_name 下面? | ||
| 90 | + | ||
| 91 | +// page_form.unshift({ | ||
| 92 | +// data_type : "text", | ||
| 93 | +// default : "", | ||
| 94 | +// disabled : false, | ||
| 95 | +// field_id : 1414832, | ||
| 96 | +// field_name : "field_4", | ||
| 97 | +// index : 41, | ||
| 98 | +// interaction_type : "h5edit", | ||
| 99 | +// label : "物品详情", | ||
| 100 | +// name : "name_41", | ||
| 101 | +// placeholder : "请输入", | ||
| 102 | +// readonly : false, | ||
| 103 | +// required : false, | ||
| 104 | +// tag : "group", | ||
| 105 | +// unique : false, | ||
| 106 | +// field_groups: [{ | ||
| 107 | +// "tag": "input", | ||
| 108 | +// "name": "input_21", | ||
| 109 | +// "index": 2, | ||
| 110 | +// "label": "物品描述", | ||
| 111 | +// "unique": false, | ||
| 112 | +// "default": "", | ||
| 113 | +// "disabled": false, | ||
| 114 | +// "field_id": 7985071, | ||
| 115 | +// "readonly": false, | ||
| 116 | +// "required": false, | ||
| 117 | +// "data_type": "text", | ||
| 118 | +// "field_name": "field_10", | ||
| 119 | +// "placeholder": "请输入", | ||
| 120 | +// "is_camera_scan": false, | ||
| 121 | +// "camera_scan_type": "", | ||
| 122 | +// "interaction_type": "h5edit", | ||
| 123 | +// "is_edit_camera_scan_result": false, | ||
| 124 | +// "group_field_name" : "field_4", | ||
| 125 | +// },{ | ||
| 126 | +// "tag": "gender", | ||
| 127 | +// "name": "gender_3", | ||
| 128 | +// "note": "", | ||
| 129 | +// "index": 3, | ||
| 130 | +// "label": "性别", | ||
| 131 | +// "options": [ | ||
| 132 | +// { | ||
| 133 | +// "title": "男", | ||
| 134 | +// "value": "男", | ||
| 135 | +// "checked": false, | ||
| 136 | +// "desc_url": "", | ||
| 137 | +// "is_input": false, | ||
| 138 | +// "desc_text": "", | ||
| 139 | +// "desc_type": "", | ||
| 140 | +// "desc_btn_name": "", | ||
| 141 | +// "input_required": false, | ||
| 142 | +// "input_placeholder": "请输入补充信息" | ||
| 143 | +// }, | ||
| 144 | +// { | ||
| 145 | +// "title": "女", | ||
| 146 | +// "value": "女", | ||
| 147 | +// "checked": false, | ||
| 148 | +// "desc_url": "", | ||
| 149 | +// "is_input": false, | ||
| 150 | +// "desc_text": "", | ||
| 151 | +// "desc_type": "", | ||
| 152 | +// "desc_btn_name": "", | ||
| 153 | +// "input_required": false, | ||
| 154 | +// "input_placeholder": "请输入补充信息" | ||
| 155 | +// } | ||
| 156 | +// ], | ||
| 157 | +// "disabled": false, | ||
| 158 | +// "field_id": 799603, | ||
| 159 | +// "required": false, | ||
| 160 | +// "data_type": "text", | ||
| 161 | +// "direction": "vertical", | ||
| 162 | +// "field_name": "field_4", | ||
| 163 | +// "option_map": { | ||
| 164 | +// "女": { | ||
| 165 | +// "title": "女", | ||
| 166 | +// "value": "女", | ||
| 167 | +// "checked": false, | ||
| 168 | +// "desc_url": "", | ||
| 169 | +// "is_input": false, | ||
| 170 | +// "desc_text": "", | ||
| 171 | +// "desc_type": "", | ||
| 172 | +// "desc_btn_name": "", | ||
| 173 | +// "input_required": false, | ||
| 174 | +// "input_placeholder": "请输入补充信息" | ||
| 175 | +// }, | ||
| 176 | +// "男": { | ||
| 177 | +// "title": "男", | ||
| 178 | +// "value": "男", | ||
| 179 | +// "checked": false, | ||
| 180 | +// "desc_url": "", | ||
| 181 | +// "is_input": false, | ||
| 182 | +// "desc_text": "", | ||
| 183 | +// "desc_type": "", | ||
| 184 | +// "desc_btn_name": "", | ||
| 185 | +// "input_required": false, | ||
| 186 | +// "input_placeholder": "请输入补充信息" | ||
| 187 | +// } | ||
| 188 | +// }, | ||
| 189 | +// "interaction_type": "h5edit" | ||
| 190 | +// },] | ||
| 191 | +// }); | ||
| 192 | + | ||
| 193 | +// TEST 新组件 | ||
| 194 | +// page_form.push({ | ||
| 195 | +// "tag": "table_editor", | ||
| 196 | +// "name": "name_2", | ||
| 197 | +// "index": 2, | ||
| 198 | +// "label": "表格", | ||
| 199 | +// "unique": false, | ||
| 200 | +// "default": "<p>999</p>", | ||
| 201 | +// "disabled": false, | ||
| 202 | +// "field_id": 799599, | ||
| 203 | +// "readonly": false, | ||
| 204 | +// "required": false, | ||
| 205 | +// "data_type": "text", | ||
| 206 | +// "field_name": "field_2", | ||
| 207 | +// "placeholder": "请输入", | ||
| 208 | +// "interaction_type": "h5edit" | ||
| 209 | +// }) | ||
| 210 | + | ||
| 211 | +// page_form.push({ | ||
| 212 | +// data_type: "text", | ||
| 213 | +// default: "选项标题1", | ||
| 214 | +// direction: "vertical", | ||
| 215 | +// disabled: false, | ||
| 216 | +// field_id: 800207, | ||
| 217 | +// field_name: "field_62", | ||
| 218 | +// index: 61, | ||
| 219 | +// interaction_type: "h5edit", | ||
| 220 | +// label: "义工组别", | ||
| 221 | +// name: "radio_61", | ||
| 222 | +// note: "", | ||
| 223 | +// required: false, | ||
| 224 | +// tag: "volunteer_group", | ||
| 225 | +// options: [ | ||
| 226 | +// { | ||
| 227 | +// checked: true, | ||
| 228 | +// desc_btn_name: "", | ||
| 229 | +// desc_text: "", | ||
| 230 | +// desc_type: "", | ||
| 231 | +// desc_url: "", | ||
| 232 | +// input_placeholder: "请输入补充信息", | ||
| 233 | +// input_required: false, | ||
| 234 | +// is_input: false, | ||
| 235 | +// title: "选项标题1", | ||
| 236 | +// value: "选项标题1" | ||
| 237 | +// }, | ||
| 238 | +// { | ||
| 239 | +// checked: false, | ||
| 240 | +// desc_btn_name: "", | ||
| 241 | +// desc_text: "", | ||
| 242 | +// desc_type: "", | ||
| 243 | +// desc_url: "", | ||
| 244 | +// input_placeholder: "请输入补充信息", | ||
| 245 | +// input_required: false, | ||
| 246 | +// is_input: false, | ||
| 247 | +// title: "选项标题2", | ||
| 248 | +// value: "选项标题2" | ||
| 249 | +// } | ||
| 250 | +// ] | ||
| 251 | +// }) | ||
| 252 | + | ||
| 253 | +formData.value = formatData(page_form); | ||
| 254 | + | ||
| 255 | +return { | ||
| 256 | + form_name, | ||
| 257 | + form_flow_process_list, | ||
| 258 | + active_flow_process, | ||
| 259 | + PHeader, | ||
| 260 | + PCommit, | ||
| 261 | + formData | ||
| 262 | +} |
src/mock/createComponentType.js
0 → 100644
| 1 | +// TAG: mock数据 | ||
| 2 | +mockData.value = [ | ||
| 3 | + { | ||
| 4 | + key: "field_1", | ||
| 5 | + value: "", | ||
| 6 | + component: "", | ||
| 7 | + component_props: { | ||
| 8 | + name: "appointment", | ||
| 9 | + tag: "appointment", | ||
| 10 | + label: "预约时间", | ||
| 11 | + default: '', | ||
| 12 | + required: true, | ||
| 13 | + placeholder: '', | ||
| 14 | + appointment_title: '选择入寺时间', | ||
| 15 | + options: [{ | ||
| 16 | + title: '03月27日', | ||
| 17 | + placeholder: '剩余余量 9878', | ||
| 18 | + value: '', | ||
| 19 | + disabled: false, | ||
| 20 | + columns: [{ | ||
| 21 | + checked : false, | ||
| 22 | + disabled : false, | ||
| 23 | + value: '1', | ||
| 24 | + text : "16:00-17:30 余1399", | ||
| 25 | + }, { | ||
| 26 | + checked : false, | ||
| 27 | + disabled : true, | ||
| 28 | + value: '2', | ||
| 29 | + text : "18:00-19:30 余1399", | ||
| 30 | + }] | ||
| 31 | + }, { | ||
| 32 | + title: '03月28日', | ||
| 33 | + placeholder: '剩余余量 9878', | ||
| 34 | + value: '', | ||
| 35 | + disabled: false, | ||
| 36 | + columns: [{ | ||
| 37 | + checked : false, | ||
| 38 | + disabled : true, | ||
| 39 | + value: '3', | ||
| 40 | + text : "16:00-17:30 余1399", | ||
| 41 | + }, { | ||
| 42 | + checked : false, | ||
| 43 | + disabled : false, | ||
| 44 | + value: '4', | ||
| 45 | + text : "16:00-17:30 余1399", | ||
| 46 | + }] | ||
| 47 | + }, { | ||
| 48 | + title: '03月28日', | ||
| 49 | + placeholder: '等待预约(提前一天)', | ||
| 50 | + value: '', | ||
| 51 | + disabled: true, | ||
| 52 | + columns: [{ | ||
| 53 | + checked : false, | ||
| 54 | + disabled : true, | ||
| 55 | + value: '5', | ||
| 56 | + text : "12:00-13:30 余1399", | ||
| 57 | + }, { | ||
| 58 | + checked : false, | ||
| 59 | + disabled : false, | ||
| 60 | + value: '6', | ||
| 61 | + text : "14:00-15:30 余1399", | ||
| 62 | + }] | ||
| 63 | + }] | ||
| 64 | + }, | ||
| 65 | + }, | ||
| 66 | +]; | ||
| 67 | + | ||
| 68 | +// 生成自定义组件 | ||
| 69 | +// createComponentType(mockData.value); |
src/mock/page_form.js
0 → 100644
| 1 | +// TODO:待完善,集合组保存的字段和值怎么处理,都是单条数据都要合并到相应的 group_field_name 下面? | ||
| 2 | + | ||
| 3 | +// page_form.unshift({ | ||
| 4 | +// data_type : "text", | ||
| 5 | +// default : "", | ||
| 6 | +// disabled : false, | ||
| 7 | +// field_id : 1414832, | ||
| 8 | +// field_name : "field_4", | ||
| 9 | +// index : 41, | ||
| 10 | +// interaction_type : "h5edit", | ||
| 11 | +// label : "物品详情", | ||
| 12 | +// name : "name_41", | ||
| 13 | +// placeholder : "请输入", | ||
| 14 | +// readonly : false, | ||
| 15 | +// required : false, | ||
| 16 | +// tag : "group", | ||
| 17 | +// unique : false, | ||
| 18 | +// field_groups: [{ | ||
| 19 | +// "tag": "input", | ||
| 20 | +// "name": "input_21", | ||
| 21 | +// "index": 2, | ||
| 22 | +// "label": "物品描述", | ||
| 23 | +// "unique": false, | ||
| 24 | +// "default": "", | ||
| 25 | +// "disabled": false, | ||
| 26 | +// "field_id": 7985071, | ||
| 27 | +// "readonly": false, | ||
| 28 | +// "required": false, | ||
| 29 | +// "data_type": "text", | ||
| 30 | +// "field_name": "field_10", | ||
| 31 | +// "placeholder": "请输入", | ||
| 32 | +// "is_camera_scan": false, | ||
| 33 | +// "camera_scan_type": "", | ||
| 34 | +// "interaction_type": "h5edit", | ||
| 35 | +// "is_edit_camera_scan_result": false, | ||
| 36 | +// "group_field_name" : "field_4", | ||
| 37 | +// },{ | ||
| 38 | +// "tag": "gender", | ||
| 39 | +// "name": "gender_3", | ||
| 40 | +// "note": "", | ||
| 41 | +// "index": 3, | ||
| 42 | +// "label": "性别", | ||
| 43 | +// "options": [ | ||
| 44 | +// { | ||
| 45 | +// "title": "男", | ||
| 46 | +// "value": "男", | ||
| 47 | +// "checked": false, | ||
| 48 | +// "desc_url": "", | ||
| 49 | +// "is_input": false, | ||
| 50 | +// "desc_text": "", | ||
| 51 | +// "desc_type": "", | ||
| 52 | +// "desc_btn_name": "", | ||
| 53 | +// "input_required": false, | ||
| 54 | +// "input_placeholder": "请输入补充信息" | ||
| 55 | +// }, | ||
| 56 | +// { | ||
| 57 | +// "title": "女", | ||
| 58 | +// "value": "女", | ||
| 59 | +// "checked": false, | ||
| 60 | +// "desc_url": "", | ||
| 61 | +// "is_input": false, | ||
| 62 | +// "desc_text": "", | ||
| 63 | +// "desc_type": "", | ||
| 64 | +// "desc_btn_name": "", | ||
| 65 | +// "input_required": false, | ||
| 66 | +// "input_placeholder": "请输入补充信息" | ||
| 67 | +// } | ||
| 68 | +// ], | ||
| 69 | +// "disabled": false, | ||
| 70 | +// "field_id": 799603, | ||
| 71 | +// "required": false, | ||
| 72 | +// "data_type": "text", | ||
| 73 | +// "direction": "vertical", | ||
| 74 | +// "field_name": "field_4", | ||
| 75 | +// "option_map": { | ||
| 76 | +// "女": { | ||
| 77 | +// "title": "女", | ||
| 78 | +// "value": "女", | ||
| 79 | +// "checked": false, | ||
| 80 | +// "desc_url": "", | ||
| 81 | +// "is_input": false, | ||
| 82 | +// "desc_text": "", | ||
| 83 | +// "desc_type": "", | ||
| 84 | +// "desc_btn_name": "", | ||
| 85 | +// "input_required": false, | ||
| 86 | +// "input_placeholder": "请输入补充信息" | ||
| 87 | +// }, | ||
| 88 | +// "男": { | ||
| 89 | +// "title": "男", | ||
| 90 | +// "value": "男", | ||
| 91 | +// "checked": false, | ||
| 92 | +// "desc_url": "", | ||
| 93 | +// "is_input": false, | ||
| 94 | +// "desc_text": "", | ||
| 95 | +// "desc_type": "", | ||
| 96 | +// "desc_btn_name": "", | ||
| 97 | +// "input_required": false, | ||
| 98 | +// "input_placeholder": "请输入补充信息" | ||
| 99 | +// } | ||
| 100 | +// }, | ||
| 101 | +// "interaction_type": "h5edit" | ||
| 102 | +// },] | ||
| 103 | +// }); | ||
| 104 | + | ||
| 105 | +// TEST 新组件 | ||
| 106 | +// page_form.push({ | ||
| 107 | +// "tag": "table_editor", | ||
| 108 | +// "name": "name_2", | ||
| 109 | +// "index": 2, | ||
| 110 | +// "label": "表格", | ||
| 111 | +// "unique": false, | ||
| 112 | +// "default": "<p>999</p>", | ||
| 113 | +// "disabled": false, | ||
| 114 | +// "field_id": 799599, | ||
| 115 | +// "readonly": false, | ||
| 116 | +// "required": false, | ||
| 117 | +// "data_type": "text", | ||
| 118 | +// "field_name": "field_2", | ||
| 119 | +// "placeholder": "请输入", | ||
| 120 | +// "interaction_type": "h5edit" | ||
| 121 | +// }) | ||
| 122 | + | ||
| 123 | +// page_form.push({ | ||
| 124 | +// data_type: "text", | ||
| 125 | +// default: "选项标题1", | ||
| 126 | +// direction: "vertical", | ||
| 127 | +// disabled: false, | ||
| 128 | +// field_id: 800207, | ||
| 129 | +// field_name: "field_62", | ||
| 130 | +// index: 61, | ||
| 131 | +// interaction_type: "h5edit", | ||
| 132 | +// label: "义工组别", | ||
| 133 | +// name: "radio_61", | ||
| 134 | +// note: "", | ||
| 135 | +// required: false, | ||
| 136 | +// tag: "volunteer_group", | ||
| 137 | +// options: [ | ||
| 138 | +// { | ||
| 139 | +// checked: true, | ||
| 140 | +// desc_btn_name: "", | ||
| 141 | +// desc_text: "", | ||
| 142 | +// desc_type: "", | ||
| 143 | +// desc_url: "", | ||
| 144 | +// input_placeholder: "请输入补充信息", | ||
| 145 | +// input_required: false, | ||
| 146 | +// is_input: false, | ||
| 147 | +// title: "选项标题1", | ||
| 148 | +// value: "选项标题1" | ||
| 149 | +// }, | ||
| 150 | +// { | ||
| 151 | +// checked: false, | ||
| 152 | +// desc_btn_name: "", | ||
| 153 | +// desc_text: "", | ||
| 154 | +// desc_type: "", | ||
| 155 | +// desc_url: "", | ||
| 156 | +// input_placeholder: "请输入补充信息", | ||
| 157 | +// input_required: false, | ||
| 158 | +// is_input: false, | ||
| 159 | +// title: "选项标题2", | ||
| 160 | +// value: "选项标题2" | ||
| 161 | +// } | ||
| 162 | +// ] | ||
| 163 | +// }) | ||
| 164 | + | ||
| 165 | +formData.value = formatData(page_form); |
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2022-07-18 10:22:22 | 2 | * @Date: 2022-07-18 10:22:22 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2024-08-12 11:15:45 | 4 | + * @LastEditTime: 2024-08-14 13:43:10 |
| 5 | * @FilePath: /data-table/src/views/index.vue | 5 | * @FilePath: /data-table/src/views/index.vue |
| 6 | * @Description: 首页 | 6 | * @Description: 首页 |
| 7 | --> | 7 | --> |
| ... | @@ -207,6 +207,7 @@ import LoginBox from '@/components/LoginBox/index.vue'; | ... | @@ -207,6 +207,7 @@ import LoginBox from '@/components/LoginBox/index.vue'; |
| 207 | // 获取表单设置 | 207 | // 获取表单设置 |
| 208 | const store = mainStore(); | 208 | const store = mainStore(); |
| 209 | const { formSetting, formInfo, successInfo } = storeToRefs(store); | 209 | const { formSetting, formInfo, successInfo } = storeToRefs(store); |
| 210 | + | ||
| 210 | // web端判断封面图片高度 | 211 | // web端判断封面图片高度 |
| 211 | const is_pc = computed(() => wxInfo().isPC); | 212 | const is_pc = computed(() => wxInfo().isPC); |
| 212 | const PHeaderHeight = computed(() => { | 213 | const PHeaderHeight = computed(() => { |
| ... | @@ -216,6 +217,7 @@ const PHeaderHeight = computed(() => { | ... | @@ -216,6 +217,7 @@ const PHeaderHeight = computed(() => { |
| 216 | return "20vh"; | 217 | return "20vh"; |
| 217 | } | 218 | } |
| 218 | }); | 219 | }); |
| 220 | + | ||
| 219 | // TAG: 自定义主题颜色 | 221 | // TAG: 自定义主题颜色 |
| 220 | const themeVars = { | 222 | const themeVars = { |
| 221 | buttonPrimaryBackground: styleColor.baseColor, | 223 | buttonPrimaryBackground: styleColor.baseColor, |
| ... | @@ -460,169 +462,7 @@ onMounted(async () => { | ... | @@ -460,169 +462,7 @@ onMounted(async () => { |
| 460 | visible: !page_commit.invisible, | 462 | visible: !page_commit.invisible, |
| 461 | }; | 463 | }; |
| 462 | } | 464 | } |
| 463 | - // TODO:待完善,集合组保存的字段和值怎么处理,都是单条数据都要合并到相应的 group_field_name 下面? | ||
| 464 | - | ||
| 465 | - // page_form.unshift({ | ||
| 466 | - // data_type : "text", | ||
| 467 | - // default : "", | ||
| 468 | - // disabled : false, | ||
| 469 | - // field_id : 1414832, | ||
| 470 | - // field_name : "field_4", | ||
| 471 | - // index : 41, | ||
| 472 | - // interaction_type : "h5edit", | ||
| 473 | - // label : "物品详情", | ||
| 474 | - // name : "name_41", | ||
| 475 | - // placeholder : "请输入", | ||
| 476 | - // readonly : false, | ||
| 477 | - // required : false, | ||
| 478 | - // tag : "group", | ||
| 479 | - // unique : false, | ||
| 480 | - // field_groups: [{ | ||
| 481 | - // "tag": "input", | ||
| 482 | - // "name": "input_21", | ||
| 483 | - // "index": 2, | ||
| 484 | - // "label": "物品描述", | ||
| 485 | - // "unique": false, | ||
| 486 | - // "default": "", | ||
| 487 | - // "disabled": false, | ||
| 488 | - // "field_id": 7985071, | ||
| 489 | - // "readonly": false, | ||
| 490 | - // "required": false, | ||
| 491 | - // "data_type": "text", | ||
| 492 | - // "field_name": "field_10", | ||
| 493 | - // "placeholder": "请输入", | ||
| 494 | - // "is_camera_scan": false, | ||
| 495 | - // "camera_scan_type": "", | ||
| 496 | - // "interaction_type": "h5edit", | ||
| 497 | - // "is_edit_camera_scan_result": false, | ||
| 498 | - // "group_field_name" : "field_4", | ||
| 499 | - // },{ | ||
| 500 | - // "tag": "gender", | ||
| 501 | - // "name": "gender_3", | ||
| 502 | - // "note": "", | ||
| 503 | - // "index": 3, | ||
| 504 | - // "label": "性别", | ||
| 505 | - // "options": [ | ||
| 506 | - // { | ||
| 507 | - // "title": "男", | ||
| 508 | - // "value": "男", | ||
| 509 | - // "checked": false, | ||
| 510 | - // "desc_url": "", | ||
| 511 | - // "is_input": false, | ||
| 512 | - // "desc_text": "", | ||
| 513 | - // "desc_type": "", | ||
| 514 | - // "desc_btn_name": "", | ||
| 515 | - // "input_required": false, | ||
| 516 | - // "input_placeholder": "请输入补充信息" | ||
| 517 | - // }, | ||
| 518 | - // { | ||
| 519 | - // "title": "女", | ||
| 520 | - // "value": "女", | ||
| 521 | - // "checked": false, | ||
| 522 | - // "desc_url": "", | ||
| 523 | - // "is_input": false, | ||
| 524 | - // "desc_text": "", | ||
| 525 | - // "desc_type": "", | ||
| 526 | - // "desc_btn_name": "", | ||
| 527 | - // "input_required": false, | ||
| 528 | - // "input_placeholder": "请输入补充信息" | ||
| 529 | - // } | ||
| 530 | - // ], | ||
| 531 | - // "disabled": false, | ||
| 532 | - // "field_id": 799603, | ||
| 533 | - // "required": false, | ||
| 534 | - // "data_type": "text", | ||
| 535 | - // "direction": "vertical", | ||
| 536 | - // "field_name": "field_4", | ||
| 537 | - // "option_map": { | ||
| 538 | - // "女": { | ||
| 539 | - // "title": "女", | ||
| 540 | - // "value": "女", | ||
| 541 | - // "checked": false, | ||
| 542 | - // "desc_url": "", | ||
| 543 | - // "is_input": false, | ||
| 544 | - // "desc_text": "", | ||
| 545 | - // "desc_type": "", | ||
| 546 | - // "desc_btn_name": "", | ||
| 547 | - // "input_required": false, | ||
| 548 | - // "input_placeholder": "请输入补充信息" | ||
| 549 | - // }, | ||
| 550 | - // "男": { | ||
| 551 | - // "title": "男", | ||
| 552 | - // "value": "男", | ||
| 553 | - // "checked": false, | ||
| 554 | - // "desc_url": "", | ||
| 555 | - // "is_input": false, | ||
| 556 | - // "desc_text": "", | ||
| 557 | - // "desc_type": "", | ||
| 558 | - // "desc_btn_name": "", | ||
| 559 | - // "input_required": false, | ||
| 560 | - // "input_placeholder": "请输入补充信息" | ||
| 561 | - // } | ||
| 562 | - // }, | ||
| 563 | - // "interaction_type": "h5edit" | ||
| 564 | - // },] | ||
| 565 | - // }); | ||
| 566 | 465 | ||
| 567 | - // TEST 新组件 | ||
| 568 | - // page_form.push({ | ||
| 569 | - // "tag": "table_editor", | ||
| 570 | - // "name": "name_2", | ||
| 571 | - // "index": 2, | ||
| 572 | - // "label": "表格", | ||
| 573 | - // "unique": false, | ||
| 574 | - // "default": "<p>999</p>", | ||
| 575 | - // "disabled": false, | ||
| 576 | - // "field_id": 799599, | ||
| 577 | - // "readonly": false, | ||
| 578 | - // "required": false, | ||
| 579 | - // "data_type": "text", | ||
| 580 | - // "field_name": "field_2", | ||
| 581 | - // "placeholder": "请输入", | ||
| 582 | - // "interaction_type": "h5edit" | ||
| 583 | - // }) | ||
| 584 | - | ||
| 585 | - // page_form.push({ | ||
| 586 | - // data_type: "text", | ||
| 587 | - // default: "选项标题1", | ||
| 588 | - // direction: "vertical", | ||
| 589 | - // disabled: false, | ||
| 590 | - // field_id: 800207, | ||
| 591 | - // field_name: "field_62", | ||
| 592 | - // index: 61, | ||
| 593 | - // interaction_type: "h5edit", | ||
| 594 | - // label: "义工组别", | ||
| 595 | - // name: "radio_61", | ||
| 596 | - // note: "", | ||
| 597 | - // required: false, | ||
| 598 | - // tag: "volunteer_group", | ||
| 599 | - // options: [ | ||
| 600 | - // { | ||
| 601 | - // checked: true, | ||
| 602 | - // desc_btn_name: "", | ||
| 603 | - // desc_text: "", | ||
| 604 | - // desc_type: "", | ||
| 605 | - // desc_url: "", | ||
| 606 | - // input_placeholder: "请输入补充信息", | ||
| 607 | - // input_required: false, | ||
| 608 | - // is_input: false, | ||
| 609 | - // title: "选项标题1", | ||
| 610 | - // value: "选项标题1" | ||
| 611 | - // }, | ||
| 612 | - // { | ||
| 613 | - // checked: false, | ||
| 614 | - // desc_btn_name: "", | ||
| 615 | - // desc_text: "", | ||
| 616 | - // desc_type: "", | ||
| 617 | - // desc_url: "", | ||
| 618 | - // input_placeholder: "请输入补充信息", | ||
| 619 | - // input_required: false, | ||
| 620 | - // is_input: false, | ||
| 621 | - // title: "选项标题2", | ||
| 622 | - // value: "选项标题2" | ||
| 623 | - // } | ||
| 624 | - // ] | ||
| 625 | - // }) | ||
| 626 | formData.value = formatData(page_form); | 466 | formData.value = formatData(page_form); |
| 627 | 467 | ||
| 628 | // TAG:获取原来表单数据 | 468 | // TAG:获取原来表单数据 |
| ... | @@ -671,75 +511,6 @@ onMounted(async () => { | ... | @@ -671,75 +511,6 @@ onMounted(async () => { |
| 671 | show_loading.value = false; | 511 | show_loading.value = false; |
| 672 | } | 512 | } |
| 673 | 513 | ||
| 674 | - // TAG: mock数据 | ||
| 675 | - mockData.value = [ | ||
| 676 | - { | ||
| 677 | - key: "field_1", | ||
| 678 | - value: "", | ||
| 679 | - component: "", | ||
| 680 | - component_props: { | ||
| 681 | - name: "appointment", | ||
| 682 | - tag: "appointment", | ||
| 683 | - label: "预约时间", | ||
| 684 | - default: '', | ||
| 685 | - required: true, | ||
| 686 | - placeholder: '', | ||
| 687 | - appointment_title: '选择入寺时间', | ||
| 688 | - options: [{ | ||
| 689 | - title: '03月27日', | ||
| 690 | - placeholder: '剩余余量 9878', | ||
| 691 | - value: '', | ||
| 692 | - disabled: false, | ||
| 693 | - columns: [{ | ||
| 694 | - checked : false, | ||
| 695 | - disabled : false, | ||
| 696 | - value: '1', | ||
| 697 | - text : "16:00-17:30 余1399", | ||
| 698 | - }, { | ||
| 699 | - checked : false, | ||
| 700 | - disabled : true, | ||
| 701 | - value: '2', | ||
| 702 | - text : "18:00-19:30 余1399", | ||
| 703 | - }] | ||
| 704 | - }, { | ||
| 705 | - title: '03月28日', | ||
| 706 | - placeholder: '剩余余量 9878', | ||
| 707 | - value: '', | ||
| 708 | - disabled: false, | ||
| 709 | - columns: [{ | ||
| 710 | - checked : false, | ||
| 711 | - disabled : true, | ||
| 712 | - value: '3', | ||
| 713 | - text : "16:00-17:30 余1399", | ||
| 714 | - }, { | ||
| 715 | - checked : false, | ||
| 716 | - disabled : false, | ||
| 717 | - value: '4', | ||
| 718 | - text : "16:00-17:30 余1399", | ||
| 719 | - }] | ||
| 720 | - }, { | ||
| 721 | - title: '03月28日', | ||
| 722 | - placeholder: '等待预约(提前一天)', | ||
| 723 | - value: '', | ||
| 724 | - disabled: true, | ||
| 725 | - columns: [{ | ||
| 726 | - checked : false, | ||
| 727 | - disabled : true, | ||
| 728 | - value: '5', | ||
| 729 | - text : "12:00-13:30 余1399", | ||
| 730 | - }, { | ||
| 731 | - checked : false, | ||
| 732 | - disabled : false, | ||
| 733 | - value: '6', | ||
| 734 | - text : "14:00-15:30 余1399", | ||
| 735 | - }] | ||
| 736 | - }] | ||
| 737 | - }, | ||
| 738 | - }, | ||
| 739 | - ]; | ||
| 740 | - | ||
| 741 | - // 生成自定义组件 | ||
| 742 | - // createComponentType(mockData.value); | ||
| 743 | createComponentType(formData.value); | 514 | createComponentType(formData.value); |
| 744 | // TAG:不同类型提交表单处理 | 515 | // TAG:不同类型提交表单处理 |
| 745 | if (page_type === 'add') { // 表单为新增状态 | 516 | if (page_type === 'add') { // 表单为新增状态 |
| ... | @@ -1128,7 +899,7 @@ const successHandle = () => { // 表单成功提交后续操作 | ... | @@ -1128,7 +899,7 @@ const successHandle = () => { // 表单成功提交后续操作 |
| 1128 | } | 899 | } |
| 1129 | } | 900 | } |
| 1130 | 901 | ||
| 1131 | -const onSubmit = async (values) => { | 902 | +const onSubmit = async (values) => { // 表单提交回调 |
| 1132 | // 表单数据处理 | 903 | // 表单数据处理 |
| 1133 | postData.value = preValidData(values); | 904 | postData.value = preValidData(values); |
| 1134 | // 合并扩展字段 | 905 | // 合并扩展字段 | ... | ... |
-
Please register or login to post a comment