mirror of
https://gitee.com/beijing_hongye_huicheng/lilishop-ui.git
synced 2025-12-22 19:05:54 +08:00
commit message
This commit is contained in:
Chopper
151
seller/src/views/statistics/order/orderDetail.vue
Normal file
151
seller/src/views/statistics/order/orderDetail.vue
Normal file
@@ -0,0 +1,151 @@
|
||||
<template>
|
||||
<div class="wrapper">
|
||||
|
||||
<div class="shop">
|
||||
<h3>订单详情</h3>
|
||||
<div class="shop-item">
|
||||
<div class="label-item">
|
||||
<span>订单来源</span>
|
||||
<span>{{res.clientType}}</span>
|
||||
</div>
|
||||
<div class="label-item">
|
||||
<span>订单状态</span>
|
||||
<span>{{orderStatusList[res.orderStatus]}}</span>
|
||||
</div>
|
||||
<div class="label-item">
|
||||
<span>付款状态</span>
|
||||
<span>{{res.payStatus == "UNPAID"
|
||||
? "未付款"
|
||||
: res.payStatus == "PAID"
|
||||
? "已付款"
|
||||
: ""}}</span>
|
||||
</div>
|
||||
<div class="label-item">
|
||||
<span>支付时间</span>
|
||||
<span>{{res.paymentTime || '暂无'}}</span>
|
||||
</div>
|
||||
<div class="label-item">
|
||||
<span>支付方式</span>
|
||||
<span>{{res.paymentMethod == "ONLINE" ? "在线支付" : ""
|
||||
}}{{ res.paymentMethod == "ALIPAY" ? "支付宝" : res.paymentMethod == "BANK_TRANSFER" ? "银行卡" : "" || '暂无'}}</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="shop-item">
|
||||
<div class="label-item">
|
||||
<span>用户名</span>
|
||||
<span>{{res.memberName}}</span>
|
||||
</div>
|
||||
<div class="label-item">
|
||||
<span>店铺名称</span>
|
||||
<span>{{res.storeName}}</span>
|
||||
</div>
|
||||
<div class="label-item">
|
||||
<span>创建时间</span>
|
||||
<span>{{res.createTime}}</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<h3>商品详情</h3>
|
||||
<div class="shop-item">
|
||||
|
||||
<div class="goods-item" v-for="(item,index) in res.orderItems" :key="index">
|
||||
<div class="goods-img">
|
||||
<img class="img" :src="item.image" alt="">
|
||||
</div>
|
||||
<div class="goods-title">
|
||||
<div>{{item.name}}</div>
|
||||
<div>{{'x'+item.num}}</div>
|
||||
<div class="goods-price">{{res.flowPrice | unitPrice('￥')}}</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="count-price">
|
||||
<div class="label-item">
|
||||
<span>总价格</span>
|
||||
<span class="flowPrice">{{res.flowPrice | unitPrice('￥')}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
orderStatusList: {
|
||||
UNDELIVERED: "待发货",
|
||||
UNPAID: "未付款",
|
||||
PAID: "已付款",
|
||||
DELIVERED: "已发货",
|
||||
CANCELLED: "已取消",
|
||||
COMPLETED: "已完成",
|
||||
TAKE: "已完成",
|
||||
},
|
||||
};
|
||||
},
|
||||
props: ["res"],
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.wrapper {
|
||||
}
|
||||
.shop {
|
||||
padding: 10px 0;
|
||||
background: #fff;
|
||||
}
|
||||
.shop-item {
|
||||
display: flex;
|
||||
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
h3 {
|
||||
margin: 20px 16px;
|
||||
font-size: 18px;
|
||||
}
|
||||
.goods-price {
|
||||
font-size: 18px;
|
||||
color: red;
|
||||
}
|
||||
.goods-item {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
margin: 16px;
|
||||
}
|
||||
.count-price {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
.flowPrice {
|
||||
font-size: 24px;
|
||||
color: red;
|
||||
}
|
||||
.goods-title {
|
||||
margin: 0 16px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.img {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.label-item {
|
||||
margin: 10px 0;
|
||||
width: 20%;
|
||||
padding: 8px;
|
||||
align-items: center;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
> span {
|
||||
padding: 8px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
224
seller/src/views/statistics/order/orderStatistics.vue
Normal file
224
seller/src/views/statistics/order/orderStatistics.vue
Normal file
@@ -0,0 +1,224 @@
|
||||
<template>
|
||||
<div class="search">
|
||||
<Row>
|
||||
<Col>
|
||||
<Card>
|
||||
<Form
|
||||
label-position="left"
|
||||
ref="searchForm"
|
||||
:model="params"
|
||||
inline
|
||||
:label-width="100"
|
||||
>
|
||||
<Form-item label="选择时间类型" prop="sn">
|
||||
<Select v-model="params.timeType" style="width: 200px">
|
||||
<Option
|
||||
v-for="item in typeList"
|
||||
:value="item.value"
|
||||
:key="item.value"
|
||||
>{{ item.label }}
|
||||
</Option
|
||||
>
|
||||
</Select>
|
||||
</Form-item>
|
||||
<Form-item label="按年查询" prop="year">
|
||||
<DatePicker
|
||||
type="year"
|
||||
style="width: 200px"
|
||||
v-model="year"
|
||||
@on-change="changeYear"
|
||||
></DatePicker>
|
||||
</Form-item>
|
||||
<Form-item label="按月查询" v-if="params.timeType == 'MONTH'">
|
||||
<InputNumber :max="12" :min="1" v-model="params.month"></InputNumber>
|
||||
</Form-item>
|
||||
</Form>
|
||||
</Card>
|
||||
|
||||
<Card style="margin-top: 2px;height: 130px">
|
||||
<h3>订单统计</h3>
|
||||
<div class="ant-row">
|
||||
<div class="ant-col-4">
|
||||
<p class="static-menu">
|
||||
<span style="font-size: 14px;">总数</span>
|
||||
</p>
|
||||
<p class="static-num">
|
||||
{{priceData.totalNum}}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<p class="static-menu">
|
||||
<span style="font-size: 14px;">总金额</span>
|
||||
</p>
|
||||
<p class="static-num">
|
||||
{{ priceData.price | unitPrice }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
|
||||
<Card style="margin-top: 2px">
|
||||
<Row>
|
||||
<Table :loading="loading"
|
||||
border
|
||||
:columns="columns"
|
||||
:data="data" ref="table"
|
||||
sortable="custom"
|
||||
@on-sort-change="changeSort"
|
||||
@on-selection-change="changeSelect">
|
||||
|
||||
</Table>
|
||||
</Row>
|
||||
<Row type="flex" justify="end" class="page">
|
||||
<Page :current="searchForm.pageNumber"
|
||||
:total="total"
|
||||
:page-size="searchForm.pageSize"
|
||||
@on-change="changePage"
|
||||
@on-page-size-change="changePageSize"
|
||||
:page-size-opts="[10,20,50]"
|
||||
size="small"
|
||||
show-total
|
||||
show-elevator
|
||||
how-sizer></Page>
|
||||
</Row>
|
||||
</Card>
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as API_Statistics from "@/api/statistics";
|
||||
|
||||
export default {
|
||||
name: "goodsStatistics",
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
searchForm: [],
|
||||
params: {
|
||||
pageNumber: 1, // 当前页数
|
||||
pageSize: 10, // 页面大小
|
||||
type: "NUM",
|
||||
timeType: "YEAR",
|
||||
year:'',
|
||||
},
|
||||
year:'',
|
||||
|
||||
priceData:{
|
||||
totalNum:0,
|
||||
price:0
|
||||
},
|
||||
loading: true, // 表单加载状态
|
||||
typeList: [
|
||||
{
|
||||
value: "YEAR",
|
||||
label: "年",
|
||||
},
|
||||
{
|
||||
value: "MONTH",
|
||||
label: "月",
|
||||
},
|
||||
],
|
||||
columns: [
|
||||
{
|
||||
title: "店铺",
|
||||
key: "sellerName",
|
||||
},
|
||||
{
|
||||
title: "订单编号",
|
||||
key: "orderItemSn",
|
||||
},
|
||||
{
|
||||
title: "购买人",
|
||||
key: "memberName",
|
||||
},
|
||||
{
|
||||
title: "订单金额",
|
||||
key: "finalPrice",
|
||||
},
|
||||
{
|
||||
title: "创建时间",
|
||||
key: "createTime",
|
||||
},
|
||||
],
|
||||
data: [],
|
||||
total: 0 // 表单数据总数
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
params: {
|
||||
handler(val) {
|
||||
this.init();
|
||||
},
|
||||
deep: true,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//初始化
|
||||
init() {
|
||||
this.getDataPage()
|
||||
},
|
||||
getDataPage() {
|
||||
this.loading = true;
|
||||
API_Statistics.getOrderStatistics(this.params).then((res) => {
|
||||
this.loading = false;
|
||||
this.data = res.result.records
|
||||
this.total = res.result.total
|
||||
});
|
||||
API_Statistics.getOrderStatisticsPrice(this.params).then((res) => {
|
||||
this.loading = false;
|
||||
this.priceData.totalNum = res.result.num
|
||||
this.priceData.price = res.result.price?res.result.price:0
|
||||
});
|
||||
},
|
||||
changeYear(item){
|
||||
this.params.year = item;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
let nowDate = new Date();
|
||||
this.params.year = this.year = nowDate.getFullYear() + ''
|
||||
this.init();
|
||||
},
|
||||
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
// 建议引入通用样式 可删除下面样式代码
|
||||
@import "@/styles/table-common.scss";
|
||||
|
||||
.ant-row {
|
||||
position: relative;
|
||||
height: auto;
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
zoom: 1;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
margin-left: 30px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
|
||||
.ant-col-4 {
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
width: 11%;
|
||||
flex: 0 0 auto;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.static-num {
|
||||
color: rgb(51, 51, 51);
|
||||
font-size: 16px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.static-menu {
|
||||
color: rgb(51, 51, 51);
|
||||
font-size: 16px;
|
||||
padding: 5px;
|
||||
}
|
||||
</style>
|
||||
170
seller/src/views/statistics/order/refundOrder.vue
Normal file
170
seller/src/views/statistics/order/refundOrder.vue
Normal file
@@ -0,0 +1,170 @@
|
||||
<template>
|
||||
<div class="wrapper">
|
||||
|
||||
<div class="shop">
|
||||
<h3>售后详情</h3>
|
||||
<div class="shop-item">
|
||||
<div class="label-item">
|
||||
<span>售后类型</span>
|
||||
<span>{{serviceTypeList[res.serviceType]}}</span>
|
||||
</div>
|
||||
<div class="label-item">
|
||||
<span>售后单状态</span>
|
||||
<span>{{serviceStatusList[res.serviceStatus]}}</span>
|
||||
</div>
|
||||
|
||||
<div class="label-item">
|
||||
<span>退款时间</span>
|
||||
<span>{{res.refundTime || '暂无'}}</span>
|
||||
</div>
|
||||
<div class="label-item">
|
||||
<span>申请退款金额</span>
|
||||
<span>{{res.applyRefundPrice || '0'}}</span>
|
||||
</div>
|
||||
<div class="label-item">
|
||||
<span>商家备注</span>
|
||||
<span>{{res.auditRemark || '暂无'}}</span>
|
||||
</div>
|
||||
<div class="label-item">
|
||||
<span>申请原因</span>
|
||||
<span>{{res.reason || '暂无'}}</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="shop-item">
|
||||
<div class="label-item">
|
||||
<span>用户名</span>
|
||||
<span>{{res.memberName}}</span>
|
||||
</div>
|
||||
<div class="label-item">
|
||||
<span>店铺名称</span>
|
||||
<span>{{res.sellerName}}</span>
|
||||
</div>
|
||||
<div class="label-item">
|
||||
<span>创建时间</span>
|
||||
<span>{{res.createTime}}</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<h3>商品详情</h3>
|
||||
<div class="shop-item">
|
||||
|
||||
<div class="goods-item">
|
||||
<div class="goods-img">
|
||||
<img class="img" :src="res.goodsImage" alt="">
|
||||
</div>
|
||||
<div class="goods-title">
|
||||
<div>{{res.goodsName}}</div>
|
||||
<div>{{'x'+res.num}}</div>
|
||||
<div class="goods-price">{{res.flowPrice | unitPrice('￥')}}</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="count-price">
|
||||
<div class="label-item">
|
||||
<span>实际退款金额</span>
|
||||
<span class="flowPrice">{{res.flowPrice | unitPrice('￥')}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
orderStatusList: {
|
||||
UNDELIVERED: "待发货",
|
||||
UNPAID: "未付款",
|
||||
PAID: "已付款",
|
||||
DELIVERED: "已发货",
|
||||
CANCELLED: "已取消",
|
||||
COMPLETED: "已完成",
|
||||
TAKE: "已完成",
|
||||
},
|
||||
// 售后类型
|
||||
serviceTypeList: {
|
||||
CANCEL: "取消",
|
||||
RETURN_GOODS: "退货",
|
||||
EXCHANGE_GOODS: "换货",
|
||||
RETURN_MONEY: "退款",
|
||||
},
|
||||
serviceStatusList: {
|
||||
APPLY: "申请售后",
|
||||
PASS: "通过售后",
|
||||
REFUSE: "拒绝售后",
|
||||
BUYER_RETURN: "买家退货，待卖家收货",
|
||||
SELLER_RE_DELIVERY: "商家换货/补发",
|
||||
SELLER_CONFIRM: "卖家确认收货",
|
||||
SELLER_TERMINATION: "卖家终止售后",
|
||||
BUYER_CONFIRM: "买家确认收货",
|
||||
BUYER_CANCEL: "买家取消售后",
|
||||
WAIT_REFUND: "等待平台退款",
|
||||
COMPLETE: "完成售后",
|
||||
},
|
||||
};
|
||||
},
|
||||
props: ["res"],
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.wrapper {
|
||||
}
|
||||
.shop {
|
||||
padding: 10px 0;
|
||||
background: #fff;
|
||||
}
|
||||
.shop-item {
|
||||
display: flex;
|
||||
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
h3 {
|
||||
margin: 20px 16px;
|
||||
font-size: 18px;
|
||||
}
|
||||
.goods-price {
|
||||
font-size: 18px;
|
||||
color: red;
|
||||
}
|
||||
.goods-item {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
margin: 16px;
|
||||
}
|
||||
.count-price {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
.flowPrice {
|
||||
font-size: 24px;
|
||||
color: red;
|
||||
}
|
||||
.goods-title {
|
||||
margin: 0 16px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
.img {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.label-item {
|
||||
margin: 10px 0;
|
||||
width: 20%;
|
||||
padding: 8px;
|
||||
align-items: center;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
> span {
|
||||
padding: 8px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user