feat(iframe): 新增沃尔玛分组路由和组件

在路由中添加了新的沃尔玛分组路径，并引入相应的组件。同时，优化了分组管理页面的UI，更新了表单和表格的结构，提升了用户体验。新增的统计功能支持下载和搜索功能。

src/router/routes/modules/iframe.ts

@@ -156,6 +156,16 @@ const IFRAME: AppRouteRecordRaw = {
         roles: ['*']
       }
     },
+    {
+      path: 'WalmartGroup',
+      name: 'iframeWalmartGroup',
+      component: () => import('@/views/card-walmart-info/group/index.vue'),
+      meta: {
+        locale: '沃尔玛分组',
+        requiresAuth: false,
+        roles: ['*']
+      }
+    },
     {
       path: 'WalmartAccount',
       name: 'iframeWalmartAccount',

src/views/card-walmart-info/account/index.vue

@@ -219,7 +219,6 @@ import AccountDetail from './components/detail.vue';
 import {
   deleteWalmartCard,
   downloadDataList,
-  queryWalmartCardList,
   refreshWalmartCardStatus,
   updateWalmartCardStatus,
   WalmartCardParams,

src/views/card-walmart-info/group/index.vue

@@ -1,91 +1,99 @@
 <template>
   <div class="container">
-    <Breadcrumb :items="['充值账户管理', '充值流水']" />
-    <a-card class="general-card" title="流水记录">
-      <a-row>
-        <a-col :flex="1">
-          <a-form
-            :model="searchForm"
-            :label-col-props="{ span: 6 }"
-            :wrapper-col-props="{ span: 18 }"
-            label-align="left"
+    <Breadcrumb :items="['充值账户管理', '沃尔玛分组']" />
+    <a-space direction="vertical" fill>
+      <a-card class="general-card" title="分组管理">
+        <a-row>
+          <a-col :flex="1">
+            <a-form
+              :model="searchForm"
+              :label-col-props="{ span: 6 }"
+              :wrapper-col-props="{ span: 18 }"
+              label-align="left"
+            >
+              <a-row :gutter="16">
+                <a-col :span="8">
+                  <a-form-item field="name" label="分组名称">
+                    <a-input
+                      v-model="searchForm.name"
+                      placeholder="请输入分组名称"
+                      allow-clear
+                    />
+                  </a-form-item>
+                </a-col>
+              </a-row>
+            </a-form>
+          </a-col>
+          <a-divider style="height: 42px" direction="vertical" />
+          <a-col flex="172px" style="text-align: right">
+            <a-space direction="horizontal" :size="18">
+              <a-button type="primary" @click="handleSearch">
+                <template #icon>
+                  <icon-search />
+                </template>
+                查询
+              </a-button>
+              <a-button @click="resetSearch">
+                <template #icon>
+                  <icon-refresh />
+                </template>
+                重置
+              </a-button>
+            </a-space>
+          </a-col>
+        </a-row>
+        <a-divider style="margin-top: 0" />
+        <a-space direction="vertical" fill>
+          <a-button
+            v-if="checkTokenFromLogin()"
+            type="primary"
+            @click="handleAdd"
           >
-            <a-row :gutter="16">
-              <a-col :span="8">
-                <a-form-item field="name" label="分组名称">
-                  <a-input
-                    v-model="searchForm.name"
-                    placeholder="请输入分组名称"
-                    allow-clear
-                  />
-                </a-form-item>
-              </a-col>
-            </a-row>
-          </a-form>
-        </a-col>
-        <a-divider style="height: 42px" direction="vertical" />
-        <a-col flex="172px" style="text-align: right">
-          <a-space direction="horizontal" :size="18">
-            <a-button type="primary" @click="handleSearch">
-              <template #icon>
-                <icon-search />
-              </template>
-              查询
-            </a-button>
-            <a-button @click="resetSearch">
-              <template #icon>
-                <icon-refresh />
-              </template>
-              重置
-            </a-button>
-          </a-space>
-        </a-col>
-      </a-row>
-      <a-divider style="margin-top: 0" />
-      <a-space direction="vertical" fill>
-        <a-button type="primary" @click="handleAdd">新增分组</a-button>
-        <a-table
-          :data="tableData"
-          :loading="loading"
-          :pagination="pagination"
-          @page-change="onPageChange"
-          @page-size-change="onPageSizeChange"
-        >
-          <template #columns>
-            <a-table-column title="ID" data-index="id" :width="80" />
-            <a-table-column title="分组名称" data-index="name" />
-            <a-table-column title="描述" data-index="notes" />
-            <a-table-column
-              title="创建时间"
-              data-index="createdAt"
-              :width="180"
-            />
-            <a-table-column
-              title="更新时间"
-              data-index="updatedAt"
-              :width="180"
-            />
-            <a-table-column title="操作" :width="200" fixed="right">
-              <template #cell="{ record }">
-                <a-space>
-                  <a-button type="text" @click="handleEdit(record)">
-                    编辑
-                  </a-button>
-                  <a-button
-                    type="text"
-                    status="danger"
-                    @click="handleDelete(record)"
-                  >
-                    删除
-                  </a-button>
-                </a-space>
-              </template>
-            </a-table-column>
-          </template>
-        </a-table>
-      </a-space>
-    </a-card>
-    <!-- 新增/编辑对话框 -->
+            新增
+          </a-button>
+          <a-table
+            :data="tableData"
+            :loading="loading"
+            :pagination="pagination"
+            @page-change="onPageChange"
+            @page-size-change="onPageSizeChange"
+          >
+            <template #columns>
+              <a-table-column title="ID" data-index="id" :width="80" />
+              <a-table-column title="分组名称" data-index="name" />
+              <a-table-column title="描述" data-index="notes" />
+              <a-table-column
+                title="创建时间"
+                data-index="createdAt"
+                :width="180"
+              />
+              <a-table-column
+                title="更新时间"
+                data-index="updatedAt"
+                :width="180"
+              />
+              <a-table-column title="操作" :width="200" fixed="right">
+                <template #cell="{ record }">
+                  <a-space>
+                    <a-button type="text" @click="handleEdit(record)">
+                      编辑
+                    </a-button>
+                    <a-button
+                      type="text"
+                      status="danger"
+                      @click="handleDelete(record)"
+                    >
+                      删除
+                    </a-button>
+                  </a-space>
+                </template>
+              </a-table-column>
+            </template>
+          </a-table>
+        </a-space>
+      </a-card>
+      <summary-card />
+    </a-space>
     <a-modal
       v-model:visible="dialogVisible"
       :title="dialogTitle"
@@ -121,6 +129,8 @@ import { Message, Modal } from '@arco-design/web-vue';
 import { apiClient } from '@/api/index.ts';
 import { KamiApiCardInfoWalmartV1GroupListReqPageSizeEnum } from '@/api/generated/models/kami-api-card-info-walmart-v1-group-list-req';
 import { KamiInternalModelEntityV1CardRedeemAccountGroup } from '@/api/generated/index.ts';
+import summaryCard from './summary.tsx';
+import { checkTokenFromLogin } from '@/utils/auth';
 
 // 搜索表单
 const searchForm = reactive({

src/views/card-walmart-info/group/summary.tsx

@@ -0,0 +1,213 @@
+import { apiClient } from '@/api';
+import type {
+  KamiApiCardInfoWalmartV1CardRedeemAccountSummary,
+  ApiCardInfoWalmartAccountDailySummaryGetPageSizeEnum
+} from '@/api/generated';
+import { handleDownLoadFile } from '@/api/utils';
+import type { Pagination } from '@/types/global';
+import {
+  Button,
+  Card,
+  Col,
+  DatePicker,
+  Divider,
+  Form,
+  FormItem,
+  Input,
+  Message,
+  Row,
+  Space,
+  Table,
+  type TableColumnData
+} from '@arco-design/web-vue';
+import { defineComponent, onMounted, reactive, ref } from 'vue';
+
+interface IformData {
+  accountId: string;
+  username: string;
+  date: string;
+}
+
+export default defineComponent({
+  name: 'walmartGroupSummary',
+  setup() {
+    const generateFormModel = (): IformData => {
+      return {
+        username: '',
+        accountId: '',
+        date: null
+      };
+    };
+
+    const formModel = ref(generateFormModel());
+    const basePagination: Pagination = {
+      current: 1,
+      pageSize: 50
+    };
+    const pagination = reactive({
+      ...basePagination
+    });
+    const columns: TableColumnData[] = [
+      {
+        title: '序号',
+        render(data) {
+          return data.rowIndex + 1;
+        }
+      },
+      {
+        title: '用户名',
+        dataIndex: 'accountInfo.name'
+      },
+      {
+        title: '余额',
+        dataIndex: 'accountInfo.balance'
+      },
+      {
+        title: '今日充值金额',
+        dataIndex: 'amountTodaySum'
+      },
+      {
+        title: '今日充值次数',
+        dataIndex: 'amountTodayCount'
+      },
+      {
+        title: '累计充值金额',
+        dataIndex: 'amountTotalSum'
+      },
+      {
+        title: '累计充值次数',
+        dataIndex: 'amountTotalCount'
+      },
+      {
+        title: '上传人',
+        dataIndex: 'accountInfo.uploadUser.username'
+      },
+      {
+        title: '日期',
+        dataIndex: 'date'
+      }
+    ];
+    const tableData = ref<KamiApiCardInfoWalmartV1CardRedeemAccountSummary[]>(
+      []
+    );
+
+    const downloadExcel = () => {
+      apiClient
+        .apiCardInfoWalmartAccountSummaryDownloadGet(
+          pagination.current,
+          pagination.pageSize as ApiCardInfoWalmartAccountDailySummaryGetPageSizeEnum,
+          formModel.value.username,
+          formModel.value.date,
+          {
+            responseType: 'blob'
+          }
+        )
+        .then(res => {
+          // 判断是不是blob类型
+          if (!res.data) {
+            Message.error('下载账户统计明细失败');
+            return;
+          }
+          handleDownLoadFile(res.data as any, '沃尔玛账户统计明细.xlsx');
+        });
+    };
+    const fetchData = (
+      page: Pagination = pagination,
+      params: IformData = formModel.value
+    ) => {
+      apiClient
+        .apiCardInfoWalmartAccountDailySummaryGet(
+          page.current,
+          page.pageSize as ApiCardInfoWalmartAccountDailySummaryGetPageSizeEnum,
+          params.username,
+          params.date
+        )
+        .then(res => {
+          tableData.value = res.data.list;
+          pagination.total = res.data.total;
+        });
+    };
+    const reset = () => {
+      formModel.value = generateFormModel();
+    };
+    onMounted(() => {
+      fetchData();
+    });
+    return () => (
+      <Card class='general-card' title='核销统计'>
+        <Space direction='vertical' fill>
+          <Row>
+            <Col flex={1}>
+              <Form model={formModel}>
+                <Row gutter={16}>
+                  <Col span={8}>
+                    <FormItem field='username' label='用户名'>
+                      <Input
+                        v-model={formModel.value.username}
+                        placeholder='请输入用户名'
+                      />
+                    </FormItem>
+                  </Col>
+                  <Col span={16}>
+                    <FormItem field='date' label='查询日期'>
+                      <DatePicker v-model={formModel.value.date} />
+                    </FormItem>
+                  </Col>
+                </Row>
+              </Form>
+            </Col>
+            <Divider style='height: 42px' direction='vertical' />
+            <Space direction='vertical' fill>
+              <Row>
+                <Col flex='172px' style='text-align: right'>
+                  <Space direction='horizontal' size={18}>
+                    <Button
+                      type='primary'
+                      onClick={() => fetchData()}
+                      v-slots={{
+                        icon: () => <icon-search />
+                      }}
+                    >
+                      搜索
+                    </Button>
+                    <Button
+                      onClick={reset}
+                      v-slots={{
+                        icon: () => <icon-refresh />
+                      }}
+                    >
+                      重置
+                    </Button>
+                  </Space>
+                </Col>
+              </Row>
+              <Row>
+                <Col>
+                  <Button
+                    type='secondary'
+                    status='warning'
+                    onClick={() => downloadExcel()}
+                    v-slots={{
+                      icon: () => <icon-download />
+                    }}
+                  >
+                    下载
+                  </Button>
+                </Col>
+              </Row>
+            </Space>
+          </Row>
+          <Table
+            columns={columns}
+            data={tableData.value}
+            pagination={pagination}
+            onPageChange={(current: number) => {
+              pagination.current = current;
+              fetchData();
+            }}
+          />
+        </Space>
+      </Card>
+    );
+  }
+});