Skip to content

Commit d7e0b77

Browse files
YunaiVYunaiV
authored
Merge pull request #84 from GoldenZqqq/bpm-optimization
工作流审批页面样式优化
2 parents 52f804e + 428f976 commit d7e0b77

File tree

3 files changed

+285
-172
lines changed

3 files changed

+285
-172
lines changed

‎src/views/bpm/processInstance/detail/ProcessInstanceBtnConatiner.vue renamed to ‎src/views/bpm/processInstance/detail/ProcessInstanceOperationButton.vue

Lines changed: 115 additions & 122 deletions
Original file line numberDiff line numberDiff line change
@@ -1,132 +1,125 @@
11
<template>
2-
<el-affix target=".formCol" position="bottom" class="h-50px" v-if="runningTask?.id">
3-
<el-divider class="!mb-8px !mt-0" />
4-
<div
5-
class="pl-50px text-14px flex items-center color-#32373c dark:color-#fff font-bold btn-container"
6-
>
7-
<el-popover :visible="passVisible" placement="top-end" :width="500" trigger="click">
8-
<template #reference>
9-
<el-button plain type="success" @click="openPopover('1')">
10-
<Icon icon="ep:select" />&nbsp; 通过
11-
</el-button>
12-
</template>
13-
<div class="flex flex-col flex-1 pt-20px px-20px" v-loading="formLoading">
14-
<el-form
15-
label-position="top"
16-
class="mb-auto"
17-
ref="formRef"
18-
:model="auditForm"
19-
:rules="auditRule"
20-
label-width="100px"
21-
>
22-
<el-form-item v-if="processInstance && processInstance.startUser" label="流程发起人">
23-
{{ processInstance?.startUser.nickname }}
24-
<el-tag size="small" type="info" class="ml-8px">
25-
{{ processInstance?.startUser.deptName }}
26-
</el-tag>
27-
</el-form-item>
28-
<el-card v-if="runningTask.formId > 0" class="mb-15px !-mt-10px">
29-
<template #header>
30-
<span class="el-icon-picture-outline">
31-
填写表单【{{ runningTask?.formName }}】
32-
</span>
33-
</template>
34-
<form-create
35-
v-model="approveForm.value"
36-
v-model:api="approveFormFApi"
37-
:option="approveForm.option"
38-
:rule="approveForm.rule"
2+
<div
3+
class="h-50px position-fixed bottom-10 text-14px flex items-center color-#32373c dark:color-#fff font-bold btn-container"
4+
>
5+
<el-popover :visible="passVisible" placement="top-end" :width="500" trigger="click">
6+
<template #reference>
7+
<el-button plain type="success" @click="openPopover('1')">
8+
<Icon icon="ep:select" />&nbsp; 通过
9+
</el-button>
10+
</template>
11+
<div class="flex flex-col flex-1 pt-20px px-20px" v-loading="formLoading">
12+
<el-form
13+
label-position="top"
14+
class="mb-auto"
15+
ref="formRef"
16+
:model="auditForm"
17+
:rules="auditRule"
18+
label-width="100px"
19+
>
20+
<el-form-item v-if="processInstance && processInstance.startUser" label="流程发起人">
21+
{{ processInstance?.startUser.nickname }}
22+
<el-tag size="small" type="info" class="ml-8px">
23+
{{ processInstance?.startUser.deptName }}
24+
</el-tag>
25+
</el-form-item>
26+
<el-card v-if="runningTask.formId > 0" class="mb-15px !-mt-10px">
27+
<template #header>
28+
<span class="el-icon-picture-outline"> 填写表单【{{ runningTask?.formName }}】 </span>
29+
</template>
30+
<form-create
31+
v-model="approveForm.value"
32+
v-model:api="approveFormFApi"
33+
:option="approveForm.option"
34+
:rule="approveForm.rule"
35+
/>
36+
</el-card>
37+
<el-form-item label="审批建议" prop="reason">
38+
<el-input v-model="auditForm.reason" placeholder="请输入审批建议" type="textarea" />
39+
</el-form-item>
40+
<el-form-item label="抄送人" prop="copyUserIds">
41+
<el-select v-model="auditForm.copyUserIds" multiple placeholder="请选择抄送人">
42+
<el-option
43+
v-for="itemx in userOptions"
44+
:key="itemx.id"
45+
:label="itemx.nickname"
46+
:value="itemx.id"
3947
/>
40-
</el-card>
41-
<el-form-item label="审批建议" prop="reason">
42-
<el-input v-model="auditForm.reason" placeholder="请输入审批建议" type="textarea" />
43-
</el-form-item>
44-
<el-form-item label="抄送人" prop="copyUserIds">
45-
<el-select v-model="auditForm.copyUserIds" multiple placeholder="请选择抄送人">
46-
<el-option
47-
v-for="itemx in userOptions"
48-
:key="itemx.id"
49-
:label="itemx.nickname"
50-
:value="itemx.id"
51-
/>
52-
</el-select>
53-
</el-form-item>
48+
</el-select>
49+
</el-form-item>
5450

