退货申请详情功能完善
This commit is contained in:
parent
d66d940d59
commit
592e5eb887
@ -14,6 +14,13 @@ export function deleteApply(params) {
|
||||
params:params
|
||||
})
|
||||
}
|
||||
export function updateApplyStatus(id,data) {
|
||||
return request({
|
||||
url:'/returnApply/update/status/'+id,
|
||||
method:'post',
|
||||
data:data
|
||||
})
|
||||
}
|
||||
|
||||
export function getApplyDetail(id) {
|
||||
return request({
|
||||
|
@ -41,117 +41,208 @@
|
||||
</el-card>
|
||||
<el-card shadow="never" class="standard-margin">
|
||||
<span class="font-medium">服务单信息</span>
|
||||
<el-row class="standard-margin">
|
||||
<el-col :span="6" class="form-border form-left-bg font-small">服务单号</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.id}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">申请状态</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.status | formatStatus}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="6" class="form-border form-left-bg font-small" style="height:50px;line-height:30px">订单编号</el-col>
|
||||
<el-col class="form-border font-small" :span="18" style="height:50px">
|
||||
{{orderReturnApply.orderSn}}
|
||||
<el-button type="text" size="small">查看</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">申请时间</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.createTime | formatTime}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">用户账号</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.memberUsername}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">联系人</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.returnName}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">联系电话</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.returnPhone}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">退货原因</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.reason}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">问题描述</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.description}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6" style="height:100px;line-height:80px">凭证图片
|
||||
</el-col>
|
||||
<el-col class="form-border font-small" :span="18" style="height:100px">
|
||||
<img v-for="item in proofPics" style="width:80px;height:80px" :src="item">
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row class="standard-margin">
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">订单金额</el-col>
|
||||
<el-col class="form-border font-small" :span="18">¥{{totalAmount}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6" style="height:52px;line-height:32px">确认退款金额
|
||||
</el-col>
|
||||
<el-col class="form-border font-small" style="height:52px" :span="18">
|
||||
¥
|
||||
<el-input size="small" v-model="updateStatusParam.returnAmount"
|
||||
style="width:200px;margin-left: 10px"></el-input>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6" style="height:52px;line-height:32px">选择收货点
|
||||
</el-col>
|
||||
<el-col class="form-border font-small" style="height:52px" :span="18">
|
||||
<el-select size="small" style="width:200px" v-model="updateStatusParam.companyAddressId">
|
||||
<el-option v-for="address in companyAddressList"
|
||||
:key="address.id"
|
||||
:value="address.id"
|
||||
:label="address.addressName">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">收货人姓名</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{currentAddress.name}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">所在区域</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{currentAddress | formatRegion}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">详细地址</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{currentAddress.detailAddress}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">联系电话</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{currentAddress.phone}}</el-col>
|
||||
</el-row>
|
||||
<div class="form-container-border">
|
||||
<el-row>
|
||||
<el-col :span="6" class="form-border form-left-bg font-small">服务单号</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.id}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">申请状态</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.status | formatStatus}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="6" class="form-border form-left-bg font-small" style="height:50px;line-height:30px">订单编号
|
||||
</el-col>
|
||||
<el-col class="form-border font-small" :span="18" style="height:50px">
|
||||
{{orderReturnApply.orderSn}}
|
||||
<el-button type="text" size="small">查看</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">申请时间</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.createTime | formatTime}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">用户账号</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.memberUsername}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">联系人</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.returnName}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">联系电话</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.returnPhone}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">退货原因</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.reason}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">问题描述</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.description}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6" style="height:100px;line-height:80px">凭证图片
|
||||
</el-col>
|
||||
<el-col class="form-border font-small" :span="18" style="height:100px">
|
||||
<img v-for="item in proofPics" style="width:80px;height:80px" :src="item">
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<div class="form-container-border">
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">订单金额</el-col>
|
||||
<el-col class="form-border font-small" :span="18">¥{{totalAmount}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6" style="height:52px;line-height:32px">确认退款金额
|
||||
</el-col>
|
||||
<el-col class="form-border font-small" style="height:52px" :span="18">
|
||||
¥
|
||||
<el-input size="small" v-model="updateStatusParam.returnAmount"
|
||||
:disabled="orderReturnApply.status!==0"
|
||||
style="width:200px;margin-left: 10px"></el-input>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div v-show="orderReturnApply.status!==3">
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6" style="height:52px;line-height:32px">选择收货点
|
||||
</el-col>
|
||||
<el-col class="form-border font-small" style="height:52px" :span="18">
|
||||
<el-select size="small"
|
||||
style="width:200px"
|
||||
:disabled="orderReturnApply.status!==0"
|
||||
v-model="updateStatusParam.companyAddressId">
|
||||
<el-option v-for="address in companyAddressList"
|
||||
:key="address.id"
|
||||
:value="address.id"
|
||||
:label="address.addressName">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">收货人姓名</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{currentAddress.name}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">所在区域</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{currentAddress | formatRegion}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">详细地址</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{currentAddress.detailAddress}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">联系电话</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{currentAddress.phone}}</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-container-border" v-show="orderReturnApply.status!==0">
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">处理人员</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.handleMan}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">处理时间</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.handleTime | formatTime}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">处理备注</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.handleNote}}</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<div class="form-container-border" v-show="orderReturnApply.status===2">
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">收货人员</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.receiveMan}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6" >收货时间</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.receiveTime | formatTime}}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6">收货备注</el-col>
|
||||
<el-col class="form-border font-small" :span="18">{{orderReturnApply.receiveNote}}</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<div class="form-container-border" v-show="orderReturnApply.status===0">
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6" style="height:52px;line-height:32px">处理备注</el-col>
|
||||
<el-col class="form-border font-small" :span="18">
|
||||
<el-input size="small" v-model="updateStatusParam.handleNote" style="width:200px;margin-left: 10px"></el-input>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<div class="form-container-border" v-show="orderReturnApply.status===1">
|
||||
<el-row>
|
||||
<el-col class="form-border form-left-bg font-small" :span="6" style="height:52px;line-height:32px">收货备注</el-col>
|
||||
<el-col class="form-border font-small" :span="18">
|
||||
<el-input size="small" v-model="updateStatusParam.receiveNote" style="width:200px;margin-left: 10px"></el-input>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<div style="margin-top:15px;text-align: center" v-show="orderReturnApply.status===0">
|
||||
<el-button type="primary" size="small" @click="handleUpdateStatus(1)">确认退货</el-button>
|
||||
<el-button type="danger" size="small" @click="handleUpdateStatus(3)">拒绝退货</el-button>
|
||||
</div>
|
||||
<div style="margin-top:15px;text-align: center" v-show="orderReturnApply.status===1">
|
||||
<el-button type="primary" size="small" @click="handleUpdateStatus(2)">确认收货</el-button>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {getApplyDetail} from '@/api/returnApply';
|
||||
import {getApplyDetail,updateApplyStatus} from '@/api/returnApply';
|
||||
import {fetchList} from '@/api/companyAddress';
|
||||
import {formatDate} from '@/utils/date';
|
||||
|
||||
const defaultUpdateStatusParam = {
|
||||
companyAddressId: null,
|
||||
handleMan: null,
|
||||
handleMan: 'admin',
|
||||
handleNote: null,
|
||||
receiveMan: null,
|
||||
receiveMan: 'admin',
|
||||
receiveNote: null,
|
||||
returnAmount: 0,
|
||||
status: 0
|
||||
};
|
||||
const defaultOrderReturnApply = {
|
||||
id: null,
|
||||
orderId: null,
|
||||
companyAddressId: null,
|
||||
productId: null,
|
||||
orderSn: null,
|
||||
createTime: null,
|
||||
memberUsername: null,
|
||||
returnAmount: null,
|
||||
returnName: null,
|
||||
returnPhone: null,
|
||||
status: null,
|
||||
handleTime: null,
|
||||
productPic: null,
|
||||
productName: null,
|
||||
productBrand: null,
|
||||
productAttr: null,
|
||||
productCount: null,
|
||||
productPrice: null,
|
||||
productRealPrice: null,
|
||||
reason: null,
|
||||
description: null,
|
||||
proofPics: null,
|
||||
handleNote: null,
|
||||
handleMan: null,
|
||||
receiveMan: null,
|
||||
receiveTime: null,
|
||||
receiveNote: null
|
||||
};
|
||||
export default {
|
||||
name: 'returnApplyDetail',
|
||||
data() {
|
||||
return {
|
||||
id: null,
|
||||
orderReturnApply: null,
|
||||
orderReturnApply: Object.assign({},defaultOrderReturnApply),
|
||||
productList: null,
|
||||
proofPics: null,
|
||||
updateStatusParam: Object.assign({}, defaultUpdateStatusParam),
|
||||
@ -161,7 +252,6 @@
|
||||
created() {
|
||||
this.id = this.$route.query.id;
|
||||
this.getDetail();
|
||||
this.getCompanyAddressList();
|
||||
},
|
||||
computed: {
|
||||
totalAmount() {
|
||||
@ -171,11 +261,13 @@
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
currentAddress(){
|
||||
currentAddress() {
|
||||
console.log("currentAddress()");
|
||||
let id = this.updateStatusParam.companyAddressId;
|
||||
for(let i=0;i<this.companyAddressList.length;i++){
|
||||
let address=this.companyAddressList[i];
|
||||
if(address.id===id){
|
||||
if(this.companyAddressList==null)return {};
|
||||
for (let i = 0; i < this.companyAddressList.length; i++) {
|
||||
let address = this.companyAddressList[i];
|
||||
if (address.id === id) {
|
||||
return address;
|
||||
}
|
||||
}
|
||||
@ -201,35 +293,60 @@
|
||||
let date = new Date(time);
|
||||
return formatDate(date, 'yyyy-MM-dd hh:mm:ss')
|
||||
},
|
||||
formatRegion(address){
|
||||
let str=address.province;
|
||||
if(address.city!=null){
|
||||
str+=" "+address.city;
|
||||
formatRegion(address) {
|
||||
let str = address.province;
|
||||
if (address.city != null) {
|
||||
str += " " + address.city;
|
||||
}
|
||||
str+=" "+address.region;
|
||||
str += " " + address.region;
|
||||
return str;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getDetail() {
|
||||
getApplyDetail(this.id).then(response => {
|
||||
console.log("getDetail")
|
||||
this.orderReturnApply = response.data;
|
||||
this.productList = [];
|
||||
this.productList.push(this.orderReturnApply);
|
||||
if (this.orderReturnApply.proofPics != null) {
|
||||
this.proofPics = this.orderReturnApply.proofPics.split(",")
|
||||
}
|
||||
//退货中和完成
|
||||
if(this.orderReturnApply.status===1||this.orderReturnApply.status===2){
|
||||
this.updateStatusParam.returnAmount=this.orderReturnApply.returnAmount;
|
||||
this.updateStatusParam.companyAddressId=this.orderReturnApply.companyAddressId;
|
||||
}
|
||||
this.getCompanyAddressList();
|
||||
});
|
||||
},
|
||||
getCompanyAddressList() {
|
||||
fetchList().then(response => {
|
||||
console.log("getCompanyAddressList()")
|
||||
this.companyAddressList = response.data;
|
||||
for(let i=0;i<this.companyAddressList.length;i++){
|
||||
if(this.companyAddressList[i].receiveStatus===1){
|
||||
this.updateStatusParam.companyAddressId=this.companyAddressList[i].id;
|
||||
for (let i = 0; i < this.companyAddressList.length; i++) {
|
||||
if (this.companyAddressList[i].receiveStatus === 1&&this.orderReturnApply.status===0) {
|
||||
this.updateStatusParam.companyAddressId = this.companyAddressList[i].id;
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
handleUpdateStatus(status){
|
||||
this.updateStatusParam.status=status;
|
||||
this.$confirm('是否要进行此操作?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
updateApplyStatus(this.id,this.updateStatusParam).then(response=>{
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '操作成功!',
|
||||
duration:1000
|
||||
});
|
||||
this.$router.back();
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -247,11 +364,16 @@
|
||||
.standard-margin {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.form-border {
|
||||
border: 1px solid #DCDFE6;
|
||||
border-right: 1px solid #DCDFE6;
|
||||
border-bottom: 1px solid #DCDFE6;
|
||||
padding: 10px;
|
||||
margin: 0 0 -1px -1px;
|
||||
}
|
||||
|
||||
.form-container-border {
|
||||
border-left: 1px solid #DCDFE6;
|
||||
border-top: 1px solid #DCDFE6;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.form-left-bg {
|
||||
|
Loading…
x
Reference in New Issue
Block a user