You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1241 lines
28 KiB
1241 lines
28 KiB
<template>
|
|
<view style="padding-bottom: 160rpx;">
|
|
<view class="park-navbar">
|
|
<u-navbar title="确认订单" :border-bottom="false" :background="background"></u-navbar>
|
|
</view>
|
|
<image :src="$picUrl+'/static/news3/walletBg.png'" mode="widthFix" class="bgImg"></image>
|
|
<view class="contentDes">
|
|
<!-- 订单状态 -->
|
|
<view class="order-status">
|
|
<view class="status">
|
|
<!-- 待支付 -->
|
|
<image src="/static/order/status/wait_pay.png" mode="widthFix"
|
|
v-if="orderInfo.order_status == 10&&orderInfo.delivery_status==10"></image>
|
|
<!-- 待发货 -->
|
|
<image src="/static/order/status/wait_deliver.png" mode="widthFix"
|
|
v-else-if="orderInfo.order_status == 10 &&orderInfo.delivery_status==30"></image>
|
|
<!-- 待收货 -->
|
|
<image src="/static/order/status/wait_receipt.png" mode="widthFix"
|
|
v-else-if="orderInfo.order_status == 10 &&orderInfo.delivery_status==20 && orderInfo.receipt_status==10">
|
|
</image>
|
|
<!-- 已 -->
|
|
<image src="/static/order/status/received.png" mode="widthFix" v-else></image>
|
|
<text>{{orderInfo.state_text}}</text>
|
|
</view>
|
|
<view class="reason"
|
|
v-if="(orderInfo.time_text>0&&!orderInfo.order_refund_id&&orderInfo.order_status==10&&orderInfo.pay_status==10)||(orderInfo.time_text>0&&!orderInfo.order_refund_id&&orderInfo.delivery_status==20&&orderInfo.order_status==10&&orderInfo.pay_status==20 && orderInfo.receipt_status==10)">
|
|
<u-count-down :timestamp="orderInfo.time_text" :show-days="false"></u-count-down>
|
|
<text style="color:#666666">后
|
|
<text
|
|
v-if="!orderInfo.order_refund_id&&orderInfo.order_status==10&&orderInfo.pay_status==10">自动取消</text>
|
|
<text
|
|
v-if="!orderInfo.order_refund_id&&orderInfo.delivery_status==20&&orderInfo.order_status==10&&orderInfo.pay_status==20 && orderInfo.receipt_status==10">自动收货</text></text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 收货地址 -->
|
|
<view class="shipping-address" v-if="orderInfo.address&&orderInfo.delivery_type == 10">
|
|
<view class="name-phone">
|
|
<text>{{orderInfo.address.name}}</text>
|
|
<text style="margin-left: 50rpx;">{{orderInfo.address.phone}}</text>
|
|
</view>
|
|
<view class="address">
|
|
<text>{{orderInfo.address.region.province}}{{orderInfo.address.region.city}}{{orderInfo.address.region.region}}{{orderInfo.address.detail}}</text>
|
|
</view>
|
|
</view>
|
|
<view class="consignee" v-if="orderInfo &&orderInfo.delivery_type == 20">
|
|
<view class="conLeft">
|
|
<view class="thr">
|
|
<view class="peo">提货人</view>
|
|
<view class="name">{{ orderInfo.ziti_address.linkman }}</view>
|
|
</view>
|
|
<view class="thr">
|
|
<view class="peo">手机号</view>
|
|
<view class="name">{{ orderInfo.ziti_address.phone }}</view>
|
|
</view>
|
|
<view class="thr">
|
|
<view class="peo">到店时间</view>
|
|
<view class="name">{{ orderInfo.to_store_time }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 订单商品 -->
|
|
<view class="order-goods">
|
|
<view class="goods-list">
|
|
<!-- <view class="orderInfo">
|
|
<text>订单号：{{orderInfo.order_no}}</text>
|
|
</view> -->
|
|
<view class="list" v-for="(item,index) in orderInfo.goods" :key="index" @click="handleTargetGoods(item.goods_id)">
|
|
<image :src="item.goods_image" mode="aspectFill" class="thumb"></image>
|
|
<view class="item">
|
|
<view class="title">{{item.goods_name}}</view>
|
|
<!-- <view class="num-size">{{item.config}}</view> -->
|
|
<view class="price">
|
|
<text class="num">x{{item.total_num}}</text>
|
|
<view>
|
|
<text class="moneyFlag">¥</text>
|
|
<text class="numText">{{item.total_pay_price?Number(item.total_pay_price):item.total_pay_price}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="descInfo">
|
|
<view class="descItem" v-if="orderInfo.delivery_type_text">
|
|
<view class="descLeft">
|
|
<text>配送方式</text>
|
|
</view>
|
|
<view class="descRight">
|
|
{{orderInfo.delivery_type_text}}
|
|
</view>
|
|
</view>
|
|
<view class="descItem" v-if="orderInfo.delivery_type==20">
|
|
<view class="descLeft">
|
|
<text>到达时间</text>
|
|
</view>
|
|
<view class="descRight">
|
|
{{orderInfo.to_store_time}}
|
|
</view>
|
|
</view>
|
|
<view class="descItem">
|
|
<view class="descLeft">
|
|
<text>配送费</text>
|
|
<!-- <view class="descText">
|
|
2件商品，共计20.4kg
|
|
</view> -->
|
|
</view>
|
|
<view class="descRight">
|
|
<text style="font-size:26upx">¥</text>
|
|
<text>{{orderInfo.express_price?Number(orderInfo.express_price):orderInfo.express_price}}</text>
|
|
</view>
|
|
</view>
|
|
<view class="descItem">
|
|
<view class="descLeft">
|
|
<text>商品金额</text>
|
|
</view>
|
|
<view class="descRight">
|
|
<text style="font-size:26upx">¥</text>
|
|
<text>{{orderInfo.total_price?Number(orderInfo.total_price):orderInfo.total_price}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="totalNum">
|
|
<text>含运费¥{{orderInfo.express_price?Number(orderInfo.express_price):orderInfo.express_price}}</text>
|
|
<text>共计：</text>
|
|
<text>¥{{orderInfo.pay_price?Number(orderInfo.pay_price):orderInfo.pay_price}}</text>
|
|
</view>
|
|
<view class="btnContent">
|
|
<view class="btnItem" @click="callStore(orderInfo.address.phone)">
|
|
<image :src="$picUrl+'/static/news3/phone.png'" mode="widthFix"></image>
|
|
<text>联系客户</text>
|
|
</view>
|
|
<view class="btnItem" style="border-left:1px solid #F4F4F4"
|
|
@click="callStore(orderInfo.storeInfo.phone)">
|
|
<image :src="$picUrl+'/static/news3/kefu.png'" mode="widthFix"></image>
|
|
<text>联系商家</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 售后 -->
|
|
<view class="remark" v-if="orderInfo.order_refund_id">
|
|
<view class="remarkTitle">售后信息</view>
|
|
<view class="list">
|
|
<view class="title">退货类型:</view>
|
|
<view class="content">{{orderInfo.refund_type_text}}</view>
|
|
</view>
|
|
<view class="list">
|
|
<view class="title">申请原因:</view>
|
|
<view class="content">{{orderInfo.apply_desc||'-'}}</view>
|
|
</view>
|
|
<view class="list" v-if="orderInfo.refuse_desc">
|
|
<view class="title">申请备注:</view>
|
|
<view class="content">{{orderInfo.refuse_desc||'-'}}</view>
|
|
</view>
|
|
<view class="remarkText" v-if="orderInfo.images.length>0">申请图片</view>
|
|
<view class="img" v-if="orderInfo.images.length>0">
|
|
<image v-for="(item,index) in orderInfo.images" :src="item.image_url" mode=""></image>
|
|
</view>
|
|
</view>
|
|
<!-- 订单信息 -->
|
|
<view class="order-info">
|
|
<view class="info-list">
|
|
<view class="list">
|
|
<view class="title">订单编号:</view>
|
|
<view class="content">{{orderInfo.order_no}}</view>
|
|
<text class="btn" @click="copy(orderInfo.order_no)">复制</text>
|
|
</view>
|
|
<view class="list">
|
|
<view class="title">下单时间:</view>
|
|
<view class="content">
|
|
{{orderInfo.create_time}}
|
|
</view>
|
|
</view>
|
|
<view class="list" v-if="orderInfo.pay_time">
|
|
<view class="title">付款时间:</view>
|
|
<view class="content">
|
|
{{orderInfo.pay_time}}
|
|
</view>
|
|
</view>
|
|
<view class="list" v-if="orderInfo.pay_method_text">
|
|
<view class="title">支付方式:</view>
|
|
<view class="content">
|
|
{{orderInfo.pay_method_text}}
|
|
</view>
|
|
</view>
|
|
<view class="list" v-if="orderInfo.remark">
|
|
<view class="title">订单备注:</view>
|
|
<view class="content">
|
|
{{orderInfo.remark}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 底部按钮 -->
|
|
<view class="footer-btn">
|
|
<view class="del"
|
|
v-show="!orderInfo.order_refund_id&&orderInfo.order_status==10&&orderInfo.delivery_type==10&&orderInfo.pay_status==20&&orderInfo.delivery_status==10&&userInfo.user_type == 40"
|
|
@click="goJump('/pages/news3/updateAddr',orderInfo,0)">修改地址</view>
|
|
<view class="btn"
|
|
v-show="!orderInfo.order_refund_id&&orderInfo.order_status==10&&orderInfo.pay_status==10&&userInfo.user_type == 40"
|
|
@click="goJump('/pages/news3/updatePrice',orderInfo)">修改价格</view>
|
|
<view class="btn"
|
|
v-show="!orderInfo.order_refund_id&&orderInfo.delivery_type==10&&orderInfo.order_status==10&&orderInfo.pay_status==20&&orderInfo.delivery_status==10&&userInfo.user_type == 40"
|
|
@click="goJump('/pages/news3/sendOutGoods',orderInfo,2)">发货</view>
|
|
<view class="del" v-show="orderInfo.audit_status==0&&userInfo.user_type == 40" @click="refuseOrder(orderInfo,20)">拒绝</view>
|
|
<view class="btn" v-show="orderInfo.audit_status==0&&userInfo.user_type == 40" @click="refuseOrder(orderInfo,10)">同意</view>
|
|
<view class="del" @click="onDelete(orderInfo)"
|
|
v-show="(!orderInfo.order_refund_id&&orderInfo.order_status==30&&orderInfo.pay_status==20&&orderInfo.delivery_status==20)||(!orderInfo.order_refund_id&&orderInfo.order_status==20&&orderInfo.pay_status==10&&orderInfo.delivery_status==10)">
|
|
删除订单</view>
|
|
<view class="btn"
|
|
v-show="!orderInfo.order_refund_id&&orderInfo.delivery_type==10&&orderInfo.order_status==10&&orderInfo.pay_status==20&&(orderInfo.delivery_status==20||orderInfo.delivery_status==30)&&userInfo.user_type == 40"
|
|
@click="goJump('/pages/news3/sendOutGoods',orderInfo,1)">修改物流</view>
|
|
</view>
|
|
</view>
|
|
<u-popup v-model=" afterSale" width="80%" border-radius="10" :closeable="true" mode="center">
|
|
<view class="afterSales">
|
|
<view class="filterTitle">
|
|
{{audit_status==20?'拒绝':'同意'}}转移至售后
|
|
</view>
|
|
<view class="filterItem c">
|
|
<view class="tuiAdderss" v-if="audit_status==10">
|
|
<text>退货地址:</text>
|
|
<view class="" @click="goJump('/pages/news3/addressList','',0)"><text
|
|
:style="{'color': addressData?'#303030':'#ABABAB'}"></text>
|
|
{{addressData?addressData.name+addressData.phone:'请选择退货地址'}}
|
|
<u-icon name="arrow-right" color="#979797" size="28"></u-icon>
|
|
</view>
|
|
</view>
|
|
<!-- <view class="itemTitle">
|
|
上传照片 <text style="color:#FF5042">*</text><text>最多可传5张图片</text>
|
|
</view> -->
|
|
<!-- <u-upload :action="action" :header="header" @on-uploaded="refundSuccess" @on-remove="refundRemove"
|
|
width="180" height="180" :file-list="transferList" :custom-btn="true" max-count="5">
|
|
<template v-slot:addBtn>
|
|
<view class="slot-btn" hover-class="slot-btn__hover" hover-stay-time="150">
|
|
<image :src="$picUrl+'/static/news/icon-upload.png'"></image>
|
|
<view class="1">上传图片</view>
|
|
</view>
|
|
</template>
|
|
</u-upload> -->
|
|
<view class="filterItemContent">
|
|
<view class="itemTitle">
|
|
审核备注
|
|
</view>
|
|
<u-input v-model="refund_notes" placeholder="请输入您的备注" type="textarea" :auto-height="true" />
|
|
</view>
|
|
</view>
|
|
<!-- :style="{'opacity': refund_image_id?1:0.6 }" -->
|
|
<view class="submit" @click="submitRefund()">
|
|
确定
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
<u-modal v-model="deleteShow" :show-cancel-button="true" :closable='false' @cancel="deleteShow=false"
|
|
@confirm="handleOk" title="确认删除订单？" confirm-color="#F55349">
|
|
<view class="slot-content order-modal">
|
|
<view class="content">删除之后订单无法恢复，无法处理您的售后问题 ，请慎重考虑</view>
|
|
<view class="desc" @click="toggleImage()">
|
|
<image v-if="isToggle" src="/static/invoice/select.png"></image>
|
|
<image v-else src="/static/invoice/select-on.png"></image>删除后将拼单信息设置为匿名
|
|
</view>
|
|
</view>
|
|
</u-modal><addShuiyin />
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import * as newFunApi from '@/api/newFun'
|
|
import * as OrderApi from '@/api/order'
|
|
export default {
|
|
data() {
|
|
return {
|
|
status: 1,
|
|
orderInfo: '',
|
|
order_id: '',
|
|
audit_status: 20,
|
|
audit_notes: '',
|
|
deleteShow: false,
|
|
afterSale: false,
|
|
isToggle: false,
|
|
refund_image_id: '',
|
|
refund_notes: '',
|
|
addressData: '',
|
|
userInfo:{}
|
|
};
|
|
},
|
|
onLoad(option) {
|
|
this.order_id = JSON.parse(option.item).order_id
|
|
this.userInfo = uni.getStorageSync('userInfo');
|
|
},
|
|
onShow() {
|
|
this.getOrderDetail(this.order_id)
|
|
},
|
|
methods: {
|
|
// 跳转到商品详情页面
|
|
handleTargetGoods(goodsId) {
|
|
uni.redirectTo({
|
|
url: '/pages/goods/detail?goodsId=' + goodsId // 目标页面路径
|
|
})
|
|
},
|
|
// 获取当前订单信息
|
|
getOrderDetail() {
|
|
const app = this
|
|
OrderApi.detail(this.order_id)
|
|
.then(result => {
|
|
this.orderInfo = result.data.order
|
|
})
|
|
},
|
|
// 联系商家
|
|
callStore(phone) {
|
|
uni.makePhoneCall({
|
|
phoneNumber: phone
|
|
});
|
|
},
|
|
copy(value) {
|
|
uni.setClipboardData({
|
|
data: this.orderInfo.order_no, // 这里是个坑接受字符串类型 value转化为字符串
|
|
success: function() {
|
|
//调用方法成功
|
|
uni.showToast({
|
|
title: '复制成功',
|
|
icon: 'none',
|
|
duration: 2000
|
|
})
|
|
}
|
|
})
|
|
},
|
|
goJump(path, value, index) {
|
|
uni.navigateTo({
|
|
url: path + '?item=' + JSON.stringify(value) + '&source=' + index,
|
|
})
|
|
},
|
|
// 删除订单
|
|
onDelete(item) {
|
|
this.deleteShow = true
|
|
},
|
|
toggleImage() {
|
|
this.isToggle = !this.isToggle
|
|
},
|
|
handleOk() {
|
|
let orderId = this.orderInfo.order_id
|
|
const app = this
|
|
newFunApi.oderDelete({
|
|
orderId: orderId
|
|
})
|
|
.then(result => {
|
|
uni.showToast({
|
|
title: result.message
|
|
})
|
|
app.deleteShow = false
|
|
app.pageNum = 1
|
|
app.goodsList = [];
|
|
app.getList()
|
|
})
|
|
},
|
|
// 同意拒绝
|
|
refuseOrder(item, status) {
|
|
this.audit_status = status;
|
|
this.afterSale = true
|
|
},
|
|
async submitRefund() {
|
|
if (this.audit_status == 10 && !this.addressData) {
|
|
return that.$toast('请选择退货地址')
|
|
}
|
|
let params = {
|
|
"orderId": this.orderInfo.order_id,
|
|
"orderRefundId": this.itemInfor.order_refund_id,
|
|
"form": {
|
|
"audit_status": this.audit_status,
|
|
'refuse_desc': this.refund_notes,
|
|
'address_id': this.addressData.address_id,
|
|
'orderRefundId': this.orderInfo.order_refund_id
|
|
}
|
|
}
|
|
let {
|
|
status,
|
|
message,
|
|
data
|
|
} = await newFunApi.audit(params);
|
|
if (status == 200) {
|
|
this.afterSale = false
|
|
uni.hideLoading();
|
|
this.pageNum = 1
|
|
this.goodsList = [];
|
|
this.getList()
|
|
}
|
|
},
|
|
/**
|
|
* 售后点击
|
|
*/
|
|
onApplyAftersales() {
|
|
uni.navigateTo({
|
|
url: '/pages/AfterSaleType/AfterSaleType',
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
::v-deep .u-navbar-fixed {
|
|
background: none !important;
|
|
}
|
|
|
|
page {
|
|
background-color: #F7F8FA;
|
|
min-height: 100%;
|
|
padding-bottom: 140rpx;
|
|
}
|
|
|
|
.tuiAdderss {
|
|
padding: 30rpx 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
border-bottom: 1rpx solid #EAEAEA;
|
|
}
|
|
|
|
.orderInfo {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
margin-bottom: 120rpx;
|
|
|
|
text {
|
|
font-size: 28upx;
|
|
color: #707070;
|
|
|
|
}
|
|
}
|
|
|
|
.bgImg {
|
|
width: 100%;
|
|
height: auto;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: 1;
|
|
}
|
|
|
|
.contentDes {
|
|
position: relative;
|
|
z-index: 2;
|
|
margin: 0upx 26upx;
|
|
padding-top: 20upx;
|
|
}
|
|
|
|
.navBarContent {
|
|
height: 88upx;
|
|
line-height: 88upx;
|
|
text-align: center;
|
|
position: relative;
|
|
|
|
text {
|
|
font-size: 32upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #000;
|
|
}
|
|
|
|
}
|
|
|
|
.page {
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: #f6f6f6;
|
|
}
|
|
|
|
/* 订单状态 */
|
|
.order-status {
|
|
width: 100%;
|
|
margin: 0 12rpx 40rpx 12rpx;
|
|
|
|
.status {
|
|
display: flex;
|
|
align-items: center;
|
|
// justify-content: center;
|
|
width: 100%;
|
|
|
|
image {
|
|
width: 89upx;
|
|
height: 89upx;
|
|
}
|
|
|
|
text {
|
|
font-size: 40upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #3B3B3B;
|
|
margin-left: 20upx;
|
|
}
|
|
}
|
|
|
|
.reason {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-top: 14upx;
|
|
|
|
text {
|
|
font-size: 30upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #FF6F6F;
|
|
}
|
|
}
|
|
}
|
|
|
|
.personInfo {
|
|
background: #FFFFFF;
|
|
border-radius: 4px 4px 4px 4px;
|
|
opacity: 1;
|
|
padding: 28upx 40upx;
|
|
margin-top: 80upx;
|
|
|
|
.infoTitle {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
|
|
&>text {
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #3B3B3B;
|
|
|
|
}
|
|
|
|
.phone {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
image {
|
|
width: 32upx;
|
|
height: 32upx;
|
|
}
|
|
|
|
text {
|
|
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #3B3B3B;
|
|
margin-left: 10upx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.fxContent {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-top: 40upx;
|
|
|
|
.fxPic {
|
|
display: flex;
|
|
align-items: center;
|
|
flex: 1;
|
|
|
|
image {
|
|
width: 114upx;
|
|
height: 114upx;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.peopleText {
|
|
margin-left: 28upx;
|
|
|
|
.name {
|
|
font-size: 32upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #2F2F2F;
|
|
|
|
}
|
|
|
|
.realName {
|
|
margin-top: 10upx;
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #8B8B8B;
|
|
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
/* 收货地址 */
|
|
.shipping-address {
|
|
|
|
height: 130upx;
|
|
background: #FFFFFF;
|
|
border-radius: 4px 4px 4px 4px;
|
|
opacity: 1;
|
|
margin-top: 30upx;
|
|
padding: 0 40upx;
|
|
|
|
.name-phone {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 32rpx 0 22rpx 0;
|
|
|
|
text {
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #3B3B3B;
|
|
}
|
|
}
|
|
|
|
.address {
|
|
text {
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #B0B0B0;
|
|
|
|
}
|
|
}
|
|
}
|
|
|
|
.remark {
|
|
background: #FFFFFF;
|
|
border-radius: 4px 4px 4px 4px;
|
|
opacity: 1;
|
|
padding: 26upx 40upx;
|
|
margin: 16upx 0;
|
|
|
|
.list {
|
|
display: flex;
|
|
align-items: center;
|
|
width: 100%;
|
|
position: relative;
|
|
margin: 25upx 0;
|
|
|
|
.btn {
|
|
|
|
font-size: 24upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #F63016;
|
|
position: absolute;
|
|
right: 0;
|
|
}
|
|
|
|
.title {
|
|
|
|
font-size: 24upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #7E7E7E;
|
|
|
|
}
|
|
|
|
.content {
|
|
margin-left: 20upx;
|
|
font-size: 24upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #1E1E1E;
|
|
|
|
}
|
|
}
|
|
|
|
.remarkTitle {
|
|
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #3B3B3B;
|
|
|
|
}
|
|
|
|
.remarkText {
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #7E7E7E;
|
|
margin: 20upx 0;
|
|
font-size: 24upx;
|
|
}
|
|
|
|
.img {
|
|
display: flex;
|
|
|
|
image {
|
|
width: 100upx;
|
|
height: 100upx;
|
|
margin: 0 10upx;
|
|
}
|
|
}
|
|
}
|
|
|
|
/* 订单商品 */
|
|
.order-goods {
|
|
width: 100%;
|
|
background-color: #FFFFFF;
|
|
border-radius: 4px;
|
|
|
|
.goods-list {
|
|
padding: 15upx 40upx 0 40upx;
|
|
|
|
.list {
|
|
display: flex;
|
|
align-items: center;
|
|
width: 100%;
|
|
|
|
.thumb {
|
|
width: 150upx;
|
|
height: 150upx;
|
|
}
|
|
|
|
.item {
|
|
margin-top: 20upx;
|
|
flex: 1;
|
|
margin-left: 30upx;
|
|
|
|
.title {
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #000000;
|
|
}
|
|
|
|
.num-size {
|
|
margin: 14upx 0;
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #7C7C7C;
|
|
|
|
}
|
|
|
|
.price {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
width: 100%;
|
|
margin-top: 8rpx;
|
|
|
|
.num {
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #1E1E1E;
|
|
}
|
|
|
|
.moneyFlag {
|
|
font-size: 26upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #F21A1C;
|
|
|
|
}
|
|
|
|
.numText {
|
|
|
|
font-size: 32upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #F21A1C;
|
|
|
|
}
|
|
}
|
|
|
|
.order-btn {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
width: 100%;
|
|
height: 100rpx;
|
|
|
|
.btn {
|
|
padding: 10rpx 30rpx;
|
|
color: #555555;
|
|
font-size: 26rpx;
|
|
border: 2rpx solid #EEEEEE;
|
|
border-radius: 100rpx;
|
|
}
|
|
}
|
|
|
|
.order-btn {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
width: 100%;
|
|
height: 100rpx;
|
|
|
|
.btn {
|
|
padding: 10rpx 30rpx;
|
|
color: #555555;
|
|
font-size: 26rpx;
|
|
border: 2rpx solid #EEEEEE;
|
|
border-radius: 100rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
.descInfo {
|
|
.descItem {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-top: 28upx;
|
|
|
|
.descLeft {
|
|
text {
|
|
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #3B3B3B;
|
|
|
|
}
|
|
|
|
.descText {
|
|
|
|
font-size: 24upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #B7B7B7;
|
|
|
|
}
|
|
}
|
|
|
|
.descRight {
|
|
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #515151;
|
|
|
|
}
|
|
}
|
|
}
|
|
|
|
.totalNum {
|
|
text-align: right;
|
|
margin-top: 30upx;
|
|
|
|
text:first-child {
|
|
font-size: 24upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #B7B7B7;
|
|
|
|
}
|
|
|
|
text:nth-child(2) {
|
|
font-size: 32upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #3B3B3B;
|
|
margin: 0 10upx;
|
|
|
|
}
|
|
|
|
text:nth-child(3) {
|
|
font-size: 32upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
color: #F21A1C;
|
|
|
|
}
|
|
}
|
|
|
|
.btnContent {
|
|
display: flex;
|
|
border-top: 1px solid #F4F4F4;
|
|
margin-top: 26upx;
|
|
|
|
.btnItem {
|
|
justify-content: center;
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
margin: 22upx 0;
|
|
|
|
image {
|
|
width: 30upx;
|
|
height: auto;
|
|
}
|
|
|
|
text {
|
|
|
|
font-size: 24upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #1E1E1E;
|
|
margin-left: 14upx;
|
|
}
|
|
}
|
|
}
|
|
|
|
/* 订单信息 */
|
|
.order-info {
|
|
width: 100%;
|
|
background-color: #FFFFFF;
|
|
border-radius: 4px;
|
|
|
|
.info-list {
|
|
padding: 24upx 34upx;
|
|
margin-top: 20upx;
|
|
|
|
.list {
|
|
display: flex;
|
|
align-items: center;
|
|
width: 100%;
|
|
position: relative;
|
|
margin: 25upx 0;
|
|
|
|
.btn {
|
|
|
|
font-size: 24upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #F63016;
|
|
position: absolute;
|
|
right: 0;
|
|
}
|
|
|
|
.title {
|
|
|
|
font-size: 24upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #7E7E7E;
|
|
|
|
}
|
|
|
|
.content {
|
|
margin-left: 20upx;
|
|
font-size: 24upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #1E1E1E;
|
|
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.footer-btn {
|
|
position: fixed;
|
|
left: 0;
|
|
bottom: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
width: 100%;
|
|
height: 100rpx;
|
|
background-color: #FFFFFF;
|
|
border-top: 2rpx solid #EEEEEE;
|
|
padding: 0 40upx;
|
|
|
|
.del {
|
|
width: 140upx;
|
|
height: 68upx;
|
|
background: #FFFFFF;
|
|
border-radius: 38px 38px 38px 38px;
|
|
opacity: 1;
|
|
border: 1px solid #D9D9D9;
|
|
line-height: 68upx;
|
|
|
|
font-size: 24upx;
|
|
text-align: center;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #828282;
|
|
margin-left: 14upx;
|
|
}
|
|
|
|
.btn {
|
|
text-align: center;
|
|
width: 140upx;
|
|
height: 68upx;
|
|
background: #FFFFFF;
|
|
border-radius: 38px 38px 38px 38px;
|
|
opacity: 1;
|
|
border: 1px solid #F21A1C;
|
|
line-height: 68upx;
|
|
|
|
font-size: 24upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #F21A1C;
|
|
margin-left: 14upx;
|
|
}
|
|
}
|
|
|
|
.afterSales {
|
|
padding: 0 32rpx 32rpx 32upx;
|
|
|
|
.c {
|
|
overflow: hidden;
|
|
|
|
.slot-btn {
|
|
width: 180rpx;
|
|
height: 180rpx;
|
|
background: #F6F6F6;
|
|
border-radius: 10rpx;
|
|
border: 1px solid #C0C0C0;
|
|
text-align: center;
|
|
font-size: 28rpx;
|
|
font-weight: 500;
|
|
color: #6D6D6D;
|
|
|
|
.l {
|
|
line-height: 30rpx;
|
|
}
|
|
|
|
image {
|
|
width: 50rpx;
|
|
height: 50rpx;
|
|
display: block;
|
|
margin: 0 auto;
|
|
margin-top: 30rpx;
|
|
}
|
|
}
|
|
|
|
.itemTitle {
|
|
height: 104rpx;
|
|
line-height: 104rpx;
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #303030;
|
|
|
|
::v-deep .u-input {
|
|
height: 160upx;
|
|
background: #F7F8FA;
|
|
border-radius: 3px 3px 3px 3px;
|
|
opacity: 1;
|
|
|
|
}
|
|
|
|
::v-deep .u-input__textarea {
|
|
padding: 20upx;
|
|
}
|
|
|
|
text {
|
|
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #B5B5B5;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.filterTitle {
|
|
font-size: 32upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #303030;
|
|
text-align: center;
|
|
height: 104rpx;
|
|
line-height: 104rpx;
|
|
border-bottom: 1rpx solid #EAEAEA;
|
|
}
|
|
}
|
|
|
|
.filterTitle {
|
|
font-size: 32upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #303030;
|
|
text-align: center;
|
|
height: 104rpx;
|
|
line-height: 104rpx;
|
|
border-bottom: 1rpx solid #EAEAEA;
|
|
}
|
|
|
|
.filterItem {
|
|
.filterItemContent {
|
|
.itemTitle {
|
|
height: 104rpx;
|
|
line-height: 104rpx;
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #303030;
|
|
|
|
text {
|
|
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #B5B5B5;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
::v-deep .u-input {
|
|
height: 160upx;
|
|
background: #F7F8FA;
|
|
border-radius: 3px 3px 3px 3px;
|
|
opacity: 1;
|
|
|
|
}
|
|
|
|
::v-deep .u-input__textarea {
|
|
padding: 20upx;
|
|
}
|
|
}
|
|
|
|
.submit {
|
|
width: 100%;
|
|
height: 100rpx;
|
|
background: #FF6257;
|
|
border-radius: 6px 6px 6px 6px;
|
|
opacity: 1;
|
|
line-height: 100rpx;
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #FFFFFF;
|
|
margin-top: 40upx;
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
.order-modal {
|
|
padding: 50rpx;
|
|
position: relative;
|
|
|
|
.content {
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
line-height: 50rpx;
|
|
color: #4C4C4C;
|
|
}
|
|
|
|
.desc {
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 24rpx;
|
|
font-weight: 400;
|
|
color: #9F9F9F;
|
|
justify-content: center;
|
|
margin-top: 20rpx;
|
|
|
|
image {
|
|
width: 28rpx;
|
|
height: 28rpx;
|
|
margin-right: 20rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.consignee {
|
|
width: 100%;
|
|
// height: 200rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 10rpx 10rpx 10rpx 10rpx;
|
|
opacity: 1;
|
|
margin: 12rpx 0 0 0rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
padding: 24rpx 36rpx 6rpx 32rpx;
|
|
|
|
.conLeft {
|
|
.thr {
|
|
overflow: hidden;
|
|
// display: flex;
|
|
width: 474rpx;
|
|
// height: 34rpx;
|
|
font-size: 24rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #838383;
|
|
line-height: 34rpx;
|
|
margin-bottom: 20rpx;
|
|
|
|
// justify-content: flex-start;
|
|
.peo {
|
|
width: 150rpx;
|
|
float: left;
|
|
}
|
|
|
|
.name {
|
|
color: #333;
|
|
float: left;
|
|
word-wrap: break-word;
|
|
width: 300rpx;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
.conRight {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
color: #F21A1C;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
|
|
.code {
|
|
height: 34rpx;
|
|
font-size: 24rpx;
|
|
line-height: 34rpx;
|
|
margin-bottom: 8rpx;
|
|
}
|
|
|
|
.codeNum {
|
|
width: 80rpx;
|
|
height: 78rpx;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.openCode {
|
|
height: 28rpx;
|
|
font-size: 20rpx;
|
|
font-weight: 400;
|
|
color: #848484;
|
|
line-height: 23rpx;
|
|
margin-top: 4rpx;
|
|
}
|
|
}
|
|
}
|
|
</style>
|
|
|