refactor: vue3.3 defineOptions

src/views/infra/apiAccessLog/ApiAccessLogDetail.vue

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

src/views/infra/apiAccessLog/index.vue

@@ -139,12 +139,15 @@
   <!-- 表单弹窗：详情 -->
   <ApiAccessLogDetail ref="detailRef" />
 </template>
-<script setup lang="ts" name="InfraApiAccessLog">
+<script setup lang="ts">
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import download from '@/utils/download'
 import { formatDate } from '@/utils/formatTime'
 import * as ApiAccessLogApi from '@/api/infra/apiAccessLog'
 import ApiAccessLogDetail from './ApiAccessLogDetail.vue'
+
+defineOptions({ name: 'InfraApiAccessLog' })
+
 const message = useMessage() // 消息弹窗
 
 const loading = ref(true) // 列表的加载中

src/views/infra/apiErrorLog/ApiErrorLogDetail.vue

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

src/views/infra/apiErrorLog/index.vue

@@ -158,13 +158,16 @@
   <ApiErrorLogDetail ref="detailRef" />
 </template>
 
-<script setup lang="ts" name="InfraApiErrorLog">
+<script setup lang="ts">
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as ApiErrorLogApi from '@/api/infra/apiErrorLog'
 import ApiErrorLogDetail from './ApiErrorLogDetail.vue'
 import { InfraApiErrorLogProcessStatusEnum } from '@/utils/constants'
+
+defineOptions({ name: 'InfraApiErrorLog' })
+
 const message = useMessage() // 消息弹窗
 
 const loading = ref(true) // 列表的加载中

src/views/infra/build/index.vue

@@ -29,7 +29,7 @@
     </div>
   </Dialog>
 </template>
-<script setup lang="ts" name="InfraBuild">
+<script setup lang="ts">
 import FcDesigner from '@form-create/designer'
 import { useClipboard } from '@vueuse/core'
 import { isString } from '@/utils/is'
@@ -39,6 +39,8 @@ import 'highlight.js/styles/github.css' // 导入代码高亮样式
 import xml from 'highlight.js/lib/languages/java'
 import json from 'highlight.js/lib/languages/json'
 
