任务审批抽屉

src/views/wallet/wallet-recharge-apply/index.vue

@@ -110,6 +110,9 @@
 							@click="handleDelete([row.id])"
 							>删除</el-button
 						>
+						<el-button type="primary" size="small" link icon="VideoPlay" @click="deal(row)" v-auth="'wallet_walletRechargeApply_check'">
+							开始处理
+						</el-button>
 					</template>
 				</el-table-column>
 			</el-table>
@@ -126,6 +129,14 @@
 			temp-url="/admin/sys-file/local/file/wallet_recharge.xlsx"
 			@refreshDataList="getDataList(false)"
 		/>
+
+		<!-- 右侧抽屉 -->
+		<taskDrawer
+			v-model="taskDrawerVisible"
+			:current-data="currentData"
+			:current-open-flow-form="currentOpenFlowForm"
+			@task-submit-event="taskSubmitEvent"
+		/>
 	</div>
 </template>
 
@@ -135,6 +146,8 @@ import * as walletRechargeApplyApi from "/@/api/wallet/wallet-recharge-apply"
 import { useMessage, useMessageBox } from "/@/hooks/message"
 import { useDict } from "/@/hooks/dict"
 import { ElLoading } from "element-plus"
+import { queryTask } from "/@/api/flow/task"
+import taskDrawer from "/@/components/taskDrawer/index.vue"
 
 const { push } = useRouter()
 
@@ -151,6 +164,9 @@ const showSearch = ref(true)
 // 多选变量
 const selectObjs = ref([]) as any
 const multiple = ref(true)
+const taskDrawerVisible = ref<boolean>()
+const currentData = ref()
+const currentOpenFlowForm = ref()
 
 const state: BasicTableProps = reactive<BasicTableProps>({
 	queryForm: {},
@@ -221,4 +237,22 @@ const handleDelete = async (ids: string[]) => {
 		useMessage().error(err.msg)
 	}
 }
+
+/**
+ * 点击开始处理
+ * @param row
+ */
+const deal = (row: any) => {
+	currentData.value = row
+	queryTask(row.processId, false).then((res) => {
+		currentOpenFlowForm.value = res.data.formItems
+		taskDrawerVisible.value = true
+	})
+}
+
+// 任务提交事件
+const taskSubmitEvent = () => {
+	taskDrawerVisible.value = false
+	getDataList()
+}
 </script>