代理商和品牌订单

This commit is contained in:
余同学 2025-01-15 17:26:36 +08:00
parent bc5bb0414f
commit cd9454dae1
6 changed files with 870 additions and 5 deletions

View File

@ -276,4 +276,20 @@ export const mer_admin = {
sortnotice: (data) => { sortnotice: (data) => {
return $http.post(`/admin-api/notice/update/sort`, data); return $http.post(`/admin-api/notice/update/sort`, data);
}, },
//品牌和分销商的订单
distributorOrBrandOrderPage: (data) => {
return $http.request({
method: "get",
url: `/merchant-api/backend/order/page`,
params: data,
});
},
//订单概述
orderOverview: (data) => {
return $http.request({
method: "get",
url: `/merchant-api/backend/order/overview`,
params: data,
});
},
}; };

View File

@ -77,6 +77,19 @@ export default {
open: null, open: null,
list: [], list: [],
}, },
{
menuId: getUUID(),
parentId: 0,
parentName: null,
name: "品牌市场",
url: "operation-management/brand-market/index",
perms: "",
type: 1,
elIcon: "el-icon-shopping-cart-full",
orderNum: 0,
open: null,
list: [],
},
{ {
menuId: getUUID(), menuId: getUUID(),
parentId: 0, parentId: 0,

View File

@ -176,6 +176,7 @@ export function getMenu(role) {
return [ return [
"operation-management", "operation-management",
// "operation-management/shop-list/index", // "operation-management/shop-list/index",
"operation-management/brand-market/index",
"operation-management/brand-store/index", "operation-management/brand-store/index",
// "operation-management/order/index", // "operation-management/order/index",
"operation-management/brand-order/index", "operation-management/brand-order/index",

View File

@ -0,0 +1,217 @@
<template>
<div style="height: calc(100vh - 200px)">
<obj-table-plus
ref="oTable"
style="height: 100%"
:tableCols="tableCols"
:tableProp="tableProp"
@query="queryList"
v-model="dataList"
:tableEvent="tableEvent"
:enableAutoQuery="false"
>
<template slot="tableTop">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="菜市场名称">
<el-input
v-model="formInline.marketName"
placeholder="菜市场名称搜索"
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="$refs.oTable.reload()"
>查询</el-button
>
<el-button type="primary" @click="Reset">重置</el-button>
</el-form-item>
</el-form>
<div class="mb-2"></div>
</template>
</obj-table-plus>
<!-- 菜市场详情 -->
<viewDetails ref="viewDetails"></viewDetails>
</div>
</template>
<script>
import viewDetails from "./popup/view-details.vue";
import { mapState } from "vuex";
export default {
components: { viewDetails },
data() {
return {
dataList: [],
formInline: {
name: "",
},
tableProp: {
"auto-resize": true,
border: true,
height: "auto",
"row-id": "id",
"show-overflow": false,
},
productFilterType: "SALE",
selectList: [],
};
},
created() {
this.$nextTick(() => {
this.$refs.oTable.reload();
});
},
methods: {
Reset() {
this.formInline = {
name: "",
};
this.$refs.oTable.reload();
},
queryList(pageNo, pageSize) {
this.$api.agent
.brandMarketPage({
pageNumber: pageNo,
pageSize: pageSize,
brandId: JSON.parse(sessionStorage.getItem("userInfo")).brandId,
})
.then((res) => {
console.log(res);
this.$refs.oTable.complete(
res.data.data.content,
Number(res.data.data.totalElements)
);
})
.catch((err) => {
this.$refs.oTable.complete(false);
});
},
},
computed: {
tableCols() {
return [
{ type: "checkbox", width: "60px", fixed: "left" },
// { type: "seq", width: "60px", align: "center", title: "" },
{
title: "菜市场名称",
align: "center",
field: "name",
},
{
title: "地址",
align: "center",
field: "address",
},
{
title: "经纬度",
align: "center",
field: "category",
type: "jsx",
render: ({ row }) => {
return (
<span>
经度{row.longitude}; 维度{row.latitude}
</span>
);
},
},
// {
// title: "",
// align: "center",
// field: "couponType",
// type: "jsx",
// render: ({ row }) => {
// return (
// <el-image
// preview-src-list={[row.license]}
// src={row.license}
// ></el-image>
// );
// },
// },
// {
// title: "",
// align: "center",
// field: "score",
// },
// {
// title: "",
// align: "center",
// field: "collectCount",
// },
// {
// title: "",
// align: "center",
// field: "likeItCount",
// },
// {
// title: "",
// align: "center",
// field: "platformSettleRatio",
// },
// {
// title: "",
// align: "center",
// field: "agentSettleRatio",
// },
{
title: "加入时间",
align: "center",
field: "createTime",
},
{
title: "状态",
align: "center",
field: "status",
type: "jsx",
width: "120px",
render: ({ row }) => {
if (row.status == 1) {
return <span></span>;
} else {
return <span></span>;
}
},
},
{
title: "操作",
fixed: "right",
type: "jsx",
align: "center",
width: "140px",
render: (row) => {
let edit = () => {
this.$refs.viewDetails.toggle(row).update();
};
return (
<div>
<el-button size="mini" type="primary" onClick={edit}>
详情
</el-button>
</div>
);
},
},
];
},
tableEvent() {
return {
"checkbox-all": ({ records, reserves }) => {
this.selectList = [...records, ...reserves];
},
"checkbox-change": ({ records, reserves }) => {
this.selectList = [...records, ...reserves];
},
};
},
...mapState("userData", [
"isMerchant",
"marketList",
"storeList",
"marketId",
"shopId",
]),
},
};
</script>
<style lang="scss" scoped></style>

View File

@ -0,0 +1,199 @@
<template>
<div>
<obj-modal
ref="modal"
labelWidth="150px"
:modalConfig="modalConfig"
:modalData="modalData"
:modalHandles="modalHandles"
>
<div slot="dialog__content">
<el-form
:model="ruleForm"
ref="ruleForm"
label-width="150px"
class="demo-ruleForm"
>
<el-row>
<el-col :span="8">
<el-form-item label="菜市场名称:">
<span>{{ ruleForm.name }}</span>
</el-form-item></el-col
>
<el-col :span="8">
<el-form-item label="经营模式:">
<span>{{
ruleForm.manageMode == 0 ? "平台" : "个体经营者"
}}</span>
</el-form-item></el-col
>
<el-col :span="8">
<el-form-item label="状态:">
<span>{{ ruleForm.status == 0 ? "禁用" : "启用" }}</span>
</el-form-item></el-col
>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="地址:">
<span
>{{ ruleForm.provinceName }}{{ ruleForm.ruleForm
}}{{ ruleForm.areaName }}{{ ruleForm.address }}</span
>
</el-form-item></el-col
>
<el-col :span="8">
<el-form-item label="经度:">
<span>{{ ruleForm.longitude }}</span>
</el-form-item></el-col
>
<el-col :span="8">
<el-form-item label="纬度:">
<span>{{ ruleForm.latitude }}</span>
</el-form-item></el-col
>
</el-row>
<!-- <el-row v-if="ruleForm.manageMode == 1">
<el-col :span="8">
<el-form-item label="经营者名称:">
<span>{{ ruleForm.operatorName }}</span>
</el-form-item></el-col
>
<el-col :span="8">
<el-form-item label="经营者账号:">
<span>{{ ruleForm.operatorPhone }}</span>
</el-form-item></el-col
>
<el-col :span="8">
</el-col>
</el-row> -->
<el-row>
<el-col :span="8">
<el-form-item label="背景图片:">
<el-image
style="width: 100px; height: 100px"
:src="ruleForm.background?.split(';')[0]"
:preview-src-list="ruleForm.background?.split(';')"
>
</el-image> </el-form-item
></el-col>
<el-col :span="8">
<el-form-item label="是否开启第三方骑手配送:">
<span>{{ ruleForm.isThirdPartyDelivery ? "是" : "否" }}</span>
</el-form-item></el-col
>
<el-col :span="8">
<el-form-item label="营业状态:">
<span>{{
ruleForm.businessStatus == 0 ? "休息" : "经营中"
}}</span>
</el-form-item></el-col
>
</el-row>
</el-form>
</div>
<!-- 选择商品 -->
</obj-modal>
</div>
</template>
<script>
import { debounce, cloneDeep } from "lodash";
export default {
components: {},
props: {},
data() {
return {
isAdd: true,
//
modalConfig: {
title: "订单详情",
show: false,
width: "1200px",
fullscreen: true,
},
modalData: {},
ruleForm: {},
tableData: [],
};
},
watch: {
// "modalConfig.show"(newVal) {
// if (newVal) {
// //
// setTimeout(() => {
// this.$refs.ruleForm.resetFields();
// });
// }
// },
},
methods: {
queryTableData(pageNo, pageSize) {},
toggle(e) {
if (this.modalConfig.show == false) {
this.modalConfig.show = true;
} else {
this.modalConfig.show = false;
}
if (e) {
this.init(cloneDeep(e.row));
}
return {
add: () => {
this.modalConfig.title = "店铺详情";
this.isAdd = true;
},
update: () => {
this.modalConfig.title = "店铺详情";
this.isAdd = false;
},
};
},
init(row) {
console.log(row);
this.ruleForm = row;
},
handleSelectionChange(e) {
console.log(e);
},
getRefundStatus(val) {
if (val == 0) {
return "正常";
} else if (val == 1) {
return "退款中";
} else if (val == 2) {
return "完全退款";
} else if (val == 3) {
return "部分退款";
} else if (val == 4) {
return "拒绝用户退款";
} else if (val == -1) {
return "退款失败";
} else if (val == -2) {
return "用户申请退款中";
}
},
},
computed: {
modalHandles() {
return [
{
label: "关闭",
handle: () => {
this.toggle();
},
},
// {
// label: "",
// type: "primary",
// // submit: true,
// handle: () => {
// },
// },
];
},
},
asyncComputed: {},
};
</script>
<style lang="scss" scoped>
</style>

View File

@ -1,15 +1,434 @@
<template> <template>
<div> <div style="height: calc(100vh - 180px)">
品牌订单 <el-form :inline="true" :model="form" class="demo-form-inline">
<el-form-item label="收货人姓名">
<el-input v-model="form.name" placeholder="收货人姓名搜索"></el-input>
</el-form-item>
<el-form-item label="订单编号">
<el-input v-model="form.orderNo" placeholder="订单编号"></el-input>
</el-form-item>
<el-form-item label="订单时间">
<el-date-picker
value-format="yyyy-MM-dd HH:mm:ss"
@change="changeTime"
v-model="time"
type="datetimerange"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getList">查询</el-button>
<el-button type="primary" @click="Reset">重置</el-button>
</el-form-item>
</el-form>
<div class="stat-list">
<div class="stat-item">
<i
class="el-icon-s-order"
style="font-size: 22px; margin-right: 8px"
></i>
<div class="stat-right">
<div class="stat-title">订单数量</div>
<div class="stat-value">
<span style="font-size: 20px">{{ overviewList.totalCount }}</span>
</div>
</div>
</div>
<div class="stat-item">
<i
class="el-icon-s-goods"
style="font-size: 22px; margin-right: 8px"
></i>
<div class="stat-right">
<div class="stat-title">订单金额</div>
<div class="stat-value">
<span style="font-size: 20px">{{ overviewList.totalMoney }}</span>
</div>
</div>
</div>
<div class="stat-item">
<i
class="el-icon-s-marketing"
style="font-size: 22px; margin-right: 8px"
></i>
<div class="stat-right">
<div class="stat-title">退款金额</div>
<div class="stat-value">
<span style="font-size: 20px">{{
overviewList.totalRefundMoney
}}</span>
</div>
</div>
</div>
<div class="stat-item">
<i
class="el-icon-s-order"
style="font-size: 22px; margin-right: 8px"
></i>
<div class="stat-right">
<div class="stat-title">订单完成率</div>
<div style="font-size: 20px" class="stat-value">
{{ overviewList.completeRate }}%
</div>
</div>
</div>
<div v-if="!isBrand" class="stat-item">
<i
class="el-icon-s-order"
style="font-size: 22px; margin-right: 8px"
></i>
<div class="stat-right">
<div class="stat-title">代理商抽成()</div>
<div style="font-size: 20px" class="stat-value">
{{
overviewList.agentCommission ? overviewList.agentCommission : 0
}}
</div>
</div>
</div>
</div>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="全部订单" name="全部订单"></el-tab-pane>
<el-tab-pane label="待支付" name="待支付"></el-tab-pane>
<el-tab-pane label="待接单" name="待接单"></el-tab-pane>
<el-tab-pane label="待备货" name="待备货"></el-tab-pane>
<el-tab-pane label="待取货" name="待取货"></el-tab-pane>
<el-tab-pane label="已取货" name="已取货"></el-tab-pane>
<el-tab-pane label="配送中" name="配送中"></el-tab-pane>
<el-tab-pane label="已配送" name="已配送"></el-tab-pane>
<el-tab-pane label="完成" name="完成"></el-tab-pane>
<el-tab-pane label="未支付订单取消" name="未支付订单取消"></el-tab-pane>
<el-tab-pane label="用户申请退款中" name="用户申请退款中"></el-tab-pane>
<el-tab-pane label="用户申请已退款" name="用户申请已退款"></el-tab-pane>
<el-tab-pane label="商家取消订单" name="商家取消订单"></el-tab-pane>
<el-tab-pane label="平台取消订单" name="平台取消订单"></el-tab-pane>
</el-tabs>
<el-table :data="tableData" height="70%" border style="width: 100%">
<el-table-column type="expand">
<template slot-scope="props">
<div style="padding-left: 20px" m="4">
<el-table :data="props.row.shopOrderResults" :border="true">
<el-table-column type="expand">
<template slot-scope="props">
<div style="padding-left: 20px" m="4">
<el-table
:data="props.row.productOrderResults"
:border="true"
>
<el-table-column type="index" width="50" label="序号">
</el-table-column>
<el-table-column label="商品名称" prop="productName" />
<el-table-column label="商品数量" prop="productCount" />
<el-table-column label="商品原价" prop="originPrice" />
<el-table-column label="商品终价" prop="finalPrice" />
<el-table-column
label="商品订单金额"
prop="productOrderMoney"
/>
<el-table-column label="商品图片" prop="productImg">
<template #default="scope">
<el-image
style="width: 60px; height: 60px"
:src="scope.row.productImg"
:zoom-rate="1.2"
:max-scale="7"
:min-scale="0.2"
:preview-src-list="[scope.row.productImg]"
:initial-index="4"
:preview-teleported="true"
fit="cover"
/>
</template>
</el-table-column>
</el-table>
</div>
</template>
</el-table-column>
<el-table-column type="index" width="50" label="序号">
</el-table-column>
<el-table-column label="订单编号" prop="unitOrderNo" />
<el-table-column label="店铺名称" prop="shopName" />
</el-table>
</div>
</template>
</el-table-column>
<el-table-column type="index" width="50" label="序号"> </el-table-column>
<el-table-column label="总订单号" prop="orderNo" />
<el-table-column label="下单时间" prop="createTime" />
<el-table-column label="收货人姓名" prop="receiverName" />
<el-table-column label="收货人电话" prop="receiverPhone" />
<el-table-column label="收货人地址" prop="poi">
<template #default="scope">
{{ scope.row.poi }} {{ scope.row.detail }}
</template>
</el-table-column>
<el-table-column label="市场订单金额" prop="unitOrderMoney" />
<el-table-column label="市场订单商品金额" prop="productMoney" />
<el-table-column label="市场订单配送费" prop="deliveryMoney" />
<el-table-column label="调度费" prop="dispatchMoney" />
<el-table-column label="包装费" prop="packageMoney" />
<el-table-column label="订单支付状态" prop="payStatus">
<template slot-scope="scope">
{{ filterStatus(scope.row.payStatus) }}
</template>
</el-table-column>
<el-table-column label="订单业务状态" prop="status">
<template slot-scope="scope">
{{ filterUnitStatus(scope.row.status) }}
</template>
</el-table-column>
<el-table-column label="订单退款状态" prop="refundStatus">
<template slot-scope="scope">
{{ filterUnitRefundStatus(scope.row.refundStatus) }}
</template>
</el-table-column>
<el-table-column label="订单结算状态" prop="settleStatus">
<template slot-scope="scope">
{{ scope.row.settleStatus == 0 ? "未结算" : "已结算" }}
</template>
</el-table-column>
<el-table-column label="市场编号" prop="settleStatus" />
<el-table-column label="市场名称" prop="marketName" />
<el-table-column label="申请退款原因" prop="refundReason" />
</el-table>
<!-- 分页 -->
<div class="pagination-container">
<el-pagination
:current-page="formInline.pageNumber"
:page-sizes="[10, 20, 30, 50]"
:page-size="formInline.pageSize"
:total="total"
background
layout="total, sizes, prev, pager, next, jumper"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
data() {
return {
activeName: "全部订单",
formInline: {
pageNumber: 1,
pageSize: 10,
brandId: "",
agentId: "",
},
form: {
name: "",
orderNo: "",
startTime: "",
endTime: "",
},
total: 0,
state: "",
tableData: [],
time: "",
overviewList: {},
isBrand: false,
};
},
created() {
if (
JSON.parse(sessionStorage.getItem("userInfo")).role ===
"ROLE_BRAND_MANAGER"
) {
this.formInline.brandId = JSON.parse(
sessionStorage.getItem("userInfo")
).brandId;
this.isBrand = true;
} else {
this.formInline.brandId = JSON.parse(
sessionStorage.getItem("userInfo")
).agentId;
this.isBrand = false;
}
this.getList();
},
methods: {
getList() {
this.$api.mer_admin
.distributorOrBrandOrderPage({
...this.formInline,
state: this.state,
...this.form,
})
.then((res) => {
console.log(res);
this.tableData = res.data.data.data;
this.total = Number(res.data.data.total);
});
this.$api.mer_admin
.orderOverview({ ...this.formInline, ...this.form })
.then()
.then((res) => {
this.overviewList = res.data.data;
console.log(res);
});
},
Reset() {
this.form = {
name: "",
orderNo: "",
startTime: "",
endTime: "",
};
this.getList();
},
handleClick(activeName) {
switch (activeName.label) {
case "全部订单":
this.state = "";
break;
case "待支付":
this.state = 0;
break;
case "待接单":
this.state = 1;
break;
case "待备货":
this.state = 2;
break;
case "待取货":
this.state = 3;
break;
case "已取货":
this.state = 4;
break;
case "配送中":
this.state = 5;
break;
case "已配送":
this.state = 6;
break;
case "完成":
this.state = 8;
break;
case "未支付订单取消":
this.state = -1;
break;
case "用户申请退款中":
this.state = -2;
break;
case "用户申请已退款":
this.state = -3;
break;
case "商家取消订单":
this.state = -4;
break;
case "平台取消订单":
this.state = -5;
break;
}
} this.getList();
},
handleSizeChange(val) {
this.formInline.pageSize = val;
this.getList();
},
handleCurrentChange(val) {
this.formInline.pageNumber = val;
this.getList();
},
filterStatus(val) {
if (val === 0) {
return "待支付";
} else if (val == 1) {
return "已支付";
} else if (val == -1) {
return "已取消";
} else if (val == -2) {
return "已退款";
} else if (val == -3) {
return "部分退款";
}
},
filterUnitStatus(val) {
if (val === 0) {
return "待支付";
} else if (val == 1) {
return "待接单";
} else if (val == 2) {
return "待备货";
} else if (val == 3) {
return "待取货";
} else if (val == 4) {
return "已取货";
} else if (val == 5) {
return "配送中";
} else if (val == 6) {
return "已配送";
} else if (val == 8) {
return "完成";
} else if (val == -1) {
return "未支付订单取消";
} else if (val == -2) {
return "用户申请退款中";
} else if (val == -3) {
return "用户申请已退款";
} else if (val == -4) {
return "商家取消订单";
} else if (val == -5) {
return "平台取消订单";
}
},
filterUnitRefundStatus(val) {
if (val === 0) {
return "正常";
} else if (val == 1) {
return "退款中";
} else if (val == 2) {
return "完全退款";
} else if (val == 3) {
return "部分退款";
} else if (val == 4) {
return "拒绝用户退款";
} else if (val == -1) {
return "退款失败";
} else if (val == -2) {
return "用户申请退款中";
}
},
changeTime(e) {
if (e) {
this.form.startTime = e[0];
this.form.endTime = e[1];
} else {
this.form.startTime = "";
this.form.endTime = "";
}
},
},
};
</script> </script>
<style> <style lang="scss" scoped>
.stat-list {
display: flex;
align-items: center;
/* justify-content: space-between; */
// flex-wrap: wrap;
margin-bottom: 10px;
padding: 10px;
border: 1px solid #ccc;
}
.stat-item {
width: 20%;
margin: 20px 20px;
display: flex;
align-items: center;
}
.stat-right {
font-size: 18px;
}
.stat-title {
margin-bottom: 5px;
}
</style> </style>