分销结构优化

This commit is contained in:
pikachu1995@126.com
2023-10-16 16:00:15 +08:00
parent c88c1865e7
commit 63b22f4c86
13 changed files with 891 additions and 373 deletions

View File

@@ -0,0 +1,110 @@
import request, {Method} from '@/plugins/request.js';
/**
* 获取当前会员分销信息
*/
export function distribution () {
return request({
url: `/buyer/distribution/distribution`,
method: Method.GET,
needToken: true
});
}
/**
* 申请成为分销员
* @param idNumber 身份证号
* @param name 名字
*/
export function applyDistribution (params) {
return request({
url: `/buyer/distribution/distribution`,
method: Method.POST,
needToken: true,
params
});
}
/**
* 获取分销员订单列表
*/
export function getDistOrderList (params) {
return request({
url: `/buyer/distribution/order`,
method: Method.GET,
needToken: true,
params
});
}
/**
* 获取分销员下级用户列表
*/
export function getDistMemberList (params) {
return request({
url: `/buyer/distribution/distribution/memberList`,
method: Method.GET,
needToken: true,
params
});
}
/**
* 获取分销商商品列表
*/
export function getDistGoodsList (params) {
return request({
url: `/buyer/distribution/goods`,
method: Method.GET,
needToken: true,
params
});
}
/**
* 分销员提现历史
*/
export function distCashHistory (params) {
return request({
url: `/buyer/distribution/cash`,
method: Method.GET,
needToken: true,
params
});
}
/**
* 分销员-团队列表
*/
export function getDistGroupList (params) {
return request({
url: `/buyer/distribution/distribution/groupList`,
method: Method.GET,
needToken: true,
params
});
}
/**
* 分销商提现
*/
export function distCash (params) {
return request({
url: `/buyer/distribution/cash`,
method: Method.POST,
needToken: true,
params
});
}
/**
* 绑定分销
* @param distributionId 商品分销ID
*/
export function getGoodsDistribution (distributionId) {
return request({
url: `/buyer/distribution/distribution/bindingDistribution/${distributionId}`,
method: Method.GET,
needToken: true
});
}

View File

