feat: base 我的审批页面添加发起流程按钮

src/views/wf/myticket.vue

@@ -2,6 +2,7 @@
 	<el-container>
 		<el-header>
 			<div class="left-panel">
+				<el-button type="primary" style="margin-right:4px" @click="()=>{dialogVisible=true;}">发起流程</el-button>
 				<el-segmented
 					v-model="tvalue"
 					:options="Object.keys(toptions)"
@@ -81,19 +82,16 @@
 						{{ scope.row.workflow_.name }}
 					</template>
 				</el-table-column>
-				<el-table-column label="所在节点" width="160">
+				<el-table-column label="节点状态">
 					<template #default="scope">
-						{{ scope.row.state_.name }}
+											<el-tag :type="actStateEnum[scope.row.act_state]?.type">
+									{{ actStateEnum[scope.row.act_state]?.text }}
+								</el-tag>
+						<el-tag type="info" effect="plain">{{ scope.row.state_.name }}</el-tag>
+
 					</template>
-				</el-table-column>
-				<el-table-column label="进行状态" prop="sort" width="120">
-					<template #default="scope">
-						<el-tag :type="actStateEnum[scope.row.act_state]?.type">
-                        {{ actStateEnum[scope.row.act_state]?.text }}
-                    </el-tag>
-					</template>
-				</el-table-column>
-				<el-table-column label="可处理人" :show-overflow-tooltip="true" min-width="160">
+        		</el-table-column>
+				<el-table-column label="可处理人" :show-overflow-tooltip="true" width="200">
 					<template #default="scope">
 						<span
 							v-if="
@@ -130,13 +128,23 @@
 		</el-main>
 		<el-drawer v-model="drawer" size="90%" :show-close="false">
 			<template #header="{ close, titleId, titleClass }">
-				<h4 :id="titleId" :class="titleClass">工单详情</h4>
+				<h4 :id="titleId" :class="titleClass">工单信息</h4>
 				<el-button type="danger" @click="close">关闭</el-button>
 			</template>
-			<component :is="currentComponent" :ticketId="ticketId" :t_id="t_id" @closed="drawer = false"
+			<component :is="currentComponent" :ticketId="ticketId" :t_id="t_id" @closed="drawer = false" :mode="mode"
 			@success="()=>{drawer = false; $refs.table.refresh()}"></component>
 		</el-drawer>
 	</el-container>
+	<el-dialog v-model="dialogVisible" title="选择流程">
+			<el-card
+				v-for="item in wfOptions"
+				:key="item.id"
+				:body-style="{ padding: '10px', cursor: 'pointer' }"
+				style="width: 200px; display: inline-block; margin: 4px; background-color: #f5f7fa;"
+				shadow="hover"
+				@click="startTicket(item)"
+				>{{ item.name }}</el-card>
+	</el-dialog>
 </template>
 
 <script>
@@ -180,7 +188,9 @@ export default {
 			wfOptions: [],
 			currentComponent: null,
 			ticketId: null,
-			t_id: "",
+			t_id: null,
+			dialogVisible: false,
+			mode: "show"
 		};
 	},
 	mounted() {
@@ -228,6 +238,17 @@ export default {
 			defineAsyncComponent(() => import(`@/views${viewPath}.vue`))
 			);
 		},
+		startTicket(item) {
+			this.dialogVisible = false;
+			this.drawer = true;
+			this.t_id = null;
+			this.mode = "add"
+			const viewPath = item.view_path;
+			// 动态 import
+			this.currentComponent = markRaw(
+				defineAsyncComponent(() => import(`@/views${viewPath}.vue`))
+			);
+		}
 	},
 };
 </script>