chore: 改为setup写法 优化样式

apps/web-antd/src/views/_core/profile/components/account-bind.vue

@@ -31,12 +31,6 @@ const bindList = computed<BindItem[]>(() => {
 });
 
 const gridOptions: VxeGridProps = {
-  checkboxConfig: {
-    // 高亮
-    highlight: true,
-    // 翻页时保留选中状态
-    reserve: true,
-  },
   columns: [
     {
       field: 'source',
@@ -132,14 +126,12 @@ function handleUnbind(record: Record<string, any>) {
           <ListItem>
             <Card>
               <div class="flex w-full items-center gap-4">
-                <div>
                 <component
                   :is="item.avatar"
                   v-if="item.avatar"
                   :style="item?.style ?? {}"
                   class="size-[40px]"
                 />
-                </div>
                 <div class="flex flex-1 items-center justify-between">
                   <div class="flex flex-col">
                     <h4

apps/web-antd/src/views/_core/profile/setting-panel.vue

@@ -1,6 +1,4 @@
-<script lang="ts">
+<script setup lang="ts">
-import { defineComponent } from 'vue';
-
 import { TabPane, Tabs } from 'ant-design-vue';
 
 import AccountBind from './components/account-bind.vue';
@@ -8,52 +6,34 @@ import BaseSetting from './components/base-setting.vue';
 import OnlineDevice from './components/online-device.vue';
 import SecureSetting from './components/secure-setting.vue';
 
-export default defineComponent({
+const settingList = [
-  components: {
-    AccountBind,
-    BaseSetting,
-    OnlineDevice,
-    SecureSetting,
-    TabPane,
-    Tabs,
-  },
-  setup() {
-    const settingList = [
   {
-        component: 'BaseSetting',
+    component: BaseSetting,
     key: '1',
     name: '基本设置',
   },
   {
-        component: 'SecureSetting',
+    component: SecureSetting,
     key: '2',
     name: '安全设置',
   },
   {
-        component: 'AccountBind',
+    component: AccountBind,
     key: '3',
     name: '账号绑定',
   },
   {
-        component: 'OnlineDevice',
+    component: OnlineDevice,
     key: '4',
     name: '在线设备',
   },
-    ];
+];
-
-    return {
-      settingList,
-    };
-  },
-});
 </script>
 
 <template>
   <Tabs class="bg-background rounded-[var(--radius)] px-[16px] lg:flex-1">
-    <template v-for="item in settingList" :key="item.key">
+    <TabPane v-for="item in settingList" :key="item.key" :tab="item.name">
-      <TabPane :tab="item.name">
       <component :is="item.component" v-bind="$attrs" />
     </TabPane>
-    </template>
   </Tabs>
 </template>