refactor: vue3.3 defineOptions

src/views/bpm/definition/index.vue

@@ -94,12 +94,15 @@
   </Dialog>
 </template>
 
-<script setup lang="ts" name="BpmProcessDefinition">
+<script setup lang="ts">
 import { DICT_TYPE } from '@/utils/dict'
 import { dateFormatter } from '@/utils/formatTime'
 import { MyProcessViewer } from '@/components/bpmnProcessDesigner/package'
 import * as DefinitionApi from '@/api/bpm/definition'
 import { setConfAndFields2 } from '@/utils/formCreate'
+
+defineOptions({ name: 'BpmProcessDefinition' })
+
 const { push } = useRouter() // 路由
 const { query } = useRoute() // 查询参数
 

src/views/bpm/form/editor/index.vue

@@ -38,7 +38,7 @@
     </template>
   </Dialog>
 </template>
-<script lang="ts" name="BpmFormEditor" setup>
+<script lang="ts" setup>
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { CommonStatusEnum } from '@/utils/constants'
 import * as FormApi from '@/api/bpm/form'
@@ -46,6 +46,8 @@ import FcDesigner from '@form-create/designer'
 import { encodeConf, encodeFields, setConfAndFields } from '@/utils/formCreate'
 import { useTagsViewStore } from '@/store/modules/tagsView'
 