@@ -333,92 +333,7 @@ export function clearComplain (id) {
});
}
/**
* 获取当前会员分销信息
*/
export function distribution () {
return request({
url: `/buyer/distribution/distribution`,
method: Method.GET,
needToken: true
});
}
/**
* 申请成为分销商
* @param idNumber 身份证号
* @param name 名字
*/
export function applyDistribution (params) {
return request({
url: `/buyer/distribution/distribution`,
method: Method.POST,
needToken: true,
params
});
}
/**
* 获取分销商订单列表
*/
export function getDistOrderList (params) {
return request({
url: `/buyer/distribution/order`,
method: Method.GET,
needToken: true,
params
});
}
/**
* 获取分销商商品列表
*/
export function getDistGoodsList (params) {
return request({
url: `/buyer/distribution/goods`,
method: Method.GET,
needToken: true,
params
});
}
/**
* 绑定、解绑分销商品
* @param distributionGoodsId 分销商品id
* @param checked 分销商品id,true为绑定false为解绑
*/
export function selectDistGoods (params) {
return request({
url: `/buyer/distribution/goods/checked/${params.distributionGoodsId}`,
method: Method.GET,
needToken: true,
params
});
}
/**
* 分销商提现历史
*/
export function distCashHistory (params) {
return request({
url: `/buyer/distribution/cash`,
method: Method.GET,
needToken: true,
params
});
}
/**
* 分销商提现
*/
export function distCash (params) {
return request({
url: `/buyer/distribution/cash`,
method: Method.POST,
needToken: true,
params
});
}
/**
* 我的足迹

View File

@@ -1,6 +1,6 @@
<template>
<div class="wrapper">
<card _Title="我的分销" />
<card _Title="我的分销"/>
<!-- 分销申请 -->
<div v-if="status === 0">
@@ -12,20 +12,8 @@
<FormItem label="身份证号" prop="idNumber">
<Input v-model="applyForm.idNumber"></Input>
</FormItem>
<FormItem label="银行开户行" prop="settlementBankBranchName">
<Input v-model="applyForm.settlementBankBranchName"></Input>
</FormItem>
<FormItem label="银行开户名" prop="settlementBankAccountName">
<Input v-model="applyForm.settlementBankAccountName"></Input>
</FormItem>
<FormItem label="银行账号" prop="settlementBankAccountNum">
<Input v-model="applyForm.settlementBankAccountNum"></Input>
</FormItem>
<FormItem>
<Button type="primary" :loading="applyLoading" @click="apply"
>提交申请</Button
>
<Button type="primary" :loading="applyLoading" @click="apply">提交申请</Button>
</FormItem>
</Form>
</div>
@@ -34,43 +22,69 @@
<Alert type="success">
您提交的信息正在审核
<template slot="desc"
>提交认证申请后工作人员将在三个工作日进行核对完成审核</template
>提交认证申请后工作人员将在三个工作日进行核对完成审核
</template
>
</Alert>
</div>
<!-- 分销提现商品订单 -->
<div v-if="status === 2">
<div class="tips">
<p>分销下线付款之后会生成分销订单</p>
<p>
冻结金额用户提现金额即为冻结金额审核通过后扣除冻结金额审核拒绝之后冻结金额返回可提现金额
</p>
<p>可提现金额分销订单佣金T+1解冻后可变为可提现金额</p>
<p>交易完成后返佣可提现</p>
</div>
<div class="box">
<div class="mb_20 account-price">
<span class="subTips">可提现金额</span>
<span class="fontsize_48 global_color"
>{{ result.canRebate | unitPrice }}</span
>
<span class="subTips">冻结金额</span>
<span class="">{{ result.commissionFrozen | unitPrice }}</span>
<span class="subTips">返利总金额</span>
<span class="">{{ result.rebateTotal | unitPrice }}</span>
<span class="subTips">可提现金额()</span>
<span class="fontsize_48 global_color">{{ result.canRebate | unitPrice }}</span>
<span class="subTips">待结算</span>
<span class="">{{ result.commissionFrozen | unitPrice }}</span>
<span class="subTips">总收益()</span>
<span class="">{{ result.rebateTotal | unitPrice }}</span>
<Button
type="primary"
size="small"
class="ml_20"
@click="withdrawApplyModal = true"
>申请提现</Button
>
@click="withdrawApplyModal = true">申请提现
</Button>
</div>
</div>
<Tabs :value="tabName" @on-click="tabPaneChange">
<TabPane label="已选商品" name="goodsChecked">
<TabPane label="推广订单" name="order">
<Table stripe :columns="orderColumns" :data="orderData.records">
<template slot-scope="{ row }" slot="createTime">
<span>{{ row.createTime }}</span>
</template>
<template slot-scope="{ row }" slot="goodsName">
<span>{{ row.goodsName }}</span>
</template>
<template slot-scope="{ row }" slot="num">
<span>{{ row.num }}</span>
</template>
<template slot-scope="{ row }" slot="rebate">
<span>{{ row.rebate }}</span>
</template>
<template slot-scope="{ row }" slot="distributionOrderStatus">
<span v-if="row.distributionOrderStatus == 'NO_COMPLETED'">未完成</span>
<span v-else-if="row.distributionOrderStatus == 'COMPLETE'">订单完成</span>
<span v-else-if="row.distributionOrderStatus == 'CANCEL'">订单取消</span>
<span v-else-if="row.distributionOrderStatus == 'REFUND'">订单退款</span>
</template>
</Table>
<div class="page-size">
<Page
:current="orderParams.pageNumber"
:total="orderData.total"
:page-size="orderParams.pageSize"
@on-change="changeOrderPage"
size="small"
show-total
show-elevator
></Page>
</div>
</TabPane>
<TabPane label="推广商品" name="goods">
<Table stripe :columns="goodsColumns" :data="goodsData.records">
<template slot-scope="{ row }" slot="name">
<div
@@ -79,20 +93,21 @@
linkTo(
`/goodsDetail?skuId=${row.skuId}&goodsId=${row.goodsId}`
)
"
>
">
<img
style="vertical-align: top"
:src="row.thumbnail"
width="60"
height="60"
alt=""
/>&nbsp; {{ row.goodsName }}
alt=""/>&nbsp; {{ row.goodsName }}
</div>
</template>
<template slot-scope="{ row }" slot="price">
<span> {{ row.price | unitPrice }}</span>
</template>
<template slot-scope="{ row }" slot="firstProportion">
<span style="margin-left: 10px;"> {{ row.firstProportion }}%</span>
</template>
<template slot-scope="{ row }" slot="commission">
<span> {{ row.commission | unitPrice }}</span>
</template>
@@ -101,15 +116,8 @@
type="success"
size="small"
style="margin-right: 5px"
@click="fenxiao(row)"
>分销商品</Button
>
<Button
type="error"
size="small"
@click="selectGoods(row.id, false)"
>取消选择</Button
>
@click="fenxiao(row)">邀请好友
</Button>
</template>
</Table>
<div class="page-size">
@@ -124,48 +132,30 @@
></Page>
</div>
</TabPane>
<TabPane label="未选商品" name="goodsUncheck">
<Table stripe :columns="goodsColumns" :data="goodsData.records">
<template slot-scope="{ row }" slot="name">
<div
class="goods-msg"
@click="
linkTo(
`/goodsDetail?skuId=${row.skuId}&goodsId=${row.goodsId}`
)
"
>
<img
style="vertical-align: top"
:src="row.thumbnail"
width="60"
height="60"
alt=""
/>&nbsp; {{ row.goodsName }}
</div>
<TabPane label="我的客户" name="member">
<Table stripe :columns="memberColumns" :data="memberData.records">
<template slot-scope="{ row }" slot="nickName">
<span>{{ row.nickName }}</span>
</template>
<template slot-scope="{ row }" slot="price">
<span> {{ row.price | unitPrice }}</span>
<template slot-scope="{ row }" slot="orderPrice">
<span>{{ row.orderPrice }}</span>
</template>
<template slot-scope="{ row }" slot="commission">
<span> {{ row.commission | unitPrice }}</span>
<template slot-scope="{ row }" slot="rebatePrice">
<span>{{ row.rebatePrice }}</span>
</template>
<template slot-scope="{ row }" slot="action">
<Button
type="primary"
size="small"
style="margin-right: 5px"
@click="selectGoods(row.id, true)"
>选择商品</Button
>
<template slot-scope="{ row }" slot="orderNum">
<span>{{ row.orderNum }}</span>
</template>
<template slot-scope="{ row }" slot="lastLoginDate">
<span>{{ row.lastLoginDate }}</span>
</template>
</Table>
<div class="page-size">
<Page
:current="params.pageNumber"
:total="goodsData.total"
:page-size="params.pageSize"
@on-change="changePage"
:current="memberParams.pageNumber"
:total="memberData.total"
:page-size="memberParams.pageSize"
@on-change="changeOrderPage"
size="small"
show-total
show-elevator
@@ -183,13 +173,11 @@
<template slot-scope="{ row }" slot="price">
<span
v-if="row.distributionCashStatus == 'VIA_AUDITING'"
style="color: green"
>
+{{ row.price | unitPrice }}</span
style="color: green">
{{ row.price | unitPrice }}</span
>
<span v-else style="color: red">
-{{ row.price | unitPrice }}</span
>
{{ row.price | unitPrice }}</span>
</template>
<template slot-scope="{ row }" slot="status">
<span>
@@ -199,8 +187,7 @@
: row.distributionCashStatus == "VIA_AUDITING"
? "通过"
: "拒绝"
}}</span
>
}}</span>
</template>
</Table>
<div class="page-size">
@@ -215,6 +202,30 @@
></Page>
</div>
</TabPane>
<TabPane label="我的团队" name="group">
<Table stripe :columns="groupColumns" :data="groupData.records">
<template slot-scope="{ row }" slot="memberName">
<span>{{ row.memberName }}</span>
</template>
<template slot-scope="{ row }" slot="distributionOrderPrice">
<span>{{ row.distributionOrderPrice }}</span>
</template>
<template slot-scope="{ row }" slot="distributionOrderCount">
<span>{{ row.distributionOrderCount }}</span>
</template>
</Table>
<div class="page-size">
<Page
:current="groupParams.pageNumber"
:total="groupData.total"
:page-size="groupParams.pageSize"
@on-change="changeOrderPage"
size="small"
show-total
show-elevator
></Page>
</div>
</TabPane>
</Tabs>
</div>
<!-- 未开放 -->
@@ -222,7 +233,8 @@
<Alert type="error">
分销功能暂未开启
<template slot="desc"
>提交认证申请后工作人员将在三个工作日进行核对完成审核</template
>提交认证申请后工作人员将在三个工作日进行核对完成审核
</template
>
</Alert>
</div>
@@ -239,7 +251,8 @@
<Alert type="success">
您提交的申诉正在审核
<template slot="desc"
>提交认证申请后工作人员将在三个工作日进行核对完成审核</template
>提交认证申请后工作人员将在三个工作日进行核对完成审核
</template
>
</Alert>
</div>
@@ -250,29 +263,18 @@
</p>
<div>
<Input v-model="withdrawPrice" size="large" number maxlength="9"
><span slot="append"></span></Input
>
><span slot="append"></span></Input>
</div>
<div slot="footer" style="text-align: center">
<Button type="primary" size="large" @click="withdraw">提现</Button>
</div>
</Modal>
<Modal v-model="qrcodeShow" title="分销商品" width="800">
<Alert type="warning"> 下载二维码或者复制链接分享商品 </Alert>
<Alert type="warning"> 下载二维码或者复制链接分享商品</Alert>
<div class="qrcode">
<div style="width: 150px; height: 150px; border: 1px solid #eee">
<vue-qr
:text="qrcode"
:callback="qrcodeData"
:margin="0"
colorDark="#000"
colorLight="#fff"
:size="150"
></vue-qr>
<div class="qrcode-platform">PC端</div>
<Button class="download-btn" type="success" @click="downloadQrcode"
>下载二维码</Button
>
<div style="width: 150px; height: 150px; ">
<div class="qrcode-platform" style="margin-top: 100px">PC端</div>
<Button style="margin-left: 40px; margin-top: 65px" type="success" @click="copyUrlLink">复制链接</Button>
</div>
<div style="width: 150px; height: 150px; border: 1px solid #eee">
<vue-qr
@@ -285,13 +287,13 @@
></vue-qr>
<div class="qrcode-platform">移动应用端</div>
<Button class="download-btn" type="success" @click="downloadQrcodeH5"
>下载二维码</Button
>下载二维码
</Button
>
</div>
</div>
<div class="mt_10" style="margin-top: 100px;">
商品链接<Input style="width: 600px" v-model="qrcode"></Input>
</div>
</Modal>
</div>
@@ -304,92 +306,98 @@ import {
distCash,
distCashHistory,
getDistGoodsList,
selectDistGoods,
} from "@/api/member.js";
import { IDCard } from "@/plugins/RegExp.js";
import { checkBankno } from "@/plugins/Foundation";
getDistOrderList,
getDistMemberList,
getDistGroupList
} from "@/api/distribution.js";
import {IDCard} from "@/plugins/RegExp.js";
import vueQr from "vue-qr";
export default {
name: "Distribution",
components: { vueQr },
components: {vueQr},
data() {
return {
config:require('@/config'),
config: require('@/config'),
status: 0, // 申请状态0为未申请 1 申请中 2 申请完成 3 功能暂未开启
applyForm: {}, // 申请表单
rules: {
// 验证规则
name: [{ required: true, message: "请输入真实姓名" }],
name: [{required: true, message: "请输入真实姓名"}],
idNumber: [
{ required: true, message: "请输入身份证号" },
{ pattern: IDCard, message: "请输入正确的身份证号" },
],
settlementBankBranchName: [
{
required: true,
message: "请输入银行开户行",
// 可以单个或者同时写两个触发验证方式
trigger: "blur",
},
],
settlementBankAccountName: [
{
required: true,
message: "请输入银行开户名",
// 可以单个或者同时写两个触发验证方式
trigger: "blur",
},
],
//银行账号
settlementBankAccountNum: [
{
required: true,
message: "银行账号不正确",
// 可以单个或者同时写两个触发验证方式
trigger: "blur",
},
{
validator: (rule, value, callback) => {
// 上面有说返回true表示校验通过返回false表示不通过
// this.$u.test.mobile()就是返回true或者false的
return checkBankno(value);
},
message: "银行账号不正确",
},
{required: true, message: "请输入身份证号"},
{pattern: IDCard, message: "请输入正确的身份证号"},
],
},
tabName: "goodsChecked", // 当前所在tab
tabName: "order", // 当前所在tab
result: {}, // 审核结果
applyLoading: false, // 申请加载状态
goodsLoading: false, // 列表加载状态
orderLoading: false, // 订单加载状态
withdrawApplyModal: false, // 提现表单显隐
withdrawPrice: 0, // 提现金额
goodsData: {}, // 商品数据
orderData:{}, //订单数据
memberData:{}, //订单数据
logData: {}, // 日志数据
groupData:{},//团队数据
orderColumns:[
//订单表头
{title: "下单时间", slot: "createTime", minWidth: 200},
{title: "商品名称", slot: "goodsName", minWidth: 200},
{title: "数量", slot: "num"},
{title: "佣金金额", slot: "rebate"},
{title: "状态", slot: "distributionOrderStatus"},
],
memberColumns:[
//客户列表表头
{title: "客户昵称", slot: "nickName", minWidth: 150},
{title: "成交额", slot: "orderPrice"},
{title: "佣金总额", slot: "rebatePrice"},
{title: "订单数", slot: "orderNum"},
{title: "最近下单时间", slot: "lastLoginDate", minWidth: 150},
],
goodsColumns: [
// 商品表头
{ title: "商品名称", slot: "name", width: 400 },
{ title: "商品价格", slot: "price" },
{ title: "佣金", slot: "commission" },
{ title: "操作", slot: "action", minWidth: 120 },
{title: "商品名称", slot: "name", width: 400},
{title: "商品价格", slot: "price"},
{title: "佣金比例", slot: "firstProportion"},
{title: "预计赚", slot: "commission"},
{title: "操作", slot: "action", minWidth: 120},
],
logColumns: [
// 日志表头
{ title: "编号", slot: "sn" },
{ title: "申请时间", slot: "time" },
{ title: "提现金额", slot: "price" },
{ title: "提现状态", slot: "status" },
{title: "编号", slot: "sn"},
{title: "申请时间", slot: "time"},
{title: "提现金额", slot: "price"},
{title: "提现状态", slot: "status"},
],
groupColumns: [
// 团队表头
{title: "昵称", slot: "memberName"},
{title: "销售额", slot: "distributionOrderPrice"},
{title: "订单量", slot: "distributionOrderCount"},
],
params: {
// 商品请求参数
pageNumber: 1,
pageSize: 20,
checked: true,
sort: "createTime",
order: "desc",
},
orderParams: {
// 订单商品请求参数
pageNumber: 1,
pageSize: 20,
sort: "createTime",
order: "desc",
},
memberParams: {
// 会员请求参数
pageNumber: 1,
pageSize: 20,
sort: "createTime",
order: "desc",
},
logParams: {
// 日志参数
@@ -398,8 +406,15 @@ export default {
sort: "createTime",
order: "desc",
},
groupParams: {
// 会员请求参数
pageNumber: 1,
pageSize: 20,
sort: "createTime",
order: "desc",
},
qrcode: "", // 二维码
qrcodeH5:"",//H5二维码
qrcodeH5: "",//H5二维码
qrcodeShow: false, // 显示二维码
base64Img: "", // base64编码
base64ImgH5: "", // base64H5编码
@@ -427,7 +442,7 @@ export default {
},
withdraw() {
// 申请提现
distCash({ price: this.withdrawPrice }).then((res) => {
distCash({price: this.withdrawPrice}).then((res) => {
this.withdrawApplyModal = false;
this.price = 0;
if (res.success) {
@@ -447,6 +462,15 @@ export default {
// 二维码H5端base64地址
this.base64ImgH5 = data64;
},
copyUrlLink(){
navigator.clipboard.writeText(this.qrcode)
.then(() => {
this.$Message.success("复制成功!");
})
.catch(err => {
this.$Message.error("复制失败!");
});
},
downloadQrcode() {
// 下载二维码
let a = document.createElement("a"); // 生成一个a元素
@@ -455,7 +479,7 @@ export default {
a.href = this.base64Img; // 将生成的URL设置为a.href属性
a.dispatchEvent(event); // 触发a的单击事件
},
downloadQrcodeH5(){
downloadQrcodeH5() {
// 下载H5二维码
let a = document.createElement("a"); // 生成一个a元素
let event = new MouseEvent("click"); // 创建一个单击事件
@@ -465,18 +489,33 @@ export default {
},
tabPaneChange(tab) {
// tab栏切换
if (tab === "goodsChecked") {
this.params.checked = true;
this.params.pageNUmber = 1;
this.getGoodsData();
} else if (tab === "goodsUncheck") {
if (tab === "goods") {
this.params.checked = false;
this.getGoodsData();
}else if (tab === "order") {
this.orderParams.checked = false;
this.getOrderData();
}else if (tab === "member") {
this.memberParams.checked = false;
this.getMemberData();
} else if (tab === "log") {
this.logParams.pageNumber = 1;
this.getLog();
}else if (tab === "group") {
this.groupParams.pageNumber = 1;
this.getGroupData();
}
},
changeOrderPage(val) {
// 修改页码
this.orderParams.pageNumber = val;
this.getOrderData();
},
changeMemberPage(val) {
// 修改页码
this.memberParams.pageNumber = val;
this.getMemberData();
},
changePage(val) {
// 修改页码
this.params.pageNumber = val;
@@ -487,19 +526,6 @@ export default {
this.logParams.pageNumber = val;
this.getLog();
},
selectGoods(id, checked) {
// 选择商品
let params = {
distributionGoodsId: id,
checked: checked,
};
selectDistGoods(params).then((res) => {
if (res.success) {
this.$Message.success("操作成功!");
this.getGoodsData();
}
});
},
fenxiao(row) {
// 分销商品
this.qrcode = `${this.config.PC_DOMAIN}/goodsDetail?skuId=${row.skuId}&goodsId=${row.goodsId}&distributionId=${this.result.id}`;
@@ -507,6 +533,18 @@ export default {
this.goodsNameCurr = row.goodsName;
this.qrcodeShow = true;
},
getOrderData(){
// 订单数据
getDistOrderList(this.orderParams).then((res) => {
if (res.success) this.orderData = res.result;
});
},
getMemberData(){
// 订单数据
getDistMemberList(this.memberParams).then((res) => {
if (res.success) this.memberData = res.result;
});
},
getGoodsData() {
// 商品数据
getDistGoodsList(this.params).then((res) => {
@@ -519,8 +557,14 @@ export default {
if (res.success) this.logData = res.result;
});
},
getGroupData() {
// 团队列表
getDistGroupList(this.groupParams).then((res) => {
if (res.success) this.groupData = res.result;
});
},
//申诉
repaying(){
repaying() {
applyDistribution().then((res) => {
this.applyLoading = false;
if (res.success) {
@@ -537,14 +581,14 @@ export default {
let type = res.result.distributionStatus;
if (type === "PASS") {
this.status = 2;
this.getGoodsData();
} else if ( type === "REFUSE") {
this.getOrderData();
} else if (type === "REFUSE") {
this.status = 0;
} else if (type === "RETREAT") {
this.status = 4;
}else if (type === "APPEAL") {
} else if (type === "APPEAL") {
this.status = 5;
}else {
} else {
this.status = 1;
}
} else if (!res.data.success && res.data.code === 22000) {
@@ -563,28 +607,35 @@ export default {
.box {
margin: 20px 0;
}
.page-size {
margin: 15px 0px;
text-align: right;
}
.account-price {
font-weight: bold;
}
.subTips {
margin-left: 10px;
}
.fontsize_48 {
font-size: 48px;
}
.goods-msg {
display: flex;
align-items: center;
padding: 3px;
&:hover {
color: $theme_color;
cursor: pointer;
}
}
.download-btn {
// position: relative;
// top: -200px;
@@ -592,26 +643,31 @@ export default {
margin-left: 25px;
margin-top: 5px
}
/deep/ .ivu-alert-message {
p {
margin: 4px 0;
}
}
.tips{
background:#f7f7f7;
.tips {
background: #f7f7f7;
padding: 16px;
border-radius: .4em;
>p{
> p {
margin: 6px 0;
}
}
.qrcode{
.qrcode {
display: flex;
justify-content: space-evenly;
padding-top: 10px
}
.qrcode-platform{
.qrcode-platform {
text-align: center;
font-size: 14px;
margin: 5px;