mirror of
https://gitee.com/beijing_hongye_huicheng/lilishop-ui.git
synced 2025-12-20 18:05:53 +08:00
适配微服务
This commit is contained in:
paulGao
@@ -2,7 +2,13 @@
|
||||
<div class="search">
|
||||
<Card>
|
||||
<Row @keydown.enter.native="handleSearch">
|
||||
<Form ref="searchForm" :model="searchForm" inline :label-width="70" class="search-form">
|
||||
<Form
|
||||
ref="searchForm"
|
||||
:model="searchForm"
|
||||
inline
|
||||
:label-width="70"
|
||||
class="search-form"
|
||||
>
|
||||
<Form-item label="订单编号" prop="orderSn">
|
||||
<Input
|
||||
type="text"
|
||||
@@ -22,7 +28,12 @@
|
||||
/>
|
||||
</Form-item>
|
||||
<Form-item label="售后状态">
|
||||
<Select v-model="searchForm.serviceStatus" placeholder="全部" clearable style="width: 200px">
|
||||
<Select
|
||||
v-model="searchForm.serviceStatus"
|
||||
placeholder="全部"
|
||||
clearable
|
||||
style="width: 200px"
|
||||
>
|
||||
<Option value="APPLY">申请售后</Option>
|
||||
<Option value="PASS">通过售后</Option>
|
||||
<Option value="REFUSE">拒绝售后</Option>
|
||||
@@ -63,12 +74,23 @@
|
||||
/>
|
||||
</Form-item>
|
||||
<Form-item label="售后类型">
|
||||
<Select v-model="searchForm.serviceType" placeholder="全部" clearable style="width: 200px">
|
||||
<Select
|
||||
v-model="searchForm.serviceType"
|
||||
placeholder="全部"
|
||||
clearable
|
||||
style="width: 200px"
|
||||
>
|
||||
<Option value="RETURN_MONEY">退款</Option>
|
||||
<Option value="RETURN_GOODS">退货</Option>
|
||||
</Select>
|
||||
</Form-item>
|
||||
<Button @click="handleSearch" type="primary" icon="ios-search" class="search-btn">搜索</Button>
|
||||
<Button
|
||||
@click="handleSearch"
|
||||
type="primary"
|
||||
icon="ios-search"
|
||||
class="search-btn"
|
||||
>搜索</Button
|
||||
>
|
||||
</Form>
|
||||
</Row>
|
||||
<Table
|
||||
@@ -80,25 +102,36 @@
|
||||
class="mt_10"
|
||||
>
|
||||
<!-- 商品栏目格式化 -->
|
||||
<template slot="goodsSlot" slot-scope="{row}">
|
||||
<div style="margin-top: 5px;height: 80px; display: flex;">
|
||||
<template slot="goodsSlot" slot-scope="{ row }">
|
||||
<div style="margin-top: 5px; height: 80px; display: flex">
|
||||
<div style="">
|
||||
<img :src="row.goodsImage" style="height: 60px;margin-top: 3px">
|
||||
<img :src="row.goodsImage" style="height: 60px; margin-top: 3px" />
|
||||
</div>
|
||||
|
||||
<div style="margin-left: 13px;">
|
||||
<div style="margin-left: 13px">
|
||||
<div class="div-zoom">
|
||||
<a @click="linkTo(row.goodsId,row.skuId)">{{row.goodsName}}</a>
|
||||
<a @click="linkTo(row.goodsId, row.skuId)">{{ row.goodsName }}</a>
|
||||
</div>
|
||||
<Poptip trigger="hover" title="扫码在手机中查看" transfer>
|
||||
<div slot="content">
|
||||
<vue-qr :text="wapLinkTo(row.goodsId,row.skuId)" :margin="0" colorDark="#000" colorLight="#fff" :size="150"></vue-qr>
|
||||
<vue-qr
|
||||
:text="wapLinkTo(row.goodsId, row.skuId)"
|
||||
:margin="0"
|
||||
colorDark="#000"
|
||||
colorLight="#fff"
|
||||
:size="150"
|
||||
></vue-qr>
|
||||
</div>
|
||||
<img src="../../../assets/qrcode.svg" class="hover-pointer" width="20" height="20" alt="">
|
||||
<img
|
||||
src="../../../assets/qrcode.svg"
|
||||
class="hover-pointer"
|
||||
width="20"
|
||||
height="20"
|
||||
alt=""
|
||||
/>
|
||||
</Poptip>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</Table>
|
||||
<Row type="flex" justify="end" class="mt_10">
|
||||
@@ -120,220 +153,220 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as API_Order from "@/api/order";
|
||||
import vueQr from 'vue-qr'
|
||||
export default {
|
||||
name: "orderList",
|
||||
components: {
|
||||
"vue-qr":vueQr
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: true, // 表单加载状态
|
||||
searchForm: {
|
||||
// 搜索框初始化对象
|
||||
pageNumber: 1, // 当前页数
|
||||
pageSize: 10, // 页面大小
|
||||
sort: "createTime", // 默认排序字段
|
||||
order: "desc", // 默认排序方式
|
||||
startDate: "", // 起始时间
|
||||
endDate: "", // 终止时间
|
||||
orderSn: "",
|
||||
memberName: "",
|
||||
serviceStatus: "",
|
||||
storeName:"",
|
||||
sn: "",
|
||||
|
||||
import * as API_Order from "@/api/order";
|
||||
import vueQr from "vue-qr";
|
||||
export default {
|
||||
components: {
|
||||
"vue-qr": vueQr,
|
||||
},
|
||||
name: "after-sale-order",
|
||||
data() {
|
||||
return {
|
||||
loading: true, // 表单加载状态
|
||||
searchForm: {
|
||||
// 搜索框初始化对象
|
||||
pageNumber: 1, // 当前页数
|
||||
pageSize: 10, // 页面大小
|
||||
sort: "createTime", // 默认排序字段
|
||||
order: "desc", // 默认排序方式
|
||||
startDate: "", // 起始时间
|
||||
endDate: "", // 终止时间
|
||||
orderSn: "",
|
||||
memberName: "",
|
||||
serviceStatus: "",
|
||||
storeName: "",
|
||||
sn: "",
|
||||
},
|
||||
selectDate: null, // 选择时间段
|
||||
form: {
|
||||
// 添加或编辑表单对象初始化数据
|
||||
sn: "",
|
||||
storeName: "",
|
||||
startTime: "",
|
||||
endTime: "",
|
||||
billPrice: "",
|
||||
},
|
||||
columns: [
|
||||
{
|
||||
title: "售后服务单号",
|
||||
key: "sn",
|
||||
minWidth: 140,
|
||||
tooltip: true,
|
||||
},
|
||||
selectDate: null, // 选择时间段
|
||||
form: {
|
||||
// 添加或编辑表单对象初始化数据
|
||||
sn: "",
|
||||
storeName: "",
|
||||
startTime: "",
|
||||
endTime: "",
|
||||
billPrice: "",
|
||||
{
|
||||
title: "订单编号",
|
||||
key: "orderSn",
|
||||
minWidth: 120,
|
||||
tooltip: true,
|
||||
},
|
||||
columns: [
|
||||
{
|
||||
title: "售后服务单号",
|
||||
key: "sn",
|
||||
minWidth: 140,
|
||||
tooltip: true
|
||||
},
|
||||
{
|
||||
title: "订单编号",
|
||||
key: "orderSn",
|
||||
minWidth: 120,
|
||||
tooltip: true
|
||||
},
|
||||
{
|
||||
title: "商品",
|
||||
key: "goodsName",
|
||||
minWidth: 300,
|
||||
tooltip: true,
|
||||
slot: "goodsSlot",
|
||||
},
|
||||
{
|
||||
title: "会员名称",
|
||||
key: "memberName",
|
||||
width: 140,
|
||||
},
|
||||
{
|
||||
title: "商家名称",
|
||||
key: "storeName",
|
||||
minWidth: 100,
|
||||
tooltip: true
|
||||
},
|
||||
{
|
||||
title: "售后金额",
|
||||
key: "applyRefundPrice",
|
||||
width: 110,
|
||||
render: (h, params) => {
|
||||
if(params.row.applyRefundPrice == null){
|
||||
return h(
|
||||
"div",
|
||||
this.$options.filters.unitPrice(0, "￥")
|
||||
);
|
||||
}else{
|
||||
return h(
|
||||
"div",
|
||||
this.$options.filters.unitPrice(params.row.applyRefundPrice, "￥")
|
||||
);
|
||||
}
|
||||
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "售后类型",
|
||||
key: "serviceType",
|
||||
width: 100,
|
||||
render: (h, params) => {
|
||||
if (params.row.serviceType == "RETURN_MONEY") {
|
||||
return h('div', [h('tag', {props: {color: "blue"}}, '退款'),]);
|
||||
} else if (params.row.serviceType == "RETURN_GOODS") {
|
||||
return h('div', [h('tag', {props: {color: "volcano"}}, '退货'),]);
|
||||
} else if (params.row.serviceType == "EXCHANGE_GOODS") {
|
||||
return h('div', [h('tag', {props: {color: "green"}}, '换货'),]);
|
||||
}
|
||||
{
|
||||
title: "商品",
|
||||
key: "goodsName",
|
||||
minWidth: 300,
|
||||
tooltip: true,
|
||||
slot: "goodsSlot",
|
||||
},
|
||||
{
|
||||
title: "会员名称",
|
||||
key: "memberName",
|
||||
width: 140,
|
||||
},
|
||||
{
|
||||
title: "商家名称",
|
||||
key: "storeName",
|
||||
minWidth: 100,
|
||||
tooltip: true,
|
||||
},
|
||||
{
|
||||
title: "售后金额",
|
||||
key: "applyRefundPrice",
|
||||
width: 110,
|
||||
render: (h, params) => {
|
||||
if (params.row.applyRefundPrice == null) {
|
||||
return h("div", this.$options.filters.unitPrice(0, "￥"));
|
||||
} else {
|
||||
return h(
|
||||
"div",
|
||||
this.$options.filters.unitPrice(params.row.applyRefundPrice, "￥")
|
||||
);
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
title: "售后状态",
|
||||
key: "serviceStatus",
|
||||
width: 200,
|
||||
render: (h, params) => {
|
||||
if (params.row.serviceStatus == "APPLY") {
|
||||
return h('div', [h('tag', {props: {color: "blue"}}, '申请中'),]);
|
||||
} else if (params.row.serviceStatus == "PASS") {
|
||||
return h('div', [h('tag', {props: {color: "cyan"}}, '通过售后'),]);
|
||||
} else if (params.row.serviceStatus == "REFUSE") {
|
||||
return h('div', [h('tag', {props: {color: "volcano"}}, '拒绝售后'),]);
|
||||
} else if (params.row.serviceStatus == "BUYER_RETURN") {
|
||||
return h('div', [h('tag', {props: {color: "orange"}}, '买家退货，待卖家收货'),]);
|
||||
} else if (params.row.serviceStatus == "SELLER_CONFIRM") {
|
||||
return h('div', [h('tag', {props: {color: "gold"}}, '卖家确认收货'),]);
|
||||
} else if (params.row.serviceStatus == "SELLER_TERMINATION") {
|
||||
return h('div', [h('tag', {props: {color: "lime"}}, '卖家终止售后'),]);
|
||||
} else if (params.row.serviceStatus == "BUYER_CANCEL") {
|
||||
return h('div', [h('tag', {props: {color: "purple"}}, '买家取消售后'),]);
|
||||
} else if (params.row.serviceStatus == "COMPLETE") {
|
||||
return h('div', [h('tag', {props: {color: "green"}}, '完成售后'),]);
|
||||
}else if (params.row.serviceStatus == "WAIT_REFUND") {
|
||||
return h('div', [h('tag', {props: {color: "geekblue"}}, '待平台退款'),]);
|
||||
}
|
||||
},
|
||||
{
|
||||
title: "售后类型",
|
||||
key: "serviceType",
|
||||
width: 100,
|
||||
render: (h, params) => {
|
||||
if (params.row.serviceType == "RETURN_MONEY") {
|
||||
return h("div", [h("tag", { props: { color: "blue" } }, "退款")]);
|
||||
} else if (params.row.serviceType == "RETURN_GOODS") {
|
||||
return h("div", [h("tag", { props: { color: "volcano" } }, "退货")]);
|
||||
} else if (params.row.serviceType == "EXCHANGE_GOODS") {
|
||||
return h("div", [h("tag", { props: { color: "green" } }, "换货")]);
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
{
|
||||
title: "操作",
|
||||
key: "action",
|
||||
fixed: "right",
|
||||
align: "center",
|
||||
width: 100,
|
||||
render: (h, params) => {
|
||||
{
|
||||
title: "售后状态",
|
||||
key: "serviceStatus",
|
||||
width: 150,
|
||||
render: (h, params) => {
|
||||
if (params.row.serviceStatus == "APPLY") {
|
||||
return h("div", [h("tag", { props: { color: "blue" } }, "申请中")]);
|
||||
} else if (params.row.serviceStatus == "PASS") {
|
||||
return h("div", [h("tag", { props: { color: "cyan" } }, "通过售后")]);
|
||||
} else if (params.row.serviceStatus == "REFUSE") {
|
||||
return h("div", [h("tag", { props: { color: "volcano" } }, "拒绝售后")]);
|
||||
} else if (params.row.serviceStatus == "BUYER_RETURN") {
|
||||
return h("div", [
|
||||
h(
|
||||
"Button",
|
||||
{
|
||||
props: {
|
||||
type: "info",
|
||||
size: "small",
|
||||
},
|
||||
style: {
|
||||
marginRight: "5px",
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
this.detail(params.row);
|
||||
},
|
||||
h("tag", { props: { color: "orange" } }, "买家退货，待卖家收货"),
|
||||
]);
|
||||
} else if (params.row.serviceStatus == "SELLER_CONFIRM") {
|
||||
return h("div", [h("tag", { props: { color: "gold" } }, "卖家确认收货")]);
|
||||
} else if (params.row.serviceStatus == "SELLER_TERMINATION") {
|
||||
return h("div", [h("tag", { props: { color: "lime" } }, "卖家终止售后")]);
|
||||
} else if (params.row.serviceStatus == "BUYER_CANCEL") {
|
||||
return h("div", [h("tag", { props: { color: "purple" } }, "买家取消售后")]);
|
||||
} else if (params.row.serviceStatus == "COMPLETE") {
|
||||
return h("div", [h("tag", { props: { color: "green" } }, "完成售后")]);
|
||||
} else if (params.row.serviceStatus == "WAIT_REFUND") {
|
||||
return h("div", [h("tag", { props: { color: "geekblue" } }, "待平台退款")]);
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "申请时间",
|
||||
key: "createTime",
|
||||
width: 180,
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
key: "action",
|
||||
fixed: "right",
|
||||
align: "center",
|
||||
width: 100,
|
||||
render: (h, params) => {
|
||||
return h("div", [
|
||||
h(
|
||||
"Button",
|
||||
{
|
||||
props: {
|
||||
type: "info",
|
||||
size: "small",
|
||||
},
|
||||
style: {
|
||||
marginRight: "5px",
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
this.detail(params.row);
|
||||
},
|
||||
},
|
||||
"查看"
|
||||
),
|
||||
]);
|
||||
},
|
||||
},
|
||||
"查看"
|
||||
),
|
||||
]);
|
||||
},
|
||||
],
|
||||
data: [], // 表单数据
|
||||
total: 0, // 表单数据总数
|
||||
};
|
||||
},
|
||||
],
|
||||
data: [], // 表单数据
|
||||
total: 0, // 表单数据总数
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
// 初始化数据
|
||||
init() {
|
||||
this.getDataList();
|
||||
},
|
||||
methods: {
|
||||
// 初始化数据
|
||||
init() {
|
||||
this.getDataList();
|
||||
},
|
||||
// 分页 改变页码
|
||||
changePage(v) {
|
||||
this.searchForm.pageNumber = v;
|
||||
this.getDataList();
|
||||
},
|
||||
// 分页 改变页数
|
||||
changePageSize(v) {
|
||||
this.searchForm.pageNumber = 1;
|
||||
this.searchForm.pageSize = v;
|
||||
this.getDataList();
|
||||
},
|
||||
// 搜索
|
||||
handleSearch() {
|
||||
this.searchForm.pageNumber = 1;
|
||||
this.searchForm.pageSize = 10;
|
||||
this.getDataList();
|
||||
},
|
||||
// 开始结束时间分别赋值
|
||||
selectDateRange(v) {
|
||||
if (v) {
|
||||
this.searchForm.startDate = v[0];
|
||||
this.searchForm.endDate = v[1];
|
||||
}
|
||||
},
|
||||
// 获取列表数据
|
||||
getDataList() {
|
||||
this.loading = true;
|
||||
API_Order.getAfterSaleOrderPage(this.searchForm).then((res) => {
|
||||
this.loading = false;
|
||||
if (res.success) {
|
||||
this.data = res.result.records;
|
||||
this.total = res.result.total;
|
||||
}
|
||||
});
|
||||
this.total = this.data.length;
|
||||
// 分页 改变页码
|
||||
changePage(v) {
|
||||
this.searchForm.pageNumber = v;
|
||||
this.getDataList();
|
||||
},
|
||||
// 分页 改变页数
|
||||
changePageSize(v) {
|
||||
this.searchForm.pageNumber = 1;
|
||||
this.searchForm.pageSize = v;
|
||||
this.getDataList();
|
||||
},
|
||||
// 搜索
|
||||
handleSearch() {
|
||||
this.searchForm.pageNumber = 1;
|
||||
this.searchForm.pageSize = 10;
|
||||
this.getDataList();
|
||||
},
|
||||
// 开始结束时间分别赋值
|
||||
selectDateRange(v) {
|
||||
if (v) {
|
||||
this.searchForm.startDate = v[0];
|
||||
this.searchForm.endDate = v[1];
|
||||
}
|
||||
},
|
||||
// 获取列表数据
|
||||
getDataList() {
|
||||
this.loading = true;
|
||||
API_Order.getAfterSaleOrderPage(this.searchForm).then((res) => {
|
||||
this.loading = false;
|
||||
},
|
||||
// 跳转订单详情
|
||||
detail(v) {
|
||||
let sn = v.sn;
|
||||
this.$router.push({
|
||||
name: "after-order-detail",
|
||||
query: {sn: sn},
|
||||
});
|
||||
|
||||
},
|
||||
if (res.success) {
|
||||
this.data = res.result.records;
|
||||
this.total = res.result.total;
|
||||
}
|
||||
});
|
||||
this.total = this.data.length;
|
||||
this.loading = false;
|
||||
},
|
||||
mounted() {
|
||||
this.init();
|
||||
// 跳转订单详情
|
||||
detail(v) {
|
||||
let sn = v.sn;
|
||||
this.$router.push({
|
||||
name: "after-order-detail",
|
||||
query: { sn: sn },
|
||||
});
|
||||
},
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.init();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -7,56 +7,54 @@
|
||||
<h3>退货申请</h3>
|
||||
<dl>
|
||||
<dt>退货状态</dt>
|
||||
<dd>{{afterSaleInfo.serviceName}}</dd>
|
||||
<dd>{{ afterSaleInfo.serviceName }}</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>退货退款编号</dt>
|
||||
<dd>{{afterSaleInfo.sn}}</dd>
|
||||
<dd>{{ afterSaleInfo.sn }}</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>退货退款原因</dt>
|
||||
<dd>{{afterSaleInfo.reason}}</dd>
|
||||
<dd>{{ afterSaleInfo.reason }}</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>申请退款金额</dt>
|
||||
<dd>￥{{afterSaleInfo.applyRefundPrice | unitPrice}}</dd>
|
||||
<dd>￥{{ afterSaleInfo.applyRefundPrice | unitPrice }}</dd>
|
||||
</dl>
|
||||
<dl v-if="afterSaleInfo.actualRefundPrice">
|
||||
<dt>实际退款金额</dt>
|
||||
<dd>￥{{afterSaleInfo.actualRefundPrice | unitPrice}}</dd>
|
||||
<dd>￥{{ afterSaleInfo.actualRefundPrice | unitPrice }}</dd>
|
||||
</dl>
|
||||
<dl v-if="afterSaleInfo.refundPoint">
|
||||
<dt>退还积分</dt>
|
||||
<dd>{{afterSaleInfo.refundPoint}}</dd>
|
||||
<dd>{{ afterSaleInfo.refundPoint }}</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>退货数量</dt>
|
||||
<dd>{{afterSaleInfo.num}}</dd>
|
||||
<dd>{{ afterSaleInfo.num }}</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>问题描述</dt>
|
||||
<dd>{{afterSaleInfo.problemDesc}}</dd>
|
||||
<dd>{{ afterSaleInfo.problemDesc }}</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>凭证</dt>
|
||||
<dd v-if="afterSaleImage == ''">
|
||||
暂无凭证
|
||||
</dd>
|
||||
<dd v-if="afterSaleImage == ''">暂无凭证</dd>
|
||||
<dd v-else>
|
||||
<div class="div-img" v-for="(item, index) in afterSaleImage" :key="index">
|
||||
<img class="complain-img" :src=item>
|
||||
<img class="complain-img" :src="item" />
|
||||
</div>
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
|
||||
<div class="div-form-default" v-if="afterSaleInfo.serviceStatus=='APPLY'">
|
||||
<div class="div-form-default" v-if="afterSaleInfo.serviceStatus == 'APPLY'">
|
||||
<h3>处理意见</h3>
|
||||
<dl>
|
||||
<dt>商家</dt>
|
||||
<dd>
|
||||
<div class="div-content">
|
||||
{{afterSaleInfo.storeName}}
|
||||
{{ afterSaleInfo.storeName }}
|
||||
</div>
|
||||
</dd>
|
||||
</dl>
|
||||
@@ -64,7 +62,11 @@
|
||||
<dt>是否同意</dt>
|
||||
<dd>
|
||||
<div class="div-content">
|
||||
<RadioGroup type="button" button-style="solid" v-model="params.serviceStatus">
|
||||
<RadioGroup
|
||||
type="button"
|
||||
button-style="solid"
|
||||
v-model="params.serviceStatus"
|
||||
>
|
||||
<Radio label="PASS">
|
||||
<span>同意</span>
|
||||
</Radio>
|
||||
@@ -77,37 +79,49 @@
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>申请退款金额</dt>
|
||||
<dd>{{ afterSaleInfo.applyRefundPrice | unitPrice('￥') }}</dd>
|
||||
<dd>{{ afterSaleInfo.applyRefundPrice | unitPrice("￥") }}</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>实际退款金额</dt>
|
||||
<dd>
|
||||
<Input v-model="params.actualRefundPrice" style="width:260px" />
|
||||
<Input v-model="params.actualRefundPrice" style="width: 260px" />
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>备注信息</dt>
|
||||
<dd>
|
||||
<Input v-model="params.remark" type="textarea" maxlength="200" :rows="4" clearable style="width:260px" />
|
||||
<Input
|
||||
v-model="params.remark"
|
||||
type="textarea"
|
||||
maxlength="200"
|
||||
:rows="4"
|
||||
clearable
|
||||
style="width: 260px"
|
||||
/>
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dd>
|
||||
<div style="text-align: right;width: 45%;margin-top: 10px">
|
||||
<Button type="primary" :loading="submitLoading" @click="handleSubmit" style="margin-left: 5px">
|
||||
<div style="text-align: right; width: 45%; margin-top: 10px">
|
||||
<Button
|
||||
type="primary"
|
||||
:loading="submitLoading"
|
||||
@click="handleSubmit"
|
||||
style="margin-left: 5px"
|
||||
>
|
||||
确定
|
||||
</Button>
|
||||
</div>
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
<div class="div-form-default" v-if="afterSaleInfo.serviceStatus !='APPLY'">
|
||||
<div class="div-form-default" v-if="afterSaleInfo.serviceStatus != 'APPLY'">
|
||||
<h3>商家处理</h3>
|
||||
<dl>
|
||||
<dt>商家</dt>
|
||||
<dd>
|
||||
<div class="div-content">
|
||||
{{afterSaleInfo.storeName}}
|
||||
{{ afterSaleInfo.storeName }}
|
||||
</div>
|
||||
</dd>
|
||||
</dl>
|
||||
@@ -128,139 +142,176 @@
|
||||
<dl>
|
||||
<dt>备注信息</dt>
|
||||
<dd>
|
||||
{{afterSaleInfo.auditRemark || '暂无备注信息'}}
|
||||
{{ afterSaleInfo.auditRemark || "暂无备注信息" }}
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
<div class="div-flow-center">
|
||||
|
||||
</div>
|
||||
<div class="div-flow-center"></div>
|
||||
<div class="div-flow-right">
|
||||
<div class="div-form-default">
|
||||
<h3>相关商品交易信息</h3>
|
||||
<dl>
|
||||
<dt>
|
||||
<img :src="afterSaleInfo.goodsImage" height="60px">
|
||||
<img :src="afterSaleInfo.goodsImage" height="60px" />
|
||||
</dt>
|
||||
<dd>
|
||||
<div class="div-zoom">
|
||||
<a @click="linkTo(afterSaleInfo.goodsId,afterSaleInfo.skuId)">{{afterSaleInfo.goodsName}}</a>
|
||||
<a @click="linkTo(afterSaleInfo.goodsId, afterSaleInfo.skuId)">{{
|
||||
afterSaleInfo.goodsName
|
||||
}}</a>
|
||||
<Poptip trigger="hover" title="扫码在手机中查看" transfer>
|
||||
<div slot="content">
|
||||
<vue-qr :text="wapLinkTo(afterSaleInfo.goodsId,afterSaleInfo.skuId)" :margin="0" colorDark="#000" colorLight="#fff" :size="150"></vue-qr>
|
||||
<vue-qr
|
||||
:text="wapLinkTo(afterSaleInfo.goodsId, afterSaleInfo.skuId)"
|
||||
:margin="0"
|
||||
colorDark="#000"
|
||||
colorLight="#fff"
|
||||
:size="150"
|
||||
></vue-qr>
|
||||
</div>
|
||||
<img src="../../../assets/qrcode.svg" style="vertical-align:middle" class="hover-pointer ml_10" width="20" height="20" alt="">
|
||||
<img
|
||||
src="../../../assets/qrcode.svg"
|
||||
style="vertical-align: middle"
|
||||
class="hover-pointer ml_10"
|
||||
width="20"
|
||||
height="20"
|
||||
alt=""
|
||||
/>
|
||||
</Poptip>
|
||||
</div>
|
||||
<div style="color:#999;font-size:10px">数量：x{{afterSaleInfo.num}}</div>
|
||||
|
||||
<div style="color: #999; font-size: 10px">
|
||||
数量：x{{ afterSaleInfo.num }}
|
||||
</div>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
</div>
|
||||
<div class="div-form-default">
|
||||
<h3>订单相关信息</h3>
|
||||
<dl>
|
||||
<dt>
|
||||
订单编号
|
||||
</dt>
|
||||
<dt>订单编号</dt>
|
||||
<dd>
|
||||
{{afterSaleInfo.orderSn}}
|
||||
{{ afterSaleInfo.orderSn }}
|
||||
</dd>
|
||||
</dl>
|
||||
<dl v-if="afterSaleInfo.bankDepositName">
|
||||
<dt>银行开户行</dt>
|
||||
<dd>
|
||||
{{afterSaleInfo.bankDepositName}}
|
||||
{{ afterSaleInfo.bankDepositName }}
|
||||
</dd>
|
||||
</dl>
|
||||
<dl v-if="afterSaleInfo.bankAccountName">
|
||||
<dt>银行开户名</dt>
|
||||
<dd>
|
||||
{{afterSaleInfo.bankAccountName}}
|
||||
{{ afterSaleInfo.bankAccountName }}
|
||||
</dd>
|
||||
</dl>
|
||||
<dl v-if="afterSaleInfo.bankAccountNumber">
|
||||
<dt>银行卡号</dt>
|
||||
<dd>
|
||||
{{afterSaleInfo.bankAccountNumber}}
|
||||
{{ afterSaleInfo.bankAccountNumber }}
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
</div>
|
||||
<div class="div-form-default" v-if="afterSaleInfo.afterSaleAllowOperationVO && afterSaleInfo.afterSaleAllowOperationVO.refund">
|
||||
<div
|
||||
class="div-form-default"
|
||||
v-if="
|
||||
afterSaleInfo.afterSaleAllowOperationVO &&
|
||||
afterSaleInfo.afterSaleAllowOperationVO.refund
|
||||
"
|
||||
>
|
||||
<h3>平台退款</h3>
|
||||
<dl>
|
||||
<dt>银行开户行</dt>
|
||||
<dd>
|
||||
{{afterSaleInfo.bankDepositName}}
|
||||
{{ afterSaleInfo.bankDepositName }}
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>银行开户名</dt>
|
||||
<dd>
|
||||
{{afterSaleInfo.bankAccountName}}
|
||||
{{ afterSaleInfo.bankAccountName }}
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>银行卡号</dt>
|
||||
<dd>
|
||||
{{afterSaleInfo.bankAccountNumber}}
|
||||
{{ afterSaleInfo.bankAccountNumber }}
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>备注信息</dt>
|
||||
<dd>
|
||||
<Input v-model="refundPriceForm.remark" type="textarea" maxlength="200" :rows="4" clearable style="width:260px" />
|
||||
<Input
|
||||
v-model="refundPriceForm.remark"
|
||||
type="textarea"
|
||||
maxlength="200"
|
||||
:rows="4"
|
||||
clearable
|
||||
style="width: 260px"
|
||||
/>
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>操作</dt>
|
||||
<dd>
|
||||
<Button type="primary" :loading="submitLoading" @click="refundPriceSubmit" style="margin-left: 5px">
|
||||
<Button
|
||||
type="primary"
|
||||
:loading="submitLoading"
|
||||
@click="refundPriceSubmit"
|
||||
style="margin-left: 5px"
|
||||
>
|
||||
退款
|
||||
</Button>
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
<div class="div-form-default" v-if="afterSaleInfo.showDelivery && afterSaleInfo.serviceType ==='RETURN_GOODS'">
|
||||
<div
|
||||
class="div-form-default"
|
||||
v-if="
|
||||
afterSaleInfo.showDelivery && afterSaleInfo.serviceType === 'RETURN_GOODS'
|
||||
"
|
||||
>
|
||||
<h3>物流信息</h3>
|
||||
<dl>
|
||||
<dt>收货商家</dt>
|
||||
<dd>{{afterSaleInfo.storeName}}</dd>
|
||||
<dd>{{ afterSaleInfo.storeName }}</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>收货商家手机</dt>
|
||||
<dd>{{storeMsg.salesConsigneeMobile}}</dd>
|
||||
<dd>{{ storeMsg.salesConsigneeMobile }}</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>收货地址</dt>
|
||||
<dd>{{storeMsg.salesConsigneeAddressPath}} {{storeMsg.salesConsigneeDetail}}</dd>
|
||||
<dd>
|
||||
{{ storeMsg.salesConsigneeAddressPath }}
|
||||
{{ storeMsg.salesConsigneeDetail }}
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>物流公司</dt>
|
||||
<dd>{{afterSaleInfo.mlogisticsName}}</dd>
|
||||
<dd>{{ afterSaleInfo.mlogisticsName }}</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>
|
||||
物流单号
|
||||
</dt>
|
||||
<dt>物流单号</dt>
|
||||
<dd>
|
||||
{{afterSaleInfo.mlogisticsNo}}
|
||||
{{ afterSaleInfo.mlogisticsNo }}
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>操作</dt>
|
||||
<dd>
|
||||
<Button type="info" :loading="submitLoading" @click="logisticsSeller()" style="margin-left: 5px">
|
||||
<Button
|
||||
type="info"
|
||||
:loading="submitLoading"
|
||||
@click="logisticsSeller()"
|
||||
style="margin-left: 5px"
|
||||
>
|
||||
查询物流
|
||||
</Button>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
@@ -273,33 +324,32 @@
|
||||
<dl>
|
||||
<dt>售后单号：</dt>
|
||||
<dd>
|
||||
<div class="text-box">{{sn}}</div>
|
||||
<div class="text-box">{{ sn }}</div>
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>物流公司：</dt>
|
||||
<dd>
|
||||
<div class="text-box">{{afterSaleInfo.mlogisticsName}}</div>
|
||||
<div class="text-box">{{ afterSaleInfo.mlogisticsName }}</div>
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>快递单号：</dt>
|
||||
<dd>
|
||||
<div class="text-box">{{afterSaleInfo.mlogisticsNo}}</div>
|
||||
<div class="text-box">{{ afterSaleInfo.mlogisticsNo }}</div>
|
||||
</dd>
|
||||
</dl>
|
||||
<div class="div-express-log">
|
||||
<ul class="express-log">
|
||||
<template v-if="Object.keys(logisticsInfo).length">
|
||||
<li v-for="(item,index) in logisticsInfo.traces" :key="index">
|
||||
<span class="time">{{item.AcceptTime}}</span>
|
||||
<span class="detail">{{item.AcceptStation}}</span>
|
||||
<li v-for="(item, index) in logisticsInfo.traces" :key="index">
|
||||
<span class="time">{{ item.AcceptTime }}</span>
|
||||
<span class="detail">{{ item.AcceptStation }}</span>
|
||||
</li>
|
||||
</template>
|
||||
<template v-else>
|
||||
<li style="text-align:center;">暂无物流信息</li>
|
||||
<li style="text-align: center">暂无物流信息</li>
|
||||
</template>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@@ -312,14 +362,17 @@
|
||||
|
||||
<script>
|
||||
import * as API_Order from "@/api/order";
|
||||
|
||||
import vueQr from "vue-qr";
|
||||
export default {
|
||||
components: {
|
||||
"vue-qr": vueQr,
|
||||
},
|
||||
name: "orderDetail",
|
||||
data() {
|
||||
return {
|
||||
sn: "", // 订单号
|
||||
logisticsModal: false, //查询物流模态框
|
||||
|
||||
|
||||
logisticsInfo: {}, //物流信息
|
||||
afterSaleInfo: {}, // 售后信息
|
||||
afterSaleImage: [], //会员申诉图片
|
||||
@@ -334,44 +387,45 @@ export default {
|
||||
refundPriceForm: {
|
||||
remark: "",
|
||||
},
|
||||
afterSaleStatusList: [ // 售后状态列表
|
||||
afterSaleStatusList: [
|
||||
// 售后状态列表
|
||||
{
|
||||
name: '申请中',
|
||||
status: 'APPLY'
|
||||
name: "申请中",
|
||||
status: "APPLY",
|
||||
},
|
||||
{
|
||||
name: '通过',
|
||||
status: 'PASS'
|
||||
name: "通过",
|
||||
status: "PASS",
|
||||
},
|
||||
{
|
||||
name: '拒绝',
|
||||
status: 'REFUSE'
|
||||
name: "拒绝",
|
||||
status: "REFUSE",
|
||||
},
|
||||
{
|
||||
name: '买家退货，待卖家收货',
|
||||
status: 'BUYER_RETURN'
|
||||
name: "买家退货，待卖家收货",
|
||||
status: "BUYER_RETURN",
|
||||
},
|
||||
{
|
||||
name: '卖家确认收货',
|
||||
status: 'SELLER_CONFIRM'
|
||||
name: "卖家确认收货",
|
||||
status: "SELLER_CONFIRM",
|
||||
},
|
||||
{
|
||||
name: '卖家终止售后',
|
||||
status: 'SELLER_TERMINATION'
|
||||
name: "卖家终止售后",
|
||||
status: "SELLER_TERMINATION",
|
||||
},
|
||||
{
|
||||
name: '买家取消售后',
|
||||
status: 'BUYER_CANCEL'
|
||||
name: "买家取消售后",
|
||||
status: "BUYER_CANCEL",
|
||||
},
|
||||
{
|
||||
name: '完成售后',
|
||||
status: 'COMPLETE'
|
||||
name: "完成售后",
|
||||
status: "COMPLETE",
|
||||
},
|
||||
{
|
||||
name: '等待平台退款',
|
||||
status: 'WAIT_REFUND'
|
||||
}
|
||||
]
|
||||
name: "等待平台退款",
|
||||
status: "WAIT_REFUND",
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
@@ -382,13 +436,19 @@ export default {
|
||||
this.loading = false;
|
||||
if (res.success) {
|
||||
this.afterSaleInfo = res.result;
|
||||
this.afterSaleInfo.showDelivery = this.showDelivery(this.afterSaleInfo.serviceStatus)
|
||||
this.afterSaleInfo.serviceName = this.filterOrderStatus(this.afterSaleInfo.serviceStatus)
|
||||
this.afterSaleInfo.showDelivery = this.showDelivery(
|
||||
this.afterSaleInfo.serviceStatus
|
||||
);
|
||||
this.afterSaleInfo.serviceName = this.filterOrderStatus(
|
||||
this.afterSaleInfo.serviceStatus
|
||||
);
|
||||
this.afterSaleImage = (res.result.afterSaleImage || "").split(",");
|
||||
//退货地址去掉逗号
|
||||
if (this.afterSaleInfo.mconsigneeAddressPath)
|
||||
this.afterSaleInfo.mconsigneeAddressPath =
|
||||
this.afterSaleInfo.mconsigneeAddressPath.replaceAll(",", " ");
|
||||
this.afterSaleInfo.mconsigneeAddressPath = this.afterSaleInfo.mconsigneeAddressPath.replaceAll(
|
||||
",",
|
||||
" "
|
||||
);
|
||||
|
||||
this.$set(
|
||||
this.params,
|
||||
@@ -397,15 +457,17 @@ export default {
|
||||
);
|
||||
// 如果显示物流信息，展示商家地址
|
||||
if (this.afterSaleInfo.showDelivery) {
|
||||
API_Order.storeAddress(this.sn).then(resu => {
|
||||
if(resu.success) {
|
||||
const obj = resu.result
|
||||
obj.salesConsigneeAddressPath = obj.salesConsigneeAddressPath.replaceAll(',', '')
|
||||
API_Order.storeAddress(this.sn).then((resu) => {
|
||||
if (resu.success) {
|
||||
const obj = resu.result;
|
||||
obj.salesConsigneeAddressPath = obj.salesConsigneeAddressPath.replaceAll(
|
||||
",",
|
||||
""
|
||||
);
|
||||
this.storeMsg = obj;
|
||||
}
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
@@ -462,21 +524,24 @@ export default {
|
||||
}
|
||||
});
|
||||
},
|
||||
filterOrderStatus (status) { // 获取订单状态中文
|
||||
const ob = this.afterSaleStatusList.filter(e => { return e.status === status });
|
||||
return ob[0].name
|
||||
filterOrderStatus(status) {
|
||||
// 获取订单状态中文
|
||||
const ob = this.afterSaleStatusList.filter((e) => {
|
||||
return e.status === status;
|
||||
});
|
||||
return ob[0].name;
|
||||
},
|
||||
// 根据订单状态判断是否显示物流信息
|
||||
showDelivery (status) {
|
||||
showDelivery(status) {
|
||||
let flag = false;
|
||||
this.afterSaleStatusList.forEach((e,index) => {
|
||||
this.afterSaleStatusList.forEach((e, index) => {
|
||||
// 订单为买家退货，待卖家收货之后的状态，并且不是买家取消售后，展示物流信息
|
||||
if(e.status === status && index>=3 && index !==6) {
|
||||
flag = true
|
||||
if (e.status === status && index >= 3 && index !== 6) {
|
||||
flag = true;
|
||||
}
|
||||
})
|
||||
return flag
|
||||
}
|
||||
});
|
||||
return flag;
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.sn = this.$route.query.sn;
|
||||
@@ -484,7 +549,7 @@ export default {
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" >
|
||||
<style lang="scss">
|
||||
.ivu-col {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
@@ -4,9 +4,22 @@
|
||||
<Card style="height: 60px">
|
||||
<div style="">
|
||||
<Button v-if="allowOperation.editPrice" @click="modifyPrice">调整价格</Button>
|
||||
<Button v-if="allowOperation.editConsignee" @click="editAddress" type="primary" ghost>修改收货地址</Button>
|
||||
<Button v-if="allowOperation.cancel" @click="orderCancel" type="warning" ghost>订单取消</Button>
|
||||
<Button v-if="orderInfo.order.orderStatus === 'UNPAID'" @click="confirmPrice" type="primary">收款</Button>
|
||||
<Button
|
||||
v-if="allowOperation.editConsignee"
|
||||
@click="editAddress"
|
||||
type="primary"
|
||||
ghost
|
||||
>修改收货地址</Button
|
||||
>
|
||||
<Button v-if="allowOperation.cancel" @click="orderCancel" type="warning" ghost
|
||||
>订单取消</Button
|
||||
>
|
||||
<Button
|
||||
v-if="orderInfo.order.orderStatus === 'UNPAID'"
|
||||
@click="confirmPrice"
|
||||
type="primary"
|
||||
>收款</Button
|
||||
>
|
||||
<Button @click="orderLog" type="info" ghost>订单日志</Button>
|
||||
</div>
|
||||
</Card>
|
||||
@@ -45,21 +58,30 @@
|
||||
|
||||
<div class="div-item" v-if="orderInfo.order.needReceipt == true">
|
||||
<div class="div-item-left">发票抬头：</div>
|
||||
<div class="div-item-right">{{
|
||||
orderInfo.receipt.receiptTitle ? orderInfo.receipt.receiptTitle : '暂无'
|
||||
<div class="div-item-right">
|
||||
{{
|
||||
orderInfo.receipt.receiptTitle ? orderInfo.receipt.receiptTitle : "暂无"
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="div-item" v-if="orderInfo.order.needReceipt == true && orderInfo.receipt.taxpayerId">
|
||||
<div
|
||||
class="div-item"
|
||||
v-if="orderInfo.order.needReceipt == true && orderInfo.receipt.taxpayerId"
|
||||
>
|
||||
<div class="div-item-left">发票税号：</div>
|
||||
<div class="div-item-right">{{ orderInfo.receipt.taxpayerId ? orderInfo.receipt.taxpayerId : '暂无' }}</div>
|
||||
<div class="div-item-right">
|
||||
{{ orderInfo.receipt.taxpayerId ? orderInfo.receipt.taxpayerId : "暂无" }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="div-item" v-if="orderInfo.order.needReceipt == true">
|
||||
<div class="div-item-left">发票内容：</div>
|
||||
<div class="div-item-right">{{
|
||||
orderInfo.receipt.receiptContent ? orderInfo.receipt.receiptContent : '暂无'
|
||||
<div class="div-item-right">
|
||||
{{
|
||||
orderInfo.receipt.receiptContent
|
||||
? orderInfo.receipt.receiptContent
|
||||
: "暂无"
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
@@ -67,13 +89,19 @@
|
||||
<div class="div-item" v-if="orderInfo.order.needReceipt == true">
|
||||
<div class="div-item-left">发票金额：</div>
|
||||
<div class="div-item-right">
|
||||
{{ orderInfo.receipt.receiptPrice ? orderInfo.receipt.receiptPrice : '暂无' | unitPrice('￥') }}
|
||||
{{
|
||||
orderInfo.receipt.receiptPrice
|
||||
? orderInfo.receipt.receiptPrice
|
||||
: "暂无" | unitPrice("￥")
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="div-item" v-if="orderInfo.order.needReceipt == true">
|
||||
<div class="div-item-left">是否开票：</div>
|
||||
<div class="div-item-right">{{ orderInfo.receipt.receiptStatus == 0 ? '未开' : '已开' }}</div>
|
||||
<div class="div-item-right">
|
||||
{{ orderInfo.receipt.receiptStatus == 0 ? "未开" : "已开" }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="width: 36%; float: left">
|
||||
@@ -105,21 +133,30 @@
|
||||
|
||||
<div class="div-item" v-if="orderInfo.order.needReceipt == true">
|
||||
<div class="div-item-left">发票抬头：</div>
|
||||
<div class="div-item-right">{{
|
||||
orderInfo.receipt.receiptTitle ? orderInfo.receipt.receiptTitle : '暂无'
|
||||
<div class="div-item-right">
|
||||
{{
|
||||
orderInfo.receipt.receiptTitle ? orderInfo.receipt.receiptTitle : "暂无"
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="div-item" v-if="orderInfo.order.needReceipt == true && orderInfo.receipt.taxpayerId">
|
||||
<div
|
||||
class="div-item"
|
||||
v-if="orderInfo.order.needReceipt == true && orderInfo.receipt.taxpayerId"
|
||||
>
|
||||
<div class="div-item-left">发票税号：</div>
|
||||
<div class="div-item-right">{{ orderInfo.receipt.taxpayerId ? orderInfo.receipt.taxpayerId : '暂无' }}</div>
|
||||
<div class="div-item-right">
|
||||
{{ orderInfo.receipt.taxpayerId ? orderInfo.receipt.taxpayerId : "暂无" }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="div-item" v-if="orderInfo.order.needReceipt == true">
|
||||
<div class="div-item-left">发票内容：</div>
|
||||
<div class="div-item-right">{{
|
||||
orderInfo.receipt.receiptContent ? orderInfo.receipt.receiptContent : '暂无'
|
||||
<div class="div-item-right">
|
||||
{{
|
||||
orderInfo.receipt.receiptContent
|
||||
? orderInfo.receipt.receiptContent
|
||||
: "暂无"
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
@@ -127,13 +164,19 @@
|
||||
<div class="div-item" v-if="orderInfo.order.needReceipt == true">
|
||||
<div class="div-item-left">发票金额：</div>
|
||||
<div class="div-item-right">
|
||||
{{ orderInfo.receipt.receiptPrice ? orderInfo.receipt.receiptPrice : '暂无' | unitPrice('￥') }}
|
||||
{{
|
||||
orderInfo.receipt.receiptPrice
|
||||
? orderInfo.receipt.receiptPrice
|
||||
: "暂无" | unitPrice("￥")
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="div-item" v-if="orderInfo.order.needReceipt == true">
|
||||
<div class="div-item-left">是否开票：</div>
|
||||
<div class="div-item-right">{{ orderInfo.receipt.receiptStatus == 0 ? '未开' : '已开' }}</div>
|
||||
<div class="div-item-right">
|
||||
{{ orderInfo.receipt.receiptStatus == 0 ? "未开" : "已开" }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="div-item">
|
||||
@@ -145,29 +188,55 @@
|
||||
</div>
|
||||
</Card>
|
||||
<Card class="mt_10">
|
||||
<Table :loading="loading" border :columns="columns" :data="data" ref="table" sortable="custom">
|
||||
<Table
|
||||
:loading="loading"
|
||||
border
|
||||
:columns="columns"
|
||||
:data="data"
|
||||
ref="table"
|
||||
sortable="custom"
|
||||
>
|
||||
<!-- 商品栏目格式化 -->
|
||||
<template slot="goodsSlot" slot-scope="{row}">
|
||||
<template slot="goodsSlot" slot-scope="{ row }">
|
||||
<div style="margin-top: 5px; height: 80px; display: flex">
|
||||
<div style="">
|
||||
<img :src="row.image" style="height: 60px; margin-top: 1px; width: 60px" />
|
||||
<img
|
||||
:src="row.image"
|
||||
style="height: 60px; margin-top: 1px; width: 60px"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div style="margin-left: 13px">
|
||||
<div class="div-zoom">
|
||||
<a @click="linkTo(row.goodsId,row.skuId)">{{ row.goodsName }}</a>
|
||||
<a @click="linkTo(row.goodsId, row.skuId)">{{ row.goodsName }}</a>
|
||||
</div>
|
||||
<span v-for="(item, key) in JSON.parse(row.specs)" :key="key">
|
||||
<span v-show="key!='images'" style="font-size: 12px;color: #999999;">
|
||||
<span v-show="key != 'images'" style="font-size: 12px; color: #999999">
|
||||
{{ key }} : {{ item }}
|
||||
</span>
|
||||
</span>
|
||||
<Poptip trigger="hover" style="display: block;" title="扫码在手机中查看" transfer>
|
||||
<Poptip
|
||||
trigger="hover"
|
||||
style="display: block"
|
||||
title="扫码在手机中查看"
|
||||
transfer
|
||||
>
|
||||
<div slot="content">
|
||||
<vue-qr :text="wapLinkTo(row.goodsId,row.skuId)" :margin="0" colorDark="#000" colorLight="#fff"
|
||||
:size="150"></vue-qr>
|
||||
<vue-qr
|
||||
:text="wapLinkTo(row.goodsId, row.skuId)"
|
||||
:margin="0"
|
||||
colorDark="#000"
|
||||
colorLight="#fff"
|
||||
:size="150"
|
||||
></vue-qr>
|
||||
</div>
|
||||
<img src="../../../assets/qrcode.svg" class="hover-pointer" width="20" height="20" alt="">
|
||||
<img
|
||||
src="../../../assets/qrcode.svg"
|
||||
class="hover-pointer"
|
||||
width="20"
|
||||
height="20"
|
||||
alt=""
|
||||
/>
|
||||
</Poptip>
|
||||
</div>
|
||||
</div>
|
||||
@@ -177,32 +246,56 @@
|
||||
<ul>
|
||||
<li>
|
||||
<span class="label">商品总额：</span>
|
||||
<span class="txt">{{ orderInfo.order.priceDetailDTO.goodsPrice | unitPrice('￥') }}</span>
|
||||
<span class="txt">{{
|
||||
orderInfo.order.priceDetailDTO.goodsPrice | unitPrice("￥")
|
||||
}}</span>
|
||||
</li>
|
||||
<li v-if="orderInfo.order.priceDetailDTO.discountPrice && orderInfo.order.priceDetailDTO.discountPrice > 0">
|
||||
<li
|
||||
v-if="
|
||||
orderInfo.order.priceDetailDTO.discountPrice &&
|
||||
orderInfo.order.priceDetailDTO.discountPrice > 0
|
||||
"
|
||||
>
|
||||
<span class="label">优惠金额：</span>
|
||||
<span class="txt"> {{ orderInfo.order.priceDetailDTO.discountPrice | unitPrice('￥') }} </span>
|
||||
<span class="txt">
|
||||
{{ orderInfo.order.priceDetailDTO.discountPrice | unitPrice("￥") }}
|
||||
</span>
|
||||
</li>
|
||||
|
||||
<li v-if="orderInfo.order.priceDetailDTO.couponPrice && orderInfo.order.priceDetailDTO.couponPrice > 0">
|
||||
<li
|
||||
v-if="
|
||||
orderInfo.order.priceDetailDTO.couponPrice &&
|
||||
orderInfo.order.priceDetailDTO.couponPrice > 0
|
||||
"
|
||||
>
|
||||
<span class="label">优惠券金额：</span>
|
||||
<span class="txt"> {{ orderInfo.order.priceDetailDTO.couponPrice | unitPrice('￥') }} </span>
|
||||
<span class="txt">
|
||||
{{ orderInfo.order.priceDetailDTO.couponPrice | unitPrice("￥") }}
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="label">运费：</span>
|
||||
<span class="txt">{{ orderInfo.order.freightPrice | unitPrice('￥') }}</span>
|
||||
<span class="txt">{{
|
||||
orderInfo.order.freightPrice | unitPrice("￥")
|
||||
}}</span>
|
||||
</li>
|
||||
<li v-if="orderInfo.order.priceDetailDTO.updatePrice">
|
||||
<span class="label">修改金额：</span>
|
||||
<span class="txt theme_color">¥{{ orderInfo.order.priceDetailDTO.updatePrice | unitPrice }}</span>
|
||||
<span class="txt theme_color"
|
||||
>¥{{ orderInfo.order.priceDetailDTO.updatePrice | unitPrice }}</span
|
||||
>
|
||||
</li>
|
||||
<li v-if="orderInfo.order.priceDetailDTO.payPoint != 0">
|
||||
<span class="label">使用积分：</span>
|
||||
<span class="txt flowPrice">{{ orderInfo.order.priceDetailDTO.payPoint }}</span>
|
||||
<span class="txt flowPrice">{{
|
||||
orderInfo.order.priceDetailDTO.payPoint
|
||||
}}</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="label">应付金额：</span>
|
||||
<span class="txt flowPrice">¥{{ orderInfo.order.priceDetailDTO.flowPrice | unitPrice }}</span>
|
||||
<span class="txt flowPrice"
|
||||
>¥{{ orderInfo.order.priceDetailDTO.flowPrice | unitPrice }}</span
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -215,10 +308,20 @@
|
||||
<span>修改金额</span>
|
||||
</p>
|
||||
<div>
|
||||
<Form ref="modifyPriceForm" :model="modifyPriceForm" label-position="left" :label-width="70"
|
||||
:rules="modifyPriceValidate">
|
||||
<Form
|
||||
ref="modifyPriceForm"
|
||||
:model="modifyPriceForm"
|
||||
label-position="left"
|
||||
:label-width="70"
|
||||
:rules="modifyPriceValidate"
|
||||
>
|
||||
<FormItem label="订单金额" prop="price">
|
||||
<InputNumber style="width:100px;" v-model="modifyPriceForm.price" :min="0" :max="999999"></InputNumber>
|
||||
<InputNumber
|
||||
style="width: 100px"
|
||||
v-model="modifyPriceForm.price"
|
||||
:min="0"
|
||||
:max="999999"
|
||||
></InputNumber>
|
||||
<span class="ml_10">元</span>
|
||||
</FormItem>
|
||||
</Form>
|
||||
@@ -235,11 +338,20 @@
|
||||
<span>订单取消</span>
|
||||
</p>
|
||||
<div>
|
||||
<Form ref="orderCancelForm" :model="orderCancelForm" label-position="left" :label-width="100"
|
||||
:rules="orderCancelValidate">
|
||||
<Form
|
||||
ref="orderCancelForm"
|
||||
:model="orderCancelForm"
|
||||
label-position="left"
|
||||
:label-width="100"
|
||||
:rules="orderCancelValidate"
|
||||
>
|
||||
<FormItem label="取消原因" prop="reason">
|
||||
<Input v-model="orderCancelForm.reason" type="textarea" :autosize="{ minRows: 2, maxRows: 5 }"
|
||||
placeholder="请输入取消原因"></Input>
|
||||
<Input
|
||||
v-model="orderCancelForm.reason"
|
||||
type="textarea"
|
||||
:autosize="{ minRows: 2, maxRows: 5 }"
|
||||
placeholder="请输入取消原因"
|
||||
></Input>
|
||||
</FormItem>
|
||||
</Form>
|
||||
</div>
|
||||
@@ -255,22 +367,55 @@
|
||||
<span>修改收件信息</span>
|
||||
</p>
|
||||
<div>
|
||||
<Form ref="addressForm" :model="addressForm" label-position="left" :label-width="100" :rules="addressRule">
|
||||
<Form
|
||||
ref="addressForm"
|
||||
:model="addressForm"
|
||||
label-position="left"
|
||||
:label-width="100"
|
||||
:rules="addressRule"
|
||||
>
|
||||
<FormItem label="收件人" prop="consigneeName">
|
||||
<Input v-model="addressForm.consigneeName" size="large" maxlength="20"></Input>
|
||||
<Input
|
||||
v-model="addressForm.consigneeName"
|
||||
size="large"
|
||||
maxlength="20"
|
||||
></Input>
|
||||
</FormItem>
|
||||
<FormItem label="联系方式" prop="consigneeMobile">
|
||||
<Input v-model="addressForm.consigneeMobile" size="large" maxlength="11"></Input>
|
||||
<Input
|
||||
v-model="addressForm.consigneeMobile"
|
||||
size="large"
|
||||
maxlength="11"
|
||||
></Input>
|
||||
</FormItem>
|
||||
<FormItem label="地址信息" prop="consigneeAddressPath">
|
||||
<Input v-model="addr" disabled style="width: 305px" v-if="showRegion == false" />
|
||||
<Button v-if="showRegion == false" @click="regionClick" :loading="submitLoading" type="primary"
|
||||
icon="ios-create-outline" style="margin-left: 8px">修改
|
||||
<Input
|
||||
v-model="addr"
|
||||
disabled
|
||||
style="width: 305px"
|
||||
v-if="showRegion == false"
|
||||
/>
|
||||
<Button
|
||||
v-if="showRegion == false"
|
||||
@click="regionClick"
|
||||
:loading="submitLoading"
|
||||
type="primary"
|
||||
icon="ios-create-outline"
|
||||
style="margin-left: 8px"
|
||||
>修改
|
||||
</Button>
|
||||
<region style="width: 400px" @selected="selectedRegion" v-if="showRegion == true" />
|
||||
<region
|
||||
style="width: 400px"
|
||||
@selected="selectedRegion"
|
||||
v-if="showRegion == true"
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem label="详细地址" prop="consigneeDetail">
|
||||
<Input v-model="addressForm.consigneeDetail" size="large" maxlength="50"></Input>
|
||||
<Input
|
||||
v-model="addressForm.consigneeDetail"
|
||||
size="large"
|
||||
maxlength="50"
|
||||
></Input>
|
||||
</FormItem>
|
||||
</Form>
|
||||
</div>
|
||||
@@ -285,8 +430,14 @@
|
||||
<span>订单日志</span>
|
||||
</p>
|
||||
<div class="order-log-div">
|
||||
<Table :loading="loading" border :columns="orderLogColumns" :data="orderInfo.orderLogs" ref="table"
|
||||
sortable="custom"></Table>
|
||||
<Table
|
||||
:loading="loading"
|
||||
border
|
||||
:columns="orderLogColumns"
|
||||
:data="orderInfo.orderLogs"
|
||||
ref="table"
|
||||
sortable="custom"
|
||||
></Table>
|
||||
</div>
|
||||
|
||||
<div slot="footer" style="text-align: right">
|
||||
@@ -359,9 +510,7 @@ export default {
|
||||
|
||||
//验证取消订单原因
|
||||
orderCancelValidate: {
|
||||
reason: [
|
||||
{ required: true, message: "取消原因不能为空", trigger: "blur" },
|
||||
],
|
||||
reason: [{ required: true, message: "取消原因不能为空", trigger: "blur" }],
|
||||
},
|
||||
addressModal: false, //弹出修改收件信息框
|
||||
//收件地址表单
|
||||
@@ -373,12 +522,8 @@ export default {
|
||||
consigneeAddressIdPath: "",
|
||||
},
|
||||
orderDeliverFormValidate: {
|
||||
logisticsNo: [
|
||||
{ required: true, message: "发货单号不能为空", trigger: "change" },
|
||||
],
|
||||
logisticsId: [
|
||||
{ required: true, message: "请选择物流公司", trigger: "blur" },
|
||||
],
|
||||
logisticsNo: [{ required: true, message: "发货单号不能为空", trigger: "change" }],
|
||||
logisticsId: [{ required: true, message: "请选择物流公司", trigger: "blur" }],
|
||||
},
|
||||
addressRule: {
|
||||
consigneeName: [
|
||||
@@ -442,10 +587,7 @@ export default {
|
||||
if (!params.row.goodsPrice) {
|
||||
return h("div", this.$options.filters.unitPrice(0, "￥"));
|
||||
}
|
||||
return h(
|
||||
"div",
|
||||
this.$options.filters.unitPrice(params.row.goodsPrice, "￥")
|
||||
);
|
||||
return h("div", this.$options.filters.unitPrice(params.row.goodsPrice, "￥"));
|
||||
},
|
||||
},
|
||||
|
||||
@@ -459,10 +601,7 @@ export default {
|
||||
key: "flowPrice",
|
||||
minWidth: 100,
|
||||
render: (h, params) => {
|
||||
return h(
|
||||
"div",
|
||||
this.$options.filters.unitPrice(params.row.flowPrice, "￥")
|
||||
);
|
||||
return h("div", this.$options.filters.unitPrice(params.row.flowPrice, "￥"));
|
||||
},
|
||||
},
|
||||
],
|
||||
@@ -542,15 +681,13 @@ export default {
|
||||
modifyPriceSubmit() {
|
||||
this.$refs.modifyPriceForm.validate((valid) => {
|
||||
if (valid) {
|
||||
API_Order.updateOrderPrice(this.sn, this.modifyPriceForm).then(
|
||||
(res) => {
|
||||
if (res.success) {
|
||||
this.$Message.success("修改订单金额成功");
|
||||
this.modal = false;
|
||||
this.getDataList();
|
||||
}
|
||||
API_Order.updateOrderPrice(this.sn, this.modifyPriceForm).then((res) => {
|
||||
if (res.success) {
|
||||
this.$Message.success("修改订单金额成功");
|
||||
this.modal = false;
|
||||
this.getDataList();
|
||||
}
|
||||
);
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
@@ -594,10 +731,8 @@ export default {
|
||||
this.addressForm.consigneeName = this.orderInfo.order.consigneeName;
|
||||
this.addressForm.consigneeMobile = this.orderInfo.order.consigneeMobile;
|
||||
this.addressForm.consigneeDetail = this.orderInfo.order.consigneeDetail;
|
||||
this.addressForm.consigneeAddressPath =
|
||||
this.orderInfo.order.consigneeAddressPath;
|
||||
this.addressForm.consigneeAddressIdPath =
|
||||
this.orderInfo.order.consigneeAddressIdPath;
|
||||
this.addressForm.consigneeAddressPath = this.orderInfo.order.consigneeAddressPath;
|
||||
this.addressForm.consigneeAddressIdPath = this.orderInfo.order.consigneeAddressIdPath;
|
||||
},
|
||||
//修改收货地址
|
||||
editAddressSubmit() {
|
||||
@@ -609,15 +744,13 @@ export default {
|
||||
this.addressForm.consigneeAddressIdPath = this.regionId;
|
||||
this.$refs.addressForm.validate((valid) => {
|
||||
if (valid) {
|
||||
API_Order.editOrderConsignee(this.sn, this.addressForm).then(
|
||||
(res) => {
|
||||
if (res.success) {
|
||||
this.$Message.success("收货地址修改成功");
|
||||
this.addressModal = false;
|
||||
this.getDataList();
|
||||
}
|
||||
API_Order.editOrderConsignee(this.sn, this.addressForm).then((res) => {
|
||||
if (res.success) {
|
||||
this.$Message.success("收货地址修改成功");
|
||||
this.addressModal = false;
|
||||
this.getDataList();
|
||||
}
|
||||
);
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
@@ -657,7 +790,6 @@ export default {
|
||||
margin-bottom: 2vh;
|
||||
}
|
||||
|
||||
|
||||
.select-clear {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user