H5端齐采药项目,uniapp框架
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.
 
 
 
 
 

1643 lines
38 KiB

<template>
<z-paging ref="paging" v-model="list" @query="queryList">
<u-navbar title="订单详情" leftIconSize="0" @leftClick="leftClick" placeholder>
<u-icon name="arrow-left" slot="left" color="#333333" size="24"></u-icon>
</u-navbar>
<view class="" v-for="(item,index) in list" :key="index">
<view class="Order-details">
<view class="Order-status">
<div class="df jcsb Order-head" @click="Status">
<div>订单状态</div>
<div class="df aic">
<text>{{data.order_status_name}}</text>
<img style="width: 28rpx;height: 28rpx;margin: 0 4rpx;"
:src="$util.img(`/upload/weapp/user/you.png`)"></img>
</div>
</div>
<div class="Order-thread"></div>
<div class="Order-number">订单编号<span>{{data.order_no}}</span> </div>
<div class="Order-time">下单时间<span>{{data.create_time | time}}</span></div>
</view>
<view class="connection">
<div class="df jcsb">
<div class="connection-head">{{data.nickname}}<span>{{data.store_type}}</span></div>
<div class="df" @click="kehutiaozhuan(data.member_id)">
<div class="connection-Rearf">{{data.pay_type_name}}</div>
<image style="width: 28rpx;height: 28rpx;margin: 36rpx 4rpx 0 4rpx;"
:src="$util.img(`/upload/weapp/user/you.png`)"></image>
</div>
</div>
<div class="line"></div>
<div class="df jcsb">
<div class="connection-head">店铺名称:{{data.store_name}}</div>
</div>
<div class="line"></div>
<div class="Good-doctor">{{data.address}}</div>
<div class="connection-address">
<span>{{data.full_address}}</span>
<span>{{data.name}}&ensp;{{data.mobile}}</span>
</div>
<div class="line"></div>
<div class="df Shipping-address">
<div class="">收货地址:</div>
<div>
<view class="Shipping-telephone">{{data.name}}<span>{{data.mobile}}</span></view>
<view class="Shipping-telephona">{{data.full_address}}</view>
</div>
</div>
</view>
<view class="Commodity-list">
<div class="df jcsb Commodity-ten" @click="btn">
<div>商品清单</div>
<div class="df aic">
<text>{{data.goods_num}}件</text>
<img style="width: 28rpx;height: 28rpx;margin: 0 4rpx;"
:src="$util.img(`/upload/weapp/user/you.png`)"></img>
</div>
</div>
<div class="dotted-line"></div>
<div class="Commodity-money">
<div class="df jcsb money">
<div>订单金额</div>
<div>¥{{data.order_money}}</div>
</div>
<div class="df jcsb money">
<div>商品金额</div>
<div>¥{{data.goods_money}}</div>
</div>
<div class="df jcsb money">
<div>订单调整</div>
<div class="money-koude">¥{{data.adjust_money}}</div>
</div>
<div class="df jcsb money">
<div>特批优惠</div>
<div class="money-koude">¥{{data.sales_money}}</div>
</div>
<div class="df jcsb money">
<div>运费</div>
<div class="money-koude">¥{{data.delivery_money}}</div>
</div>
<div class="df jcsb money">
<div>优惠卷</div>
<div>-¥{{data.coupon_money}}</div>
</div>
</div>
<div class="df transportation-expenses">
<!-- <div class="df aic jcsa" @click="show1=true">
<image :src="$util.img(`/upload/weapp/pageSalesman/reportForm/revise.png`)"></image>
修改运费</div>
<div class="df aic jcsa" @click="show2=true">
<image :src="$util.img(`/upload/weapp/pageSalesman/reportForm/form.png`)"></image>
修改特批价</div> -->
</div>
</view>
<view class="Collection-record">
<!-- <div class="df jcsb " @click="Logistics">
<div>发货/物流记录</div>
<div class="df">
<u-icon name="arrow-right"></u-icon>
</div> -->
</div>
<!-- <div class="dotted-line" style="margin: 24rpx 0;"></div> -->
<div class="df jcsb" @click="Collection">
<div>收款记录</div>
<div class="df">
<!-- <div v-if="data.wait_status==1 && data.sales_balance==1 &&data.wait_status==1">待确认</div>-->
<!-- <div v-else-if="data.wait_status==1 && data.sales_balance==1 &&data.wait_status==2">已确认</div>-->
<!-- <div v-else-if="data.sales_balance==0">已支付</div>-->
<!-- <div v-else>暂无收款记录</div>-->
<div v-if="!(data.pay || false)">暂无收款记录{{data.pay.pay_status}}</div>
<div v-else-if="data.pay.pay_status == 2">已支付</div>
<div v-else-if="data.pay.pay_status == 0 && data.pay.pay_money > 0 && data.pay.received_money > 0">部分支付</div>
<div v-else>未支付</div>
<image style="width: 28rpx;height: 28rpx;margin: 10rpx 0rpx;"
:src="$util.img(`/upload/weapp/user/you.png`)"></image>
</div>
</div>
<div class="dotted-line" style="margin: 24rpx 0;"></div>
<!-- <div class="copper-coin">代付¥488.00</div>
<div class="dotted-line"></div> -->
<div class="Order-message">订单留言</div>
<div class="Order-departure">{{data.buyer_message}}</div>
<div class="dotted-line"></div>
<!-- <div class="Order-remarks df jcsb">订单备注
<u-icon name="arrow-right" color="#fff" size="28"></u-icon>
</div>
<div class="importance">这是大客户</div> -->
<div class="dotted-line"></div>
<div class="df jcsb Delivery-method">
<text>配送方式</text>
<text>{{data.delivery_type_name}}</text>
</div>
<div class="dotted-line"></div>
<div class="df jcsb Delivery-methoda">
<div>发票信息</div>
<div class="df">
<text v-if="data.invoice_status==0">未开票</text>
<text v-if="data.invoice_status==1">已开票</text>
<u-icon name="arrow-right" color="#fff" size="28"></u-icon>
</div>
</div>
</view>
<u-overlay :show="show" @click="show = true">
<div class="notification">
<div class="point-out">提示</div>
<div class="Text-field">
<u-textarea maxlength=100 v-model="value2" placeholder="请输入内容" count></u-textarea>
</div>
<div class="define df">
<div class="f1 df aic jcsa">取消</div>
<div class="f1 df aic jcsa">确定</div>
</div>
</div>
</u-overlay>
<u-overlay :show="show1">
<view class="transportation">
<div>修改运费</div>
<div class="df">
<text>运费:</text>
<text>¥50.00</text>
</div>
<div class="df aic">
<div class="df aic">修改运费</div>
<div><input type="text"><span>元</span></div>
</div>
<div class="fill-in">请填写修改后运费</div>
<div class="df definea">
<div class="df aic jcsa" @click="show1 = false">取消</div>
<div class="df aic jcsa" @click="one">确定</div>
</div>
</view>
</u-overlay>
<u-overlay :show="show2">
<view class="Special-rating">
<div>申请特批价</div>
<div>订单价格:<span>¥50.00</span></div>
<div class="df aic">
<div class="df aic empty-fixed"><span>*</span>特批价</div>
<div>
<input type="text">
<span>元</span>
</div>
</div>
<div class="df">
<div cladd="empty-fixed">申请原因</div>
<div>
<u-textarea v-model="value1" height="124rpx"></u-textarea>
</div>
</div>
<div class="">特批价是指通过客户与业务员之间得沟通后,同意对本地订单总价进行优惠,在此修改优惠后得订单总价</div>
<div class="df">
<div class="df aic jcsa" @click="show2 = false">取消</div>
<div class="df aic jcsa" @click="two">确认</div>
</div>
</view>
</u-overlay>
<u-overlay :show="show3">
<view class="listacd">
<!-- <u-navbar title="填写发货信息" leftIconSize="0" placeholder>
<u-icon name="arrow-left" slot="left" color="#333333" size="24"></u-icon>
</u-navbar> -->
<div class="list-list df aic jcsa">填写发货信息</div>
<!-- data.order_goods -->
<view class="list" v-for="(item,index) in data.order_goods" :key="index">
<div class="df">
<div class="list-img">
<image :src="$util.img(item.sku_image)" mode=""></image>
</div>
<div class="df fdc Product-Introduction">
<div class="Product-name">{{item.goods_name}}</div>
<div class="df">
<div class="number">编号:{{item.order_no}}</div>
<!-- <u-switch :v-model="item.const" @change="errorset(item,index)"></u-switch> -->
<div class="badge" @click="other(item,index)">
<image :src="$util.img(`/upload/weapp/pageSalesman/checked.png`)"
v-if="item.const==true" mode=""></image>
<image :src="$util.img(`/upload/weapp/pageSalesman/un_check.png`)" v-else
mode=""></image>
</div>
</div>
<div>
<!-- <div class="stock">库存:{{item.stock}}袋</div> -->
</div>
<div class="df aic price">
<div class="price-before">当前价:¥{{item.price}}/袋</div>
<div style="color: red;margin-left: 12rpx;">×{{item.num}}</div>
</div>
</div>
</div>
</view>
<div class="df" style="margin-top: 20rpx;margin-left: 25rpx;">发货方式<div
style="margin-left: 20rpx;">
<u-switch v-model="value12"></u-switch>
</div>
</div>
<view class="wuliu df aic jcsb" @click="show4=true" v-if="value12">
<div class="df">
物流公司:
<div v-if="listname.length>0">{{listname}}</div>
<div style="color: #ccc;" v-else>请选择物流公司</div>
</div>
<div>
<u-icon name="arrow-right"></u-icon>
</div>
</view>
<div style="margin-top: 20rpx;margin-left: 25rpx;" v-if="value12">快递单号</div>
<div class="uinput" v-if="value12">
<u--input placeholder="请输入快递单号" border="surround" v-model="value" @change="changease"
:customStyle="{
border:'none',
}"></u--input>
</div>
<div class="df aic jcsa">
<div class="df aic jcsa one" @click="show3 = false">取消</div>
<div class="df aic jcsa two" @click="two">确认</div>
</div>
</view>
</u-overlay>
<u-action-sheet cancelText="取消" @close="show4=false" @select="select" :actions="listb" :show="show4">
</u-action-sheet>
<view class="nav df aic jcf">
<!-- <div style="border: 0rpx;"></div> -->
<div class="df aic jcsa listone" @click="passthrough">再次订购</div>
<!-- <div class="df aic jcsa" @click="cancel">取消订单</div> -->
<div class="df aic jcsa listtwo" v-if="data.order_status_name=='待发货'&&xiudada" @click="show3=true">确认发货</div>
<div class="df aic jcsa listtwo" v-if="data.order_status_name=='已发货'&&xiudada"
@click="ConfirmCharge">确认收货</div>
</view>
</view>
</view>
</z-paging>
</template>
<script>
import {
computed
} from "vue"
const timesfm = require('@/common/js/map/message.js')
import eventBus from '@/common/js/bus.js'
export default {
data() {
return {
show: false,
show1: false,
show2: false,
show3: false,
show4: false,
lista: [],
listb: [],
lujin:'',
listname: '',
value11: false,
value12: false,
value2: '请输入订单备注',
value1: '',
value: '',
xiudada:true,
express_company_id: '',
list: [1],
order: '', //订单id
member: '', //下单客户id
data: [] //详情数据
};
},
onLoad(e) {
// order 订单id member 下单客户id
eventBus.$on('urlone', (data) => {
this.lujin = data
uni.$off('urlone')
})
console.log(e, 'id');
this.order = e.or
this.member = e.me
},
computed: {
//共几种商品
Several: function() {
var Severala = []
for (var i = 0; i < this.lista.length; i++) {
this.listb.push({
"name": this.lista[i].company_name
})
}
// this.listb=Severala
},
shuzu: function() {
let a = ''
let _this = this
for (var i = 0; i < this.data.order_goods.length; i++) {
console.log(_this.data.order_goods, 'iii');
if (_this.data.order_goods[i].const) {
console.log(i, 'iii');
a = a + '' + JSON.stringify(_this.data.order_goods[i].goods_id)
}
}
return a
}
},
onShow() {
// this.switch()
this.$api.sendRequest({
url: '/api/salasmanorder/detail',
data: {
order_id: this.order,
member_id: this.member
},
success: res => {
this.data = res.data
console.log('xxx',res.data);
for (var i = 0; i < this.data.order_goods.length; i++) {
this.data.order_goods[i].const = false
// console.log(this.data.order_goods,'待发货');
}
}
})
this.$api.sendRequest({
url: '/api/salasmanorder/getExpressList',
data: {
page: "1",
page_size: '20'
},
success: res => {
this.lista = res.data.list
console.log(res.data.list, '物流公司');
let a = []
for (var i = 0; i < res.data.list.length; i++) {
a.push({
name: res.data.list[i].company_name
})
}
setTimeout(() => {
this.listb = a
}, 500)
}
})
},
methods: {
queryList(pageNo, pageSize) {
this.$api.sendRequest({
url: '/api/salasmanorder/detail',
data: {
order_id: this.order,
member_id: this.member
},
success: res => {
this.data = res.data
console.log(this.data, '待发货详情');
}
})
this.$refs.paging.complete(this.list);
},
kehutiaozhuan(id){
uni.navigateTo({
// url:'/page_salesman_customer/Customer_details/detailedinformation',
url: `/page_salesman_customer/detailed/detailed?id=${id}&di=1`
})
},
leftClick() {
// #ifdef H5
event.stopPropagation();
// #endif
if (this.lujin == 0) {
uni.redirectTo({
// url:this.list[this.current.URL]
url: `/page_salesman_order/index/index?index=0`
})
}
if (this.lujin == 1) {
uni.redirectTo({
// url:this.list[this.current.URL]
url: `/page_salesman_order/index/index?index=1`
})
}
if (this.lujin == 2) {
uni.redirectTo({
// url:this.list[this.current.URL]
url: `/page_salesman_order/index/index?index=2`
})
}
if (this.lujin == 3) {
uni.redirectTo({
// url:this.list[this.current.URL]
url: `/page_salesman_order/index/index?index=3`
})
}
if (this.lujin == 4) {
uni.redirectTo({
// url:this.list[this.current.URL]
url: `/page_salesman_order/index/index?index=4`
})
}
if (this.lujin == 5) {
uni.redirectTo({
// url:this.list[this.current.URL]
url: `/page_salesman_order/index/index?index=5`
})
}
if (this.lujin == 6) {
uni.redirectTo({
// url:this.list[this.current.URL]
url: `/page_salesman_order/index/index?index=6`
})
}
},
Status(){
setTimeout(()=>{
eventBus.$emit('record',{
order_id:this.order,
member_id:this.member,
data:this.data.order_log,
orderStatus:this.data.order_status_name
})
},500)
uni.navigateTo({
// url:this.list[this.current.URL]
url:`/page_salesman_order/Order_status/Order_status`
})
},
other(item, index) {
console.log(item, 'item');
let _this = this
this.express_company_id = ''
console.log(this.data.order_goods, 'item2');
this.data.order_goods[index].const = !this.data.order_goods[index].const
for (var i = 0; i < this.data.order_goods.length; i++) {
console.log(_this.data.order_goods, 'iii');
if (_this.data.order_goods[i].const) {
// console.log(i,'iii');
if (this.express_company_id.length > 0) {
this.express_company_id = this.express_company_id + ',' + JSON.stringify(_this.data
.order_goods[i].order_goods_id)
} else {
this.express_company_id = JSON.stringify(_this.data.order_goods[i].order_goods_id)
}
}
}
this.$forceUpdate()
},
ConfirmCharge() {
let _this = this
this.$api.sendRequest({
url: '/api/salasmanorder/takeDelivery',
data: {
order_id: this.order,
member_id: this.member
},
success: res => {
if (res.code == 0) {
_this.xiudada = false
this.$api.sendRequest({
url: '/api/salasmanorder/detail',
data: {
order_id: this.order,
member_id: this.member
},
success: res => {
this.data = res.data
console.log(res.data, '订单详情');
}
})
this.$util.showToast({
title: '确认收货成功'
});
}
}
})
},
changease(e) {
this.value = e
},
// errorset(item,index){
// item[index].const=!item[index].const
// console.log(index);
// },
Logistics() {
console.log('物流');
uni.navigateTo({
// url:this.list[this.current.URL]
url: `/page_salesman_order/Delivery_logistics/Delivery_logistics?id=${this.data.member_id}&di=${this.data.order_id}`
})
},
select(e) {
this.listname = e.name
for (let i = 0; i < this.lista.length; i++) {
if (e.name == this.lista[i].company_name) {
this.company_id = this.lista[i].company_id
}
}
},
btn() {
// this.show=true
setTimeout(() => {
uni.$emit('CommodityList', this.data)
}, 500)
uni.navigateTo({
// url:this.list[this.current.URL]
url: '/page_salesman_index/Commodity_list/Commodity_list'
})
},
Collection() {
console.log(11);
if(this.data.sales_balance==0){
this.$util.showToast({
title: '无收款记录'
});
return
}
console.log(22);
if(this.data.sales_status==0){
this.$util.showToast({
title: '未审核'
});
return
}
console.log(33);
if(this.data.sales_status==2){
this.$util.showToast({
title: '已驳回'
});
return
}
console.log(44);
uni.navigateTo({
// url:this.list[this.current.URL]
url: `/page_salesman_order/Collection_record/Collection_record?id=${this.data.member_id}&di=${this.data.order_id}`
})
},
one() {
this.show1 = false
this.$util.showToast({
title: '修改成功'
});
},
two() {
this.show2 = false
// this.$util.showToast({
// title: '修改成功'
// });
let _this = this
let a = ''
console.log({
order_id: this.order, // 是 string 订单id
order_goods_ids: this.express_company_id, // 是 string 发货商品id 多个用英文逗号隔开
express_company_id: this.company_id, // 是 string 快递公司company_id
delivery_no: this.value, // 是 string 快递单号
delivery_type: this.value12 ? 1 : 0 // 否 string 发货方式1 需要物流 0无需物流 默认1
});
if (!this.express_company_id.length > 0) {
this.$util.showToast({
title: '请选择发货商品'
});
return
}
if (this.value12) {
if (!this.listname.length > 0) {
this.$util.showToast({
title: '请选择物流公司'
});
return
}
if (!this.value.length > 0) {
this.$util.showToast({
title: '请填写快递单号'
});
return
}
this.$api.sendRequest({
url: '/api/salasmanorder/delivery',
data: {
order_id: this.order, // 是 string 订单id
order_goods_ids: this.express_company_id, // 是 string 发货商品id 多个用英文逗号隔开
express_company_id: this.company_id, // 是 string 快递公司company_id
delivery_no: this.value, // 是 string 快递单号
delivery_type: this.value12 ? 1 : 0 // 否 string 发货方式1 需要物流 0无需物流 默认1
},
success: res => {
this.show3 = false
this.$util.showToast({
title: '发货成功'
});
this.$api.sendRequest({
url: '/api/salasmanorder/detail',
data: {
order_id: this.order,
member_id: this.member
},
success: res => {
this.data = res.data
console.log(this.data, '待发货详情');
}
})
}
})
} else {
this.$api.sendRequest({
url: '/api/salasmanorder/delivery',
data: {
order_id: this.order, // 是 string 订单id
order_goods_ids: this.express_company_id, // 是 string 发货商品id 多个用英文逗号隔开
// express_company_id: this.company_id, // 是 string 快递公司company_id
// delivery_no: this.value, // 是 string 快递单号
delivery_type: this.value12 ? 1 : 0 // 否 string 发货方式1 需要物流 0无需物流 默认1
},
success: res => {
this.show3 = false
this.$util.showToast({
title: '发货成功'
});
this.$api.sendRequest({
url: '/api/salasmanorder/detail',
data: {
order_id: this.order,
member_id: this.member
},
success: res => {
this.data = res.data
console.log(this.data, '待发货详情');
}
})
}
})
}
},
passthrough() {
setTimeout(() => {
uni.$emit('zaicidinggou', {
one:this.data.order_goods,
two:1
})
}, 500)
uni.navigateTo({
url: `/page_salesman_index/Select_item/Select_item?st=${this.data.member_id}&di=${this.data.store_id}`
})
// this.$util.showToast({
// title: '订购成功'
// });
},
cancel() {
this.$util.showToast({
title: '取消成功'
});
},
through() {
this.$util.showToast({
title: '通过审核成功'
});
}
},
filters: {
time(num) {
return timesfm(num * 1000)
}
}
}
</script>
<style lang="scss">
.listacd {
width: 100%;
height: 100%;
background-color: rgb(247, 247, 247);
overflow-y: scroll;
/* #ifdef APP */
padding: 100rpx 0 0 0;
box-sizing: border-box;
/* #endif */
.wuliu {
width: 700rpx;
margin: 0 auto;
background-color: #fff;
padding: 10rpx;
box-sizing: border-box;
border-radius: 20rpx;
margin-top: 20rpx;
}
.uinput {
width: 700rpx;
margin: 0 auto;
margin-top: 20rpx;
border-radius: 20rpx;
background-color: #fff;
}
.one {
width: 300rpx;
margin-top: 80rpx;
padding: 10rpx;
box-sizing: border-box;
border-radius: 20rpx;
border: 1rpx solid #fff;
background-color: #fff;
}
.two {
width: 300rpx;
margin-top: 80rpx;
padding: 10rpx;
// box-sizing: border-box;
background-color: rgb(64, 158, 255);
border-radius: 20rpx;
color: #fff;
}
}
.list-list {
/* #ifdef APP */
margin-top: 20rpx;
/* #endif */
/* #ifdef H5 */
margin-top: 100rpx;
/* #endif */
}
.list {
width: 702rpx;
// height: 324rpx;
background: #FFFFFF;
border-radius: 24rpx;
margin: 0 auto;
box-sizing: border-box;
margin-top: 20rpx;
padding-bottom: 24rpx;
box-sizing: border-box;
.list-img {
width: 176rpx;
height: 176rpx;
border-radius: 8rpx;
margin: 32rpx 24rpx 0 32rpx;
image {
width: 176rpx;
height: 176rpx;
border-radius: 8rpx;
}
}
.Product-Introduction {
.Product-name {
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
line-height: 40rpx;
margin-top: 32rpx;
}
.number {
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
line-height: 34rpx;
margin-top: 32rpx;
margin-right: 40rpx;
}
.badge {
width: 40rpx;
height: 40rpx;
image {
width: 40rpx;
height: 40rpx;
}
}
.stock {
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
line-height: 34rpx;
margin-top: 32rpx;
// margin-left: 90rpx;
}
.price {
margin-top: 34rpx;
.price-before {
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
line-height: 34rpx;
}
.price-revise {
input {
width: 78rpx;
height: 40rpx;
background: #F6F6F6;
border-radius: 8rpx;
}
span:nth-child(1) {
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #F33B50;
line-height: 34rpx;
margin-left: 46rpx;
margin-right: 16rpx;
}
span:nth-child(2) {
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
line-height: 34rpx;
margin-left: 6rpx;
}
}
}
}
}
.Special-rating {
width: 630rpx;
background: #FFFFFF;
border-radius: 24px;
position: fixed;
top: 240rpx;
left: 50%;
transform: translateX(-50%);
box-sizing: border-box;
padding-bottom: 32rpx;
}
.empty-fixed {
margin-top: 0 !important;
}
.Special-rating div:nth-child(1) {
margin-top: 40rpx;
text-align: center;
font-size: 32rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #222222;
line-height: 44rpx;
}
.Special-rating div:nth-child(2) {
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #585858;
line-height: 40rpx;
margin-top: 30rpx;
margin-left: 28rpx;
}
.Special-rating div:nth-child(3) {
margin-top: 24rpx;
height: 70rpx;
div:nth-child(1) {
height: 70rpx;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgb(88, 88, 88);
line-height: 40rpx;
margin-left: 28rpx;
span {
color: #FF3030;
}
}
div:nth-child(2) {
width: 438rpx;
height: 70rpx;
background: #F6F6F6;
border-radius: 16rpx;
position: relative;
margin-left: 30rpx;
margin-top: 0;
input {
width: 438rpx;
height: 70rpx;
background: #F6F6F6;
border-radius: 16rpx;
}
span {
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #222222;
line-height: 40rpx;
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 24rpx;
}
}
}
.Special-rating div:nth-child(4) {
height: 160rpx;
margin-top: 24rpx;
div:nth-child(1) {
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #585858;
line-height: 40rpx;
margin-left: 28rpx;
margin-right: -12rpx;
margin-top: 0;
}
div:nth-child(2) {
width: 438rpx;
height: 124rpx;
background: #F6F6F6;
border-radius: 16rpx;
text-align: left;
margin-top: 0;
}
}
.Special-rating div:nth-child(5) {
width: 570rpx;
height: 68rpx;
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #585858;
line-height: 34rpx;
margin: 0 auto;
margin-top: 16rpx;
}
.Special-rating div:nth-child(6) {
margin-top: 44rpx;
div:nth-child(1) {
margin: 0;
width: 206rpx;
height: 72rpx;
border-radius: 40rpx;
border: 2rpx solid #E8E8E8;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #222222;
line-height: 40rpx;
margin: 0 32rpx 0 94rpx;
}
div:nth-child(2) {
margin: 0;
width: 206rpx;
height: 72rpx;
background: #21BBF3;
border-radius: 40rpx;
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #FFFFFF;
line-height: 40rpx;
}
}
.transportation {
width: 540rpx;
height: 448rpx;
background: #FFFFFF;
border-radius: 24px;
position: fixed;
top: 418rpx;
left: 50%;
transform: translateX(-50%);
box-sizing: border-box;
.definea {
margin-top: 38rpx;
}
.definea div:nth-child(1) {
width: 206rpx;
height: 72rpx;
border-radius: 40rpx;
border: 2rpx solid #E8E8E8;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #222222;
line-height: 40rpx;
margin-top: 0;
margin-left: 48rpx;
}
.definea div:nth-child(2) {
width: 206rpx;
height: 72rpx;
background: #21BBF3;
border-radius: 40rpx;
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #FFFFFF;
line-height: 40rpx;
margin-top: 0;
margin-left: 32rpx;
padding: 0;
}
}
.transportation div:nth-child(1) {
font-size: 32rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #222222;
line-height: 44rpx;
text-align: center;
margin-top: 40rpx;
}
.transportation div:nth-child(2) {
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #585858;
line-height: 40rpx;
margin-top: 30rpx;
padding-left: 38rpx;
text:nth-child(2) {
margin-left: 16rpx;
}
}
.transportation div:nth-child(3) {
div:nth-child(1) {
width: 112rpx;
height: 40rpx;
margin-left: 38rpx;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #585858;
line-height: 40rpx;
}
div:nth-child(2) {
width: 288rpx;
height: 70rpx;
background: #F6F6F6;
border-radius: 16rpx;
margin-left: 20rpx;
position: relative;
input {
width: 288rpx;
height: 70rpx;
background: #F6F6F6;
border-radius: 16rpx;
}
span {
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 24rpx;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #222222;
line-height: 40rpx;
}
}
}
.fill-in {
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #585858;
line-height: 34rpx;
margin: 20rpx 0 0 36rpx;
}
.nav {
width: 750rpx;
height: 100rpx;
background: #F7F7F7;
margin-top: 32rpx;
padding: 0 40rpx;
box-sizing: border-box;
.listone {
width: 192rpx;
height: 72rpx;
border-radius: 40rpx;
border: 2rpx solid #E8E8E8;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #222222;
line-height: 40rpx;
}
.listtwo {
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #FFFFFF;
line-height: 40rpx;
width: 192rpx;
height: 72rpx;
background: #21BBF3;
border-radius: 40rpx;
margin: 0 0rpx 0 20rpx;
}
}
.Order-details {
padding: 24rpx;
.Order-status {
width: 702rpx;
height: 270rpx;
background: #FFFFFF;
border-radius: 24rpx;
.Order-head div:nth-child(1) {
padding: 32rpx 0 28rpx 32rpx;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #585858;
line-height: 44rpx;
}
.Order-head div:nth-child(2) {
padding: 32rpx 0;
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #FF3B67;
line-height: 40rpx;
}
.Order-thread {
width: 638rpx;
height: 2rpx;
background: #F2F2F2;
border-radius: 16rpx;
margin: 0 auto;
}
.Order-number {
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
line-height: 40rpx;
padding: 28rpx 0 0 32rpx;
span {
margin-left: 42rpx;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #222222;
line-height: 40rpx;
}
}
.Order-time {
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
line-height: 40rpx;
padding: 24rpx 0 0 32rpx;
}
.Order-time span:nth-child(1) {
margin-left: 42rpx;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #222222;
line-height: 40rpx;
}
}
.connection {
width: 702rpx;
// height: 464rpx;
background: #FFFFFF;
border-radius: 24rpx;
margin-top: 24rpx;
padding-bottom: 20rpx;
box-sizing: border-box;
.Shipping-telephona {
margin-top: 16rpx;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #222222;
line-height: 40rpx;
}
.Shipping-telephone {
padding: 28rpx 0 0 0;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #222222;
line-height: 40rpx;
span {
margin-left: 24rpx;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
line-height: 40rpx;
}
}
.Shipping-address div:nth-child(1) {
width: 170rpx;
height: 40rpx;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #585858;
line-height: 40rpx;
padding: 28rpx 0 0 32rpx;
}
.connection-address {
padding: 24rpx 0 0 32rpx;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #585858;
line-height: 40rpx;
margin-bottom: 28rpx;
}
.connection-address span:nth-child(1) {
margin-right: 40rpx;
}
.Good-doctor {
padding: 32rpx 0 0 32rpx;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #585858;
line-height: 40rpx;
}
.line {
width: 638rpx;
height: 2rpx;
background: #F2F2F2;
border-radius: 16rpx;
margin: 0 auto;
}
.connection-Rearf {
padding-top: 32rpx;
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #222222;
line-height: 40rpx;
}
.connection-head {
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #585858;
line-height: 44rpx;
padding: 32rpx;
span {
width: 92rpx;
height: 36rpx;
font-size: 20rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #FF7D02;
line-height: 28rpx;
background-color: rgb(255, 240, 226);
margin-left: 16rpx;
}
}
}
.Commodity-list {
width: 702rpx;
// height: 542rpx;
background: #FFFFFF;
border-radius: 16rpx;
margin-top: 24rpx;
padding-bottom: 24rpx;
box-sizing: border-box;
.transportation-expenses {
margin-top: 32rpx;
div {
width: 174rpx;
height: 48rpx;
background: #FFFFFF;
border-radius: 28rpx;
border: 2rpx solid #E8E8E8;
text-align: center;
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #222222;
line-height: 34rpx
}
image {
width: 32rpx;
height: 32rpx;
}
}
.transportation-expenses div:nth-child(1) {
margin-left: 274rpx;
margin-right: 24rpx;
}
.Commodity-money {
padding: 0 32rpx;
.money {
margin-top: 24rpx;
.money-koude {
color: red !important;
}
}
.money div:nth-child(1) {
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #222222;
line-height: 40rpx;
}
.money div:nth-child(2) {
font-size: 24rpx;
font-family: DINAlternate-Bold, DINAlternate;
font-weight: bold;
color: #222222;
line-height: 40rpx;
}
}
.dotted-line {
width: 638rpx;
height: 2rpx;
background: #F2F2F2;
border-radius: 16rpx;
margin: 0 auto;
margin-top: 28rpx;
margin-bottom: 4rpx;
}
.Commodity-ten div:nth-child(1) {
padding: 32rpx 0 0 32rpx;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #585858;
line-height: 44rpx;
}
.Commodity-ten div:nth-child(2) {
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #222222;
line-height: 44rpx;
margin-top: 32rpx;
}
}
.Collection-record {
width: 702rpx;
background: #FFFFFF;
border-radius: 24rpx;
margin-top: 24rpx;
padding: 32rpx;
box-sizing: border-box;
.Delivery-method {
padding: 28rpx 48rpx 28rpx 0;
}
.Delivery-methoda {
padding: 28rpx 0rpx 28rpx 0;
}
.Delivery-method div:nth-child(1) {
font-size: 30rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #585858;
line-height: 44rpx;
}
.Delivery-method div:nth-child(2) {
font-size: 30rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #222222;
line-height: 44rpx;
}
.Delivery-methoda div:nth-child(1) {
font-size: 30rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #585858;
line-height: 44rpx;
}
.Delivery-methoda div:nth-child(2) {
font-size: 30rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #222222;
line-height: 44rpx;
}
.copper-coin {
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #222222;
line-height: 40rpx;
margin-top: 24rpx;
margin-bottom: 28rpx;
}
.dotted-line {
width: 638rpx;
height: 2rpx;
background: #F2F2F2;
border-radius: 16rpx;
}
.Order-message {
margin-top: 28rpx;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #585858;
line-height: 40rpx;
}
.Order-departure {
margin-top: 24rpx;
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #222222;
line-height: 40rpx;
margin-bottom: 28rpx;
}
.Order-remarks {
margin-top: 28rpx;
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #585858;
line-height: 40rpx;
}
.importance {
margin-top: 24rpx;
margin-bottom: 28rpx;
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #222222;
line-height: 40rpx;
}
}
.notification {
width: 540rpx;
height: 416rpx;
background: #FFFFFF;
position: fixed;
top: 572rpx;
left: 106rpx;
right: 104rpx;
border-radius: 20rpx;
box-sizing: border-box;
.define {
border: 2rpx solid #E8E8E8;
border-bottom: none;
height: 96rpx;
margin-top: 36rpx;
}
.define div:nth-child(1) {
border-left: none;
}
.define div:nth-child(2) {
color: #21BBF3;
border-right: none;
}
.point-out {
font-size: 32rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #222222;
line-height: 44rpx;
margin: 0 auto;
text-align: center;
margin: 40rpx 0 24rpx 0;
}
.Text-field {
padding: 0;
padding: 0 50rpx 0 46rpx;
}
}
}
</style>