chore: 租户套餐下拉框样式

apps/web-antd/src/views/system/tenant/tenant-drawer.vue

@@ -1,11 +1,14 @@
 <script setup lang="ts">
-import { computed, ref } from 'vue';
+import { computed, h, ref } from 'vue';
 
 import { useVbenDrawer } from '@vben/common-ui';
 import { $t } from '@vben/locales';
 
+import { Tag } from 'ant-design-vue';
+
 import { useVbenForm } from '#/adapter';
 import { clientAdd, clientUpdate } from '#/api/system/client';
+import { tenantInfo } from '#/api/system/tenant';
 import { packageSelectList } from '#/api/system/tenant-package';
 
 import { drawerSchema } from './data';
@@ -14,7 +17,7 @@ const emit = defineEmits<{ reload: [] }>();
 
 interface DrawerProps {
   update: boolean;
-  record?: any;
+  id?: number | string;
 }
 
 const isUpdate = ref(false);
@@ -34,11 +37,21 @@ const [BasicForm, formApi] = useVbenForm({
 
 async function setupPackageSelect() {
   const tenantPackageList = await packageSelectList();
+  const options = tenantPackageList.map((item) => ({
+    label: h('div', { class: 'flex items-center gap-[6px]' }, [
+      h('span', null, item.packageName),
+      h(Tag, { color: 'processing' }, () => `${item.menuIds.length}个菜单项`),
+    ]),
+    title: item.packageName,
+    value: item.packageId,
+  }));
   formApi.updateSchema([
     {
       componentProps: {
-        fieldNames: { label: 'packageName', value: 'packageId' },
-        options: tenantPackageList,
+        optionFilterProp: 'title',
+        optionLabelProp: 'title',
+        options,
+        showSearch: true,
       },
       fieldName: 'packageId',
     },
@@ -53,13 +66,14 @@ const [BasicDrawer, drawerApi] = useVbenDrawer({
       return null;
     }
     drawerApi.drawerLoading(true);
-    const { record, update } = drawerApi.getData() as DrawerProps;
+    const { id, update } = drawerApi.getData() as DrawerProps;
     isUpdate.value = update;
     // 初始化
     await setupPackageSelect();
-    if (update && record) {
+    if (update && id) {
+      const record = await tenantInfo(id);
       for (const key in record) {
-        await formApi.setFieldValue(key, record[key]);
+        await formApi.setFieldValue(key, record[key as keyof typeof record]);
       }
     }
     drawerApi.drawerLoading(false);
@@ -74,7 +88,6 @@ async function handleConfirm() {
       return;
     }
     const data = await formApi.getValues();
-    console.log(data);
     await (isUpdate.value ? clientUpdate(data) : clientAdd(data));
     emit('reload');
     await handleCancel();