review：【antd/ele】【bpm】流程模型的迁移

apps/web-ele/src/views/bpm/processInstance/create/index.vue

@@ -185,6 +185,7 @@ onMounted(() => {
 
 <template>
   <Page auto-content-height>
+    <!-- TODO @jason：这里交互，可以做成类似 vue3 + element-plus 那个一样，滚动切换分类哈？对标钉钉、飞书哈； -->
     <!-- 第一步，通过流程定义的列表，选择对应的流程 -->
     <template v-if="!selectProcessDefinition">
       <ElCard

apps/web-ele/src/views/bpm/processInstance/detail/index.vue

@@ -223,8 +223,8 @@ watch(
 const loading = ref(false);
 /** 初始化 */
 onMounted(async () => {
-  loading.value = true;
   try {
+    loading.value = true;
     await getDetail();
     // 获得用户列表
     userOptions.value = await getSimpleUserList();

apps/web-ele/src/views/bpm/processInstance/detail/modules/bpm-viewer.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { ref, watch } from 'vue';
 
+// TODO @jason：这个貌似暂时还没迁移的样子？
 // import { MyProcessViewer } from '#/views/bpm/components/bpmn-process-designer/package';
 
 defineOptions({ name: 'ProcessInstanceBpmnViewer' });

apps/web-ele/src/views/bpm/processInstance/detail/modules/operation-button.vue

@@ -275,6 +275,7 @@ async function openPopover(type: string) {
     }
   }
   Object.keys(popOverVisible.value).forEach((item) => {
+    // TODO @jason：这里是不是保持和 antd 一致？
     popOverVisible.value[item] = item === type;
   });
 }
@@ -704,6 +705,8 @@ function handleSignFinish(url: string) {
   approveFormRef.value?.validateField('signPicUrl');
 }
 
+// TODO @jason：handlePopoverVisible 需要要有么？
+
 defineExpose({ loadTodoTask });
 </script>
 <template>
@@ -725,9 +728,9 @@ defineExpose({ loadTodoTask });
         <template #reference>
           <ElButton plain type="primary" @click="openPopover('approve')">
             <IconifyIcon icon="lucide:check" />
-            <span class="ml-1">{{
-              getButtonDisplayName(BpmTaskOperationButtonTypeEnum.APPROVE)
-            }}</span>
+            <span class="ml-1">
+              {{ getButtonDisplayName(BpmTaskOperationButtonTypeEnum.APPROVE) }}
+            </span>
           </ElButton>
         </template>
         <!-- 办理表单 -->
@@ -979,6 +982,7 @@ defineExpose({ loadTodoTask });
             label-width="100px"
           >
             <ElFormItem label="新审批人" prop="assigneeUserId">
+              <!-- TODO @jason：是不是用 unocss 哈？antd 和 ele 都要改下 -->
               <ElSelect
                 v-model="transferForm.assigneeUserId"
                 clearable
@@ -1040,9 +1044,11 @@ defineExpose({ loadTodoTask });
         <template #reference>
           <ElButton plain @click="openPopover('delegate')">
             <IconifyIcon :size="14" icon="icon-park-outline:user-positioning" />
-            <span class="ml-1">{{
-              getButtonDisplayName(BpmTaskOperationButtonTypeEnum.DELEGATE)
-            }}</span>
+            <span class="ml-1">
+              {{
+                getButtonDisplayName(BpmTaskOperationButtonTypeEnum.DELEGATE)
+              }}
+            </span>
           </ElButton>
         </template>
         <div class="flex flex-1 flex-col px-5 pt-5" v-loading="formLoading">
@@ -1116,9 +1122,11 @@ defineExpose({ loadTodoTask });
         <template #reference>
           <ElButton plain @click="openPopover('addSign')">
             <IconifyIcon :size="14" icon="icon-park-outline:plus" />
-            <span class="ml-1">{{
-              getButtonDisplayName(BpmTaskOperationButtonTypeEnum.ADD_SIGN)
-            }}</span>
+            <span class="ml-1">
+              {{
+                getButtonDisplayName(BpmTaskOperationButtonTypeEnum.ADD_SIGN)
+              }}
+            </span>
           </ElButton>
         </template>
         <div class="flex flex-1 flex-col px-5 pt-5" v-loading="formLoading">
@@ -1272,9 +1280,9 @@ defineExpose({ loadTodoTask });
         <template #reference>
           <ElButton plain @click="openPopover('return')">
             <IconifyIcon :size="14" icon="lucide:arrow-left" />
-            <span class="ml-1">{{
-              getButtonDisplayName(BpmTaskOperationButtonTypeEnum.RETURN)
-            }}</span>
+            <span class="ml-1">
+              {{ getButtonDisplayName(BpmTaskOperationButtonTypeEnum.RETURN) }}
+            </span>
           </ElButton>
         </template>
         <div class="flex flex-1 flex-col px-5 pt-5" v-loading="formLoading">

apps/web-ele/src/views/bpm/processInstance/detail/modules/signature.vue

@@ -54,7 +54,6 @@ const [Modal, modalApi] = useVbenModal({
           </ElButton>
         </ElTooltip>
       </div>
-
       <Vue3Signature
         class="h-full flex-1 border border-solid border-gray-300"
         ref="signature"

apps/web-ele/src/views/bpm/processInstance/detail/modules/task-list.vue

@@ -86,6 +86,8 @@ function useGridColumns(): VxeTableGridOptions['columns'] {
   ];
 }
 
+// TODO @jason：是不是要 const formRef = ref<formCreate>();
+
 const formRef = ref();
 const taskForm = ref<TaskForm>({
   rule: [],
@@ -187,6 +189,7 @@ defineExpose({
     </Grid>
   </div>
   <Modal class="w-3/5">
+    <!-- TODO @jason：是不是 antd 和 ele 保持统一？ -->
     <FormCreate
       ref="formRef"
       v-model="taskForm.value"