审批提交添加loading
This commit is contained in:
1 parent
d618aca278
commit
013afdf16e
4 files changed
+165
-123
No files matched your search
@@ -1,81 +1,96 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { ref } from "vue"
|
||||||
import { completeTask } from '/@/api/flow/task'
|
import { completeTask } from "/@/api/flow/task"
|
||||||
import type { FlowFormItem, TaskData, TaskSubmitParam } from './types'
|
import type { FlowFormItem, TaskData, TaskSubmitParam } from "./types"
|
||||||
|
import { useMessage } from "/@/hooks/message"
|
||||||
|
|
||||||
const dialogVisible = ref(false)
|
const dialogVisible = ref(false)
|
||||||
const submitDesc = ref('')
|
const submitDesc = ref("")
|
||||||
const currentData = ref<TaskData>()
|
const currentData = ref<TaskData>()
|
||||||
const currentOpenFlowForm = ref<FlowFormItem[]>()
|
const currentOpenFlowForm = ref<FlowFormItem[]>()
|
||||||
|
const loading = ref(false)
|
||||||
|
|
||||||
const handle = (row: TaskData, formData: FlowFormItem[]) => {
|
const handle = (row: TaskData, formData: FlowFormItem[]) => {
|
||||||
submitDesc.value = ''
|
submitDesc.value = ""
|
||||||
currentData.value = row
|
currentData.value = row
|
||||||
currentOpenFlowForm.value = formData
|
currentOpenFlowForm.value = formData
|
||||||
dialogVisible.value = true
|
dialogVisible.value = true
|
||||||
}
|
}
|
||||||
|
|
||||||
defineExpose({ handle })
|
defineExpose({ handle })
|
||||||
const emit = defineEmits<{
|
const emit = defineEmits<{
|
||||||
(e: 'taskSubmitEvent'): void
|
(e: "taskSubmitEvent"): void
|
||||||
}>()
|
}>()
|
||||||
|
|
||||||
const submit = async () => {
|
const submit = async () => {
|
||||||
if (!currentData.value || !currentOpenFlowForm.value) return
|
if (!currentData.value || !currentOpenFlowForm.value) return
|
||||||
|
|
||||||
const formData: Record<string, any> = {}
|
const formData: Record<string, any> = {}
|
||||||
|
|
||||||
for (const item of currentOpenFlowForm.value) {
|
for (const item of currentOpenFlowForm.value) {
|
||||||
formData[item.id] = item.props.value
|
formData[item.id] = item.props.value
|
||||||
|
|
||||||
if (item.type === 'Layout') {
|
if (item.type === "Layout") {
|
||||||
const subList = item.props.value as FlowFormItem[][]
|
const subList = item.props.value as FlowFormItem[][]
|
||||||
const processedData = subList.map(array =>
|
const processedData = subList.map((array) =>
|
||||||
array.reduce((acc, subItem) => ({
|
array.reduce(
|
||||||
...acc,
|
(acc, subItem) => ({
|
||||||
[subItem.id]: subItem.props.value
|
...acc,
|
||||||
}), {})
|
[subItem.id]: subItem.props.value,
|
||||||
)
|
}),
|
||||||
formData[item.id] = processedData
|
{},
|
||||||
}
|
),
|
||||||
}
|
)
|
||||||
|
formData[item.id] = processedData
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
formData[`${currentData.value.nodeId}_approve_condition`] = true
|
formData[`${currentData.value.nodeId}_approve_condition`] = true
|
||||||
|
|
||||||
const param: TaskSubmitParam = {
|
const param: TaskSubmitParam = {
|
||||||
paramMap: formData,
|
paramMap: formData,
|
||||||
taskId: currentData.value.taskId,
|
taskId: currentData.value.taskId,
|
||||||
taskLocalParamMap: {
|
taskLocalParamMap: {
|
||||||
approveDesc: submitDesc.value,
|
approveDesc: submitDesc.value,
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await completeTask(param)
|
loading.value = true
|
||||||
dialogVisible.value = false
|
const res = await completeTask(param).finally(() => (loading.value = false))
|
||||||
emit('taskSubmitEvent')
|
if (res.code === 0) {
|
||||||
} catch (error) {
|
dialogVisible.value = false
|
||||||
console.error('Failed to complete task:', error)
|
emit("taskSubmitEvent")
|
||||||
}
|
useMessage().success("通过成功")
|
||||||
|
return
|
||||||
|
}
|
||||||
|
useMessage().error("通过失败")
|
||||||
|
} catch (error) {
|
||||||
|
loading.value = false
|
||||||
|
useMessage().error("错误")
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<el-dialog v-model="dialogVisible" title="提交审核" :width="400" class="rounded-lg shadow-xl">
|
<el-dialog v-model="dialogVisible" title="提交审核" :width="400" class="rounded-lg shadow-xl">
|
||||||
<div class="p-4 space-y-4">
|
<div class="p-4 space-y-4" v-loading="loading">
|
||||||
<el-input v-model="submitDesc" type="textarea" maxlength="100" :rows="5" placeholder="请输入审核意见..."
|
<el-input
|
||||||
show-word-limit class="w-full transition-all duration-300 focus:ring-2 focus:ring-primary" />
|
v-model="submitDesc"
|
||||||
|
type="textarea"
|
||||||
|
maxlength="100"
|
||||||
|
:rows="5"
|
||||||
|
placeholder="请输入审核意见..."
|
||||||
|
show-word-limit
|
||||||
|
class="w-full transition-all duration-300 focus:ring-2 focus:ring-primary"
|
||||||
|
/>
|
||||||
|
|
||||||
<div class="flex justify-end pt-4 space-x-3">
|
<div class="flex justify-end pt-4 space-x-3">
|
||||||
<el-button @click="dialogVisible = false" class="hover:bg-gray-100 dark:hover:bg-gray-700">
|
<el-button @click="dialogVisible = false" class="hover:bg-gray-100 dark:hover:bg-gray-700" :disabled="loading"> 取消 </el-button>
|
||||||
取消
|
<el-button type="primary" @click="submit" class="bg-primary hover:bg-primary-focus" :disabled="loading"> 确定 </el-button>
|
||||||
</el-button>
|
</div>
|
||||||
<el-button type="primary" @click="submit" class="bg-primary hover:bg-primary-focus">
|
</div>
|
||||||
确定
|
</el-dialog>
|
||||||
</el-button>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</el-dialog>
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
@@ -27,9 +27,9 @@
|
|||||||
</template>
|
</template>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<div style="flex: auto">
|
<div style="flex: auto">
|
||||||
<el-button size="large" type="danger" icon="Close" @click="refuseTask">拒绝</el-button>
|
<el-button size="large" type="danger" icon="Close" @click="refuseTask" :disabled="loading">拒绝</el-button>
|
||||||
<el-button size="large" type="primary" icon="Check" @click="submitTask">提交</el-button>
|
<el-button size="large" type="primary" icon="Check" @click="submitTask" :disabled="loading">提交</el-button>
|
||||||
<el-button size="large" type="info" icon="Share" @click="transferTask">转办</el-button>
|
<el-button size="large" type="info" icon="Share" @click="transferTask" :disabled="loading">转办</el-button>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</el-drawer>
|
</el-drawer>
|
||||||
|
|||||||
@@ -1,13 +1,13 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { defineExpose } from "vue"
|
import { defineExpose } from "vue"
|
||||||
import { completeTask } from "/@/api/flow/task"
|
import { completeTask } from "/@/api/flow/task"
|
||||||
|
import { useMessage } from "/@/hooks/message"
|
||||||
|
|
||||||
const dialogVisible = ref(false)
|
const dialogVisible = ref(false)
|
||||||
|
|
||||||
const submitDesc = ref("")
|
const submitDesc = ref("")
|
||||||
|
|
||||||
const currentData = ref()
|
const currentData = ref()
|
||||||
const currentOpenFlowForm = ref()
|
const currentOpenFlowForm = ref()
|
||||||
|
const loading = ref(false)
|
||||||
|
|
||||||
const handle = (row, formData) => {
|
const handle = (row, formData) => {
|
||||||
submitDesc.value = ""
|
submitDesc.value = ""
|
||||||
@@ -20,7 +20,7 @@ const handle = (row, formData) => {
|
|||||||
defineExpose({ handle })
|
defineExpose({ handle })
|
||||||
const emit = defineEmits(["taskSubmitEvent"])
|
const emit = defineEmits(["taskSubmitEvent"])
|
||||||
|
|
||||||
const submit = () => {
|
const submit = async () => {
|
||||||
let value = currentOpenFlowForm.value
|
let value = currentOpenFlowForm.value
|
||||||
|
|
||||||
var formData = {}
|
var formData = {}
|
||||||
@@ -52,22 +52,31 @@ const submit = () => {
|
|||||||
approveDesc: "拒绝原因:" + submitDesc.value,
|
approveDesc: "拒绝原因:" + submitDesc.value,
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
try {
|
||||||
completeTask(param).then((res) => {
|
loading.value = true
|
||||||
dialogVisible.value = false
|
const res = await completeTask(param).finally(() => (loading.value = false))
|
||||||
emit("taskSubmitEvent")
|
if (res.code === 0) {
|
||||||
})
|
useMessage().success("拒绝成功")
|
||||||
|
dialogVisible.value = false
|
||||||
|
emit("taskSubmitEvent")
|
||||||
|
return
|
||||||
|
}
|
||||||
|
useMessage().error("拒绝失败")
|
||||||
|
} catch (error) {
|
||||||
|
useMessage().error("错误")
|
||||||
|
loading.value = false
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<el-dialog v-model="dialogVisible" title="拒绝审核" width="400px">
|
<el-dialog v-model="dialogVisible" title="拒绝审核" width="400px">
|
||||||
<el-input v-model="submitDesc" type="textarea" maxlength="100" :rows="5" placeholder="审核意见" show-word-limit />
|
<el-input v-loading="loading" v-model="submitDesc" type="textarea" maxlength="100" :rows="5" placeholder="审核意见" show-word-limit />
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<span class="dialog-footer">
|
<span class="dialog-footer">
|
||||||
<el-button @click="dialogVisible = false">取消</el-button>
|
<el-button @click="dialogVisible = false" :disabled="loading">取消</el-button>
|
||||||
<el-button type="primary" @click="submit"> 确定 </el-button>
|
<el-button type="primary" @click="submit" :disabled="loading">确定</el-button>
|
||||||
</span>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
|
|||||||
@@ -1,84 +1,85 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { defineExpose, ref } from 'vue';
|
import { defineExpose, ref } from "vue"
|
||||||
import { transferTask } from '/@/api/flow/task';
|
import { transferTask } from "/@/api/flow/task"
|
||||||
import selectShow from '/@/components/OrgSelector/index.vue';
|
import selectShow from "/@/components/OrgSelector/index.vue"
|
||||||
import { ElMessage } from 'element-plus';
|
import { ElMessage } from "element-plus"
|
||||||
|
|
||||||
interface FlowFormItem {
|
interface FlowFormItem {
|
||||||
id: string;
|
id: string
|
||||||
type: string;
|
type: string
|
||||||
props: {
|
props: {
|
||||||
value: any;
|
value: any
|
||||||
label?: string;
|
label?: string
|
||||||
};
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
interface TaskData {
|
interface TaskData {
|
||||||
taskId: string;
|
taskId: string
|
||||||
nodeId: string;
|
nodeId: string
|
||||||
}
|
}
|
||||||
|
|
||||||
const dialogVisible = ref(false);
|
const dialogVisible = ref(false)
|
||||||
const submitDesc = ref('');
|
const submitDesc = ref("")
|
||||||
const userList = ref<Array<{ id: string }>>([]);
|
const userList = ref<Array<{ id: string }>>([])
|
||||||
const currentData = ref<TaskData>();
|
const currentData = ref<TaskData>()
|
||||||
const currentOpenFlowForm = ref<FlowFormItem[]>();
|
const currentOpenFlowForm = ref<FlowFormItem[]>()
|
||||||
|
const loading = ref(false)
|
||||||
|
|
||||||
const handle = (row: TaskData, formData: FlowFormItem[]) => {
|
const handle = (row: TaskData, formData: FlowFormItem[]) => {
|
||||||
submitDesc.value = '';
|
submitDesc.value = ""
|
||||||
currentData.value = row;
|
currentData.value = row
|
||||||
currentOpenFlowForm.value = formData;
|
currentOpenFlowForm.value = formData
|
||||||
dialogVisible.value = true;
|
dialogVisible.value = true
|
||||||
};
|
}
|
||||||
|
|
||||||
defineExpose({ handle });
|
defineExpose({ handle })
|
||||||
const emit = defineEmits(['taskSubmitEvent']);
|
const emit = defineEmits(["taskSubmitEvent"])
|
||||||
|
|
||||||
const validateForm = (): boolean => {
|
const validateForm = (): boolean => {
|
||||||
if (userList.value.length === 0) {
|
if (userList.value.length === 0) {
|
||||||
ElMessage.warning('请选择转办人员');
|
ElMessage.warning("请选择转办人员")
|
||||||
return false;
|
return false
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!submitDesc.value.trim()) {
|
if (!submitDesc.value.trim()) {
|
||||||
ElMessage.warning('请输入审核意见');
|
ElMessage.warning("请输入审核意见")
|
||||||
return false;
|
return false
|
||||||
}
|
}
|
||||||
|
|
||||||
if (submitDesc.value.trim().length < 2) {
|
if (submitDesc.value.trim().length < 2) {
|
||||||
ElMessage.warning('审核意见至少需要2个字符');
|
ElMessage.warning("审核意见至少需要2个字符")
|
||||||
return false;
|
return false
|
||||||
}
|
}
|
||||||
|
|
||||||
return true;
|
return true
|
||||||
};
|
}
|
||||||
|
|
||||||
const submit = async () => {
|
const submit = async () => {
|
||||||
if (!currentOpenFlowForm.value || !currentData.value) return;
|
if (!currentOpenFlowForm.value || !currentData.value) return
|
||||||
|
|
||||||
// 表单校验
|
// 表单校验
|
||||||
if (!validateForm()) return;
|
if (!validateForm()) return
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const formData: Record<string, any> = {};
|
const formData: Record<string, any> = {}
|
||||||
|
|
||||||
for (const item of currentOpenFlowForm.value) {
|
for (const item of currentOpenFlowForm.value) {
|
||||||
formData[item.id] = item.props.value;
|
formData[item.id] = item.props.value
|
||||||
|
|
||||||
if (item.type === 'Layout') {
|
if (item.type === "Layout") {
|
||||||
const subList = item.props.value as Array<FlowFormItem[]>;
|
const subList = item.props.value as Array<FlowFormItem[]>
|
||||||
const d = subList.map((array) => {
|
const d = subList.map((array) => {
|
||||||
const v: Record<string, any> = {};
|
const v: Record<string, any> = {}
|
||||||
for (const subItem of array) {
|
for (const subItem of array) {
|
||||||
v[subItem.id] = subItem.props.value;
|
v[subItem.id] = subItem.props.value
|
||||||
}
|
}
|
||||||
return v;
|
return v
|
||||||
});
|
})
|
||||||
formData[item.id] = d;
|
formData[item.id] = d
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
formData[`${currentData.value.nodeId}_approve_condition`] = true;
|
formData[`${currentData.value.nodeId}_approve_condition`] = true
|
||||||
|
|
||||||
const param = {
|
const param = {
|
||||||
paramMap: formData,
|
paramMap: formData,
|
||||||
@@ -87,22 +88,32 @@ const submit = async () => {
|
|||||||
taskLocalParamMap: {
|
taskLocalParamMap: {
|
||||||
approveDesc: submitDesc.value.trim(),
|
approveDesc: submitDesc.value.trim(),
|
||||||
},
|
},
|
||||||
};
|
}
|
||||||
|
|
||||||
await transferTask(param);
|
try {
|
||||||
ElMessage.success('转办成功');
|
loading.value = true
|
||||||
dialogVisible.value = false;
|
const res = await transferTask(param).finally(() => (loading.value = false))
|
||||||
emit('taskSubmitEvent');
|
if (res.code === 0) {
|
||||||
|
ElMessage.success("转办成功")
|
||||||
|
dialogVisible.value = false
|
||||||
|
emit("taskSubmitEvent")
|
||||||
|
return
|
||||||
|
}
|
||||||
|
ElMessage.error("转办失败")
|
||||||
|
} catch (error) {
|
||||||
|
loading.value = false
|
||||||
|
ElMessage.error("错误")
|
||||||
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
ElMessage.error('转办失败,请重试');
|
ElMessage.error("转办失败,请重试")
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<el-dialog v-model="dialogVisible" width="400px" :close-on-click-modal="false" :close-on-press-escape="false" class="transfer-dialog">
|
<el-dialog v-model="dialogVisible" width="400px" :close-on-click-modal="false" :close-on-press-escape="false" class="transfer-dialog">
|
||||||
<div class="space-y-4">
|
<div v-loading="loading" class="space-y-4">
|
||||||
<div class="w-full">
|
<div class="w-full">
|
||||||
<label class="block pb-2">
|
<label class="block pb-2">
|
||||||
<span class="text-base font-medium after:content-['*'] after:text-red-500 after:ml-1"> 选择转办人员 </span>
|
<span class="text-base font-medium after:content-['*'] after:text-red-500 after:ml-1"> 选择转办人员 </span>
|
||||||
@@ -114,14 +125,21 @@ const submit = async () => {
|
|||||||
<label class="block pb-2">
|
<label class="block pb-2">
|
||||||
<span class="text-base font-medium after:content-['*'] after:text-red-500 after:ml-1"> 审核意见 </span>
|
<span class="text-base font-medium after:content-['*'] after:text-red-500 after:ml-1"> 审核意见 </span>
|
||||||
</label>
|
</label>
|
||||||
<el-input v-model="submitDesc" type="textarea" maxlength="100" :rows="5" placeholder="请输入审核意见(2-100字)" show-word-limit />
|
<el-input
|
||||||
|
v-model="submitDesc"
|
||||||
|
type="textarea"
|
||||||
|
maxlength="100"
|
||||||
|
:rows="5"
|
||||||
|
placeholder="请输入审核意见(2-100字)"
|
||||||
|
show-word-limit
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<span class="flex justify-end gap-2">
|
<span class="flex justify-end gap-2">
|
||||||
<el-button @click="dialogVisible = false">取消</el-button>
|
<el-button @click="dialogVisible = false" :disabled="loading">取消</el-button>
|
||||||
<el-button type="primary" @click="submit">确定</el-button>
|
<el-button type="primary" @click="submit" :disabled="loading">确定</el-button>
|
||||||
</span>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
|
|||||||
Reference in new issue
Block a user