Browse Source

订单详情优化

master
hupeng 4 years ago committed by xuwenbo
parent
commit
c24a35dfc0
  1. 281
      src/views/shop/order/detail.vue

281
src/views/shop/order/detail.vue

@ -12,26 +12,26 @@
<el-card shadow="never" style="margin-top: 15px"> <el-card shadow="never" style="margin-top: 15px">
<div class="operate-container"> <div class="operate-container">
<i class="el-icon-warning color-danger" style="margin-left: 20px"></i> <i class="el-icon-warning color-danger" style="margin-left: 20px"></i>
<span class="color-danger">当前订单状态{{order.statusName}}</span> <span class="color-danger">当前订单状态<span v-html="order.statusName"></span></span>
<div class="operate-button-container" v-show="order._status===1"> <div class="operate-button-container" v-show="order._status===1">
<el-button size="mini" @click="showUpdateReceiverDialog">修改收货人信息</el-button> <el-button size="mini" @click="editOrder(order)">修改订单</el-button>
<el-button size="mini" @click="showUpdateMoneyDialog">修改费用信息</el-button> <el-button size="mini" @click="remark(order)">备注订单</el-button>
<el-button size="mini" @click="showCloseOrderDialog">关闭订单</el-button> </div>
<el-button size="mini" @click="showMarkOrderDialog">备注订单</el-button> <div class="operate-button-container" v-show="order._status===3">
<el-button size="mini" @click="refund(order)">立即退款</el-button>
<el-button size="mini" @click="remark(order)">备注订单</el-button>
</div> </div>
<div class="operate-button-container" v-show="order._status===2"> <div class="operate-button-container" v-show="order._status===2">
<el-button size="mini" @click="showUpdateReceiverDialog">修改收货人信息</el-button> <el-button size="mini" @click="edit(order)">去发货</el-button>
<el-button size="mini">取消订单</el-button> <el-button size="mini" @click="remark(order)">备注订单</el-button>
<el-button size="mini" @click="showMarkOrderDialog">备注订单</el-button>
</div> </div>
<div class="operate-button-container" v-show="order._status===4"> <div class="operate-button-container" v-show="order._status===4">
<el-button size="mini" @click="showLogisticsDialog">订单跟踪</el-button> <el-button size="mini" @click="showLogisticsDialog">订单跟踪</el-button>
<el-button size="mini" @click="showMarkOrderDialog">备注订单</el-button> <el-button size="mini" @click="remark(order)">备注订单</el-button>
</div> </div>
<div class="operate-button-container" v-show="order._status===6||order._status===7 "> <div class="operate-button-container" v-show="order._status===6||order._status===7 ">
<el-button size="mini" @click="showLogisticsDialog">订单跟踪</el-button> <el-button size="mini" @click="showLogisticsDialog">订单跟踪</el-button>
<el-button size="mini" @click="handleDeleteOrder">删除订单</el-button> <el-button size="mini" @click="remark(order)">备注订单</el-button>
<el-button size="mini" @click="showMarkOrderDialog">备注订单</el-button>
</div> </div>
</div> </div>
<div style="margin-top: 20px"> <div style="margin-top: 20px">
@ -188,7 +188,7 @@
<el-col :span="6" class="table-cell">{{order.totalPrice}}</el-col> <el-col :span="6" class="table-cell">{{order.totalPrice}}</el-col>
<el-col :span="6" class="table-cell">{{order.payPostage}}</el-col> <el-col :span="6" class="table-cell">{{order.payPostage}}</el-col>
<el-col :span="6" class="table-cell">-{{order.couponPrice}}</el-col> <el-col :span="6" class="table-cell">-{{order.couponPrice}}</el-col>
<el-col :span="6" class="table-cell">-{{order.useIntegral}}</el-col> <el-col :span="6" class="table-cell">-{{order.deductionPrice}}</el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="6" class="table-cell-title">活动优惠</el-col> <el-col :span="6" class="table-cell-title">活动优惠</el-col>
@ -197,8 +197,8 @@
<el-col :span="6" class="table-cell-title">应付款金额</el-col> <el-col :span="6" class="table-cell-title">应付款金额</el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="6" class="table-cell">-{{order.promotionAmount}}</el-col> <el-col :span="6" class="table-cell">-0</el-col>
<el-col :span="6" class="table-cell">-{{order.deductionPrice}}</el-col> <el-col :span="6" class="table-cell">-0</el-col>
<el-col :span="6" class="table-cell"> <el-col :span="6" class="table-cell">
<span class="color-danger">{{order.totalPrice}}</span> <span class="color-danger">{{order.totalPrice}}</span>
</el-col> </el-col>
@ -279,7 +279,7 @@
<!-- <el-button type="primary" @click="handleUpdateReceiverInfo"> </el-button>--> <!-- <el-button type="primary" @click="handleUpdateReceiverInfo"> </el-button>-->
<!-- </span>--> <!-- </span>-->
<!-- </el-dialog>--> <!-- </el-dialog>-->
<el-dialog title="修改费用信息" <!-- <el-dialog title="修改费用信息"
:visible.sync="moneyDialogVisible" :visible.sync="moneyDialogVisible"
width="80%"> width="80%">
<div class="table-layout"> <div class="table-layout">
@ -363,12 +363,21 @@
<el-button @click="markOrderDialogVisible = false"> </el-button> <el-button @click="markOrderDialogVisible = false"> </el-button>
<el-button type="primary" @click="handleMarkOrder"> </el-button> <el-button type="primary" @click="handleMarkOrder"> </el-button>
</span> </span>
</el-dialog> </el-dialog> -->
<eForm ref="form" :is-add="isAdd" />
<eRefund ref="form2" :is-add="isAdd" />
<editOrder ref="form3" :is-add="isAdd" />
<eRemark ref="form4" :is-add="isAdd" />
</div> </div>
</template> </template>
<script> <script>
import { express, getOrderDetail } from '@/api/yxStoreOrder' import { express, getOrderDetail } from '@/api/yxStoreOrder'
import {formatTimeTwo} from '@/utils/index'; import {formatTimeTwo} from '@/utils/index';
import eForm from './form'
import eRefund from './refund'
import editOrder from './edit'
import eRemark from './remark'
const defaultReceiverInfo = { const defaultReceiverInfo = {
orderId:null, orderId:null,
receiverName:null, receiverName:null,
@ -381,7 +390,7 @@ import {formatTimeTwo} from '@/utils/index';
status:null status:null
}; };
export default { export default {
components: {}, components: {eForm, eRefund, editOrder, eRemark},
data() { data() {
return { return {
isAdd: false, isAdd: false,
@ -499,9 +508,243 @@ import {formatTimeTwo} from '@/utils/index';
} }
}, },
mounted () { mounted () {
this.getInfo(); this.init();
}, },
methods: { methods: {
refund(data) {
this.isAdd = false
const _this = this.$refs.form2
_this.form = {
id: data.id,
orderId: data.orderId,
uid: data.uid,
realName: data.realName,
userPhone: data.userPhone,
userAddress: data.userAddress,
cartId: data.cartId,
freightPrice: data.freightPrice,
totalNum: data.totalNum,
totalPrice: data.totalPrice,
totalPostage: data.totalPostage,
payPrice: data.payPrice,
payPostage: data.payPostage,
deductionPrice: data.deductionPrice,
couponId: data.couponId,
couponPrice: data.couponPrice,
paid: data.paid,
payTime: data.payTime,
payType: data.payType,
addTime: data.addTime,
status: data.status,
refundStatus: data.refundStatus,
refundReasonWapImg: data.refundReasonWapImg,
refundReasonWapExplain: data.refundReasonWapExplain,
refundReasonTime: data.refundReasonTime,
refundReasonWap: data.refundReasonWap,
refundReason: data.refundReason,
refundPrice: data.refundPrice,
deliveryName: data.deliveryName,
deliveryType: data.deliveryType,
deliveryId: data.deliveryId,
gainIntegral: data.gainIntegral,
useIntegral: data.useIntegral,
backIntegral: data.backIntegral,
mark: data.mark,
isDel: data.isDel,
unique: data.unique,
remark: data.remark,
merId: data.merId,
isMerCheck: data.isMerCheck,
combinationId: data.combinationId,
pinkId: data.pinkId,
cost: data.cost,
seckillId: data.seckillId,
bargainId: data.bargainId,
verifyCode: data.verifyCode,
storeId: data.storeId,
shippingType: data.shippingType,
isChannel: data.isChannel,
isRemind: data.isRemind,
isSystemDel: data.isSystemDel
}
_this.dialog = true
},
edit(data) {
this.isAdd = false
const _this = this.$refs.form
_this.form = {
id: data.id,
orderId: data.orderId,
uid: data.uid,
realName: data.realName,
userPhone: data.userPhone,
userAddress: data.userAddress,
cartId: data.cartId,
freightPrice: data.freightPrice,
totalNum: data.totalNum,
totalPrice: data.totalPrice,
totalPostage: data.totalPostage,
payPrice: data.payPrice,
payPostage: data.payPostage,
deductionPrice: data.deductionPrice,
couponId: data.couponId,
couponPrice: data.couponPrice,
paid: data.paid,
payTime: data.payTime,
payType: data.payType,
addTime: data.addTime,
status: data.status,
refundStatus: data.refundStatus,
refundReasonWapImg: data.refundReasonWapImg,
refundReasonWapExplain: data.refundReasonWapExplain,
refundReasonTime: data.refundReasonTime,
refundReasonWap: data.refundReasonWap,
refundReason: data.refundReason,
refundPrice: data.refundPrice,
deliveryName: data.deliveryName,
deliverySn: data.deliverySn,
deliveryType: data.deliveryType,
deliveryId: data.deliveryId,
gainIntegral: data.gainIntegral,
useIntegral: data.useIntegral,
backIntegral: data.backIntegral,
mark: data.mark,
isDel: data.isDel,
unique: data.unique,
remark: data.remark,
merId: data.merId,
isMerCheck: data.isMerCheck,
combinationId: data.combinationId,
pinkId: data.pinkId,
cost: data.cost,
seckillId: data.seckillId,
bargainId: data.bargainId,
verifyCode: data.verifyCode,
storeId: data.storeId,
shippingType: data.shippingType,
isChannel: data.isChannel,
isRemind: data.isRemind,
isSystemDel: data.isSystemDel
}
_this.dialog = true
},
editOrder(data) {
this.isAdd = false
const _this = this.$refs.form3
_this.form = {
id: data.id,
orderId: data.orderId,
uid: data.uid,
realName: data.realName,
userPhone: data.userPhone,
userAddress: data.userAddress,
cartId: data.cartId,
freightPrice: data.freightPrice,
totalNum: data.totalNum,
totalPrice: data.totalPrice,
totalPostage: data.totalPostage,
payPrice: data.payPrice,
payPostage: data.payPostage,
deductionPrice: data.deductionPrice,
couponId: data.couponId,
couponPrice: data.couponPrice,
paid: data.paid,
payTime: data.payTime,
payType: data.payType,
addTime: data.addTime,
status: data.status,
refundStatus: data.refundStatus,
refundReasonWapImg: data.refundReasonWapImg,
refundReasonWapExplain: data.refundReasonWapExplain,
refundReasonTime: data.refundReasonTime,
refundReasonWap: data.refundReasonWap,
refundReason: data.refundReason,
refundPrice: data.refundPrice,
deliveryName: data.deliveryName,
deliveryType: data.deliveryType,
deliveryId: data.deliveryId,
gainIntegral: data.gainIntegral,
useIntegral: data.useIntegral,
backIntegral: data.backIntegral,
mark: data.mark,
isDel: data.isDel,
unique: data.unique,
remark: data.remark,
merId: data.merId,
isMerCheck: data.isMerCheck,
combinationId: data.combinationId,
pinkId: data.pinkId,
cost: data.cost,
seckillId: data.seckillId,
bargainId: data.bargainId,
verifyCode: data.verifyCode,
storeId: data.storeId,
shippingType: data.shippingType,
isChannel: data.isChannel,
isRemind: data.isRemind,
isSystemDel: data.isSystemDel
}
_this.dialog = true
},
remark(data) {
this.isAdd = false
const _this = this.$refs.form4
_this.form = {
id: data.id,
orderId: data.orderId,
uid: data.uid,
realName: data.realName,
userPhone: data.userPhone,
userAddress: data.userAddress,
cartId: data.cartId,
freightPrice: data.freightPrice,
totalNum: data.totalNum,
totalPrice: data.totalPrice,
totalPostage: data.totalPostage,
payPrice: data.payPrice,
payPostage: data.payPostage,
deductionPrice: data.deductionPrice,
couponId: data.couponId,
couponPrice: data.couponPrice,
paid: data.paid,
payTime: data.payTime,
payType: data.payType,
addTime: data.addTime,
status: data.status,
refundStatus: data.refundStatus,
refundReasonWapImg: data.refundReasonWapImg,
refundReasonWapExplain: data.refundReasonWapExplain,
refundReasonTime: data.refundReasonTime,
refundReasonWap: data.refundReasonWap,
refundReason: data.refundReason,
refundPrice: data.refundPrice,
deliveryName: data.deliveryName,
deliveryType: data.deliveryType,
deliveryId: data.deliveryId,
gainIntegral: data.gainIntegral,
useIntegral: data.useIntegral,
backIntegral: data.backIntegral,
mark: data.mark,
isDel: data.isDel,
unique: data.unique,
remark: data.remark,
merId: data.merId,
isMerCheck: data.isMerCheck,
combinationId: data.combinationId,
pinkId: data.pinkId,
cost: data.cost,
seckillId: data.seckillId,
bargainId: data.bargainId,
verifyCode: data.verifyCode,
storeId: data.storeId,
shippingType: data.shippingType,
isChannel: data.isChannel,
isRemind: data.isRemind,
isSystemDel: data.isSystemDel
}
_this.dialog = true
},
express() { express() {
let params ={ let params ={
"orderCode": this.order.id, "orderCode": this.order.id,
@ -518,7 +761,7 @@ import {formatTimeTwo} from '@/utils/index';
}) })
}, },
getInfo(){ init(){
let that = this; let that = this;
let id = that.$route.params.id || 0; let id = that.$route.params.id || 0;
getOrderDetail(id).then(response => { getOrderDetail(id).then(response => {

Loading…
Cancel
Save