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