Commit 74951c0a by chenyu

update: update

parent a98e2f67
<template>
<div>
<el-dialog title="订单详情" custom-class="customer-dailog" :visible.sync="dialogVisible"
:close-on-click-modal="false" @close="cancel" width="600px">
<div class="record-dilog" style="width: 560px;">
<div class="table-content">
<el-table :data="orderData" tooltip-effect="dark" ref="orderTable">
<el-table-column prop="productName" label="商品信息" width="200px">
<template slot-scope="scope">
<div class="record-info">
<div class="record-infoimg"><img width="60" height="60"
:src="scope.row.imageUrl ? scope.row.imageUrl : './static/img/default.png'"
alt=""></div>
<div class="record-infocontent">
<div>{{ scope.row.productName }}</div>
<div>{{ scope.row.productCode }}</div>
<div style="color: #c0c4cc;">
<span v-for="(item, index) in scope.row.attrColorSize" :key="index">
{{item.key}}:{{item.value}}
</span>
</div>
<div></div>
</div>
</div>
</template>
</el-table-column>
<el-table-column prop="number" label="数量" width="120px"></el-table-column>
<el-table-column prop="payPrice" label="成交价">
<template slot-scope="scope">
<p>{{ scope.row.unitPrice }}</p>
<p>{{ scope.row.payPrice }}</p>
</template>
</el-table-column>
</el-table>
<div class="record-border">
<div class="record-countwrap">
<p><span class="record-count">商品总价</span><span
class="record-countvalue">{{ orderInfo.totalAmount }}</span></p>
<p><span class="record-count">优惠活动</span><span
class="record-countvalue">{{ orderInfo.promotionAmount }}</span></p>
<p><span class="record-count">应付金额</span><span
class="record-countvalue">{{ orderInfo.paidAmount }}</span></p>
</div>
</div>
<div class="record-border">
<div class="record-countwrap">
<p v-for="(item, index) in payInfo" :key="index"><span
class="record-count">{{ item.name }}</span><span
class="record-countvalue">{{ item.value }}</span></p>
</div>
</div>
<div class="record-border">
<div class="record-countwrap">
<p><span class="record-count">订单总额</span><span
class="record-countvalue">{{ orderInfo.paidAmount }}</span></p>
</div>
</div>
</div>
<div class="evaluate-box" v-if="evaluateData.length">
<div class="evaluate-con">
<div class="item" v-for="(item, index) in evaluateData" :key="index">
{{item.ruleName}}
<div class="evaluate-star">
<el-rate disabled v-model="item.evaluateScore"
:colors="['#99A9BF', '#F7BA2A', '#FF9900']"></el-rate>
</div>
</div>
</div>
<div class="e-txt">
<div class="e-con">
<p>买家评语</p>
<p>{{evaluate.evaluateContent}}</p>
</div>
<span class="e-time">
{{evaluate.createTime}}
</span>
</div>
<div class="r-txt" v-if="evaluate.replyContent">
<div class="e-con">
<p>商家回复</p>
<p>{{evaluate.replyContent}}</p>
</div>
<span class="e-time">
{{evaluate.replayDate}}
</span>
</div>
<div style="text-align: center" v-if="!evaluate.replyContent">
<el-button @click="replayFast">立即回复</el-button>
</div>
</div>
</div>
<el-dialog title="回复" :visible.sync="replayVisable" width="30%" append-to-body>
<div class="">
<el-input type="textarea" :rows="2" placeholder="请输入回复内容" v-model="textarea">
</el-input>
</div>
<span slot="footer" class="dilog-footer">
<el-button @click="replayVisable = false">取 消</el-button>
<el-button type="primary" @click="confirmReplay">确 定</el-button>
</span>
</el-dialog>
<span slot="footer" class="dialog-footer">
<el-button @click="cancel">关闭</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { doFetch, doFetchqs, doFetchGet } from "../../axios/api";
import url from "../../axios/url";
import { mapState } from "vuex";
import { checkFalse, checkStatus, checkSuccess } from "../../../../static/js/checkStatus";
export default {
name: "customermainstoreDialog",
props: {
dialogVisible: {
type: Boolean,
default: false
},
obj: {
type: Object,
default: () => {
return {};
}
}
},
data() {
return {
evaluateId:'',
orderId:'',
orderInfo: {},
orderData: [],
evaluateData: [],
payInfo: [],
textarea: '',
replayVisable: false,
btnLoading: false,
};
},
computed: {
...mapState([ "showEditClique" ])
},
methods: {
cancel() {
this.$emit('update:dialogVisible', false);
},
getOrderDetail(orderId) {
this.orderData = [];
this.orderInfo = "";
this.orderId = orderId;
this.payInfo = [];
doFetch(url.orderDetail, {
memberId: this.memberId,
orderId: orderId
})
.then(res => {
if (res.data.errorCode === 0) {
this.orderInfo = res.data.result.orderInfo;
// 组装一下商品的属性 方便遍历
console.log(res.data.result.orderInfo.list)
this.orderData = res.data.result.orderInfo.list.map(ele => ({
...ele,
attrColorSize: JSON.parse(ele.attrColorSize)
}));
if (this.orderInfo.payInfo) {
this.payInfo = JSON.parse(this.orderInfo.payInfo);
}
// 评价数据
const data = res.data.result.orderInfo.evaluate;
if (!data) {
this.evaluateData = [];
} else {
this.evaluateId = data.evaluateId;
this.evaluate = {
...data,
createTime:
data.createTime != -1
? formatLongTime(data.createTime, 1)
: "--",
replayDate:
data.replayDate != -1
? formatLongTime(data.replayDate, 1)
: "--"
};
this.evaluateData = data.scoresList.map(ele => ({
...ele,
evaluateScore: ele.evaluateScore / 2
}));
}
} else {
checkFalse(res.data.message);
}
})
.catch(err => {
checkStatus(err);
});
},
confirmReplay() {
if (!this.textarea) {
return;
}
doFetch("/api-member/evalaute_recover", {
evaluateId: this.evaluateId,
replyContent: this.textarea
}).then(res => {
if (res.data.errorCode === 0) {
this.getOrderDetail(this.orderId);
this.replayVisable = false;
}
});
}
},
watch: {
dialogVisible(n, o) {
if (n) {
console.log(obj);
// const { memberId, mainStoreName, mainStoreId, mainClerkId } = this.obj;
// this.form = Object.assign({}, this.form, { memberId, mainStoreId, mainClerkId, mainStoreIdBak: mainStoreId });
// this.getOrderDetail();
}
}
}
};
</script>
<style lang="less">
// 去除dailog-footer上边框
.customer-dailog .el-dialog__footer {
padding-top: 0;
padding-bottom: 20px;
border-top: none !important;
}
.customer-dailog .el-dialog__body {
padding-bottom: 0;
}
</style>
\ No newline at end of file
......@@ -19,16 +19,16 @@
<el-option :key=-1 label="所有类型" :value=-1></el-option>
<el-option :key=1 label="销售" :value=1></el-option>
<el-option :key=2 label="退货" :value=2></el-option>
<el-option :key=4 label="退换货" :value=4></el-option>
<el-option :key=3 label="退换货" :value=3></el-option>
</el-select>
</div>
</div>
<div class="table-content" v-loading="load">
<el-table class="only-head-table">
<el-table :class="['only-head-table',!memberData.length?'no-data':'']">
<el-table-column v-for="colunm in tableColumnList" :key="colunm" :label="colunm.label"
:min-width="colunm.width"></el-table-column>
</el-table>
<div class="only-content-table-list" style="height:calc(100vh - 224px);">
<div class="only-content-table-list" style="height:calc(100vh - 224px);" v-if="memberData.length">
<div class="group-item" v-for="group in memberData" :key="group">
<div class="group-header">
<div class="left">
......@@ -59,27 +59,34 @@
<template v-else>{{group[colunm.prop]|fomatFloat}}<el-popover
popper-class="amount-detail-popover" placement="bottom" width="242"
trigger="click" :open-delay="200">
<div class="amount-detail">
<div class="amount-detail" v-loading="orderLoading"
v-if="Object.keys(orderInfo).length">
<h5 class="title">金额详情</h5>
<div class="middle">
<p class="line"><span>吊牌价总额:</span>¥{{group.price|fomatFloat}}</p>
<p class="line"><span>订单应收:</span>¥{{group.receivable|fomatFloat}}
<p class="line">
<span>吊牌价总额:</span>¥{{orderInfo.totalAmount|fomatFloat}}
</p>
<p class="line"><span>订单实付:</span>¥{{group.paidAmount|fomatFloat}}
<p class="line">
<span>订单应收:</span>¥{{orderInfo.paidAmount|fomatFloat}}
</p>
<p class="line">
<span>订单实付:</span>¥{{group.paidAmount|fomatFloat}}
</p>
</div>
<div class="bottom">
<p class="line">支付方式:</p>
<div class="right">
<p class="cash"><span>现金</span>¥{{group.paidAmount|fomatFloat}}
<p class="cash"><span>现金</span>¥{{payInfo.cash|fomatFloat}}
</p>
<p class="voucher">
<span>抵金券</span>¥{{group.paidAmount|fomatFloat}}
<span>抵金券</span>¥{{payInfo.voucher|fomatFloat}}
</p>
</div>
</div>
</div>
<span slot="reference" class="icon-span" title="查看金额详情"><i
<div v-else style="text-align:center">暂无数据</div>
<span slot="reference" class="icon-span" title="查看金额详情"
@click="getOrderDetail(group.orderId)"><i
class="iconfont icon-dingdan1"></i></span>
</el-popover></template>
</template>
......@@ -116,17 +123,11 @@
</div>
</div>
</div>
<!--订单详情-->
<consumptionorder-dialog :dialogVisible.sync="dilogOrderVisible" :obj="{orderId}">
</consumptionorder-dialog>
<!--订单详情-end-->
</div>
</template>
<script>
import nav from "../../common/navbar/navbar.vue";
import consumptionorderDialog from "./components/consumptionorderDialog.vue";
import { doFetch } from "../axios/api";
import url from "../axios/url";
import {
......@@ -172,6 +173,9 @@ export default {
},
orderType: -1,
searchInfo: "",
orderLoading: false,
orderInfo: {},
payInfo: {},
page: {
currentPage: 1,
pageSize: 20,
......@@ -180,7 +184,6 @@ export default {
orderId: "",
memberData: [],
fullscreenLoading: false,
dilogOrderVisible: false,
totalCountList: [
{ label: '消费总额(实付)', key: 'costFeePaid', filter: 'fomatFloat' },
{ label: '消费总额(应收)', key: 'costFee', filter: 'fomatFloat' },
......@@ -207,8 +210,8 @@ export default {
orderTypeFilter: (v) => {
switch (v) {
case 1: return '销售'; break;
case 1: return '退货'; break;
case 1: return '退换货'; break;
case 2: return '退货'; break;
case 3: return '退换货'; break;
default: return '';
}
}
......@@ -286,6 +289,39 @@ export default {
return false;
}
},
getOrderDetail(orderId) {
this.orderLoading = true;
doFetch(url.orderDetail, {
memberId: this.memberId,
orderId: orderId
})
.then(res => {
if (res.data.errorCode === 0) {
let orderInfo = {};
let payInfo = {};
orderInfo = res.data.result.orderInfo;
if (orderInfo.payInfo) {
let list = JSON.parse(orderInfo.payInfo) || [];
list.map(el => {
switch (el.name) {
case '现金': payInfo.cash = el.value; break;
case '抵金券': payInfo.voucher = el.value; break;
default:
break;
}
});
}
this.orderInfo = Object.assign({}, orderInfo);
this.payInfo = Object.assign({}, payInfo);
console.log(orderInfo);
} else {
checkFalse(res.data.message);
}
})
.catch(err => {
checkStatus(err);
}).finally(_ => this.orderLoading = false);
},
spanMethod({ rowIndex, columnIndex, length }) {
if ([ 3, 4, 5 ].includes(columnIndex)) {
if (rowIndex === 0) {
......@@ -314,8 +350,7 @@ export default {
this.$store.commit("mutations-slide", true);
},
components: {
"v-nav": nav,
consumptionorderDialog
"v-nav": nav
}
};
</script>
......@@ -370,6 +405,11 @@ p {
/deep/.el-table__header-wrapper {
margin-bottom: 10px;
}
&.no-data {
/deep/.el-table__body-wrapper {
display: block;
}
}
}
.only-content-table-list {
overflow-y: scroll;
......@@ -528,9 +568,12 @@ p {
text-align: right;
}
.right {
.voucher{
.voucher {
color: #909399;
}
span {
margin-right: 10px;
}
}
}
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment