fix(组织&项目): 修复模板管理工作流组件错误

frontend/src/views/setting/organization/template/components/workflowCard.vue

@@ -9,11 +9,11 @@
       '_disabled_gray_bg': isEnableProjectState,
     }"
   >
+    <a-trigger v-model:popup-visible="visible" trigger="click" align-point>
       <!-- 不允许状态流转 -->
       <img v-if="isNotAllowCreate" src="@/assets/images/notAllow_bg.png" class="h-[100%] w-[100%]" alt="" />
-
       <!-- 未创建 hover  禁用  选中 -->
-    <div v-else-if="isUnCreateWorkFlow" class="action" @click="createFlowStep">
+      <div v-else-if="isUnCreateWorkFlow" class="action h-full" @click="createFlowStep">
         <icon-plus
           :style="{ 'font-size': '16px' }"
           class="_unSelect_SvgIcon"
@@ -22,7 +22,6 @@
         <span
           class="_unSelect_CreateStep"
           :class="{ ...styleClass.createStep, _hover_CreateStep: isEnableProjectState ? false : true }"
-        @click="createFlowStep"
           >{{ t('system.orgTemplate.createFlowStep') }}</span
         >
       </div>
@@ -30,15 +29,13 @@
       <div v-else-if="isCreated" class="created flex h-full w-full items-center justify-center" @click="createFlowStep">
         <icon-check :style="{ 'font-size': '16px' }" class="text-[rgb(var(--success-6))]" />
       </div>
-    <a-modal
-      v-model:visible="visible"
-      title-align="start"
-      :class="['ms-modal-form']"
-      :width="400"
-      @cancel="handleCancel"
-    >
-      <template #title> {{ title }} </template>
-      <div class="flex w-[60%] items-center justify-between text-[var(--color-text-1)]">
+      <template #content>
+        <div class="w-[400px] rounded bg-white p-[24px] shadow-[0_0_10px_rgba(100,100,102,0.15)]">
+          <div class="flex items-center justify-between">
+            <div class="font-medium text-[var(--color-text-1)]">{{ title }}</div>
+            <div class="cursor-pointer text-[18px] text-[var(--color-text-2)]" @click="handleCancel">×</div>
+          </div>
+          <div class="my-[16px] flex w-[60%] items-center justify-between text-[var(--color-text-1)]">
             <div class="flex flex-col">
               <span class="mb-2">{{ t('system.orgTemplate.startState') }} </span>
               <MsTag>{{ startState }}</MsTag>
@@ -49,16 +46,31 @@
               <MsTag>{{ endState }}</MsTag>
             </div>
           </div>
-      <template #footer>
-        <a-button @click="handleCancel">{{ t('common.cancel') }}</a-button>
-        <a-button v-if="isUnCreateWorkFlow" type="primary" :loading="loading" @click="changeWorkFlow('create')">{{
-          t('common.create')
-        }}</a-button>
-        <a-button v-else type="primary" status="danger" class="!bg-[rgb(var(--danger-7))]" @click="cancelFlowStep">{{
-          t('system.orgTemplate.deleteSteps')
-        }}</a-button>
+          <div class="flex items-center justify-end gap-[8px]">
+            <a-button size="small" @click="handleCancel">{{ t('common.cancel') }}</a-button>
+            <a-button
+              v-if="isUnCreateWorkFlow"
+              size="small"
+              type="primary"
+              :loading="loading"
+              @click="changeWorkFlow('create')"
+            >
+              {{ t('common.create') }}
+            </a-button>
+            <a-button
+              v-else
+              size="small"
+              type="primary"
+              status="danger"
+              class="!bg-[rgb(var(--danger-7))]"
+              @click="cancelFlowStep"
+            >
+              {{ t('system.orgTemplate.deleteSteps') }}
+            </a-button>
+          </div>
+        </div>
       </template>
-    </a-modal>
+    </a-trigger>
   </div>
 </template>