feat：【antd/ele】【mp】优化 mp 账号的选择逻辑

apps/web-antd/src/views/mp/statistics/data.ts

@@ -1,29 +1,14 @@
 import type { VbenFormSchema } from '#/adapter/form';
-import type { MpAccountApi } from '#/api/mp/account';
 
 import { beginOfDay, endOfDay, formatDateTime } from '@vben/utils';
 
-import { getSimpleAccountList } from '#/api/mp/account';
-
-/** 关联数据 */
-let accountList: MpAccountApi.AccountSimple[] = [];
-getSimpleAccountList().then((data) => (accountList = data));
-
 /** 列表的搜索表单 */
 export function useGridFormSchema(): VbenFormSchema[] {
   return [
     {
       fieldName: 'accountId',
       label: '公众号',
-      component: 'ApiSelect',
-      componentProps: {
-        options: accountList.map((item) => ({
-          label: item.name,
-          value: item.id,
-        })),
-        placeholder: '请选择公众号',
-      },
-      defaultValue: accountList[0]?.id,
+      component: 'Input',
     },
     {
       fieldName: 'dateRange',
@@ -36,7 +21,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       defaultValue: [
         formatDateTime(beginOfDay(new Date(Date.now() - 3600 * 1000 * 24 * 7))),
         formatDateTime(endOfDay(new Date(Date.now() - 3600 * 1000 * 24))),
-      ] as [Date, Date],
+      ],
     },
   ];
 }

apps/web-antd/src/views/mp/statistics/index.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import type { EchartsUIType } from '@vben/plugins/echarts';
 
-import { onMounted, ref } from 'vue';
+import { ref } from 'vue';
 
 import { ContentWrap, Page } from '@vben/common-ui';
 import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
@@ -16,6 +16,7 @@ import {
   getUserCumulate,
   getUserSummary,
 } from '#/api/mp/statistics';
+import { WxAccountSelect } from '#/views/mp/components';
 
 import {
   interfaceSummaryOption,
@@ -95,6 +96,12 @@ async function getSummary(values: Record<string, any>) {
   );
 }
 
+/** 公众号变化时查询数据 */
+function handleAccountChange(accountId: number) {
+  queryFormApi.setValues({ accountId });
+  queryFormApi.submitForm();
+}
+
 const [QueryForm, queryFormApi] = useVbenForm({
   commonConfig: {
     componentProps: {
@@ -106,17 +113,16 @@ const [QueryForm, queryFormApi] = useVbenForm({
   wrapperClass: 'grid-cols-1 md:grid-cols-2',
   handleSubmit: getSummary,
 });
-
-/** 初始化 */
-onMounted(() => {
-  queryFormApi.submitForm();
-});
 </script>
 
 <template>
   <Page auto-content-height>
     <ContentWrap class="h-full w-full">
-      <QueryForm />
+      <QueryForm>
+        <template #accountId>
+          <WxAccountSelect @change="handleAccountChange" />
+        </template>
+      </QueryForm>
 
       <div class="flex h-1/3 w-full gap-4">
         <Card class="h-full w-1/2" title="用户增减数据">