+defineOptions({ name: 'BpmFormEditor' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息
 const { push, currentRoute } = useRouter() // 路由

src/views/bpm/form/index.vue

@@ -90,12 +90,14 @@
   </Dialog>
 </template>
 
-<script lang="ts" name="BpmForm" setup>
+<script lang="ts" setup>
 import { DICT_TYPE } from '@/utils/dict'
 import { dateFormatter } from '@/utils/formatTime'
 import * as FormApi from '@/api/bpm/form'
 import { setConfAndFields2 } from '@/utils/formCreate'
 
+defineOptions({ name: 'BpmForm' })
+
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 const { currentRoute, push } = useRouter() // 路由

src/views/bpm/group/UserGroupForm.vue

@@ -41,12 +41,14 @@
     </template>
   </Dialog>
 </template>
-<script lang="ts" name="UserGroupForm" 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: 'UserGroupForm' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 

src/views/bpm/group/index.vue

@@ -111,13 +111,16 @@
   <UserGroupForm ref="formRef" @success="getList" />
 </template>
 
-<script setup lang="ts" name="BpmUserGroup">
+<script setup lang="ts">
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { dateFormatter } from '@/utils/formatTime'
 import * as UserGroupApi from '@/api/bpm/userGroup'
 import * as UserApi from '@/api/system/user'
 import UserGroupForm from './UserGroupForm.vue'
 import { UserVO } from '@/api/system/user'
+
+defineOptions({ name: 'BpmUserGroup' })
+
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 

src/views/bpm/model/ModelForm.vue

@@ -121,12 +121,14 @@
     </template>
   </Dialog>
 </template>
-<script lang="ts" name="ModelForm" setup>
+<script lang="ts" setup>
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { ElMessageBox } from 'element-plus'
 import * as ModelApi from '@/api/bpm/model'
 import * as FormApi from '@/api/bpm/form'
 
+defineOptions({ name: 'ModelForm' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 

src/views/bpm/model/ModelImportForm.vue

@@ -49,9 +49,11 @@
     </template>
   </Dialog>
 </template>
-<script lang="ts" name="ModelImportForm" setup>
+<script lang="ts" setup>
 import { getAccessToken, getTenantId } from '@/utils/auth'
 
+defineOptions({ name: 'ModelImportForm' })
+
 const message = useMessage() // 消息弹窗
 
 const dialogVisible = ref(false) // 弹窗的是否展示

src/views/bpm/model/editor/index.vue

@@ -24,7 +24,7 @@
   </ContentWrap>
 </template>
 
-<script setup lang="ts" name="BpmModelEditor">
+<script setup lang="ts">
 import { MyProcessDesigner, MyProcessPenal } from '@/components/bpmnProcessDesigner/package'
 // 自定义元素选中时的弹出菜单（修改 默认任务 为 用户任务）
 import CustomContentPadProvider from '@/components/bpmnProcessDesigner/package/designer/plugins/content-pad'
@@ -32,6 +32,8 @@ import CustomContentPadProvider from '@/components/bpmnProcessDesigner/package/d
 import CustomPaletteProvider from '@/components/bpmnProcessDesigner/package/designer/plugins/palette'
 import * as ModelApi from '@/api/bpm/model'
 
+defineOptions({ name: 'BpmModelEditor' })
+
 const router = useRouter() // 路由
 const { query } = useRoute() // 路由的查询
 const message = useMessage() // 国际化

src/views/bpm/model/index.vue

@@ -226,7 +226,7 @@
   </Dialog>
 </template>
 
-<script setup lang="ts" name="BpmModel">
+<script setup lang="ts">
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { dateFormatter, formatDate } from '@/utils/formatTime'
 import { MyProcessViewer } from '@/components/bpmnProcessDesigner/package'
@@ -235,6 +235,9 @@ import * as FormApi from '@/api/bpm/form'
 import ModelForm from './ModelForm.vue'
 import ModelImportForm from '@/views/bpm/model/ModelImportForm.vue'
 import { setConfAndFields2 } from '@/utils/formCreate'
+
+defineOptions({ name: 'BpmModel' })
+
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 const { push } = useRouter() // 路由

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

@@ -42,10 +42,13 @@
     </el-form-item>
   </el-form>
 </template>
-<script setup name="BpmOALeaveCreate" lang="ts">
+<script setup lang="ts">
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import * as LeaveApi from '@/api/bpm/leave'
 import { useTagsViewStore } from '@/store/modules/tagsView'
+
+defineOptions({ name: 'BpmOALeaveCreate' })
+
 const message = useMessage() // 消息弹窗
 const { delView } = useTagsViewStore() // 视图操作
 const { currentRoute } = useRouter() // 路由

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

@@ -16,12 +16,14 @@
     </el-descriptions>
   </ContentWrap>
 </template>
-<script lang="ts" name="BpmOALeaveDetail" setup>
+<script lang="ts" setup>
 import { DICT_TYPE } from '@/utils/dict'
 import { formatDate } from '@/utils/formatTime'
 import { propTypes } from '@/utils/propTypes'
 import * as LeaveApi from '@/api/bpm/leave'
 
+defineOptions({ name: 'BpmOALeaveDetail' })
+
 const { query } = useRoute() // 查询参数
 
 const props = defineProps({

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

@@ -138,11 +138,14 @@
     />
   </ContentWrap>
 </template>
-<script setup lang="ts" name="BpmOALeave">
+<script setup lang="ts">
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { dateFormatter } from '@/utils/formatTime'
 import * as LeaveApi from '@/api/bpm/leave'
 import * as ProcessInstanceApi from '@/api/bpm/processInstance'
+
+defineOptions({ name: 'BpmOALeave' })
+
 const message = useMessage() // 消息弹窗
 const router = useRouter() // 路由
 const { t } = useI18n() // 国际化

src/views/bpm/processInstance/create/index.vue

@@ -46,13 +46,16 @@
     <ProcessInstanceBpmnViewer :bpmn-xml="bpmnXML as any" />
   </ContentWrap>
 </template>
-<script setup lang="ts" name="BpmProcessInstanceCreate">
+<script setup lang="ts">
 import { DICT_TYPE } from '@/utils/dict'
 import * as DefinitionApi from '@/api/bpm/definition'
 import * as ProcessInstanceApi from '@/api/bpm/processInstance'
 import { setConfAndFields2 } from '@/utils/formCreate'
 import type { ApiAttrs } from '@form-create/element-ui/types/config'
 import ProcessInstanceBpmnViewer from '../detail/ProcessInstanceBpmnViewer.vue'
+
+defineOptions({ name: 'BpmProcessInstanceCreate' })
+
 const router = useRouter() // 路由
 const message = useMessage() // 消息
 

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 { MyProcessViewer } from '@/components/bpmnProcessDesigner/package'
 import * as ActivityApi from '@/api/bpm/activity'
 
+defineOptions({ name: 'BpmProcessInstanceBpmnViewer' })
+
 const props = defineProps({
   loading: propTypes.bool, // 是否加载中
   id: propTypes.string, // 流程实例的编号

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

@@ -44,13 +44,15 @@
     </el-col>
   </el-card>
 </template>
-<script lang="ts" name="BpmProcessInstanceTaskList" setup>
+<script lang="ts" setup>
 import { formatDate, formatPast2 } from '@/utils/formatTime'
 import { propTypes } from '@/utils/propTypes'
 
+defineOptions({ name: 'BpmProcessInstanceTaskList' })
+
 defineProps({
   loading: propTypes.bool, // 是否加载中
-  tasks: propTypes.array // 流程任务的数组
+  tasks: propTypes.arrayOf(propTypes.object) // 流程任务的数组
 })
 
 /** 获得任务对应的 icon */

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

@@ -24,10 +24,12 @@
     </template>
   </Dialog>
 </template>
-<script lang="ts" name="BpmTaskUpdateAssigneeForm" setup>
+<script lang="ts" setup>
 import * as TaskApi from '@/api/bpm/task'
 import * as UserApi from '@/api/system/user'
 
+defineOptions({ name: 'BpmTaskUpdateAssigneeForm' })
+
 const dialogVisible = ref(false) // 弹窗的是否展示
 const formLoading = ref(false) // 表单的加载中
 const formData = ref({

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

@@ -93,7 +93,7 @@
     <TaskUpdateAssigneeForm ref="taskUpdateAssigneeFormRef" @success="getDetail" />
   </ContentWrap>
 </template>
-<script lang="ts" name="BpmProcessInstanceDetail" setup>
+<script lang="ts" setup>
 import { useUserStore } from '@/store/modules/user'
 import { setConfAndFields2 } from '@/utils/formCreate'
 import type { ApiAttrs } from '@form-create/element-ui/types/config'
@@ -105,6 +105,8 @@ import ProcessInstanceBpmnViewer from './ProcessInstanceBpmnViewer.vue'
 import ProcessInstanceTaskList from './ProcessInstanceTaskList.vue'
 import { registerComponent } from '@/utils/routerHelper'
 
+defineOptions({ name: 'BpmProcessInstanceDetail' })
+
 const { query } = useRoute() // 查询参数
 const message = useMessage() // 消息弹窗
 const { proxy } = getCurrentInstance() as any

src/views/bpm/processInstance/index.vue

@@ -159,11 +159,14 @@
     />
   </ContentWrap>
 </template>
-<script setup lang="ts" name="BpmProcessInstance">
+<script setup lang="ts">
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { dateFormatter } from '@/utils/formatTime'
 import { ElMessageBox } from 'element-plus'
 import * as ProcessInstanceApi from '@/api/bpm/processInstance'
+
+defineOptions({ name: 'BpmProcessInstance' })
+
 const router = useRouter() // 路由
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化

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

@@ -25,11 +25,13 @@
     </el-descriptions>
   </Dialog>
 </template>
-<script lang="ts" name="BpmTaskDetail" setup>
+<script lang="ts" setup>
 import { DICT_TYPE } from '@/utils/dict'
 import { formatDate } from '@/utils/formatTime'
 import * as TaskApi from '@/api/bpm/task'
 
+defineOptions({ name: 'BpmTaskDetail' })
+
 const dialogVisible = ref(false) // 弹窗的是否展示
 const detailLoading = ref(false) // 表单的加载中
 const detailData = ref() // 详情数据

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

@@ -80,12 +80,14 @@
   <!-- 表单弹窗：详情 -->
   <TaskDetail ref="detailRef" @success="getList" />
 </template>
-<script lang="ts" name="BpmTodoTask" setup>
+<script lang="ts" setup>
 import { DICT_TYPE } from '@/utils/dict'
 import { dateFormatter } from '@/utils/formatTime'
 import * as TaskApi from '@/api/bpm/task'
 import TaskDetail from './TaskDetail.vue'
 
+defineOptions({ name: 'BpmTodoTask' })
+
 const { push } = useRouter() // 路由
 
 const loading = ref(true) // 列表的加载中

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

@@ -77,10 +77,12 @@
   </ContentWrap>
 </template>
 
-<script lang="ts" name="BpmDoneTask" setup>
+<script lang="ts" setup>
 import { dateFormatter } from '@/utils/formatTime'
 import * as TaskApi from '@/api/bpm/task'
 
+defineOptions({ name: 'BpmDoneTask' })
+
 const { push } = useRouter() // 路由
 
 const loading = ref(true) // 列表的加载中

src/views/bpm/taskAssignRule/TaskAssignRuleForm.vue

@@ -97,7 +97,7 @@
     </template>
   </Dialog>
 </template>
-<script lang="ts" name="BpmTaskAssignRuleForm" setup>
+<script lang="ts" setup>
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { defaultProps, handleTree } from '@/utils/tree'
 import * as TaskAssignRuleApi from '@/api/bpm/taskAssignRule'
@@ -107,6 +107,8 @@ import * as PostApi from '@/api/system/post'
 import * as UserApi from '@/api/system/user'
 import * as UserGroupApi from '@/api/bpm/userGroup'
 
+defineOptions({ name: 'BpmTaskAssignRuleForm' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 

src/views/bpm/taskAssignRule/index.vue

@@ -32,7 +32,7 @@
   <!-- 添加/修改弹窗 -->
   <TaskAssignRuleForm ref="formRef" @success="getList" />
 </template>
-<script setup lang="ts" name="BpmTaskAssignRule">
+<script setup lang="ts">
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import * as TaskAssignRuleApi from '@/api/bpm/taskAssignRule'
 import * as RoleApi from '@/api/system/role'
@@ -41,6 +41,9 @@ import * as PostApi from '@/api/system/post'
 import * as UserApi from '@/api/system/user'
 import * as UserGroupApi from '@/api/bpm/userGroup'
 import TaskAssignRuleForm from './TaskAssignRuleForm.vue'
+
+defineOptions({ name: 'BpmTaskAssignRule' })
+
 const { query } = useRoute() // 查询参数
 
 const loading = ref(true) // 列表的加载中