feat: 迁移工作流

src/locales/langs/en-us.ts

@@ -281,6 +281,10 @@ const local: App.I18n.Schema = {
     workflow: 'Workflow',
     workflow_task: 'Workflow Task',
     workflow_batch: 'Workflow Batch',
+    workflow_form: 'Workflow',
+    workflow_form_copy: 'Copy Workflow',
+    workflow_form_detail: 'Workflow Detail',
+    workflow_form_edit: 'Edit Workflow',
     job: 'Schedule Task Management',
     job_task: 'Schedule Task List',
     job_batch: 'Schedule Task Batch List',

src/locales/langs/zh-cn.ts

@@ -282,6 +282,10 @@ const local: App.I18n.Schema = {
     workflow: '工作流',
     workflow_task: '任务管理',
     workflow_batch: '执行批次',
+    workflow_form: '工作流',
+    workflow_form_copy: '复制工作流',
+    workflow_form_detail: '工作流详情',
+    workflow_form_edit: '编辑工作流',
     job: '定时任务',
     job_task: '任务管理',
     job_batch: '执行批次',

src/router/elegant/imports.ts

@@ -50,5 +50,8 @@ export const views: Record<LastLevelRouteKey, RouteComponent | (() => Promise<Ro
   "user-center": () => import("@/views/user-center/index.vue"),
   user_manager: () => import("@/views/user/manager/index.vue"),
   workflow_batch: () => import("@/views/workflow/batch/index.vue"),
+  workflow_form_copy: () => import("@/views/workflow/form/copy/index.vue"),
+  workflow_form_detail: () => import("@/views/workflow/form/detail/index.vue"),
+  workflow_form_edit: () => import("@/views/workflow/form/edit/index.vue"),
   workflow_task: () => import("@/views/workflow/task/index.vue"),
 };

src/router/elegant/routes.ts

@@ -544,6 +544,47 @@ export const generatedRoutes: GeneratedRoute[] = [
           icon: 'carbon:batch-job'
         }
       },
+      {
+        name: 'workflow_form',
+        path: '/workflow/form',
+        meta: {
+          title: 'workflow_form',
+          hideInMenu: true,
+          i18nKey: 'route.workflow_form'
+        },
+        children: [
+          {
+            name: 'workflow_form_copy',
+            path: '/workflow/form/copy',
+            component: 'view.workflow_form_copy',
+            meta: {
+              title: 'workflow_form_copy',
+              hideInMenu: true,
+              i18nKey: 'route.workflow_form_copy'
+            }
+          },
+          {
+            name: 'workflow_form_detail',
+            path: '/workflow/form/detail',
+            component: 'view.workflow_form_detail',
+            meta: {
+              title: 'workflow_form_detail',
+              hideInMenu: true,
+              i18nKey: 'route.workflow_form_detail'
+            }
+          },
+          {
+            name: 'workflow_form_edit',
+            path: '/workflow/form/edit',
+            component: 'view.workflow_form_edit',
+            meta: {
+              title: 'workflow_form_edit',
+              hideInMenu: true,
+              i18nKey: 'route.workflow_form_edit'
+            }
+          }
+        ]
+      },
       {
         name: 'workflow_task',
         path: '/workflow/task',

src/router/elegant/transform.ts

@@ -114,14 +114,14 @@ function transformElegantRouteToVueRoute(
     }
 
   }
-  
+
   // add redirect to child
   if (children?.length && !vueRoute.redirect) {
     vueRoute.redirect = {
       name: children[0].name
     };
   }
-  
+
   if (children?.length) {
     const childRoutes = children.flatMap(child => transformElegantRouteToVueRoute(child, layouts, views));
 
@@ -202,6 +202,10 @@ const routeMap: RouteMap = {
   "user-center": "/user-center",
   "workflow": "/workflow",
   "workflow_batch": "/workflow/batch",
+  "workflow_form": "/workflow/form",
+  "workflow_form_copy": "/workflow/form/copy",
+  "workflow_form_detail": "/workflow/form/detail",
+  "workflow_form_edit": "/workflow/form/edit",
   "workflow_task": "/workflow/task"
 };
 

src/views/workflow/form/copy/index.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import WorkFlowIframe from '../modules/workflow-iframe.vue';
+
+defineOptions({
+  name: 'WorkFlowCopy'
+});
+</script>
+
+<template>
+  <div class="iframe"><WorkFlowIframe value="wA4wN1nZ" /></div>
+</template>
+
+<style scoped>
+.iframe {
+  padding: 0 !important;
+}
+</style>

src/views/workflow/form/detail/index.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import WorkFlowIframe from '../modules/workflow-iframe.vue';
+
+defineOptions({
+  name: 'WorkFlowDetail'
+});
+</script>
+
+<template>
+  <div class="iframe"><WorkFlowIframe value="kaxC8Iml" /></div>
+</template>
+
+<style scoped>
+.iframe {
+  padding: 0 !important;
+}
+</style>

src/views/workflow/form/edit/index.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import WorkFlowIframe from '../modules/workflow-iframe.vue';
+
+defineOptions({
+  name: 'WorkFlowEdit'
+});
+</script>
+
+<template>
+  <div class="iframe"><WorkFlowIframe value="D7Rzd7Oe" /></div>
+</template>
+
+<style scoped>
+.iframe {
+  padding: 0 !important;
+}
+</style>

src/views/workflow/form/modules/workflow-iframe.vue

@@ -0,0 +1,88 @@
+<script setup lang="ts">
+import { onActivated, onMounted, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+
+defineOptions({
+  name: 'WorkFlowIframe'
+});
+
+interface Props {
+  value: string;
+}
+
+defineProps<Props>();
+
+const iframeRef = ref();
+const route = useRoute();
+const router = useRouter();
+
+const id = route.query.id as string;
+const spinning = ref(true);
+const mode = import.meta.env.MODE;
+const baseUrl = import.meta.env.BASE_URL;
+
+function save() {
+  window.removeEventListener('message', handleMessage);
+  window.$message?.info('工作流新增成功');
+  router.push({ path: '/job/workflow/list' });
+}
+
+function cancel() {
+  window.removeEventListener('message', handleMessage);
+  router.push({ path: '/job/workflow/list' });
+}
+
+function update() {
+  window.$message?.info('工作流修改成功');
+  router.push({ path: '/job/workflow/list' });
+}
+
+function handleMessage(e: MessageEvent) {
+  if (typeof e.data === 'object') {
+    if (e.data.code === 'SV5ucvLBhvFkOftb') {
+      save();
+    } else if (e.data.code === 'kb4DO9h6WIiqFhbp') {
+      cancel();
+    } else if (e.data.code === '8Rr3XPtVVAHfduQg') {
+      update();
+    }
+  }
+}
+
+function iframeLoad() {
+  // 处理兼容行问题 兼容IE
+  if (iframeRef.value.attachEvent) {
+    iframeRef.value.attachEvent('onload', () => {
+      // iframe加载完毕以后执行操作
+      spinning.value = false;
+    });
+  } else {
+    iframeRef.value.onload = () => {
+      // iframe加载完毕以后执行操作
+      spinning.value = false;
+    };
+  }
+}
+
+window.addEventListener('message', handleMessage, false);
+
+onMounted(() => {
+  iframeLoad();
+});
+
+onActivated(() => {
+  window.removeEventListener('message', handleMessage);
+});
+</script>
+
+<template>
+  <NSpin :show="spinning" size="large" description="工作流加载中" class="h-full" content-class="h-full">
+    <iframe
+      ref="iframeRef"
+      class="size-full"
+      :src="`${mode === 'prod' ? baseUrl : ''}/lib/index.html?id=${id}&mode=${mode}&x1c2Hdd6=${value}`"
+    />
+  </NSpin>
+</template>
+
+<style scoped lang="scss"></style>

src/views/workflow/task/index.vue

@@ -1,5 +1,6 @@
 <script setup lang="tsx">
 import { NButton, NPopconfirm, NTag } from 'naive-ui';
+import { useRouter } from 'vue-router';
 import { fetchGetWorkflowPageList } from '@/service/api';
 import { $t } from '@/locales';
 import { useAppStore } from '@/store/modules/app';
@@ -7,6 +8,7 @@ import { useTable, useTableOperate } from '@/hooks/common/table';
 import { enableStatusNumberRecord, triggerTypeRecord } from '@/constants/business';
 import WorkflowSearch from './modules/workflow-search.vue';
 
+const router = useRouter();
 const appStore = useAppStore();
 
 const { columns, columnChecks, data, getData, loading, mobilePagination, searchParams, resetSearchParams } = useTable({
@@ -123,7 +125,6 @@ const { columns, columnChecks, data, getData, loading, mobilePagination, searchP
 });
 
 const {
-  handleAdd,
   handleEdit,
   checkedRowKeys,
   onBatchDeleted,
@@ -148,6 +149,10 @@ function handleDelete(id: string) {
 function edit(id: string) {
   handleEdit(id);
 }
+
+function handleAdd() {
+  router.push({ path: '/workflow/form/edit' });
+}
 </script>
 
 <template>