55-
<el-form-item>
56-
<el-button :disabled="formLoading" type="success" @click="handleAudit(true)">
57-
通过
58-
</el-button>
59-
<el-button @click="passVisible = false"> 取消 </el-button>
60-
</el-form-item>
61-
</el-form>
62-
</div>
63-
</el-popover>
64-
<el-popover :visible="rejectVisible" placement="top-end" :width="500" trigger="click">
65-
<template #reference>
66-
<el-button class="mr-20px" plain type="danger" @click="openPopover('2')">
67-
<Icon icon="ep:close" />&nbsp; 拒绝
68-
</el-button>
69-
</template>
70-
<div class="flex flex-col flex-1 pt-20px px-20px" v-loading="formLoading">
71-
<el-form
72-
label-position="top"
73-
class="mb-auto"
74-
ref="formRef"
75-
:model="auditForm"
76-
:rules="auditRule"
77-
label-width="100px"
78-
>
79-
<el-form-item v-if="processInstance && processInstance.startUser" label="流程发起人">
80-
{{ processInstance?.startUser.nickname }}
81-
<el-tag size="small" type="info" class="ml-8px">
82-
{{ processInstance?.startUser.deptName }}
83-
</el-tag>
84-
</el-form-item>
85-
<el-card v-if="runningTask.formId > 0" class="mb-15px !-mt-10px">
86-
<template #header>
87-
<span class="el-icon-picture-outline">
88-
填写表单【{{ runningTask?.formName }}】
89-
</span>
90-
</template>
91-
<form-create
92-
v-model="approveForm.value"
93-
v-model:api="approveFormFApi"
94-
:option="approveForm.option"
95-
:rule="approveForm.rule"
51+
<el-form-item>
52+
<el-button :disabled="formLoading" type="success" @click="handleAudit(true)">
53+
通过
54+
</el-button>
55+
<el-button @click="passVisible = false"> 取消 </el-button>
56+
</el-form-item>
57+
</el-form>
58+
</div>
59+
</el-popover>
60+
<el-popover :visible="rejectVisible" placement="top-end" :width="500" trigger="click">
61+
<template #reference>
62+
<el-button class="mr-20px" plain type="danger" @click="openPopover('2')">
63+
<Icon icon="ep:close" />&nbsp; 拒绝
64+
</el-button>
65+
</template>
66+
<div class="flex flex-col flex-1 pt-20px px-20px" v-loading="formLoading">
67+
<el-form
68+
label-position="top"
69+
class="mb-auto"
70+
ref="formRef"
71+
:model="auditForm"
72+
:rules="auditRule"
73+
label-width="100px"
74+
>
75+
<el-form-item v-if="processInstance && processInstance.startUser" label="流程发起人">
76+
{{ processInstance?.startUser.nickname }}
77+
<el-tag size="small" type="info" class="ml-8px">
78+
{{ processInstance?.startUser.deptName }}
79+
</el-tag>
80+
</el-form-item>
81+
<el-card v-if="runningTask.formId > 0" class="mb-15px !-mt-10px">
82+
<template #header>
83+
<span class="el-icon-picture-outline"> 填写表单【{{ runningTask?.formName }}】 </span>
84+
</template>
85+
<form-create
86+
v-model="approveForm.value"
87+
v-model:api="approveFormFApi"
88+
:option="approveForm.option"
89+
:rule="approveForm.rule"
90+
/>
91+
</el-card>
92+
<el-form-item label="审批建议" prop="reason">
93+
<el-input v-model="auditForm.reason" placeholder="请输入审批建议" type="textarea" />
94+
</el-form-item>
95+
<el-form-item label="抄送人" prop="copyUserIds">
96+
<el-select v-model="auditForm.copyUserIds" multiple placeholder="请选择抄送人">
97+
<el-option
98+
v-for="itemx in userOptions"
99+
:key="itemx.id"
100+
:label="itemx.nickname"
101+
:value="itemx.id"
96102
/>
97-
</el-card>
98-
<el-form-item label="审批建议" prop="reason">
99-
<el-input v-model="auditForm.reason" placeholder="请输入审批建议" type="textarea" />
100-
</el-form-item>
101-
<el-form-item label="抄送人" prop="copyUserIds">
102-
<el-select v-model="auditForm.copyUserIds" multiple placeholder="请选择抄送人">
103-
<el-option
104-
v-for="itemx in userOptions"
105-
:key="itemx.id"
106-
:label="itemx.nickname"
107-
:value="itemx.id"
108-
/>
109-
</el-select>
110-
</el-form-item>
103+
</el-select>
104+
</el-form-item>
111105

