Showing
2 changed files
with
55 additions
and
27 deletions
| ... | @@ -2,7 +2,7 @@ | ... | @@ -2,7 +2,7 @@ |
| 2 | * @Author: hookehuyr hookehuyr@gmail.com | 2 | * @Author: hookehuyr hookehuyr@gmail.com |
| 3 | * @Date: 2022-05-26 23:52:36 | 3 | * @Date: 2022-05-26 23:52:36 |
| 4 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 4 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 5 | - * @LastEditTime: 2024-06-28 18:31:02 | 5 | + * @LastEditTime: 2024-07-04 14:47:58 |
| 6 | * @FilePath: /data-table/src/App.vue | 6 | * @FilePath: /data-table/src/App.vue |
| 7 | * @Description: | 7 | * @Description: |
| 8 | --> | 8 | --> |
| ... | @@ -87,6 +87,13 @@ onMounted(async () => { | ... | @@ -87,6 +87,13 @@ onMounted(async () => { |
| 87 | if (data.length) { | 87 | if (data.length) { |
| 88 | Object.assign(form_setting, data[0]['property_list'], data[0]['extend']); | 88 | Object.assign(form_setting, data[0]['property_list'], data[0]['extend']); |
| 89 | } | 89 | } |
| 90 | + // TAG: 是否显示流程按钮 | ||
| 91 | + if (page_type === 'add' && form_setting.flow_id) { | ||
| 92 | + form_setting.is_flow = true; | ||
| 93 | + } | ||
| 94 | + if (page_type === 'flow') { | ||
| 95 | + form_setting.is_flow = true; | ||
| 96 | + } | ||
| 90 | // 缓存表单设置 | 97 | // 缓存表单设置 |
| 91 | store.changeFormSetting(form_setting); | 98 | store.changeFormSetting(form_setting); |
| 92 | // 跳转未授权页 | 99 | // 跳转未授权页 | ... | ... |
| 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-07-01 12:32:31 | 4 | + * @LastEditTime: 2024-07-04 15:18:15 |
| 5 | * @FilePath: /data-table/src/views/index.vue | 5 | * @FilePath: /data-table/src/views/index.vue |
| 6 | * @Description: 首页 | 6 | * @Description: 首页 |
| 7 | --> | 7 | --> |
| ... | @@ -35,6 +35,7 @@ | ... | @@ -35,6 +35,7 @@ |
| 35 | </div> | 35 | </div> |
| 36 | <!-- 流程表单 --> | 36 | <!-- 流程表单 --> |
| 37 | <div v-if="formSetting.is_flow" style="margin: 16px; padding-top: 1rem;"> | 37 | <div v-if="formSetting.is_flow" style="margin: 16px; padding-top: 1rem;"> |
| 38 | + <div v-if="page_type === 'flow'"> | ||
| 38 | <p style="margin-bottom: 1rem; font-size: 0.85rem; font-weight: bold;">审批意见</p> | 39 | <p style="margin-bottom: 1rem; font-size: 0.85rem; font-weight: bold;">审批意见</p> |
| 39 | <div style="margin-bottom: 1rem; border: 1px solid #eee;"> | 40 | <div style="margin-bottom: 1rem; border: 1px solid #eee;"> |
| 40 | <van-field | 41 | <van-field |
| ... | @@ -46,8 +47,9 @@ | ... | @@ -46,8 +47,9 @@ |
| 46 | placeholder="" | 47 | placeholder="" |
| 47 | /> | 48 | /> |
| 48 | </div> | 49 | </div> |
| 50 | + </div> | ||
| 49 | <van-button round block type="primary" @click="approval_show=true" style="margin-bottom: 1rem;"> | 51 | <van-button round block type="primary" @click="approval_show=true" style="margin-bottom: 1rem;"> |
| 50 | - 审核操作 | 52 | + 流程操作 |
| 51 | </van-button> | 53 | </van-button> |
| 52 | </div> | 54 | </div> |
| 53 | <!-- <van-cell-group :border="false"> | 55 | <!-- <van-cell-group :border="false"> |
| ... | @@ -256,32 +258,51 @@ const onSubmitPwd = async () => { | ... | @@ -256,32 +258,51 @@ const onSubmitPwd = async () => { |
| 256 | // 弹出流程审核操作 | 258 | // 弹出流程审核操作 |
| 257 | const approval_show = ref(false); | 259 | const approval_show = ref(false); |
| 258 | const approval_note = ref(''); | 260 | const approval_note = ref(''); |
| 261 | +const flow_node_action_id = ref(''); | ||
| 259 | // 审批组件点击 | 262 | // 审批组件点击 |
| 260 | const onClickFloatingBubble = () => { | 263 | const onClickFloatingBubble = () => { |
| 261 | approval_show.value = true; | 264 | approval_show.value = true; |
| 262 | } | 265 | } |
| 263 | const myForm = ref(null); | 266 | const myForm = ref(null); |
| 264 | -const approval_actions = [ | 267 | +const approval_actions = ref([]); |
| 265 | - { name: '提交', id: 'commit', }, | 268 | +setTimeout(() => { |
| 266 | - { name: '撤回', id: 'withdraw', disabled: true }, | 269 | + // 审核操作列表数据 |
| 267 | - { name: '驳回', id: 'reject', }, | 270 | + approval_actions.value = formSetting.value.flow_node_action_list.map((item) => { return { name: item.btnText, id: item.id } }); |
| 268 | - { name: '结束流程', id: 'terminate', }, | 271 | +}, 500); |
| 269 | -]; | ||
| 270 | const onApprovalSelect = (item) => { | 272 | const onApprovalSelect = (item) => { |
| 271 | - switch (item.id) { | 273 | + flow_node_action_id.value = item.id; |
| 272 | - case 'commit': | 274 | + if (page_type === 'add') { // 新增页面统一处理为提交 |
| 273 | - myForm.value.submit() | 275 | + myForm.value.submit(); |
| 274 | - break; | 276 | + } |
| 275 | - case 'withdraw': | 277 | + // TODO: 等待处理方式 |
| 276 | - break; | 278 | + if (page_type === 'flow') { |
| 277 | - case 'reject': | 279 | + console.warn('flow'); |
| 278 | - break; | ||
| 279 | - case 'terminate': | ||
| 280 | - break; | ||
| 281 | } | 280 | } |
| 281 | + // switch (item.id) { | ||
| 282 | + // case 'commit': | ||
| 283 | + // myForm.value.submit(); | ||
| 284 | + // break; | ||
| 285 | + // case 'draft': | ||
| 286 | + // myForm.value.submit(); | ||
| 287 | + // break; | ||
| 288 | + // case 'withdraw': | ||
| 289 | + // handleApproval('withdraw'); | ||
| 290 | + // break; | ||
| 291 | + // case 'reject': | ||
| 292 | + // handleApproval('reject'); | ||
| 293 | + // break; | ||
| 294 | + // case 'terminate': | ||
| 295 | + // handleApproval('terminate'); | ||
| 296 | + // break; | ||
| 297 | + // } | ||
| 282 | }; | 298 | }; |
| 283 | const onApprovalCancel = () => { | 299 | const onApprovalCancel = () => { |
| 300 | + console.warn('取消'); | ||
| 301 | +} | ||
| 284 | 302 | ||
| 303 | +const handleApproval = (type) => { | ||
| 304 | + console.warn(type); | ||
| 305 | + console.warn(approval_note.value); | ||
| 285 | } | 306 | } |
| 286 | 307 | ||
| 287 | // TODO: 等待调试发送短信接口 | 308 | // TODO: 等待调试发送短信接口 |
| ... | @@ -319,7 +340,7 @@ onMounted(async () => { | ... | @@ -319,7 +340,7 @@ onMounted(async () => { |
| 319 | document | 340 | document |
| 320 | .querySelector("body") | 341 | .querySelector("body") |
| 321 | .setAttribute("style", `background-color: ${styleColor.backgroundColor}`); | 342 | .setAttribute("style", `background-color: ${styleColor.backgroundColor}`); |
| 322 | - const { data } = await queryFormAPI({ form_code: $route.query.code, page_type, data_id }); | 343 | + const { data } = await queryFormAPI({ form_code: $route.query.code, page_type, data_id, flow_node_code: formSetting.value.flow_node_code }); // flow_node_code 表示随机选择的流程节点的ID, 用来过滤流程显示字段 |
| 323 | const form_data = data; | 344 | const form_data = data; |
| 324 | // 缓存表单信息 | 345 | // 缓存表单信息 |
| 325 | store.changeFormInfo(data); | 346 | store.changeFormInfo(data); |
| ... | @@ -338,13 +359,9 @@ onMounted(async () => { | ... | @@ -338,13 +359,9 @@ onMounted(async () => { |
| 338 | // 提交按钮 | 359 | // 提交按钮 |
| 339 | page_commit = element; | 360 | page_commit = element; |
| 340 | } else { | 361 | } else { |
| 341 | - // TODO:过滤掉自定义流程中的字段-需要新API接口 | ||
| 342 | - // console.warn(element); | ||
| 343 | page_form.push(element); | 362 | page_form.push(element); |
| 344 | } | 363 | } |
| 345 | }); | 364 | }); |
| 346 | - // TODO: 判断是否流程表单-需要新API接口 | ||
| 347 | - formSetting.value.is_flow = false; | ||
| 348 | /** 页眉属性 | 365 | /** 页眉属性 |
| 349 | * @param label 表单标题 | 366 | * @param label 表单标题 |
| 350 | * @param banner_type 页眉类型:["文字", "单张图", "轮播图"] text=文字,image=单张图,carousel=轮播图 | 367 | * @param banner_type 页眉类型:["文字", "单张图", "轮播图"] text=文字,image=单张图,carousel=轮播图 |
| ... | @@ -943,6 +960,7 @@ const onSubmit = async (values) => { | ... | @@ -943,6 +960,7 @@ const onSubmit = async (values) => { |
| 943 | postData.value = preValidData(values); | 960 | postData.value = preValidData(values); |
| 944 | // 合并扩展字段 | 961 | // 合并扩展字段 |
| 945 | postData.value = { ...postData.value, x_field_1, x_cycle }; | 962 | postData.value = { ...postData.value, x_field_1, x_cycle }; |
| 963 | + // TODO: formData.value disabled=true 数据处理?表单页面上不显示?不一定需要处理 | ||
| 946 | // 检查非表单输入项 | 964 | // 检查非表单输入项 |
| 947 | if (validOther().status) { | 965 | if (validOther().status) { |
| 948 | // 编辑模式不能提交数据 | 966 | // 编辑模式不能提交数据 |
| ... | @@ -958,7 +976,9 @@ const onSubmit = async (values) => { | ... | @@ -958,7 +976,9 @@ const onSubmit = async (values) => { |
| 958 | const result = await addFormDataAPI({ | 976 | const result = await addFormDataAPI({ |
| 959 | form_code: $route.query.code, | 977 | form_code: $route.query.code, |
| 960 | data: postData.value, | 978 | data: postData.value, |
| 961 | - openid: iframe_openid | 979 | + openid: iframe_openid, |
| 980 | + flow_id: formSetting.value.flow_id, // 流程相关保存接口, 把flow_id传到后台 | ||
| 981 | + flow_node_action_id: flow_node_action_id.value, // 用户选择的流程节点的操作按钮的ID | ||
| 962 | }); | 982 | }); |
| 963 | if (result.code) { | 983 | if (result.code) { |
| 964 | // 提交按钮禁用状态 | 984 | // 提交按钮禁用状态 |
| ... | @@ -983,9 +1003,10 @@ const onSubmit = async (values) => { | ... | @@ -983,9 +1003,10 @@ const onSubmit = async (values) => { |
| 983 | // 表单成功提交后续操作 | 1003 | // 表单成功提交后续操作 |
| 984 | successHandle(); | 1004 | successHandle(); |
| 985 | }); | 1005 | }); |
| 986 | - } | 1006 | + } else { |
| 987 | // 表单成功提交后续操作 | 1007 | // 表单成功提交后续操作 |
| 988 | successHandle(); | 1008 | successHandle(); |
| 1009 | + } | ||
| 989 | } else { | 1010 | } else { |
| 990 | // 提交按钮禁用状态 | 1011 | // 提交按钮禁用状态 |
| 991 | submitStatus.value = false; | 1012 | submitStatus.value = false; |
| ... | @@ -1011,7 +1032,7 @@ const onSubmit = async (values) => { | ... | @@ -1011,7 +1032,7 @@ const onSubmit = async (values) => { |
| 1011 | // 提交按钮禁用状态 | 1032 | // 提交按钮禁用状态 |
| 1012 | submitStatus.value = false; | 1033 | submitStatus.value = false; |
| 1013 | } | 1034 | } |
| 1014 | - } else if (page_type === 'flow') { // TODO: 流程表单提交 | 1035 | + } else if (page_type === 'flow') { // TODO: 流程表单提交,需要新的接口 |
| 1015 | 1036 | ||
| 1016 | } else { | 1037 | } else { |
| 1017 | console.warn('缺参数'); | 1038 | console.warn('缺参数'); | ... | ... |
-
Please register or login to post a comment