gxwebsoft/mp-10584
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(shop): 完善分销商业务功能

Browse Source 
- 在ShopDealerCapital模型中新增分销商昵称字段
- 在ShopDealerUser模型中新增类型和头像字段
- 更新资本流水页面显示分销商昵称和用户ID组合信息
- 修改收益列标题为收益类型并隐藏对方用户列
- 更新分销商用户页面类型标签文本并添加二维码生成功能
- 添加二维码预览弹窗支持复制链接和打开原图
- 优化分销商用户编辑弹窗界面布局和字段验证
- 新增关联用户选择功能并完善表单验证规则
- 添加支付密码管理和佣金信息展示功能
This commit is contained in:
赵忠林
2026-01-26 22:55:23 +08:00
parent e2382aeeab
commit 26978de65c
6 changed files with 363 additions and 170 deletions
Download Patch File Download Diff File Expand all files Collapse all files

428
src/views/shop/shopDealerUser/components/shopDealerUserEdit.vue
View File

@@ -1,11 +1,12 @@
<!-- 编辑弹窗 -->
<template>
<ele-modal
:width="800"
:width="900"
:visible="visible"
:maskClosable="false"
:maxable="maxable"
:title="isUpdate ? '编辑分销商用户记录表' : '添加分销商用户记录表'"
:confirm-loading="loading"
:title="isUpdate ? '编辑分销商用户' : '添加分销商用户'"
:body-style="{ paddingBottom: '28px' }"
@update:visible="updateVisible"
@ok="save"
@@ -19,150 +20,176 @@
styleResponsive ? { md: 19, sm: 19, xs: 24 } : { flex: '1' }
"
>
<a-form-item label="类型 0经销商 1企业 2集团" name="type">
<a-input
allow-clear
placeholder="请输入类型 0经销商 1企业 2集团"
v-model:value="form.type"
/>
</a-form-item>
<a-form-item label="自增ID" name="userId">
<a-input
allow-clear
placeholder="请输入自增ID"
v-model:value="form.userId"
/>
</a-form-item>
<a-form-item label="姓名" name="realName">
<a-input
allow-clear
placeholder="请输入姓名"
v-model:value="form.realName"
/>
</a-form-item>
<a-form-item label="手机号" name="mobile">
<a-input
allow-clear
placeholder="请输入手机号"
v-model:value="form.mobile"
/>
</a-form-item>
<a-form-item label="支付密码" name="payPassword">
<a-input
allow-clear
placeholder="请输入支付密码"
v-model:value="form.payPassword"
/>
</a-form-item>
<a-form-item label="当前可提现佣金" name="money">
<a-input
allow-clear
placeholder="请输入当前可提现佣金"
v-model:value="form.money"
/>
</a-form-item>
<a-form-item label="已冻结佣金" name="freezeMoney">
<a-input
allow-clear
placeholder="请输入已冻结佣金"
v-model:value="form.freezeMoney"
/>
</a-form-item>
<a-form-item label="累积提现佣金" name="totalMoney">
<a-input
allow-clear
placeholder="请输入累积提现佣金"
v-model:value="form.totalMoney"
/>
</a-form-item>
<a-form-item label="收益基数" name="rate">
<a-input
allow-clear
placeholder="请输入收益基数"
v-model:value="form.rate"
/>
</a-form-item>
<a-form-item label="单价" name="price">
<a-input
allow-clear
placeholder="请输入单价"
v-model:value="form.price"
/>
</a-form-item>
<a-form-item label="推荐人用户ID" name="refereeId">
<a-input
allow-clear
placeholder="请输入推荐人用户ID"
v-model:value="form.refereeId"
/>
</a-form-item>
<a-form-item label="成员数量(一级)" name="firstNum">
<a-input
allow-clear
placeholder="请输入成员数量(一级)"
v-model:value="form.firstNum"
/>
</a-form-item>
<a-form-item label="成员数量(二级)" name="secondNum">
<a-input
allow-clear
placeholder="请输入成员数量(二级)"
v-model:value="form.secondNum"
/>
</a-form-item>
<a-form-item label="成员数量(三级)" name="thirdNum">
<a-input
allow-clear
placeholder="请输入成员数量(三级)"
v-model:value="form.thirdNum"
/>
</a-form-item>
<a-form-item label="专属二维码" name="qrcode">
<a-input
allow-clear
placeholder="请输入专属二维码"
v-model:value="form.qrcode"
/>
</a-form-item>
<a-form-item label="备注" name="comments">
<a-textarea
:rows="4"
:maxlength="200"
placeholder="请输入描述"
v-model:value="form.comments"
/>
</a-form-item>
<a-form-item label="排序号" name="sortNumber">
<a-input-number
:min="0"
:max="9999"
class="ele-fluid"
placeholder="请输入排序号"
v-model:value="form.sortNumber"
/>
</a-form-item>
<a-form-item label="是否删除" name="isDelete">
<a-input
allow-clear
placeholder="请输入是否删除"
v-model:value="form.isDelete"
/>
</a-form-item>
<a-form-item label="修改时间" name="updateTime">
<a-input
allow-clear
placeholder="请输入修改时间"
v-model:value="form.updateTime"
/>
</a-form-item>
<a-divider orientation="left">
<span style="color: #1890ff; font-weight: 600">基础信息</span>
</a-divider>
<a-row :gutter="16">
<a-col :span="24" v-if="!isUpdate">
<a-form-item label="关联用户" name="userId">
<SelectUser
:key="selectedUserText"
:value="selectedUserText"
:placeholder="`选择用户`"
@done="onChooseUser"
/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="类型" name="type">
<a-select v-model:value="form.type" placeholder="请选择类型">
<a-select-option :value="0">经销商</a-select-option>
<a-select-option :value="1">企业</a-select-option>
<a-select-option :value="2">集团</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="手机号" name="mobile">
<a-input
allow-clear
:maxlength="11"
placeholder="请输入手机号"
:disabled="true"
v-model:value="form.mobile"
/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="姓名" name="realName">
<a-input
allow-clear
:maxlength="20"
placeholder="请输入姓名"
v-model:value="form.realName"
/>
</a-form-item>
</a-col>
<!-- <a-col :span="12">-->
<!-- <a-form-item-->
<!-- label="支付密码"-->
<!-- name="payPassword"-->
<!-- :help="isUpdate ? '留空表示不修改' : undefined"-->
<!-- >-->
<!-- <a-input-password-->
<!-- allow-clear-->
<!-- :maxlength="20"-->
<!-- placeholder="请输入支付密码"-->
<!-- v-model:value="form.payPassword"-->
<!-- />-->
<!-- </a-form-item>-->
<!-- </a-col>-->
<a-col :span="12">
<a-form-item label="头像" name="image">
<a-image :src="form.avatar" :width="50" :preview="false" />
</a-form-item>
</a-col>
</a-row>
<a-divider orientation="left">
<span style="color: #1890ff; font-weight: 600">佣金信息</span>
</a-divider>
<a-row :gutter="16">
<a-col :span="12">
<a-form-item label="可提现" name="money">
<a-input-number
class="ele-fluid"
:min="0"
:precision="2"
stringMode
placeholder="0.00"
:disabled="true"
v-model:value="form.money"
/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="已冻结" name="freezeMoney">
<a-input-number
class="ele-fluid"
:min="0"
:precision="2"
stringMode
placeholder="0.00"
:disabled="true"
v-model:value="form.freezeMoney"
/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="累积提现" name="totalMoney">
<a-input-number
class="ele-fluid"
:min="0"
:precision="2"
stringMode
placeholder="0.00"
:disabled="true"
v-model:value="form.totalMoney"
/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="佣金比例" name="rate">
<a-input-number
class="ele-fluid"
:min="0"
:max="1"
:precision="4"
stringMode
:disabled="true"
placeholder="例如 0.007"
v-model:value="form.rate"
/>
</a-form-item>
</a-col>
<!-- <a-col :span="12">-->
<!-- <a-form-item label="单价" name="price">-->
<!-- <a-input-number-->
<!-- class="ele-fluid"-->
<!-- :min="0"-->
<!-- :precision="2"-->
<!-- stringMode-->
<!-- placeholder="0.00"-->
<!-- v-model:value="form.price"-->
<!-- />-->
<!-- </a-form-item>-->
<!-- </a-col>-->
</a-row>
<!-- <a-row :gutter="16">-->
<!-- <a-col :span="12">-->
<!-- <a-form-item label="排序号" name="sortNumber">-->
<!-- <a-input-number-->
<!-- :min="0"-->
<!-- :max="9999"-->
<!-- class="ele-fluid"-->
<!-- placeholder="请输入排序号"-->
<!-- v-model:value="form.sortNumber"-->
<!-- />-->
<!-- </a-form-item>-->
<!-- </a-col>-->
<!-- <a-col :span="12">-->
<!-- <a-form-item label="备注" name="comments">-->
<!-- <a-textarea-->
<!-- :rows="3"-->
<!-- :maxlength="200"-->
<!-- show-count-->
<!-- placeholder="请输入备注"-->
<!-- v-model:value="form.comments"-->
<!-- />-->
<!-- </a-form-item>-->
<!-- </a-col>-->
<!-- </a-row>-->
</a-form>
</ele-modal>
</template>
<script lang="ts" setup>
import { ref, reactive, watch } from 'vue';
import { computed, ref, reactive, watch } from 'vue';
import { Form, message } from 'ant-design-vue';
import { assignObject, uuid } from 'ele-admin-pro';
import { assignObject, toDateString, uuid } from 'ele-admin-pro';
import { addShopDealerUser, updateShopDealerUser } from '@/api/shop/shopDealerUser';
import { ShopDealerUser } from '@/api/shop/shopDealerUser/model';
import { useThemeStore } from '@/store/modules/theme';
@@ -170,6 +197,7 @@
import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types';
import { FormInstance } from 'ant-design-vue/es/form';
import { FileRecord } from '@/api/system/file/model';
import type { User } from '@/api/system/user/model';
// 是否是修改
const isUpdate = ref(false);
@@ -201,11 +229,12 @@
// 用户信息
const form = reactive<ShopDealerUser>({
id: undefined,
type: undefined,
userId: undefined,
avatar: undefined,
type: 0,
realName: undefined,
mobile: undefined,
payPassword: undefined,
payPassword: '',
money: undefined,
freezeMoney: undefined,
totalMoney: undefined,
@@ -216,14 +245,10 @@
secondNum: undefined,
thirdNum: undefined,
qrcode: undefined,
comments: undefined,
sortNumber: undefined,
isDelete: undefined,
tenantId: undefined,
createTime: undefined,
updateTime: undefined,
shopDealerUserId: undefined,
shopDealerUserName: '',
status: 0,
comments: '',
sortNumber: 100
@@ -234,18 +259,90 @@
emit('update:visible', value);
};
const createTimeText = computed(() => {
return form.createTime ? toDateString(form.createTime, 'yyyy-MM-dd HH:mm:ss') : '';
});
const updateTimeText = computed(() => {
return form.updateTime ? toDateString(form.updateTime, 'yyyy-MM-dd HH:mm:ss') : '';
});
const selectedUserText = ref<string>('');
// 表单验证规则
const rules = reactive({
shopDealerUserName: [
userId: [
{
validator: (_rule: unknown, value: number | undefined) => {
if (!isUpdate.value && !value) {
return Promise.reject(new Error('请选择关联用户'));
}
return Promise.resolve();
},
trigger: 'change'
}
],
type: [
{
required: true,
type: 'number',
message: '请选择类型',
trigger: 'change'
}
],
realName: [
{
required: true,
type: 'string',
message: '请填写分销商用户记录表名称',
message: '请填写姓名',
trigger: 'blur'
}
],
// mobile: [
// {
// required: true,
// type: 'string',
// message: '请填写手机号',
// trigger: 'blur'
// },
// {
// pattern: /^1\\d{10}$/,
// message: '手机号格式不正确',
// trigger: 'blur'
// }
// ],
payPassword: [
{
validator: (_rule: unknown, value: string) => {
if (!isUpdate.value && !value) {
return Promise.reject(new Error('请输入支付密码'));
}
return Promise.resolve();
},
trigger: 'blur'
}
]
});
const onChooseUser = (user?: User) => {
if (!user) {
selectedUserText.value = '';
form.userId = undefined;
return;
}
form.userId = user.userId;
// 新增时尽量帮用户填充，避免重复输入
if (!form.realName) {
form.realName = user.realName ?? user.nickname;
}
if (!form.mobile) {
form.mobile = user.phone ?? user.mobile;
}
const name = user.realName ?? user.nickname ?? '';
const phone = user.phone ?? user.mobile ?? '';
selectedUserText.value = phone ? `${name}（${phone}）` : name;
};
const chooseImage = (data: FileRecord) => {
images.value.push({
uid: data.id,
@@ -271,9 +368,23 @@
.validate()
.then(() => {
loading.value = true;
const formData = {
...form
};
// 不在弹窗里编辑的字段不提交，避免误更新（如自增ID、删除标识等）
const {
isDelete,
tenantId,
createTime,
updateTime,
...rest
} = form;
const formData: ShopDealerUser = { ...rest };
// userId 新增需要，编辑不允许修改
if (isUpdate.value) {
delete formData.userId;
}
// 编辑时留空表示不修改密码
if (isUpdate.value && !formData.payPassword) {
delete formData.payPassword;
}
const saveOrUpdate = isUpdate.value ? updateShopDealerUser : addShopDealerUser;
saveOrUpdate(formData)
.then((msg) => {
@@ -294,9 +405,13 @@
() => props.visible,
(visible) => {
if (visible) {
formRef.value?.clearValidate();
images.value = [];
if (props.data) {
assignObject(form, props.data);
// 不回显密码，避免误操作
form.payPassword = '';
selectedUserText.value = '';
if(props.data.image){
images.value.push({
uid: uuid(),
@@ -306,10 +421,21 @@
}
isUpdate.value = true;
} else {
// 新增时确保表单是干净的默认值
resetFields();
form.payPassword = '';
form.type = 0;
form.status = 0;
form.comments = '';
form.sortNumber = 100;
selectedUserText.value = '';
isUpdate.value = false;
}
} else {
resetFields();
formRef.value?.clearValidate();
images.value = [];
selectedUserText.value = '';
}
},
{ immediate: true }