style: system views code style

apps/web-antd/src/views/system/dict/index.vue

@@ -1,14 +1,17 @@
 <script lang="ts" setup>
-import { ref } from 'vue'
-import { Page } from '@vben/common-ui'
-import { DocAlert } from '#/components/doc-alert'
-import TypeGrid from './modules/type-grid.vue'
-import DataGrid from './modules/data-grid.vue'
+import { ref } from 'vue';
 
-const searchDictType = ref<string>() // 搜索的字典类型
+import { Page } from '@vben/common-ui';
+
+import { DocAlert } from '#/components/doc-alert';
+
+import DataGrid from './modules/data-grid.vue';
+import TypeGrid from './modules/type-grid.vue';
+
+const searchDictType = ref<string>(); // 搜索的字典类型
 
 function onDictTypeSelect(dictType: string) {
-  searchDictType.value = dictType
+  searchDictType.value = dictType;
 }
 </script>
 

apps/web-antd/src/views/system/dict/modules/data-form.vue

@@ -1,12 +1,18 @@
 <script lang="ts" setup>
 import type { SystemDictDataApi } from '#/api/system/dict/data';
 
+import { computed, ref } from 'vue';
+
 import { useVbenModal } from '@vben/common-ui';
+
 import { message } from 'ant-design-vue';
 
-import { computed, ref } from 'vue';
 import { useVbenForm } from '#/adapter/form';
-import { createDictData, getDictData, updateDictData } from '#/api/system/dict/data';
+import {
+  createDictData,
+  getDictData,
+  updateDictData,
+} from '#/api/system/dict/data';
 import { $t } from '#/locales';
 
 import { useDataFormSchema } from '../data';
