学习很差啦 2022-08-18 12:44:54 +08:00
commit db6e47fa04
5 changed files with 292 additions and 113 deletions

View File

@ -1,17 +1,50 @@
<template> <template>
<div class="order-detail" v-if="order.order"> <div class="order-detail" v-if="order.order">
<card _Title="订单详情" :_Size="16"></card> <card _Title="订单详情" :_Size="16"></card>
<Card class="mb_10" v-if="order.allowOperationVO.pay || order.allowOperationVO.rog || order.allowOperationVO.cancel"> <Card
<Button type="success" @click="goPay(order.order.sn)" size="small" v-if="order.allowOperationVO.pay"></Button> class="mb_10"
<Button type="info" @click="received(order.order.sn)" size="small" v-if="order.allowOperationVO.rog"></Button> v-if="
<Button type="error" @click="handleCancelOrder(order.order.sn)" v-if="order.allowOperationVO.cancel" size="small"></Button> order.allowOperationVO.pay ||
order.allowOperationVO.rog ||
order.allowOperationVO.cancel
"
>
<Button
type="success"
@click="goPay(order.order.sn)"
size="small"
v-if="order.allowOperationVO.pay"
>去支付</Button
>
<Button
type="info"
@click="received(order.order.sn)"
size="small"
v-if="order.allowOperationVO.rog"
>确认收货</Button
>
<Button
type="error"
@click="handleCancelOrder(order.order.sn)"
v-if="order.allowOperationVO.cancel"
size="small"
>取消订单</Button
>
</Card> </Card>
<p class="verificationCode" v-if="order.order.verificationCode"><span>{{order.order.verificationCode}}</span></p> <p class="verificationCode" v-if="order.order.verificationCode">
核验码<span>{{ order.order.verificationCode }}</span>
</p>
<div class="order-card"> <div class="order-card">
<p class="global_color fontsize_18">{{ order.orderStatusValue }}</p> <p class="global_color fontsize_18">{{ order.orderStatusValue }}</p>
<p>订单号{{ order.order.sn }}</p> <p>订单号{{ order.order.sn }}</p>
<div style="color:#999;" class="operation-time">操作时间{{order.order.updateTime}}</div> <div style="color: #999" class="operation-time">
<Steps class="progress" :current="progressList.length" direction="vertical"> 操作时间{{ order.order.updateTime || order.order.createTime }}
</div>
<Steps
class="progress"
:current="progressList.length"
direction="vertical"
>
<Step <Step
:title="progress.message" :title="progress.message"
:content="progress.createTime" :content="progress.createTime"
@ -22,46 +55,55 @@
</div> </div>
<div class="order-card"> <div class="order-card">
<h3>收货人信息</h3> <h3>收货人信息</h3>
<p>收货人{{order.order.consigneeName}}</p> <p>收货人{{ order.order.consigneeName }}</p>
<p>手机号码{{order.order.consigneeMobile | secrecyMobile}}</p> <p>手机号码{{ order.order.consigneeMobile | secrecyMobile }}</p>
<p>收货地址{{order.order.consigneeAddressPath | unitAddress}} {{order.order.consigneeDetail}}</p> <p>
收货地址{{ order.order.consigneeAddressPath | unitAddress }}
{{ order.order.consigneeDetail }}
</p>
</div> </div>
<div class="order-card"> <div class="order-card">
<h3>付款信息</h3> <h3>付款信息</h3>
<p>支付方式{{order.paymentMethodValue}}</p> <p>支付方式{{ order.paymentMethodValue }}</p>
<p>付款状态{{order.payStatusValue}}</p> <p>付款状态{{ order.payStatusValue }}</p>
</div> </div>
<div class="order-card" v-if="!order.order.verificationCode"> <div class="order-card" v-if="!order.order.verificationCode">
<h3>配送信息</h3> <h3>配送信息</h3>
<p>配送方式{{order.deliveryMethodValue}}</p> <p>配送方式{{ order.deliveryMethodValue }}</p>
<p>配送状态{{order.deliverStatusValue}}</p> <p>配送状态{{ order.deliverStatusValue }}</p>
<p v-if="logistics">{{logistics.shipper || ''}}</p> <p v-if="logistics">
<p v-if="logistics">{{logistics.logisticCode || ''}}</p> 物流信息{{ logistics.shipper || "暂无物流信息" }}
</p>
<p v-if="logistics">
物流单号{{ logistics.logisticCode || "暂无物流单号" }}
</p>
<div class="div-express-log" v-if="logistics"> <div class="div-express-log" v-if="logistics">
<div class="express-log"> <div class="express-log">
<p>订单日志</p> <p>订单日志</p>
<div v-for="(item, index) in logistics.traces" :key="index"> <div v-for="(item, index) in logistics.traces" :key="index">
<span class="time">{{ item.AcceptTime }}</span> <span class="time">{{ item.AcceptTime }}</span>
<span class="detail">{{ item.AcceptStation }}</span> <span class="detail">{{ item.AcceptStation }}</span>
</div>
</div> </div>
</div>
</div> </div>
</div> </div>
<div class="order-card" v-if="order.order.payStatus === 'PAID'"> <div class="order-card" v-if="order.order.payStatus === 'PAID'">
<h3>发票信息</h3> <h3>发票信息</h3>
<template v-if="order.order.needReceipt"> <template v-if="order.order.needReceipt">
<p>发票抬头{{order.receipt.receiptTitle}}</p> <p>发票抬头{{ order.receipt.receiptTitle }}</p>
<p>发票内容{{order.receipt.receiptContent}}</p> <p>发票内容{{ order.receipt.receiptContent }}</p>
<p v-if="order.receipt.taxpayerId">{{order.receipt.taxpayerId}}</p> <p v-if="order.receipt.taxpayerId">
纳税人识别号{{ order.receipt.taxpayerId }}
</p>
</template> </template>
<div v-else style="color:#999;margin-left:5px"> <div v-else style="color: #999; margin-left: 5px">未开发票</div>
未开发票
</div>
</div> </div>
<!-- 订单商品 --> <!-- 订单商品 -->
<div class="goods"> <div class="goods">
<div class="shop-name"> <div class="shop-name">
<span @click="shopPage(order.order.storeId)">{{ order.order.storeName }}</span> <span @click="shopPage(order.order.storeId)">{{
order.order.storeName
}}</span>
</div> </div>
<table> <table>
<thead> <thead>
@ -77,21 +119,52 @@
<tbody> <tbody>
<tr v-for="(goods, goodsIndex) in order.orderItems" :key="goodsIndex"> <tr v-for="(goods, goodsIndex) in order.orderItems" :key="goodsIndex">
<td> <td>
<img @click="goodsDetail(goods.skuId, goods.goodsId)" :src="goods.image" alt="" /> <img
@click="goodsDetail(goods.skuId, goods.goodsId)"
:src="goods.image"
alt=""
/>
<div> <div>
<p @click="goodsDetail(goods.skuId, goods.goodsId)" class="hover-color"> <p
@click="goodsDetail(goods.skuId, goods.goodsId)"
class="hover-color"
>
{{ goods.goodsName }} {{ goods.goodsName }}
</p> </p>
</div> </div>
</td> </td>
<td>{{ goods.id }}</td> <td>{{ goods.id }}</td>
<td>{{ goods.goodsPrice | unitPrice('¥') }}</td> <td>{{ goods.goodsPrice | unitPrice("¥") }}</td>
<td>{{ goods.num }}</td> <td>{{ goods.num }}</td>
<td>{{ (goods.goodsPrice * goods.num) | unitPrice('¥') }}</td> <td>{{ (goods.goodsPrice * goods.num) | unitPrice("¥") }}</td>
<td> <td>
<Button v-if="goods.afterSaleStatus.includes('NOT_APPLIED') || goods.afterSaleStatus.includes('PART_AFTER_SALE')" @click="applyAfterSale(goods.sn)" type="info" size="small" class="mb_5"></Button> <Button
<Button v-if="goods.commentStatus == 'UNFINISHED'" @click="comment(order.order.sn, goodsIndex)" size="small" type="success" class="fontsize_12 mb_5" >评价</Button> v-if="
<Button v-if="goods.complainStatus == 'NO_APPLY'" @click="complain(order.order.sn, goodsIndex)" type="warning" class="fontsize_12" size="small"></Button> goods.afterSaleStatus.includes('NOT_APPLIED') ||
goods.afterSaleStatus.includes('PART_AFTER_SALE')
"
@click="applyAfterSale(goods.sn)"
type="info"
size="small"
class="mb_5"
>申请售后</Button
>
<Button
v-if="goods.commentStatus == 'UNFINISHED'"
@click="comment(order.order.sn, goodsIndex)"
size="small"
type="success"
class="fontsize_12 mb_5"
>评价</Button
>
<Button
v-if="goods.complainStatus == 'NO_APPLY'"
@click="complain(order.order.sn, goodsIndex)"
type="warning"
class="fontsize_12"
size="small"
>投诉</Button
>
</td> </td>
</tr> </tr>
</tbody> </tbody>
@ -102,127 +175,179 @@
<span>商品件数</span><span>{{ order.order.goodsNum }}</span> <span>商品件数</span><span>{{ order.order.goodsNum }}</span>
</div> </div>
<div> <div>
<span>商品总价</span><span>{{ order.order.goodsPrice | unitPrice("¥") }}</span><br> <span>商品总价</span
><span>{{ order.order.goodsPrice | unitPrice("¥") }}</span
><br />
</div> </div>
<div> <div>
<span>运费</span><span>+{{ order.order.freightPrice | unitPrice("¥") }}</span><br> <span>运费</span
><span>+{{ order.order.freightPrice | unitPrice("¥") }}</span
><br />
</div>
<div v-if="order.order.priceDetailDTO.couponPrice">
<span>优惠券</span
><span
>-{{
order.order.priceDetailDTO.couponPrice || 0 | unitPrice("¥")
}}</span
>
</div>
<div v-if="order.order.discountPrice">
<span>活动优惠</span
><span>-{{ order.order.discountPrice | unitPrice("¥") }}</span>
</div> </div>
<div v-if="order.order.priceDetailDTO.couponPrice"><span>优惠券</span><span>-{{ order.order.priceDetailDTO.couponPrice || 0 | unitPrice("¥") }}</span></div>
<div v-if="order.order.discountPrice"><span>活动优惠</span><span>-{{ order.order.discountPrice | unitPrice("¥") }}</span></div>
<div> <div>
<span>应付金额</span> <span>应付金额</span>
<span class="actrual-price">{{ order.order.flowPrice | unitPrice("¥") }}</span> <span class="actrual-price">{{
order.order.flowPrice | unitPrice("¥")
}}</span>
</div> </div>
</div> </div>
</div> </div>
<Modal v-model="cancelAvail" title="请选择取消订单原因" @on-ok="sureCancel" @on-cancel="cancelAvail = false"> <Modal
<RadioGroup v-model="cancelParams.reason" vertical type="button" button-style="solid"> v-model="cancelAvail"
title="请选择取消订单原因"
@on-ok="sureCancel"
@on-cancel="cancelAvail = false"
>
<RadioGroup
v-model="cancelParams.reason"
vertical
type="button"
button-style="solid"
>
<Radio :label="item.reason" v-for="item in cancelReason" :key="item.id"> <Radio :label="item.reason" v-for="item in cancelReason" :key="item.id">
{{item.reason}} {{ item.reason }}
</Radio> </Radio>
</RadioGroup> </RadioGroup>
</Modal> </Modal>
</div> </div>
</template> </template>
<script> <script>
import { orderDetail, getTraces, sureReceived, cancelOrder } from '@/api/order.js'; import {
import { afterSaleReason } from '@/api/member'; orderDetail,
getTraces,
sureReceived,
cancelOrder,
} from "@/api/order.js";
import { afterSaleReason } from "@/api/member";
export default { export default {
name: 'order-detail', name: "order-detail",
data () { data() {
return { return {
order: {}, // order: {}, //
progressList: [], // progressList: [], //
logistics: "", // logistics: "", //
cancelParams: { // cancelParams: {
orderSn: '', //
reason: '' orderSn: "",
reason: "",
}, },
cancelAvail: false, // modal cancelAvail: false, // modal
cancelReason: [] // cancelReason: [], //
}; };
}, },
methods: { methods: {
goodsDetail (skuId, goodsId) { goodsDetail(skuId, goodsId) {
// //
let routeUrl = this.$router.resolve({ let routeUrl = this.$router.resolve({
path: '/goodsDetail', path: "/goodsDetail",
query: { skuId, goodsId } query: { skuId, goodsId },
}); });
window.open(routeUrl.href, '_blank'); window.open(routeUrl.href, "_blank");
}, },
// //
shopPage (id) { shopPage(id) {
let routeUrl = this.$router.resolve({ let routeUrl = this.$router.resolve({
path: '/Merchant', path: "/Merchant",
query: { id: id } query: { id: id },
}); });
window.open(routeUrl.href, '_blank'); window.open(routeUrl.href, "_blank");
}, },
getDetail () { // getDetail() {
orderDetail(this.$route.query.sn).then(res => { //
orderDetail(this.$route.query.sn).then((res) => {
if (res.success) { if (res.success) {
this.order = res.result; this.order = res.result;
this.progressList = res.result.orderLogs this.progressList = res.result.orderLogs;
} }
}) });
}, },
traces () { // traces() {
getTraces(this.$route.query.sn).then(res => { //
getTraces(this.$route.query.sn).then((res) => {
if (res.success) { if (res.success) {
this.logistics = res.result this.logistics = res.result;
} }
}) });
}, },
received (sn) { // received(sn) {
sureReceived(sn).then(res => { //
sureReceived(sn).then((res) => {
if (res.success) { if (res.success) {
this.$Message.success('确认收货成功') this.$Message.success("确认收货成功");
this.getDetail() this.getDetail();
} }
}) });
}, },
goPay (sn) { // goPay(sn) {
this.$router.push({path: '/payment', query: {orderType: 'ORDER', sn}}); //
this.$router.push({
path: "/payment",
query: { orderType: "ORDER", sn },
});
}, },
applyAfterSale (sn) { // applyAfterSale(sn) {
this.$router.push({name: 'ApplyAfterSale', query: {sn: sn}}) //
this.$router.push({ name: "ApplyAfterSale", query: { sn: sn } });
}, },
comment (sn, goodsIndex) { // comment(sn, goodsIndex) {
this.$router.push({path: '/home/addEval', query: {sn, index: goodsIndex}}) //
this.$router.push({
path: "/home/addEval",
query: { sn, index: goodsIndex },
});
}, },
complain (sn, goodsIndex) { // complain(sn, goodsIndex) {
this.$router.push({name: 'Complain', query: {sn, index: goodsIndex}}) //
this.$router.push({ name: "Complain", query: { sn, index: goodsIndex } });
}, },
handleCancelOrder (sn) { handleCancelOrder(sn) {
// //
this.cancelParams.orderSn = sn; this.cancelParams.orderSn = sn;
afterSaleReason('CANCEL').then(res => { afterSaleReason("CANCEL").then((res) => {
if (res.success) { if (res.success) {
this.cancelReason = res.result; this.cancelReason = res.result;
this.cancelAvail = true this.cancelAvail = true;
this.cancelParams.reason = this.cancelReason[0].reason this.cancelParams.reason = this.cancelReason[0].reason;
} }
}) });
}, },
sureCancel () { // sureCancel() {
cancelOrder(this.cancelParams).then(res => { //
cancelOrder(this.cancelParams).then((res) => {
if (res.success) { if (res.success) {
this.$Message.success('取消订单成功') this.$Message.success("取消订单成功");
this.getDetail() this.getDetail();
this.cancelAvail = false this.cancelAvail = false;
} }
}) });
} },
},
mounted() {
this.getDetail();
this.traces();
}, },
mounted () {
this.getDetail()
this.traces()
}
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.mb_5{ .mb_10 {
Button:nth-of-type(2) {
margin-left: 10px;
}
}
.mb_5 {
margin-bottom: 5px; margin-bottom: 5px;
} }
.order-card { .order-card {
@ -323,7 +448,7 @@ table {
color: rgb(65, 63, 63); color: rgb(65, 63, 63);
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
span{ span {
color: $theme_color; color: $theme_color;
} }
} }

View File

@ -346,6 +346,16 @@ export default {
!res.result.checkedSkuList || !res.result.checkedSkuList ||
res.result.checkedSkuList.length === 0 res.result.checkedSkuList.length === 0
) { ) {
if (res.result.skuList && res.result.skuList[0]) {
this.$Modal.warning({
title: "购物车存在无效商品!",
content:
"[" +
res.result.skuList[0].goodsSku.goodsName +
"]" +
res.result.skuList[0].errorMessage,
});
}
this.$router.push({ this.$router.push({
path: "/cart", path: "/cart",
replace: true, replace: true,

View File

@ -44,7 +44,7 @@
</div> </div>
<div class="goods-seckill-btn" :class="{'goods-seckill-btn-gray' : nowHour < list[currIndex].timeLine}">{{nowHour >= list[currIndex].timeLine ? '立即抢购' : '即将开始'}}</div> <div class="goods-seckill-btn" :class="{'goods-seckill-btn-gray' : nowHour < list[currIndex].timeLine}">{{nowHour >= list[currIndex].timeLine ? '立即抢购' : '即将开始'}}</div>
<div class="goods-show-num"> <div class="goods-show-num">
已售<Progress style="width:110px" class="ml_10" :percent="Math.ceil(item.salesNum/(item.quantity+item.salesNum))" /> 已售<Progress style="width:110px" class="ml_10" :percent="Math.ceil(item.salesNum/(item.quantity+item.salesNum)*100)" />
</div> </div>
<div class="goods-show-seller"> <div class="goods-show-seller">
<span>{{ item.storeName }}</span> <span>{{ item.storeName }}</span>

View File

@ -39,7 +39,11 @@
style="width: 200px" style="width: 200px"
></DatePicker> ></DatePicker>
</Form-item> </Form-item>
<Button @click="handleSearch" type="primary" icon="ios-search" class="search-btn" <Button
@click="handleSearch"
type="primary"
icon="ios-search"
class="search-btn"
>搜索</Button >搜索</Button
> >
</Form> </Form>
@ -59,18 +63,26 @@
> >
<template slot-scope="{ row }" slot="action"> <template slot-scope="{ row }" slot="action">
<Button <Button
v-if="row.promotionStatus === 'CLOSE' || row.promotionStatus === 'NEW'" v-if="
row.promotionStatus === 'CLOSE' || row.promotionStatus === 'NEW'
"
type="info" type="info"
size="small" size="small"
@click="see(row)" @click="see(row)"
>编辑 >编辑
</Button> </Button>
<Button v-else type="default" size="small" @click="see(row, 'onlyView')" <Button
v-else
type="default"
size="small"
@click="see(row, 'onlyView')"
>查看 >查看
</Button> </Button>
<Button <Button
class="ml_5" class="ml_5"
v-if="row.promotionStatus === 'START' || row.promotionStatus === 'NEW'" v-if="
row.promotionStatus === 'START' || row.promotionStatus === 'NEW'
"
type="error" type="error"
size="small" size="small"
@click="close(row)" @click="close(row)"
@ -78,7 +90,9 @@
</Button> </Button>
<Button <Button
class="ml_5" class="ml_5"
v-if="row.promotionStatus === 'CLOSE' || row.promotionStatus === 'END'" v-if="
row.promotionStatus === 'CLOSE' || row.promotionStatus === 'END'
"
type="error" type="error"
size="small" size="small"
@click="remove(row)" @click="remove(row)"
@ -109,7 +123,10 @@ import {
updatePlatformCouponStatus, updatePlatformCouponStatus,
deletePlatformCoupon, deletePlatformCoupon,
} from "@/api/promotion"; } from "@/api/promotion";
import { promotionsStatusRender, promotionsScopeTypeRender } from "@/utils/promotions"; import {
promotionsStatusRender,
promotionsScopeTypeRender,
} from "@/utils/promotions";
export default { export default {
name: "coupon", name: "coupon",
@ -152,7 +169,10 @@ export default {
width: 100, width: 100,
render: (h, params) => { render: (h, params) => {
if (params.row.price) { if (params.row.price) {
return h("div", this.$options.filters.unitPrice(params.row.price, "¥")); return h(
"div",
this.$options.filters.unitPrice(params.row.price, "¥")
);
} else { } else {
return h("div", params.row.couponDiscount + "折"); return h("div", params.row.couponDiscount + "折");
} }
@ -172,6 +192,14 @@ export default {
); );
}, },
}, },
{
title: "已被使用的数量/已领取数量",
key: "publishNum",
render: (h, params) => {
return h("div", params.row.usedNum + "/" + params.row.receivedNum);
},
},
{ {
title: "优惠券类型", title: "优惠券类型",
key: "couponType", key: "couponType",
@ -207,7 +235,8 @@ export default {
} else if (params?.row?.startTime && params?.row?.endTime) { } else if (params?.row?.startTime && params?.row?.endTime) {
return h("div", { return h("div", {
domProps: { domProps: {
innerHTML: params.row.startTime + "<br/>" + params.row.endTime, innerHTML:
params.row.startTime + "<br/>" + params.row.endTime,
}, },
}); });
} }
@ -349,7 +378,7 @@ export default {
getPlatformCouponList(this.searchForm).then((res) => { getPlatformCouponList(this.searchForm).then((res) => {
this.loading = false; this.loading = false;
if (res.success) { if (res.success) {
console.log(res) console.log(res);
this.data = res.result.records; this.data = res.result.records;
this.total = res.result.total; this.total = res.result.total;
} }

View File

@ -65,7 +65,9 @@
> >
<template slot-scope="{ row }" slot="action"> <template slot-scope="{ row }" slot="action">
<Button <Button
v-if="row.promotionStatus === 'NEW' || row.promotionStatus === 'CLOSE'" v-if="
row.promotionStatus === 'NEW' || row.promotionStatus === 'CLOSE'
"
type="info" type="info"
size="small" size="small"
@click="see(row)" @click="see(row)"
@ -75,7 +77,9 @@
>查看</Button >查看</Button
> >
<Button <Button
v-if="row.promotionStatus === 'START' || row.promotionStatus === 'NEW'" v-if="
row.promotionStatus === 'START' || row.promotionStatus === 'NEW'
"
type="error" type="error"
size="small" size="small"
:style="{ marginLeft: '5px' }" :style="{ marginLeft: '5px' }"
@ -104,7 +108,10 @@
<script> <script>
import { getShopCouponList, updateCouponStatus } from "@/api/promotion"; import { getShopCouponList, updateCouponStatus } from "@/api/promotion";
import { promotionsStatusRender, promotionsScopeTypeRender } from "@/utils/promotions"; import {
promotionsStatusRender,
promotionsScopeTypeRender,
} from "@/utils/promotions";
export default { export default {
name: "coupon", name: "coupon",
@ -167,6 +174,13 @@ export default {
); );
}, },
}, },
{
title: "已被使用的数量/已领取数量",
key: "publishNum",
render: (h, params) => {
return h("div", params.row.usedNum + "/" + params.row.receivedNum);
},
},
{ {
title: "优惠券类型", title: "优惠券类型",
key: "couponType", key: "couponType",
@ -200,7 +214,8 @@ export default {
} else if (params?.row?.startTime && params?.row?.endTime) { } else if (params?.row?.startTime && params?.row?.endTime) {
return h("div", { return h("div", {
domProps: { domProps: {
innerHTML: params.row.startTime + "<br/>" + params.row.endTime, innerHTML:
params.row.startTime + "<br/>" + params.row.endTime,
}, },
}); });
} }