112-
<el-form-item>
113-
<el-button :disabled="formLoading" type="danger" @click="handleAudit(false)">
114-
拒绝
115-
</el-button>
116-
<el-button @click="rejectVisible = false"> 取消 </el-button>
117-
</el-form-item>
118-
</el-form>
119-
</div>
120-
</el-popover>
121-
<div @click="handleSend"> <Icon :size="14" icon="svg-icon:send" />&nbsp;抄送 </div>
122-
<div @click="openTaskUpdateAssigneeForm">
123-
<Icon :size="14" icon="fa:share-square-o" />&nbsp;转交
106+
<el-form-item>
107+
<el-button :disabled="formLoading" type="danger" @click="handleAudit(false)">
108+
拒绝
109+
</el-button>
110+
<el-button @click="rejectVisible = false"> 取消 </el-button>
111+
</el-form-item>
112+
</el-form>
124113
</div>
125-
<div @click="handleDelegate"> <Icon :size="14" icon="ep:position" />&nbsp;委派 </div>
126-
<div @click="handleSign"> <Icon :size="14" icon="ep:plus" />&nbsp;加签 </div>
127-
<div @click="handleBack"> <Icon :size="14" icon="fa:mail-reply" />&nbsp;退回 </div>
114+
</el-popover>
115+
<div @click="handleSend"> <Icon :size="14" icon="svg-icon:send" />&nbsp;抄送 </div>
116+
<div @click="openTaskUpdateAssigneeForm">
117+
<Icon :size="14" icon="fa:share-square-o" />&nbsp;转交
128118
</div>
129-
</el-affix>
119+
<div @click="handleDelegate"> <Icon :size="14" icon="ep:position" />&nbsp;委派 </div>
120+
<div @click="handleSign"> <Icon :size="14" icon="ep:plus" />&nbsp;加签 </div>
121+
<div @click="handleBack"> <Icon :size="14" icon="fa:mail-reply" />&nbsp;退回 </div>
122+
</div>
130123
<!-- 弹窗：转派审批人 -->
131124
<TaskTransferForm ref="taskTransferFormRef" @success="getDetail" />
132125
<!-- 弹窗：回退节点 -->

0 commit comments

Comments
 (0)