wangrunpu
/
stm32-iot-vben5
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor: empty占位

Browse Source
master
dap 5 months ago
parent d8d8ecf308
commit d4df6ba0ac
2 changed files with 199 additions and 185 deletions
Show Stats Download Patch File Download Diff File

372
apps/web-antd/src/views/workflow/components/approval-panel.vue
Unescape View File

@ -393,197 +393,201 @@ async function handleCopy(text: string) {
</script> </script>
<template> <template>
<Card <div class="w-full">
v-if="task" <Card
:body-style="{ overflowY: 'auto', height: '100%' }" v-if="task"
:loading="loading" :body-style="{ overflowY: 'auto', height: '100%' }"
class="thin-scrollbar flex-1 overflow-y-hidden" :loading="loading"
size="small" class="thin-scrollbar flex-1 overflow-y-hidden"
> size="small"
<template #title> >
<div class="flex items-center gap-2"> <template #title>
<div>编号: {{ task.id }}</div>
<CopyOutlined class="cursor-pointer" @click="handleCopy(task.id)" />
</div>
</template>
<template #extra>
<a-button size="small" @click="() => handleLoadInfo(task)">
<div class="flex items-center justify-center">
<span class="icon-[material-symbols--refresh] size-24px"></span>
</div>
</a-button>
</template>
<div class="flex flex-col gap-5 p-4">
<div class="flex flex-col gap-3">
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<div class="text-2xl font-bold">{{ task.flowName }}</div> <div>编号: {{ task.id }}</div>
<div> <CopyOutlined class="cursor-pointer" @click="handleCopy(task.id)" />
<component
:is="renderDict(task.flowStatus, DictEnum.WF_BUSINESS_STATUS)"
/>
</div>
</div> </div>
<div class="flex items-center gap-2"> </template>
<VbenAvatar <template #extra>
:alt="task?.createByName ?? ''" <a-button size="small" @click="() => handleLoadInfo(task)">
class="bg-primary size-[28px] rounded-full text-white" <div class="flex items-center justify-center">
src="" <span class="icon-[material-symbols--refresh] size-24px"></span>
/> </div>
<span>{{ task.createByName }}</span> </a-button>
<div class="flex items-center opacity-50"> </template>
<div class="flex items-center gap-1"> <div class="flex flex-col gap-5 p-4">
<span class="icon-[bxs--category-alt] size-[16px]"></span> <div class="flex flex-col gap-3">
流程分类: {{ task.categoryName }} <div class="flex items-center gap-2">
<div class="text-2xl font-bold">{{ task.flowName }}</div>
<div>
<component
:is="renderDict(task.flowStatus, DictEnum.WF_BUSINESS_STATUS)"
/>
</div> </div>
<Divider type="vertical" /> </div>
<div class="flex items-center gap-1"> <div class="flex items-center gap-2">
<span class="icon-[mdi--clock-outline] size-[16px]"></span> <VbenAvatar
提交时间: {{ task.createTime }} :alt="task?.createByName ?? ''"
class="bg-primary size-[28px] rounded-full text-white"
src=""
/>
<span>{{ task.createByName }}</span>
<div class="flex items-center opacity-50">
<div class="flex items-center gap-1">
<span class="icon-[bxs--category-alt] size-[16px]"></span>
流程分类: {{ task.categoryName }}
</div>
<Divider type="vertical" />
<div class="flex items-center gap-1">
<span class="icon-[mdi--clock-outline] size-[16px]"></span>
提交时间: {{ task.createTime }}
</div>
</div> </div>
</div> </div>
</div> </div>
<Tabs v-if="currentFlowInfo" class="flex-1">
<TabPane key="1" tab="审批详情">
<ApprovalDetails
:current-flow-info="currentFlowInfo"
:iframe-loaded="iframeLoaded"
:iframe-height="iframeHeight"
:task="task"
/>
</TabPane>
<TabPane key="2" tab="审批流程图">
<FlowPreview :instance-id="currentFlowInfo.instanceId" />
</TabPane>
</Tabs>
</div> </div>
<Tabs v-if="currentFlowInfo" class="flex-1"> <!-- 固定底部 -->
<TabPane key="1" tab="审批详情"> <div class="h-[57px]"></div>
<ApprovalDetails <div
:current-flow-info="currentFlowInfo" v-if="showFooter"
:iframe-loaded="iframeLoaded" class="border-t-solid bg-background absolute bottom-0 left-0 w-full border-t-[1px] p-3"
:iframe-height="iframeHeight" >
:task="task" <div class="flex justify-end">
/> <Space v-if="type === 'myself'">
</TabPane> <a-button
<TabPane key="2" tab="审批流程图"> v-if="revocable"
<FlowPreview :instance-id="currentFlowInfo.instanceId" /> danger
</TabPane> ghost
</Tabs> type="primary"
</div> :icon="h(RollbackOutlined)"
<!-- 固定底部 --> @click="handleCancel"
<div class="h-[57px]"></div> >
<div 撤销申请
v-if="showFooter" </a-button>
class="border-t-solid bg-background absolute bottom-0 left-0 w-full border-t-[1px] p-3" <a-button
> type="primary"
<div class="flex justify-end"> ghost
<Space v-if="type === 'myself'"> v-if="editableAndRemoveable"
<a-button :icon="h(EditOutlined)"
v-if="revocable" @click="handleEdit"
danger >
ghost 重新编辑
type="primary" </a-button>
:icon="h(RollbackOutlined)" <a-button
@click="handleCancel" v-if="editableAndRemoveable"
> danger
撤销申请 ghost
</a-button> type="primary"
<a-button :icon="h(EditOutlined)"
type="primary" @click="handleRemove"
ghost >
v-if="editableAndRemoveable" 删除
:icon="h(EditOutlined)" </a-button>
@click="handleEdit" </Space>
> <Space v-if="type === 'approve'">
重新编辑 <a-button
</a-button> type="primary"
<a-button ghost
v-if="editableAndRemoveable" :icon="h(CheckOutlined)"
danger @click="handleApproval"
ghost >
type="primary" 通过
:icon="h(EditOutlined)" </a-button>
@click="handleRemove" <a-button
> v-if="buttonPermissions?.termination"
删除 danger
</a-button> ghost
</Space> type="primary"
<Space v-if="type === 'approve'"> :icon="h(ExclamationCircleOutlined)"
<a-button @click="handleTermination"
type="primary" >
ghost 终止
:icon="h(CheckOutlined)"
@click="handleApproval"
>
通过
</a-button>
<a-button
v-if="buttonPermissions?.termination"
danger
ghost
type="primary"
:icon="h(ExclamationCircleOutlined)"
@click="handleTermination"
>
终止
</a-button>
<a-button
v-if="buttonPermissions?.back"
danger
ghost
type="primary"
:icon="h(ArrowLeftOutlined)"
@click="handleRejection"
>
驳回
</a-button>
<Dropdown
:get-popup-container="getPopupContainer"
placement="bottomRight"
>
<template #overlay>
<Menu>
<MenuItem
v-if="buttonPermissions?.trust"
key="1"
@click="() => delegationModalApi.open()"
>
<UserOutlined class="mr-2" />委托
</MenuItem>
<MenuItem
v-if="buttonPermissions?.transfer"
key="2"
@click="() => transferModalApi.open()"
>
<RollbackOutlined class="mr-2" /> 转办
</MenuItem>
<MenuItem
v-if="showMultiActions && buttonPermissions?.addSign"
key="3"
@click="() => addSignatureModalApi.open()"
>
<UsergroupAddOutlined class="mr-2" /> 加签
</MenuItem>
<MenuItem
v-if="showMultiActions && buttonPermissions?.subSign"
key="4"
@click="() => reductionSignatureModalApi.open()"
>
<UsergroupDeleteOutlined class="mr-2" /> 减签
</MenuItem>
</Menu>
</template>
<a-button v-if="showButtonOther" :icon="h(MenuOutlined)">
其他
</a-button> </a-button>
</Dropdown> <a-button
<ApprovalModal @complete="$emit('reload')" /> v-if="buttonPermissions?.back"
<RejectionModal @complete="$emit('reload')" /> danger
<DelegationModal mode="single" @finish="handleDelegation" /> ghost
<TransferModal mode="single" @finish="handleTransfer" /> type="primary"
<AddSignatureModal mode="multiple" @finish="handleAddSignature" /> :icon="h(ArrowLeftOutlined)"
<ReductionSignatureModal @click="handleRejection"
mode="multiple" >
@finish="handleReductionSignature" 驳回
/> </a-button>
</Space> <Dropdown
<Space v-if="type === 'admin'"> :get-popup-container="getPopupContainer"
<a-button @click="handleFlowInterfere"> 流程干预 </a-button> placement="bottomRight"
<a-button @click="() => updateAssigneeModalApi.open()"> >
修改办理人 <template #overlay>
</a-button> <Menu>
<FlowInterfereModal @complete="$emit('reload')" /> <MenuItem
<UpdateAssigneeModal mode="single" @finish="handleUpdateAssignee" /> v-if="buttonPermissions?.trust"
</Space> key="1"
@click="() => delegationModalApi.open()"
>
<UserOutlined class="mr-2" />委托
</MenuItem>
<MenuItem
v-if="buttonPermissions?.transfer"
key="2"
@click="() => transferModalApi.open()"
>
<RollbackOutlined class="mr-2" /> 转办
</MenuItem>
<MenuItem
v-if="showMultiActions && buttonPermissions?.addSign"
key="3"
@click="() => addSignatureModalApi.open()"
>
<UsergroupAddOutlined class="mr-2" /> 加签
</MenuItem>
<MenuItem
v-if="showMultiActions && buttonPermissions?.subSign"
key="4"
@click="() => reductionSignatureModalApi.open()"
>
<UsergroupDeleteOutlined class="mr-2" /> 减签
</MenuItem>
</Menu>
</template>
<a-button v-if="showButtonOther" :icon="h(MenuOutlined)">
其他
</a-button>
</Dropdown>
<ApprovalModal @complete="$emit('reload')" />
<RejectionModal @complete="$emit('reload')" />
<DelegationModal mode="single" @finish="handleDelegation" />
<TransferModal mode="single" @finish="handleTransfer" />
<AddSignatureModal mode="multiple" @finish="handleAddSignature" />
<ReductionSignatureModal
mode="multiple"
@finish="handleReductionSignature"
/>
</Space>
<Space v-if="type === 'admin'">
<a-button @click="handleFlowInterfere"> 流程干预 </a-button>
<a-button @click="() => updateAssigneeModalApi.open()">
修改办理人
</a-button>
<FlowInterfereModal @complete="$emit('reload')" />
<UpdateAssigneeModal mode="single" @finish="handleUpdateAssignee" />
</Space>
</div>
</div> </div>
</div> </Card>
</Card> <slot v-else name="empty">
<Fallback v-else title="点击左侧选择" /> <Fallback title="点击左侧选择" />
</slot>
</div>
</template> </template>

12
apps/web-antd/src/views/workflow/components/flow-info-modal.vue
Unescape View File

@ -6,6 +6,8 @@ import { ref } from 'vue';
import { useVbenModal } from '@vben/common-ui'; import { useVbenModal } from '@vben/common-ui';
import { Spin } from 'ant-design-vue';
import { getTaskByBusinessId } from '#/api/workflow/instance'; import { getTaskByBusinessId } from '#/api/workflow/instance';
import { ApprovalPanel } from '.'; import { ApprovalPanel } from '.';
@ -36,6 +38,14 @@ const [BasicModal, modalApi] = useVbenModal({
<template> <template>
<BasicModal> <BasicModal>
<ApprovalPanel :task="taskInfo" type="readonly" /> <!-- :task="taskInfo" -->
<ApprovalPanel type="readonly">
<template #empty>
<Spin
class="flex h-[200px] w-full items-center justify-center"
size="large"
/>
</template>
</ApprovalPanel>
</BasicModal> </BasicModal>
</template> </template>

Write Preview
Loading…
Cancel
Save