Hooke / data-table

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
9874f479 1 parent 4ad25ec1

联调流程新增功能

Inline Side-by-side
Showing 2 changed files with 55 additions and 27 deletions
......@@ -2,7 +2,7 @@
* @Author: hookehuyr hookehuyr@gmail.com
* @Date: 2022-05-26 23:52:36
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-06-28 18:31:02
* @LastEditTime: 2024-07-04 14:47:58
* @FilePath: /data-table/src/App.vue
* @Description:
-->
......@@ -87,6 +87,13 @@ onMounted(async () => {
if (data.length) {
Object.assign(form_setting, data[0]['property_list'], data[0]['extend']);
}
// TAG: 是否显示流程按钮
if (page_type === 'add' && form_setting.flow_id) {
form_setting.is_flow = true;
}
if (page_type === 'flow') {
form_setting.is_flow = true;
}
// 缓存表单设置
store.changeFormSetting(form_setting);
// 跳转未授权页
......
<!--
* @Date: 2022-07-18 10:22:22
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-07-01 12:32:31
* @LastEditTime: 2024-07-04 15:18:15
* @FilePath: /data-table/src/views/index.vue
* @Description: 首页
-->
......@@ -35,6 +35,7 @@
</div>
<!-- 流程表单 -->
<div v-if="formSetting.is_flow" style="margin: 16px; padding-top: 1rem;">
<div v-if="page_type === 'flow'">
<p style="margin-bottom: 1rem; font-size: 0.85rem; font-weight: bold;">审批意见</p>
<div style="margin-bottom: 1rem; border: 1px solid #eee;">
<van-field
......@@ -46,8 +47,9 @@
placeholder=""
/>
</div>
</div>
<van-button round block type="primary" @click="approval_show=true" style="margin-bottom: 1rem;">
审核操作
流程操作
</van-button>
</div>
<!-- <van-cell-group :border="false">
......@@ -256,32 +258,51 @@ const onSubmitPwd = async () => {
// 弹出流程审核操作
const approval_show = ref(false);
const approval_note = ref('');
const flow_node_action_id = ref('');
// 审批组件点击
const onClickFloatingBubble = () => {
approval_show.value = true;
}
const myForm = ref(null);
const approval_actions = [
{ name: '提交', id: 'commit', },
{ name: '撤回', id: 'withdraw', disabled: true },
{ name: '驳回', id: 'reject', },
{ name: '结束流程', id: 'terminate', },
];
const approval_actions = ref([]);
setTimeout(() => {
// 审核操作列表数据
approval_actions.value = formSetting.value.flow_node_action_list.map((item) => { return { name: item.btnText, id: item.id } });
}, 500);
const onApprovalSelect = (item) => {
switch (item.id) {
case 'commit':
myForm.value.submit()
break;
case 'withdraw':
break;
case 'reject':
break;
case 'terminate':
break;
flow_node_action_id.value = item.id;
if (page_type === 'add') { // 新增页面统一处理为提交
myForm.value.submit();
}
// TODO: 等待处理方式
if (page_type === 'flow') {
console.warn('flow');
}
// switch (item.id) {
// case 'commit':
// myForm.value.submit();
// break;
// case 'draft':
// myForm.value.submit();
// break;
// case 'withdraw':
// handleApproval('withdraw');
// break;
// case 'reject':
// handleApproval('reject');
// break;
// case 'terminate':
// handleApproval('terminate');
// break;
// }
};
const onApprovalCancel = () => {
console.warn('取消');
}
const handleApproval = (type) => {
console.warn(type);
console.warn(approval_note.value);
}
// TODO: 等待调试发送短信接口
......@@ -319,7 +340,7 @@ onMounted(async () => {
document
.querySelector("body")
.setAttribute("style", `background-color: ${styleColor.backgroundColor}`);
const { data } = await queryFormAPI({ form_code: $route.query.code, page_type, data_id });
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, 用来过滤流程显示字段
const form_data = data;
// 缓存表单信息
store.changeFormInfo(data);
......@@ -338,13 +359,9 @@ onMounted(async () => {
// 提交按钮
page_commit = element;
} else {
// TODO：过滤掉自定义流程中的字段-需要新API接口
// console.warn(element);
page_form.push(element);
}
});
// TODO: 判断是否流程表单-需要新API接口
formSetting.value.is_flow = false;
/** 页眉属性
* @param label 表单标题
* @param banner_type 页眉类型：["文字", "单张图", "轮播图"] text=文字，image=单张图，carousel=轮播图
......@@ -943,6 +960,7 @@ const onSubmit = async (values) => {
postData.value = preValidData(values);
// 合并扩展字段
postData.value = { ...postData.value, x_field_1, x_cycle };
// TODO: formData.value disabled=true 数据处理？表单页面上不显示？不一定需要处理
// 检查非表单输入项
if (validOther().status) {
// 编辑模式不能提交数据
......@@ -958,7 +976,9 @@ const onSubmit = async (values) => {
const result = await addFormDataAPI({
form_code: $route.query.code,
data: postData.value,
openid: iframe_openid
openid: iframe_openid,
flow_id: formSetting.value.flow_id, // 流程相关保存接口, 把flow_id传到后台
flow_node_action_id: flow_node_action_id.value, // 用户选择的流程节点的操作按钮的ID
});
if (result.code) {
// 提交按钮禁用状态
......@@ -983,9 +1003,10 @@ const onSubmit = async (values) => {
// 表单成功提交后续操作
successHandle();
});
}
} else {
// 表单成功提交后续操作
successHandle();
}
} else {
// 提交按钮禁用状态
submitStatus.value = false;
......@@ -1011,7 +1032,7 @@ const onSubmit = async (values) => {
// 提交按钮禁用状态
submitStatus.value = false;
}
} else if (page_type === 'flow') { // TODO: 流程表单提交
} else if (page_type === 'flow') { // TODO: 流程表单提交，需要新的接口
} else {
console.warn('缺参数');
......