+defineOptions({ name: 'InfraBuild' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息
 

src/views/infra/codegen/EditTable.vue

@@ -19,11 +19,13 @@
     </el-form>
   </ContentWrap>
 </template>
-<script lang="ts" name="InfraCodegenEditTable" setup>
+<script lang="ts" setup>
 import { useTagsViewStore } from '@/store/modules/tagsView'
 import { BasicInfoForm, ColumInfoForm, GenerateInfoForm } from './components'
 import * as CodegenApi from '@/api/infra/codegen'
 
+defineOptions({ name: 'InfraCodegenEditTable' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 const { push, currentRoute } = useRouter() // 路由

src/views/infra/codegen/ImportTable.vue

@@ -69,11 +69,13 @@
     </template>
   </Dialog>
 </template>
-<script lang="ts" name="InfraCodegenImportTable" setup>
+<script lang="ts" setup>
 import * as CodegenApi from '@/api/infra/codegen'
 import * as DataSourceConfigApi from '@/api/infra/dataSourceConfig'
 import { ElTable } from 'element-plus'
 
+defineOptions({ name: 'InfraCodegenImportTable' })
+
 const message = useMessage() // 消息弹窗
 
 const dialogVisible = ref(false) // 弹窗的是否展示

src/views/infra/codegen/PreviewCode.vue

@@ -54,7 +54,7 @@
     </div>
   </Dialog>
 </template>
-<script lang="ts" name="InfraCodegenPreviewCode" setup>
+<script lang="ts" setup>
 import { useClipboard } from '@vueuse/core'
 import { handleTree2 } from '@/utils/tree'
 import * as CodegenApi from '@/api/infra/codegen'
@@ -67,6 +67,8 @@ import javascript from 'highlight.js/lib/languages/javascript'
 import sql from 'highlight.js/lib/languages/sql'
 import typescript from 'highlight.js/lib/languages/typescript'
 
+defineOptions({ name: 'InfraCodegenPreviewCode' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 

src/views/infra/codegen/components/BasicInfoForm.vue

@@ -40,10 +40,12 @@
     </el-row>
   </el-form>
 </template>
-<script lang="ts" name="InfraCodegenBasicInfoForm" setup>
+<script lang="ts" setup>
 import * as CodegenApi from '@/api/infra/codegen'
 import { PropType } from 'vue'
 
+defineOptions({ name: 'InfraCodegenBasicInfoForm' })
+
 const props = defineProps({
   table: {
     type: Object as PropType<Nullable<CodegenApi.CodegenTableVO>>,

src/views/infra/codegen/components/ColumInfoForm.vue

@@ -112,11 +112,13 @@
     </el-table-column>
   </el-table>
 </template>
-<script lang="ts" name="InfraCodegenColumInfoForm" setup>
+<script lang="ts" setup>
 import { PropType } from 'vue'
 import * as CodegenApi from '@/api/infra/codegen'
 import * as DictDataApi from '@/api/system/dict/dict.type'
 
+defineOptions({ name: 'InfraCodegenColumInfoForm' })
+
 const props = defineProps({
   columns: {
     type: Array as unknown as PropType<CodegenApi.CodegenColumnVO[]>,

src/views/infra/codegen/components/GenerateInfoForm.vue

@@ -291,13 +291,15 @@
     </el-row>
   </el-form>
 </template>
-<script lang="ts" name="InfraCodegenGenerateInfoForm" setup>
+<script lang="ts" setup>
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { handleTree } from '@/utils/tree'
 import * as CodegenApi from '@/api/infra/codegen'
 import * as MenuApi from '@/api/system/menu'
 import { PropType } from 'vue'
 
+defineOptions({ name: 'InfraCodegenGenerateInfoForm' })
+
 const message = useMessage() // 消息弹窗
 const props = defineProps({
   table: {

src/views/infra/codegen/index.vue

@@ -149,7 +149,7 @@
   <!-- 弹窗：预览代码 -->
   <PreviewCode ref="previewRef" />
 </template>
-<script lang="ts" name="InfraCodegen" setup>
+<script lang="ts" setup>
 import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as CodegenApi from '@/api/infra/codegen'
@@ -157,6 +157,8 @@ import * as DataSourceConfigApi from '@/api/infra/dataSourceConfig'
 import ImportTable from './ImportTable.vue'
 import PreviewCode from './PreviewCode.vue'
 
+defineOptions({ name: 'InfraCodegen' })
+
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 const { push } = useRouter() // 路由跳转

src/views/infra/config/ConfigForm.vue

@@ -40,10 +40,12 @@
     </template>
   </Dialog>
 </template>
-<script lang="ts" name="InfraConfigForm" setup>
+<script lang="ts" setup>
 import { DICT_TYPE, getBoolDictOptions } from '@/utils/dict'
 import * as ConfigApi from '@/api/infra/config'
 
+defineOptions({ name: 'InfraConfigForm' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 

src/views/infra/config/index.vue

@@ -137,12 +137,15 @@
   <!-- 表单弹窗：添加/修改 -->
   <ConfigForm ref="formRef" @success="getList" />
 </template>
-<script setup lang="ts" name="InfraConfig">
+<script setup lang="ts">
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as ConfigApi from '@/api/infra/config'
 import ConfigForm from './ConfigForm.vue'
+
+defineOptions({ name: 'InfraConfig' })
+
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 

src/views/infra/dataSourceConfig/DataSourceConfigForm.vue

@@ -26,9 +26,11 @@
     </template>
   </Dialog>
 </template>
-<script lang="ts" name="InfraDataSourceConfigForm" setup>
+<script lang="ts" setup>
 import * as DataSourceConfigApi from '@/api/infra/dataSourceConfig'
 
+defineOptions({ name: 'InfraDataSourceConfigForm' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 

src/views/infra/dataSourceConfig/index.vue

@@ -57,10 +57,13 @@
   <!-- 表单弹窗：添加/修改 -->
   <DataSourceConfigForm ref="formRef" @success="getList" />
 </template>
-<script setup lang="ts" name="InfraDataSourceConfig">
+<script setup lang="ts">
 import { dateFormatter } from '@/utils/formatTime'
 import * as DataSourceConfigApi from '@/api/infra/dataSourceConfig'
 import DataSourceConfigForm from './DataSourceConfigForm.vue'
+
+defineOptions({ name: 'InfraDataSourceConfig' })
+
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 

src/views/infra/dbDoc/index.vue

@@ -16,10 +16,12 @@
     <IFrame v-if="!loading" v-loading="loading" :src="src" />
   </ContentWrap>
 </template>
-<script setup lang="ts" name="InfraDBDoc">
+<script setup lang="ts">
 import download from '@/utils/download'
 import * as DbDocApi from '@/api/infra/dbDoc'
 
+defineOptions({ name: 'InfraDBDoc' })
+
 const loading = ref(true) // 是否加载中
 const src = ref('') // HTML 的地址
 

src/views/infra/druid/index.vue

@@ -6,9 +6,11 @@
     <IFrame v-if="!loading" :src="url" />
   </ContentWrap>
 </template>
-<script setup lang="ts" name="InfraDruid">
+<script setup lang="ts">
 import * as ConfigApi from '@/api/infra/config'
 
+defineOptions({ name: 'InfraDruid' })
+
 const loading = ref(true) // 是否加载中
 const url = ref(import.meta.env.VITE_BASE_URL + '/druid/index.html')
 

src/views/infra/file/FileForm.vue

@@ -30,9 +30,11 @@
     </template>
   </Dialog>
 </template>
-<script lang="ts" name="InfraFileForm" setup>
+<script lang="ts" setup>
 import { getAccessToken, getTenantId } from '@/utils/auth'
 
+defineOptions({ name: 'InfraFileForm' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 

src/views/infra/file/index.vue

@@ -91,11 +91,14 @@
   <!-- 表单弹窗：添加/修改 -->
   <FileForm ref="formRef" @success="getList" />
 </template>
-<script setup lang="ts" name="InfraFile">
+<script setup lang="ts">
 import { fileSizeFormatter } from '@/utils'
 import { dateFormatter } from '@/utils/formatTime'
 import * as FileApi from '@/api/infra/file'
 import FileForm from './FileForm.vue'
+
+defineOptions({ name: 'InfraFile' })
+
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 

src/views/infra/fileConfig/FileConfigForm.vue

@@ -98,10 +98,12 @@
     </template>
   </Dialog>
 </template>
-<script lang="ts" name="InfraFileConfigForm" setup>
+<script lang="ts" setup>
 import { DICT_TYPE, getDictOptions } from '@/utils/dict'
 import * as FileConfigApi from '@/api/infra/fileConfig'
 
+defineOptions({ name: 'InfraFileConfigForm' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 
@@ -112,7 +114,7 @@ const formType = ref('') // 表单的类型：create - 新增；update - 修改
 const formData = ref({
   id: undefined,
   name: '',
-  storage: '',
+  storage: 0,
   remark: '',
   config: {}
 })
@@ -184,7 +186,7 @@ const resetForm = () => {
   formData.value = {
     id: undefined,
     name: '',
-    storage: '',
+    storage: 0,
     remark: '',
     config: {}
   }

src/views/infra/fileConfig/index.vue

@@ -126,11 +126,14 @@
   <!-- 表单弹窗：添加/修改 -->
   <FileConfigForm ref="formRef" @success="getList" />
 </template>
-<script setup lang="ts" name="InfraFileConfig">
+<script setup lang="ts">
 import * as FileConfigApi from '@/api/infra/fileConfig'
 import FileConfigForm from './FileConfigForm.vue'
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { dateFormatter } from '@/utils/formatTime'
+
+defineOptions({ name: 'InfraFileConfig' })
+
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 

src/views/infra/job/JobDetail.vue

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

src/views/infra/job/JobForm.vue

@@ -45,8 +45,11 @@
     </template>
   </Dialog>
 </template>
-<script setup lang="ts" name="JobForm">
+<script setup lang="ts">
 import * as JobApi from '@/api/infra/job'
+
+defineOptions({ name: 'JobForm' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 

src/views/infra/job/index.vue

@@ -147,7 +147,7 @@
   <!-- 表单弹窗：查看 -->
   <JobDetail ref="detailRef" />
 </template>
-<script setup lang="ts" name="InfraJob">
+<script setup lang="ts">
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { checkPermi } from '@/utils/permission'
 import JobForm from './JobForm.vue'
@@ -155,6 +155,9 @@ import JobDetail from './JobDetail.vue'
 import download from '@/utils/download'
 import * as JobApi from '@/api/infra/job'
 import { InfraJobStatusEnum } from '@/utils/constants'
+
+defineOptions({ name: 'InfraJob' })
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 const { push } = useRouter() // 路由

src/views/infra/job/logger/JobLogDetail.vue

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

src/views/infra/job/logger/index.vue

@@ -121,12 +121,15 @@
   <!-- 表单弹窗：查看 -->
   <JobLogDetail ref="detailRef" />
 </template>
-<script setup lang="ts" name="InfraJobLog">
+<script setup lang="ts">
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { formatDate } from '@/utils/formatTime'
 import download from '@/utils/download'
 import JobLogDetail from './JobLogDetail.vue'
 import * as JobLogApi from '@/api/infra/jobLog'
+
+defineOptions({ name: 'InfraJobLog' })
+
 const message = useMessage() // 消息弹窗
 const { query } = useRoute() // 查询参数
 

src/views/infra/server/index.vue

@@ -5,9 +5,11 @@
     <IFrame v-if="!loading" v-loading="loading" :src="src" />
   </ContentWrap>
 </template>
-<script setup lang="ts" name="InfraAdminServer">
+<script setup lang="ts">
 import * as ConfigApi from '@/api/infra/config'
 
+defineOptions({ name: 'InfraAdminServer' })
+
 const loading = ref(true) // 是否加载中
 const src = ref(import.meta.env.VITE_BASE_URL + '/admin/applications')
 

src/views/infra/skywalking/index.vue

@@ -5,9 +5,11 @@
     <IFrame v-if="!loading" v-loading="loading" :src="src" />
   </ContentWrap>
 </template>
-<script setup lang="ts" name="InfraSkyWalking">
+<script setup lang="ts">
 import * as ConfigApi from '@/api/infra/config'
 
+defineOptions({ name: 'InfraSkyWalking' })
+
 const loading = ref(true) // 是否加载中
 const src = ref('http://skywalking.shop.iocoder.cn')
 

src/views/infra/swagger/index.vue

@@ -5,9 +5,11 @@
     <IFrame :src="src" />
   </ContentWrap>
 </template>
-<script setup lang="ts" name="InfraSwagger">
+<script setup lang="ts">
 import * as ConfigApi from '@/api/infra/config'
 
+defineOptions({ name: 'InfraSwagger' })
+
 const loading = ref(true) // 是否加载中
 const src = ref(import.meta.env.VITE_BASE_URL + '/doc.html') // Knife4j UI
 // const src = ref(import.meta.env.VITE_BASE_URL + '/swagger-ui') // Swagger UI

src/views/infra/testDemo/index.vue

@@ -1,4 +1,4 @@
 <template>
   <div>index</div>
 </template>
-<script setup lang="ts" name="TestDome"></script>
+<script setup lang="ts"></script>

src/views/infra/webSocket/index.vue

@@ -55,11 +55,13 @@
     </el-card>
   </div>
 </template>
-<script lang="ts" name="InfraWebSocket" setup>
+<script lang="ts" setup>
 import { formatDate } from '@/utils/formatTime'
 import { useUserStore } from '@/store/modules/user'
 import { useWebSocket } from '@vueuse/core'
 
+defineOptions({ name: 'InfraWebSocket' })
+
 const userStore = useUserStore()
 
 const sendValue = ref('')