refactor: vue3.3 defineOptions

src/views/bpm/definition/index.vue

@@ -59,7 +59,7 @@
     </XModal>
   </ContentWrap>
 </template>
-<script setup lang="ts" name="BpmProcessDefinition">
+<script setup lang="ts">
 // 业务相关的 import
 import * as DefinitionApi from '@/api/bpm/definition'
 // import * as ModelApi from '@/api/bpm/model'
@@ -68,6 +68,8 @@ import { setConfAndFields2 } from '@/utils/formCreate'
 import { DICT_TYPE } from '@/utils/dict'
 import { MyProcessViewer } from '@/components/bpmnProcessDesigner/package'
 
+defineOptions({ name: 'BpmProcessDefinition' })
+
 const bpmnXML = ref(null)
 const showBpmnOpen = ref(false)
 const bpmnControlForm = ref({

src/views/bpm/form/formEditor.vue

@@ -52,7 +52,7 @@
     </XModal>
   </ContentWrap>
 </template>
-<script setup lang="ts" name="BpmFormEditor">
+<script setup lang="ts">
 import { FormInstance } from 'element-plus'
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { CommonStatusEnum } from '@/utils/constants'
@@ -61,6 +61,8 @@ import FcDesigner from '@form-create/designer'
 import { encodeConf, encodeFields, setConfAndFields } from '@/utils/formCreate'
 // import { useClipboard } from '@vueuse/core'
 
+defineOptions({ name: 'BpmFormEditor' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息
 const { query } = useRoute() // 路由

src/views/bpm/form/index.vue

@@ -43,13 +43,15 @@
   </ContentWrap>
 </template>
 
-<script setup lang="ts" name="BpmForm">
+<script setup lang="ts">
 // 业务相关的 import
 import * as FormApi from '@/api/bpm/form'
 import { allSchemas } from './form.data'
 // 表单详情相关的变量和 import
 import { setConfAndFields2 } from '@/utils/formCreate'
 
+defineOptions({ name: 'BpmForm' })
+
 const { t } = useI18n() // 国际化
 const { push } = useRouter() // 路由
 

src/views/bpm/group/UserGroupForm.vue

@@ -41,12 +41,14 @@
     </template>
   </Dialog>
 </template>
-<script lang="ts" name="BpmUserGroupForm" setup>
+<script lang="ts" setup>
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { CommonStatusEnum } from '@/utils/constants'
 import * as UserGroupApi from '@/api/bpm/userGroup'
 import * as UserApi from '@/api/system/user'
 
+defineOptions({ name: 'BpmUserGroupForm' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 

src/views/bpm/group/index.vue

@@ -85,13 +85,15 @@
   </XModal>
 </template>
 
-<script setup lang="ts" name="BpmUserGroup">
+<script setup lang="ts">
 // 业务相关的 import
 import * as UserGroupApi from '@/api/bpm/userGroup'
 import { getListSimpleUsersApi, UserVO } from '@/api/system/user'
 import { allSchemas, rules } from './group.data'
 import { FormExpose } from '@/components/Form'
 
+defineOptions({ name: 'BpmUserGroup' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 // 列表相关的变量

src/views/bpm/model/index.vue

@@ -316,7 +316,7 @@
   </ContentWrap>
 </template>
 
-<script setup lang="ts" name="BpmModel">
+<script setup lang="ts">
 // 全局相关的 import
 import { DICT_TYPE, getDictOptions } from '@/utils/dict'
 import { MyProcessViewer } from '@/components/bpmnProcessDesigner/package'
@@ -329,6 +329,8 @@ import * as ModelApi from '@/api/bpm/model'
 import { allSchemas, rules } from './model.data'
 import { setConfAndFields2 } from '@/utils/formCreate'
 
+defineOptions({ name: 'BpmModel' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 const router = useRouter() // 路由

src/views/bpm/model/modelEditor.vue

@@ -26,7 +26,7 @@
   </div>
 </template>
 
-<script setup lang="ts" name="BpmModelEditor">
+<script setup lang="ts">
 import { MyProcessDesigner, MyProcessPenal } from '@/components/bpmnProcessDesigner/package'
 // import { translations } from '@/components/bpmnProcessDesigner/src/translations'
 // 自定义元素选中时的弹出菜单（修改 默认任务 为 用户任务）
@@ -38,6 +38,8 @@ import CustomPaletteProvider from '@/components/bpmnProcessDesigner/package/desi
 // import MyProcessPalette from '@/components/bpmnProcessDesigner/package/palette/ProcessPalette.vue'
 import { createModelApi, getModelApi, updateModelApi, ModelVO } from '@/api/bpm/model'
 
+defineOptions({ name: 'BpmModelEditor' })
+
 const router = useRouter()
 const message = useMessage()
 

src/views/bpm/oa/leave/create.vue

@@ -11,7 +11,7 @@
     />
   </ContentWrap>
 </template>
-<script setup lang="ts" name="BpmOALeaveCreate">
+<script setup lang="ts">
 import { FormExpose } from '@/components/Form'
 // import XEUtils from 'xe-utils'
 
@@ -19,6 +19,8 @@ import { FormExpose } from '@/components/Form'
 import * as LeaveApi from '@/api/bpm/leave'
 import { rules, allSchemas } from './leave.data'
 
+defineOptions({ name: 'BpmOALeaveCreate' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 const { push } = useRouter() // 路由

src/views/bpm/oa/leave/detail.vue

@@ -6,11 +6,14 @@
   </ContentWrap>
 </template>
 
-<script setup lang="ts" name="BpmOALeaveDetail">
+<script setup lang="ts">
 // 业务相关的 import
 import * as LeaveApi from '@/api/bpm/leave'
 import { allSchemas } from '@/views/bpm/oa/leave/leave.data'
 import { useRouter } from 'vue-router'
+
+defineOptions({ name: 'BpmOALeaveDetail' })
+
 const router = useRouter()
 const { query } = useRoute() // 查询参数
 const message = useMessage() // 消息弹窗

src/views/bpm/oa/leave/index.vue

@@ -23,7 +23,7 @@
   </ContentWrap>
 </template>
 
-<script setup lang="ts" name="BpmOALeave">
+<script setup lang="ts">
 // 全局相关的 import
 import { ElMessageBox } from 'element-plus'
 // 业务相关的 import
@@ -31,6 +31,8 @@ import { allSchemas } from './leave.data'
 import * as LeaveApi from '@/api/bpm/leave'
 import * as ProcessInstanceApi from '@/api/bpm/processInstance'
 
+defineOptions({ name: 'BpmOALeave' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 const { push } = useRouter() // 路由

src/views/bpm/processInstance/create.vue

@@ -53,7 +53,7 @@
     </div>
   </ContentWrap>
 </template>
-<script setup lang="ts" name="BpmProcessInstanceCreate">
+<script setup lang="ts">
 // 业务相关的 import
 import { allSchemas } from './process.create'
 import * as DefinitionApi from '@/api/bpm/definition'
@@ -62,6 +62,8 @@ import { setConfAndFields2 } from '@/utils/formCreate'
 import type { ApiAttrs } from '@form-create/element-ui/types/config'
 import { DICT_TYPE } from '@/utils/dict'
 
+defineOptions({ name: 'BpmProcessInstanceCreate' })
+
 const router = useRouter() // 路由
 const message = useMessage() // 消息
 

src/views/bpm/processInstance/detail.vue

@@ -191,7 +191,7 @@
     </XModal>
   </ContentWrap>
 </template>
-<script setup lang="ts" name="BpmProcessInstanceDetail">
+<script setup lang="ts">
 import dayjs from 'dayjs'
 import * as UserApi from '@/api/system/user'
 import * as ProcessInstanceApi from '@/api/bpm/processInstance'
@@ -205,6 +205,8 @@ import type { ApiAttrs } from '@form-create/element-ui/types/config'
 import { useUserStore } from '@/store/modules/user'
 import { MyProcessViewer } from '@/components/bpmnProcessDesigner/package'
 
+defineOptions({ name: 'BpmProcessInstanceDetail' })
+
 const { query } = useRoute() // 查询参数
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化

src/views/bpm/processInstance/detail/ProcessInstanceBpmnViewer.vue

@@ -14,11 +14,13 @@
     />
   </el-card>
 </template>
-<script lang="ts" name="BpmProcessInstanceBpmnViewer" setup>
+<script lang="ts" setup>
 import { propTypes } from '@/utils/propTypes'
 import * as ActivityApi from '@/api/bpm/activity'
 import { MyProcessViewer } from '@/components/bpmnProcessDesigner/package'
 
+defineOptions({ name: 'BpmProcessInstanceBpmnViewer' })
+
 const props = defineProps({
   loading: propTypes.bool, // 是否加载中
   id: propTypes.string, // 流程实例的编号

src/views/bpm/processInstance/index.vue

@@ -41,7 +41,7 @@
     </XTable>
   </ContentWrap>
 </template>
-<script setup lang="ts" name="BpmProcessInstance">
+<script setup lang="ts">
 // 全局相关的 import
 import { ElMessageBox } from 'element-plus'
 import { DICT_TYPE } from '@/utils/dict'
@@ -50,6 +50,8 @@ import { DICT_TYPE } from '@/utils/dict'
 import * as ProcessInstanceApi from '@/api/bpm/processInstance'
 import { allSchemas } from './process.data'
 
+defineOptions({ name: 'BpmProcessInstance' })
+
 const router = useRouter() // 路由
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化

src/views/bpm/task/done/index.vue

@@ -12,11 +12,13 @@
     </XTable>
   </ContentWrap>
 </template>
-<script setup lang="ts" name="BpmDoneTask">
+<script setup lang="ts">
 // 业务相关的 import
 import { allSchemas } from './done.data'
 import * as TaskApi from '@/api/bpm/task'
 
+defineOptions({ name: 'BpmDoneTask' })
+
 const { push } = useRouter() // 路由
 
 const [registerTable] = useXTable({

src/views/bpm/task/todo/index.vue

@@ -13,11 +13,13 @@
   </ContentWrap>
 </template>
 
-<script setup lang="ts" name="BpmTodoTask">
+<script setup lang="ts">
 // 业务相关的 import
 import { allSchemas } from './todo.data'
 import * as TaskApi from '@/api/bpm/task'
 
+defineOptions({ name: 'BpmTodoTask' })
+
 const { push } = useRouter() // 路由
 
 const [registerTable] = useXTable({

src/views/bpm/taskAssignRule/index.vue

@@ -133,7 +133,7 @@
     </XModal>
   </ContentWrap>
 </template>
-<script setup lang="ts" name="BpmTaskAssignRule">
+<script setup lang="ts">
 // 全局相关的 import
 import { FormInstance } from 'element-plus'
 // 业务相关的 import
@@ -147,6 +147,8 @@ import { DICT_TYPE, getDictOptions } from '@/utils/dict'
 import { handleTree, defaultProps } from '@/utils/tree'
 import { allSchemas, rules, idShowActionClick } from './taskAssignRule.data'
 
+defineOptions({ name: 'BpmTaskAssignRule' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 const { query } = useRoute()