@@ -35,7 +41,8 @@ const [Modal, modalApi] = useVbenModal({
     }
     modalApi.lock();
     // 提交表单
-    const data = (await formApi.getValues()) as SystemDictDataApi.SystemDictData;
+    const data =
+      (await formApi.getValues()) as SystemDictDataApi.SystemDictData;
     try {
       await (formData.value?.id ? updateDictData(data) : createDictData(data));
       // 关闭并提示
@@ -54,8 +61,10 @@ const [Modal, modalApi] = useVbenModal({
       return;
     }
     // 加载数据
-    const data = modalApi.getData<SystemDictDataApi.SystemDictData | { dictType?: string }>();
-    
+    const data = modalApi.getData<
+      SystemDictDataApi.SystemDictData | { dictType?: string }
+    >();
+
     // 如果有ID，表示是编辑
     if (data && 'id' in data && data.id) {
       modalApi.lock();
@@ -82,4 +91,4 @@ const [Modal, modalApi] = useVbenModal({
   <Modal :title="getTitle">
     <Form class="mx-4" />
   </Modal>
-</template> 
+</template>

apps/web-antd/src/views/system/dict/modules/data-grid.vue

@@ -1,18 +1,25 @@
 <script lang="ts" setup>
 import type { OnActionClickParams } from '#/adapter/vxe-table';
 
-import { useVbenModal } from '@vben/common-ui';
-import { Button, message } from 'ant-design-vue';
-import { Download, Plus } from '@vben/icons';
-import DataForm from './data-form.vue';
-
-import { $t } from '#/locales';
 import { watch } from 'vue';
-import { useDataGridColumns, useDataGridFormSchema } from '../data';
-import { deleteDictData, getDictDataPage, exportDictData } from '#/api/system/dict/data';
+
+import { useVbenModal } from '@vben/common-ui';
+import { Download, Plus } from '@vben/icons';
+
+import { Button, message } from 'ant-design-vue';
+
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  deleteDictData,
+  exportDictData,
+  getDictDataPage,
+} from '#/api/system/dict/data';
+import { $t } from '#/locales';
 import { downloadByData } from '#/utils/download';
 
+import { useDataGridColumns, useDataGridFormSchema } from '../data';
+import DataForm from './data-form.vue';
+
 const props = defineProps({
   dictType: {
     type: String,
@@ -66,17 +73,14 @@ async function onDelete(row: any) {
 }
 
 /** 表格操作按钮回调 */
-function onActionClick({
-  code,
-  row,
-}: OnActionClickParams) {
+function onActionClick({ code, row }: OnActionClickParams) {
   switch (code) {
-    case 'edit': {
-      onEdit(row);
+    case 'delete': {
+      onDelete(row);
       break;
     }
-    case 'delete': {
-      onDelete(row)
+    case 'edit': {
+      onEdit(row);
       break;
     }
   }
@@ -108,7 +112,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     toolbarConfig: {
       refresh: { code: 'query' },
       search: true,
-    }
+    },
   },
 });
 
@@ -124,16 +128,25 @@ watch(
 </script>
 
 <template>
-  <div class="h-full flex flex-col">
+  <div class="flex h-full flex-col">
     <DataFormModal @success="onRefresh" />
 
     <Grid table-title="字典数据列表">
       <template #toolbar-tools>
-        <Button type="primary" @click="onCreate" v-access:code="['system:dict:create']">
+        <Button
+          type="primary"
+          @click="onCreate"
+          v-access:code="['system:dict:create']"
+        >
           <Plus class="size-5" />
           {{ $t('ui.actionTitle.create', ['字典数据']) }}
         </Button>
-        <Button type="primary" class="ml-2" @click="onExport" v-access:code="['system:dict:export']">
+        <Button
+          type="primary"
+          class="ml-2"
+          @click="onExport"
+          v-access:code="['system:dict:export']"
+        >
           <Download class="size-5" />
           {{ $t('ui.actionTitle.export') }}
         </Button>

apps/web-antd/src/views/system/dict/modules/type-form.vue

@@ -1,12 +1,18 @@
 <script lang="ts" setup>
 import type { SystemDictTypeApi } from '#/api/system/dict/type';
 
+import { computed, ref } from 'vue';
+
 import { useVbenModal } from '@vben/common-ui';
+
 import { message } from 'ant-design-vue';
 
-import { computed, ref } from 'vue';
 import { useVbenForm } from '#/adapter/form';
-import { createDictType, getDictType, updateDictType } from '#/api/system/dict/type';
+import {
+  createDictType,
+  getDictType,
+  updateDictType,
+} from '#/api/system/dict/type';
 import { $t } from '#/locales';
 
 import { useTypeFormSchema } from '../data';
@@ -33,7 +39,8 @@ const [Modal, modalApi] = useVbenModal({
     }
     modalApi.lock();
     // 提交表单
-    const data = (await formApi.getValues()) as SystemDictTypeApi.SystemDictType;
+    const data =
+      (await formApi.getValues()) as SystemDictTypeApi.SystemDictType;
     try {
       await (formData.value?.id ? updateDictType(data) : createDictType(data));
       // 关闭并提示

apps/web-antd/src/views/system/dict/modules/type-grid.vue

@@ -3,15 +3,21 @@ import type { OnActionClickParams } from '#/adapter/vxe-table';
 import type { SystemDictTypeApi } from '#/api/system/dict/type';
 
 import { useVbenModal } from '@vben/common-ui';
-import { Button, message } from 'ant-design-vue';
 import { Download, Plus } from '@vben/icons';
-import TypeForm from './type-form.vue';
+
+import { Button, message } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  deleteDictType,
+  exportDictType,
+  getDictTypePage,
+} from '#/api/system/dict/type';
+import { $t } from '#/locales';
+import { downloadByData } from '#/utils/download';
 
 import { useTypeGridColumns, useTypeGridFormSchema } from '../data';
-import { $t } from '#/locales';
-import { deleteDictType, getDictTypePage, exportDictType } from '#/api/system/dict/type';
-import { downloadByData } from '#/utils/download';
-import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import TypeForm from './type-form.vue';
 
 const emit = defineEmits(['select']);
 
@@ -61,19 +67,16 @@ async function onDelete(row: SystemDictTypeApi.SystemDictType) {
 }
 
 /** 表格操作按钮回调 */
-function onActionClick({
-  code,
-  row,
-}: OnActionClickParams) {
+function onActionClick({ code, row }: OnActionClickParams) {
   switch (code) {
-    case 'edit': {
-      onEdit(row);
-      break;
-    }
     case 'delete': {
       onDelete(row);
       break;
     }
+    case 'edit': {
+      onEdit(row);
+      break;
+    }
   }
 }
 
@@ -122,11 +125,20 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
     <Grid table-title="字典类型列表">
       <template #toolbar-tools>
-        <Button type="primary" @click="onCreate" v-access:code="['system:dict:create']">
+        <Button
+          type="primary"
+          @click="onCreate"
+          v-access:code="['system:dict:create']"
+        >
           <Plus class="size-5" />
           {{ $t('ui.actionTitle.create', ['字典类型']) }}
         </Button>
-        <Button type="primary" class="ml-2" @click="onExport" v-access:code="['system:dict:export']">
+        <Button
+          type="primary"
+          class="ml-2"
+          @click="onExport"
+          v-access:code="['system:dict:export']"
+        >
           <Download class="size-5" />
           {{ $t('ui.actionTitle.export') }}
         </Button>