zianxin/pj_admin_cloud
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

审批提交添加loading

Browse Source
This commit is contained in:
weiwei committed 2025-02-26 20:24:09 +08:00
1 parent d618aca278
commit 013afdf16e
4 files changed
+165 -123
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/components/taskDrawer/agree.vue
+70 -55
View File
@@ -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>
src/components/taskDrawer/index.vue
+3 -3
View File
@@ -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>
src/components/taskDrawer/refuse.vue
+20 -11
View File
@@ -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>
src/components/taskDrawer/transfer.vue
+72 -54
View File
@@ -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>