feat(shop): 添加经销商申请导入功能

- 新增经销商申请导入接口和相关页面组件 - 更新经销商申请列表，增加导入按钮和相关功能 - 修改经销商用户相关页面，适应新的业务需求 - 优化环境变量配置
2025-09-06 02:25:39 +08:00
parent f5a1686de1
commit a0375d8a97
10 changed files with 196 additions and 234 deletions
--- a/.env.development
+++ b/.env.development
@@ -1,5 +1,5 @@
 VITE_APP_NAME=后台管理(开发环境)
-#VITE_API_URL=http://127.0.0.1:9200/api
+VITE_API_URL=http://127.0.0.1:9200/api
 #VITE_SERVER_API_URL=http://127.0.0.1:8000/api


--- a/src/api/shop/shopDealerApply/index.ts
+++ b/src/api/shop/shopDealerApply/index.ts
@@ -140,3 +140,19 @@ export async function batchApproveShopDealerApply(ids: number[]) {
  }
  return Promise.reject(new Error(res.data.message));
 }
+
+/**
+ * 导入经销商申请
+ */
+export async function importShopDealerApplies(file: File) {
+  const formData = new FormData();
+  formData.append('file', file);
+  const res = await request.post<ApiResult<unknown>>(
+    '/shop/shop-dealer-apply/import',
+    formData
+  );
+  if (res.data.code === 0) {
+    return res.data.message;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
--- a/src/api/shop/shopDealerApply/model/index.ts
+++ b/src/api/shop/shopDealerApply/model/index.ts
@@ -12,6 +12,8 @@ export interface ShopDealerApply {
  userId?: number;
  // 姓名
  realName?: string;
+  // 经销商名称
+  dealerName?: string;
  // 手机号
  mobile?: string;
  // 推荐人用户ID
--- a/src/api/system/user/index.ts
+++ b/src/api/system/user/index.ts
@@ -214,6 +214,22 @@ export async function importUsers(file: File) {
  return Promise.reject(new Error(res.data.message));
 }

+/**
+ * 导入经销商
+ */
+export async function importShopAdmins(file: File) {
+  const formData = new FormData();
+  formData.append('file', file);
+  const res = await request.post<ApiResult<unknown>>(
+    SERVER_API_URL + '/shop/admin/import',
+    formData
+  );
+  if (res.data.code === 0) {
+    return res.data.message;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
 /**
 * 检查用户是否存在
 */
--- a/src/views/sdy/shopDealerApply/index.vue
+++ b/src/views/sdy/shopDealerApply/index.vue
@@ -115,6 +115,7 @@ const datasource: DatasourceFunction = ({
  if (filters) {
    where.status = filters.status;
  }
+  where.type = 0;
  return pageShopDealerApply({
    ...where,
    ...orders,
--- a/src/views/sdy/shopDealerApplyRs/components/shop-dealer-apply-import.vue
+++ b/src/views/sdy/shopDealerApplyRs/components/shop-dealer-apply-import.vue
@@ -0,0 +1,88 @@
+<!-- 经销商申请批量导入弹窗 -->
+<template>
+  <ele-modal
+    :width="520"
+    :footer="null"
+    title="经销商申请批量导入"
+    :visible="visible"
+    @update:visible="updateVisible"
+  >
+    <a-spin :spinning="loading">
+      <a-upload-dragger
+        accept=".xls,.xlsx"
+        :show-upload-list="false"
+        :customRequest="doUpload"
+        style="padding: 24px 0; margin-bottom: 16px"
+      >
+        <p class="ant-upload-drag-icon">
+          <cloud-upload-outlined />
+        </p>
+        <p class="ant-upload-hint">将文件拖到此处，或点击上传</p>
+      </a-upload-dragger>
+    </a-spin>
+    <div class="ele-text-center">
+      <span>只能上传xls、xlsx文件，</span>
+      <a
+        href="http://127.0.0.1:9200/api/shop/shop-dealer-apply/import/template"
+        download="经销商申请导入模板.xlsx"
+      >
+        下载导入模板
+      </a>
+    </div>
+  </ele-modal>
+</template>
+
+<script lang="ts" setup>
+  import { ref } from 'vue';
+  import { message } from 'ant-design-vue/es';
+  import { CloudUploadOutlined } from '@ant-design/icons-vue';
+  import { importShopDealerApplies } from '@/api/shop/shopDealerApply';
+
+  const emit = defineEmits<{
+    (e: 'done'): void;
+    (e: 'update:visible', visible: boolean): void;
+  }>();
+
+  defineProps<{
+    // 是否打开弹窗
+    visible: boolean;
+  }>();
+
+  // 导入请求状态
+  const loading = ref(false);
+
+  /* 上传 */
+  const doUpload = ({ file }) => {
+    if (
+      ![
+        'application/vnd.ms-excel',
+        'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
+      ].includes(file.type)
+    ) {
+      message.error('只能选择 excel 文件');
+      return false;
+    }
+    if (file.size / 1024 / 1024 > 10) {
+      message.error('大小不能超过 10MB');
+      return false;
+    }
+    loading.value = true;
+    importShopDealerApplies(file)
+      .then((msg) => {
+        loading.value = false;
+        message.success(msg);
+        updateVisible(false);
+        emit('done');
+      })
+      .catch((e) => {
+        loading.value = false;
+        message.error(e.message);
+      });
+    return false;
+  };
+
+  /* 更新 visible */
+  const updateVisible = (value: boolean) => {
+    emit('update:visible', value);
+  };
+</script>
--- a/src/views/sdy/shopDealerApplyRs/components/shopDealerApplyEdit.vue
+++ b/src/views/sdy/shopDealerApplyRs/components/shopDealerApplyEdit.vue
@@ -18,10 +18,10 @@
      :wrapper-col="{ span: 18 }"
    >

-      <a-form-item label="企业名称" name="realName">
+      <a-form-item label="企业名称" name="dealerName">
        <a-input
          placeholder="请输入企业名称"
-          v-model:value="form.realName"
+          v-model:value="form.dealerName"
        />
      </a-form-item>
      <a-form-item label="入市状态" name="applyStatus">
@@ -78,6 +78,7 @@
    applyId: undefined,
    type: 3,
    userId: undefined,
+    dealerName: '',
    realName: '',
    mobile: '',
    refereeId: undefined,
@@ -98,6 +99,13 @@

  // 表单验证规则
  const rules = reactive({
+    dealerName: [
+      {
+        required: true,
+        message: '请输入经销商名称',
+        trigger: 'blur'
+      }
+    ],
    realName: [
      {
        required: true,
--- a/src/views/sdy/shopDealerApplyRs/index.vue
+++ b/src/views/sdy/shopDealerApplyRs/index.vue
@@ -70,6 +70,8 @@
      :organization-list="data"
      @done="reload"
    />
+    <!-- 导入弹窗 -->
+    <ShopDealerApplyImport v-model:visible="showImport" @done="reload"/>

  </a-page-header>
 </template>
@@ -88,6 +90,7 @@ import type {
 } from 'ele-admin-pro/es/ele-pro-table/types';
 import {messageLoading} from 'ele-admin-pro/es';
 import ShopDealerApplyEdit from './components/shopDealerApplyEdit.vue';
+import ShopDealerApplyImport from './components/shop-dealer-apply-import.vue';
 import {toDateString} from 'ele-admin-pro';
 import {utils, writeFile} from 'xlsx';
 import dayjs from 'dayjs';
@@ -129,8 +132,8 @@ const columns = ref<ColumnItem[]>([
  // },
  {
    title: '企业名称',
-    dataIndex: 'realName',
-    align: 'center',
+    dataIndex: 'dealerName',
+    align: 'dealerName',
    showSorterTooltip: false
  },
  {
--- a/src/views/sdy/shopDealerUser/components/shopDealerUserEdit.vue
+++ b/src/views/sdy/shopDealerUser/components/shopDealerUserEdit.vue
@@ -5,7 +5,7 @@
    :visible="visible"
    :maskClosable="false"
    :maxable="maxable"
-    :title="isUpdate ? '编辑分销商用户' : '添加分销商用户'"
+    :title="isUpdate ? '编辑客户' : '添加客户'"
    :body-style="{ paddingBottom: '28px', maxHeight: '70vh', overflowY: 'auto' }"
    @update:visible="updateVisible"
    @ok="save"
@@ -22,22 +22,6 @@
      <a-divider orientation="left">基本信息</a-divider>

      <a-row :gutter="16">
-        <a-col :span="12">
-          <a-form-item
-            label="用户ID"
-            name="userId"
-            :label-col="{ span: 8 }"
-            :wrapper-col="{ span: 16 }"
-          >
-            <a-input-number
-              :min="1"
-              placeholder="请输入用户ID"
-              v-model:value="form.userId"
-              style="width: 100%"
-              :disabled="isUpdate"
-            />
-          </a-form-item>
-        </a-col>
        <a-col :span="12">
          <a-form-item
            label="姓名"
@@ -52,9 +36,37 @@
            />
          </a-form-item>
        </a-col>
+        <a-col :span="12">
+          <a-form-item
+            label="客户名称"
+            name="dealerName"
+            :label-col="{ span: 8 }"
+            :wrapper-col="{ span: 16 }"
+          >
+            <a-input
+              allow-clear
+              placeholder="请输入客户名称"
+              v-model:value="form.dealerName"
+            />
+          </a-form-item>
+        </a-col>
      </a-row>

      <a-row :gutter="16">
+        <a-col :span="12">
+          <a-form-item
+            label="用电户号"
+            name="qrcode"
+            :label-col="{ span: 8 }"
+            :wrapper-col="{ span: 16 }"
+          >
+            <a-input
+              allow-clear
+              placeholder="用电户号"
+              v-model:value="form.qrcode"
+            />
+          </a-form-item>
+        </a-col>
        <a-col :span="12">
          <a-form-item
            label="手机号"
@@ -66,194 +78,29 @@
              allow-clear
              placeholder="请输入手机号"
              v-model:value="form.mobile"
-            />
-          </a-form-item>
-        </a-col>
-        <a-col :span="12">
-          <a-form-item
-            label="支付密码"
-            name="payPassword"
-            :label-col="{ span: 8 }"
-            :wrapper-col="{ span: 16 }"
-          >
-            <a-input-password
-              allow-clear
-              placeholder="请输入支付密码"
-              v-model:value="form.payPassword"
+              :disabled="isUpdate"
            />
          </a-form-item>
        </a-col>
      </a-row>
-      <!-- 佣金信息 -->
-      <a-divider orientation="left">佣金信息</a-divider>
-
      <a-row :gutter="16">
        <a-col :span="8">
          <a-form-item
-            label="可提现佣金"
+            label="电量"
            name="money"
            :label-col="{ span: 12 }"
            :wrapper-col="{ span: 12 }"
          >
            <a-input-number
              :min="0"
-              :precision="2"
-              placeholder="0.00"
+              placeholder="0"
              v-model:value="form.money"
              style="width: 100%"
            >
-              <template #addonAfter>元</template>
+              <template #addonAfter>度</template>
            </a-input-number>
          </a-form-item>
        </a-col>
-        <a-col :span="8">
-          <a-form-item
-            label="冻结佣金"
-            name="freezeMoney"
-            :label-col="{ span: 12 }"
-            :wrapper-col="{ span: 12 }"
-          >
-            <a-input-number
-              :min="0"
-              :precision="2"
-              placeholder="0.00"
-              v-model:value="form.freezeMoney"
-              style="width: 100%"
-            >
-              <template #addonAfter>元</template>
-            </a-input-number>
-          </a-form-item>
-        </a-col>
-        <a-col :span="8">
-          <a-form-item
-            label="累计提现"
-            name="totalMoney"
-            :label-col="{ span: 12 }"
-            :wrapper-col="{ span: 12 }"
-          >
-            <a-input-number
-              :min="0"
-              :precision="2"
-              placeholder="0.00"
-              v-model:value="form.totalMoney"
-              style="width: 100%"
-              :disabled="true"
-            >
-              <template #addonAfter>元</template>
-            </a-input-number>
-          </a-form-item>
-        </a-col>
-      </a-row>
-
-      <!-- 推荐关系 -->
-      <a-divider orientation="left">推荐关系</a-divider>
-
-      <a-form-item label="推荐人" name="refereeId">
-        <a-input-group compact>
-          <a-input-number
-            :min="1"
-            placeholder="请输入推荐人用户ID"
-            v-model:value="form.refereeId"
-            style="width: calc(100% - 80px)"
-          />
-          <a-button type="primary" @click="selectReferee">选择</a-button>
-        </a-input-group>
-      </a-form-item>
-      <!-- 团队信息 -->
-      <a-divider orientation="left">团队信息</a-divider>
-
-      <a-row :gutter="16">
-        <a-col :span="8">
-          <a-form-item
-            label="一级成员"
-            name="firstNum"
-            :label-col="{ span: 12 }"
-            :wrapper-col="{ span: 12 }"
-          >
-            <a-input-number
-              :min="0"
-              placeholder="0"
-              v-model:value="form.firstNum"
-              style="width: 100%"
-              :disabled="true"
-            >
-              <template #addonAfter>人</template>
-            </a-input-number>
-          </a-form-item>
-        </a-col>
-        <a-col :span="8">
-          <a-form-item
-            label="二级成员"
-            name="secondNum"
-            :label-col="{ span: 12 }"
-            :wrapper-col="{ span: 12 }"
-          >
-            <a-input-number
-              :min="0"
-              placeholder="0"
-              v-model:value="form.secondNum"
-              style="width: 100%"
-              :disabled="true"
-            >
-              <template #addonAfter>人</template>
-            </a-input-number>
-          </a-form-item>
-        </a-col>
-        <a-col :span="8">
-          <a-form-item
-            label="三级成员"
-            name="thirdNum"
-            :label-col="{ span: 12 }"
-            :wrapper-col="{ span: 12 }"
-          >
-            <a-input-number
-              :min="0"
-              placeholder="0"
-              v-model:value="form.thirdNum"
-              style="width: 100%"
-              :disabled="true"
-            >
-              <template #addonAfter>人</template>
-            </a-input-number>
-          </a-form-item>
-        </a-col>
-      </a-row>
-
-      <!-- 其他设置 -->
-      <a-divider orientation="left">其他设置</a-divider>
-
-      <a-row :gutter="16">
-        <a-col :span="12">
-          <a-form-item
-            label="专属二维码"
-            name="qrcode"
-            :label-col="{ span: 8 }"
-            :wrapper-col="{ span: 16 }"
-          >
-            <a-input-group compact>
-              <a-input
-                placeholder="系统自动生成"
-                v-model:value="form.qrcode"
-                style="width: calc(100% - 80px)"
-                :disabled="true"
-              />
-              <a-button type="primary" @click="generateQrcode">生成</a-button>
-            </a-input-group>
-          </a-form-item>
-        </a-col>
-        <a-col :span="12">
-          <a-form-item
-            label="账户状态"
-            name="isDelete"
-            :label-col="{ span: 8 }"
-            :wrapper-col="{ span: 16 }"
-          >
-            <a-radio-group v-model:value="form.isDelete">
-              <a-radio :value="0">正常</a-radio>
-              <a-radio :value="1">已删除</a-radio>
-            </a-radio-group>
-          </a-form-item>
-        </a-col>
      </a-row>
    </a-form>
  </ele-modal>
--- a/src/views/sdy/shopDealerUser/index.vue
+++ b/src/views/sdy/shopDealerUser/index.vue
@@ -25,17 +25,15 @@
            <a-tag v-if="record.isDelete === 1" color="red">已删除</a-tag>
            <a-tag v-else color="green">正常</a-tag>
          </template>
+          <template v-if="column.key === 'money'">
+            {{ record.money }}
+          </template>
          <template v-if="column.key === 'action'">
            <a @click="openEdit(record)" class="ele-text-primary">
              <EditOutlined/>
              编辑
            </a>
            <a-divider type="vertical"/>
-            <a @click="viewDetail(record)" class="ele-text-info">
-              <EyeOutlined/>
-              详情
-            </a>
-            <a-divider type="vertical"/>
            <a-popconfirm
              title="确定要删除此分销商用户吗？"
              @confirm="remove(record)"
@@ -62,7 +60,6 @@ import {message, Modal} from 'ant-design-vue';
 import {
  ExclamationCircleOutlined,
  EditOutlined,
-  EyeOutlined,
  DeleteOutlined
 } from '@ant-design/icons-vue';
 import type {EleProTable} from 'ele-admin-pro';
@@ -102,6 +99,7 @@ const datasource: DatasourceFunction = ({
  if (filters) {
    where.status = filters.status;
  }
+  where.type = 0;
  return pageShopDealerUser({
    ...where,
    ...orders,
@@ -143,6 +141,26 @@ const columns = ref<ColumnItem[]>([
    align: 'center',
    width: 180
  },
+  {
+    title: '供电局',
+    key: 'money4',
+    align: 'center'
+  },
+  {
+    title: '供电分局',
+    key: 'money3',
+    align: 'center'
+  },
+  {
+    title: '供电所',
+    key: 'money2',
+    align: 'center'
+  },
+  {
+    title: '渠道负责人',
+    key: 'comments',
+    align: 'center'
+  },
  {
    title: '状态',
    key: 'userStatus',
@@ -187,43 +205,6 @@ const openEdit = (row?: ShopDealerUser) => {
  showEdit.value = true;
 };

-/* 查看详情 */
-const viewDetail = (row: ShopDealerUser) => {
-  Modal.info({
-    title: '分销商用户详情',
-    width: 600,
-    content: createVNode('div', {style: 'max-height: 400px; overflow-y: auto;'}, [
-      createVNode('div', {class: 'detail-item'}, [
-        createVNode('strong', null, '基本信息'),
-        createVNode('p', null, `姓名: ${row.realName || '-'}`),
-        createVNode('p', null, `手机号: ${row.mobile || '-'}`),
-        createVNode('p', null, `用户ID: ${row.userId || '-'}`),
-        createVNode('p', null, `推荐人ID: ${row.refereeId || '无'}`),
-      ]),
-      createVNode('div', {class: 'detail-item', style: 'margin-top: 16px;'}, [
-        createVNode('strong', null, '佣金信息'),
-        createVNode('p', null, `可提现佣金: ¥${parseFloat(row.money || '0').toFixed(2)}`),
-        createVNode('p', null, `冻结佣金: ¥${parseFloat(row.freezeMoney || '0').toFixed(2)}`),
-        createVNode('p', null, `累计提现: ¥${parseFloat(row.totalMoney || '0').toFixed(2)}`),
-      ]),
-      createVNode('div', {class: 'detail-item', style: 'margin-top: 16px;'}, [
-        createVNode('strong', null, '团队信息'),
-        createVNode('p', null, `一级成员: ${row.firstNum || 0} 人`),
-        createVNode('p', null, `二级成员: ${row.secondNum || 0} 人`),
-        createVNode('p', null, `三级成员: ${row.thirdNum || 0} 人`),
-        createVNode('p', null, `团队总数: ${(row.firstNum || 0) + (row.secondNum || 0) + (row.thirdNum || 0)} 人`),
-      ]),
-      createVNode('div', {class: 'detail-item', style: 'margin-top: 16px;'}, [
-        createVNode('strong', null, '其他信息'),
-        createVNode('p', null, `专属二维码: ${row.qrcode ? '已生成' : '未生成'}`),
-        createVNode('p', null, `创建时间: ${row.createTime ? toDateString(row.createTime, 'yyyy-MM-dd HH:mm:ss') : '-'}`),
-        createVNode('p', null, `更新时间: ${row.updateTime ? toDateString(row.updateTime, 'yyyy-MM-dd HH:mm:ss') : '-'}`),
-      ])
-    ]),
-    okText: '关闭'
-  });
-};
-
 /* 打开批量移动弹窗 */
 const openMove = () => {
  showMove.value = true;