984 lines
26 KiB
Vue
984 lines
26 KiB
Vue
<template>
|
||
<view class="content">
|
||
<view class="topBox">
|
||
<view class="statusText">{{orderInfo.status_name}}</view>
|
||
<view class="statusTip">{{orderInfo.order_status_content}}</view>
|
||
</view>
|
||
<view class="orderInfoBox" style="overflow: hidden;">
|
||
<view class="viewBox">
|
||
<view>货物信息</view>
|
||
<view class="goodsInfo flex-between">
|
||
<view class="infoLeft flex-center">
|
||
<image :src="path+orderInfo.type_image" class="goodsImg"></image>
|
||
<view style="margin-left: 22rpx;">
|
||
<view class="text1">回收品类</view>
|
||
<view class="text2">{{orderInfo.type_name}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="infoCenter">
|
||
<view class="text1">数量</view>
|
||
<view style="margin-top: 15rpx;">
|
||
<text class="textIcon">x</text>
|
||
<text class="textNum">{{orderInfo.quantity}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="infoRight">
|
||
<view class="text1">单价</view>
|
||
<view style="margin-top: 15rpx;">
|
||
<text class="textIcon">￥</text>
|
||
<text class="textNum">{{orderInfo.single_price}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="specsBox flex-between">
|
||
<view class="flex-center">
|
||
<text class="specsText">规格：{{deelData(orderInfo.spec_value)}}</text>
|
||
<u-icon name="arrow-right" color="#282F38" size="10"></u-icon>
|
||
</view>
|
||
<!-- <view class="updateBtn">更改</view> -->
|
||
<!-- <text class="specsText">规格：</text>
|
||
<text>{{deelData(orderInfo.spec_value)}}</text> -->
|
||
<!-- <text v-for="item in orderInfo.spec_value">{{item}}</text> -->
|
||
<!-- <u-icon name="arrow-right" color="#282F38" size="10"></u-icon> -->
|
||
</view>
|
||
|
||
<view class="countBox">
|
||
<view class="text1">合计</view>
|
||
<view style="margin-top: 0rpx;">
|
||
<text class="textIcon">￥</text>
|
||
<text class="textNum">{{orderInfo.price}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view v-show="orderInfo.person_name" class="infoWrap" style="border-radius: 30rpx;background: #fff;margin-top: 20rpx;">
|
||
<view class="bgHead">
|
||
回收员信息
|
||
</view>
|
||
<view class="infoBox">
|
||
<text class="infoText1">{{orderInfo.person_name}}</text>
|
||
<text class="infoText2">{{orderInfo.person_mobile}}</text>
|
||
<view class="infoTip">平台已认证师傅资质，上门请校核是否本人上门</view>
|
||
<view class="flex-center infoBtnBox" @click="callPhone(orderInfo.accept_mobile)">
|
||
<u-icon name="phone" color="#282F38" size="22" style="margin-right: 12rpx;margin-top: 5rpx;"></u-icon>
|
||
联系师傅
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="infoWrap" style="border-radius: 30rpx;background: #fff;margin-top: 20rpx;">
|
||
<view class="bgHead">
|
||
用户信息
|
||
</view>
|
||
<view class="infoBox" style="padding-bottom: 29rpx;">
|
||
<view style="border-bottom: 1px solid #DEDEDE;padding-bottom: 30rpx;">
|
||
<text class="infoText1">{{orderInfo.accept_name}}</text>
|
||
<text class="infoText2">{{orderInfo.accept_mobile}}</text>
|
||
<view class="infoAddress" style="margin-top: 10rpx;">{{orderInfo.area_name}}{{orderInfo.accept_address}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="funBtnBox flex-between">
|
||
<view class="leftBtn flex-center" @click="callPhone(orderInfo.accept_mobile)">
|
||
<image :src="path+'/assets/img/icon/phone2.png'" class="btnIcon"></image>
|
||
<text>联系用户</text>
|
||
</view>
|
||
<view class="rightBtn flex-center" @click="toNearbyStore">
|
||
<image :src="path+'/assets/img/icon/send2.png'" class="btnIcon"></image>
|
||
<text>导航地址</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="infoWrap" style="border-radius: 30rpx;background: #fff;margin-top: 20rpx;">
|
||
<view class="bgHead flex-between">
|
||
<view>
|
||
预约上门时间
|
||
<text class="start" style="line-height: 59rpx; color:#FF5F5F">*</text>
|
||
<text class="infoTip2">先与客户确认哦~</text>
|
||
</view>
|
||
<text class="recordLable">预约记录</text>
|
||
</view>
|
||
<view class="infoBox">
|
||
<!-- <view class="flex-between">
|
||
<text class="infoDate">请选择上门服务时间</text>
|
||
<u-icon name="arrow-right" color="#333333" size="13"></u-icon>
|
||
</view> -->
|
||
<!-- <view class="flex-between">
|
||
<view class="infoDate2 flex-center">
|
||
<view>今日</view>
|
||
<view style="margin-left: 28rpx;">09:00-11:00</view>
|
||
</view>
|
||
<view class="flex-center">
|
||
<view class="updateLable">更改</view>
|
||
<u-icon name="arrow-right" color="#333333" size="13"></u-icon>
|
||
</view>
|
||
</view> -->
|
||
<view class="flex-between" @click="selectTime">
|
||
<view class="infoDate3 flex-center">
|
||
<view>今日</view>
|
||
<view style="margin-left: 28rpx;">{{order_person_time}}</view>
|
||
</view>
|
||
<view class="flex-center">
|
||
<text v-show="!order_person_time" class="recordLable">选择预约时间</text>
|
||
<u-icon name="arrow-right" color="#333333" size="13"></u-icon>
|
||
</view>
|
||
</view>
|
||
<view class="toDoorDate">期望上门时间：{{orderInfo.order_time}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="detailBox">
|
||
<view>订单备注</view>
|
||
<view class="detailText">{{orderInfo.remark}}</view>
|
||
</view>
|
||
<view class="detailBox">
|
||
<view>订单信息</view>
|
||
<view class="detailText">下单时间：{{orderInfo.order_time}}</view>
|
||
<view class="detailText">订单编号：{{orderInfo.order_no}}</view>
|
||
</view>
|
||
|
||
<!-- <view class="news_title">
|
||
<view class="fsz30 overflow2 title tag">
|
||
{{orderInfo.status_name||''}}
|
||
</view>
|
||
<view class="time fsz26">
|
||
订单号：{{orderInfo.order_no||''}}
|
||
</view>
|
||
<view class="time fsz26">
|
||
下单时间：{{orderInfo.createtime||''}}
|
||
</view>
|
||
<view class="time fsz26" v-if="orderInfo.status ==3">
|
||
完成时间：{{orderInfo.finish_time||''}}
|
||
</view>
|
||
</view>
|
||
<view class="line"></view>
|
||
<view class=" w">
|
||
<view class="biaoti fsz30">
|
||
预约信息
|
||
</view>
|
||
<view class="main">
|
||
<view class="li fsz30">
|
||
<view class="ti">联系人 : </view>
|
||
<view>{{orderInfo.accept_name||''}}</view>
|
||
</view>
|
||
<view class="li fsz30">
|
||
<view class="ti">电话 : </view>
|
||
<view>{{orderInfo.accept_mobile||''}}</view>
|
||
</view>
|
||
<view class="li fsz30">
|
||
<view class="ti">地址 : </view>
|
||
<view>{{orderInfo.area_name||''}} </view>
|
||
</view>
|
||
<view class="li fsz30">
|
||
<view class="ti"></view>
|
||
<view style=" text-align: right;">{{orderInfo.accept_address||''}}</view>
|
||
</view>
|
||
<view class="li fsz30" v-if="orderInfo.status ==3">
|
||
<view class="ti">订单金额 : </view>
|
||
<view style="text-align: right;" class="red-price">{{orderInfo.price||''}}</view>
|
||
</view>
|
||
<view class="li fsz30" v-if="orderInfo.status ==3">
|
||
<view class="ti">订单赠送积分 : </view>
|
||
<view style="text-align: right;" class="red-price">{{orderInfo.send_point||''}}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="line"></view>
|
||
<view class=" w">
|
||
<view class="biaoti fsz30">
|
||
回收信息
|
||
</view>
|
||
<view class="main">
|
||
<view class="li fsz30">
|
||
<view class="ti">预约回收品类 : </view>
|
||
<view>{{orderInfo.type_name||''}}</view>
|
||
</view>
|
||
<view class="li fsz30">
|
||
<view class="ti">预约时间 : </view>
|
||
<view>{{orderInfo.order_time||''}}</view>
|
||
</view>
|
||
<view class="li fsz30">
|
||
<view class="ti">预约重量 : </view>
|
||
<view>{{orderInfo.weight||''}}</view>
|
||
</view>
|
||
<view class="li fsz30">
|
||
<view class="ti">备注 : </view>
|
||
<view>{{orderInfo.remark||'无'}}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="line"></view>
|
||
<view class=" w" v-if="orderInfo.status==2">
|
||
<view class="biaoti fsz30">
|
||
回收员
|
||
</view>
|
||
<view class="main">
|
||
<view class="li fsz30">
|
||
<view>姓名 : </view>
|
||
<view>{{orderInfo.person_name||''}}</view>
|
||
</view>
|
||
<view class="li fsz30">
|
||
<view >电话 : </view>
|
||
<view @tap="call(orderInfo.person_mobile)" >{{orderInfo.person_mobile||''}}</view>
|
||
</view>
|
||
<view class="li fsz30">
|
||
<view >接单时间 : </view>
|
||
<view >{{orderInfo.jiedan_time||''}}</view>
|
||
</view>
|
||
</view>
|
||
</view> -->
|
||
<view style="height:120px"></view>
|
||
</view>
|
||
<view class="button-bottom" v-if="orderInfo.status==1 || orderInfo.status==2 || orderInfo.status==3">
|
||
<view class="tipBox">请先与客户确认上门服务时间哦~</view>
|
||
<view class="buttonEdit flex-center" @click="pop4Show = true" v-if="orderInfo.status == 2">改派</view>
|
||
<button class='btn flex-center' v-if="orderInfo.status == 1 || orderInfo.status == 2" @click="cancelOrder()">取消订单</button>
|
||
<view class="buttonType2 flex-center" @click.stop="signIn()" v-if="orderInfo.status == 2">上门签到</view>
|
||
<view class="buttonType2 flex-center" v-if="orderInfo.status == 3" @click="toPay(orderInfo)">去付款</view>
|
||
</view>
|
||
<u-popup :show="pop4Show" @close="pop4Show = false" mode="center" :round="30">
|
||
<view class="pop4Box">
|
||
<view class="flex-between" style="padding: 51rpx 55rpx 0;">
|
||
<text class="pop4Title">改派原因</text>
|
||
<u-icon @click="pop4Show = false" name="close" color="#333333" size="16" bold></u-icon>
|
||
</view>
|
||
<u--textarea v-model="notesText" placeholder="请填写改派原因" class="pop4Input" style="background: #EFEFEF;border: none"></u--textarea>
|
||
<view class="flex-center" style="margin-top: 55rpx;">
|
||
<view class="pop4Btn1" @click="pop4Show = false">取消改派</view>
|
||
<view class="pop4Btn2" @click="conformChangeOrder">确认改派</view>
|
||
</view>
|
||
</view>
|
||
</u-popup>
|
||
<u-popup :show="signInShow" mode="center" :round="30">
|
||
<view class="popBoxOne">
|
||
<image :src="path+'/assets/img/icon/star1.png'" class="popOneImg"></image>
|
||
<text class="popOneText1">上门签到成功！</text>
|
||
<text class="popOneText2">上门服务请仔细核对回收货物</text>
|
||
<text class="popOneText3">祝您与用户合作愉快~</text>
|
||
<view class="popOneBtn flex-center" @click="signInShow = false">好的</view>
|
||
</view>
|
||
</u-popup>
|
||
<appointTime ref="timeRef" @checkTime="checkTime"></appointTime>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import util from '../../common/util';
|
||
import appointTime from '@/components/appointTime.vue';
|
||
export default {
|
||
data() {
|
||
return {
|
||
order_id: '',
|
||
orderInfo: {},
|
||
order_person_time: '',
|
||
pop4Show: false,
|
||
notesText: '',
|
||
signInShow: false
|
||
};
|
||
},
|
||
onShow() {
|
||
this.getOrderDetail();
|
||
},
|
||
onLoad(e) {
|
||
this.order_id = e.id;
|
||
this.getOrderDetail();
|
||
},
|
||
components: {
|
||
appointTime
|
||
},
|
||
methods: {
|
||
toPay(item){
|
||
uni.setStorageSync('orderDetail', item);
|
||
uni.navigateTo({
|
||
url:'/pages/order/pay?id=' + item.id
|
||
})
|
||
},
|
||
signIn(){
|
||
let _this = this;
|
||
let data = {
|
||
status: 3,
|
||
order_id: this.order_id
|
||
}
|
||
uni.getLocation({
|
||
type: 'wgs84',
|
||
geocode: true,
|
||
success: function (res) {
|
||
console.log('当前位置的经度：' + JSON.stringify(res));
|
||
console.log('当前位置的经度：' + res.longitude);
|
||
console.log('当前位置的纬度：' + res.latitude);
|
||
data.checkin_latitude = res.latitude
|
||
data.checkin_longitude = res.longitude
|
||
_this.$api.setorder(data,res=>{
|
||
if(res.code == '1'){
|
||
_this.tabCur = 3;
|
||
// uni.showToast({ title: '签到成功' , icon: 'success' })
|
||
this.signInShow = true;
|
||
setTimeout(()=>{
|
||
this.getOrderDetail()
|
||
},2000)
|
||
}else{
|
||
uni.showToast({ title: res.msg , icon: 'none' })
|
||
}
|
||
})
|
||
}
|
||
});
|
||
/* #ifdef H5 */
|
||
data.checkin_latitude = 32.202905;
|
||
data.checkin_longitude = 118.710193;
|
||
_this.$api.setorder(data,res=>{
|
||
if(res.code == '1'){
|
||
_this.tabCur = 3;
|
||
// uni.showToast({ title: '签到成功' , icon: 'success' })
|
||
this.signInShow = true;
|
||
setTimeout(()=>{
|
||
this.getOrderDetail()
|
||
},2000)
|
||
}else{
|
||
uni.showToast({ title: res.msg , icon: 'none' })
|
||
}
|
||
})
|
||
/* #endif */
|
||
},
|
||
conformChangeOrder(){
|
||
var _this = this;
|
||
_this.$api.reassignOrder({
|
||
order_id: this.order_id,
|
||
reason: this.notesText
|
||
},res=>{
|
||
if(res.code == '1'){
|
||
uni.showToast({ title: res.msg, icon: 'success' })
|
||
setTimeout(function() {
|
||
uni.navigateBack({
|
||
delta: 1
|
||
})
|
||
},2000);
|
||
}else{
|
||
uni.showToast({ title: res.msg, icon: 'none' })
|
||
}
|
||
})
|
||
},
|
||
toNearbyStore() {
|
||
util.openMap(this.orderInfo.accept_address,this.orderInfo.latitude,this.orderInfo.longitude)
|
||
// var url = '';
|
||
// const address = this.orderInfo.accept_address; //地址
|
||
// const latitude = this.orderInfo.latitude;//纬度
|
||
// const longitude = this.orderInfo.longitude;//精度
|
||
|
||
// url = 'geo:' + latitude + ',' + longitude + '?q=' + encodeURIComponent(address);
|
||
// // geo:34.24710702460227,108.90977498072209?q=%E8%A5%BF%E5%AE%89%E5%B8%82%E8%B4%A2%E5%AF%8C%E4%B8%AD%E5%BF%83C%E5%BA%A71002
|
||
// console.log(address,latitude,longitude)
|
||
// if (uni.getSystemInfoSync().platform == 'android') {
|
||
// plus.runtime.openURL(url);
|
||
// } else {
|
||
// plus.nativeUI.actionSheet({title:"选择地图应用",cancel:"取消",buttons:[{title:"Apple地图"},{title:"百度地图"},{title:"高德地图"},{title:"google地图"}]}, function(e){
|
||
// console.log("e.index: " + e.index);
|
||
// switch (e.index){
|
||
// case 1:
|
||
// url = `http://maps.apple.com/?q=${encodeURIComponent(address)}&ll=${latitude},${longitude}&spn=0.008766,0.019441`
|
||
// break;
|
||
// case 2:
|
||
// url = `baidumap://map/marker?location=${latitude},${longitude}&title=DCloud&src=Hello%20uni-app`;
|
||
// break;
|
||
// case 3:
|
||
// url = `iosamap://viewMap?sourceApplication=Hello%20uni-app&poiname=DCloud&lat=${latitude}&lon=${longitude}&dev=0`;
|
||
// break;
|
||
// case 4:
|
||
// url = `comgooglemaps://?q=${encodeURIComponent(address)}¢er=${latitude},${longitude}`;
|
||
// break;
|
||
// plus.runtime.openURL(url, function( e ){
|
||
// plus.nativeUI.alert("未安装此地图");
|
||
// });
|
||
// }
|
||
// })
|
||
// }
|
||
},
|
||
checkTime(val){
|
||
console.log(val,'kkkkkkk')
|
||
let data = {
|
||
status: 2,
|
||
order_id: this.order_id,
|
||
order_person_time: val
|
||
}
|
||
this.$api.setorder(data,res=>{
|
||
if(res.code == '1'){
|
||
uni.showToast({ title: res.msg , icon: 'success' })
|
||
this.order_person_time = val;
|
||
|
||
// this.recycleOrderList()
|
||
setTimeout(()=>{
|
||
// this.menuNum = 2
|
||
this.getOrderDetail()
|
||
},2000)
|
||
}else{
|
||
uni.showToast({ title: res.msg , icon: 'none' })
|
||
}
|
||
})
|
||
},
|
||
deelData(val){
|
||
console.log(val)
|
||
let str = ''
|
||
let index = 1
|
||
for(let key in val){
|
||
console.log(key)
|
||
if(index>1){
|
||
str += ' | ' + key+':'+val[key]
|
||
}else{
|
||
str += key+':'+val[key]
|
||
}
|
||
index++
|
||
}
|
||
console.log(str)
|
||
return str
|
||
},
|
||
selectTime(){
|
||
if(this.orderInfo.status == '1' || this.orderInfo.status == '7' || this.orderInfo.status == '2'){
|
||
this.$refs.timeRef.open()
|
||
}
|
||
},
|
||
callPhone(phoneNumber) {
|
||
uni.makePhoneCall({
|
||
phoneNumber: phoneNumber, // 必需，电话号码字符串
|
||
success: (res) => {
|
||
console.log("拨号成功", res);
|
||
},
|
||
fail: (err) => {
|
||
console.error("拨号失败", err);
|
||
}
|
||
});
|
||
},
|
||
deelData(val){
|
||
console.log(val)
|
||
let str = ''
|
||
let index = 1
|
||
for(let key in val){
|
||
console.log(key)
|
||
if(index>1){
|
||
str += ' | ' + key+':'+val[key]
|
||
}else{
|
||
str += key+':'+val[key]
|
||
}
|
||
index++
|
||
}
|
||
console.log(str)
|
||
return str
|
||
},
|
||
cancelOrder() {
|
||
uni.showModal({
|
||
title:'提示',
|
||
content: '确认要取消订单吗?',
|
||
success:(ret)=>{
|
||
if(ret.confirm){
|
||
let data = {
|
||
id: this.order_id
|
||
}
|
||
this.$api.cancelorder(data, res => {
|
||
if (res.code ==1) {
|
||
uni.showToast({ title: res.msg , icon: 'success' })
|
||
setTimeout(function() {
|
||
uni.navigateBack({
|
||
delta: 1
|
||
})
|
||
},2000);
|
||
} else {
|
||
uni.showToast({ title: res.msg , icon: 'none' })
|
||
}
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
getOrderDetail() {
|
||
let _this = this
|
||
let data = {
|
||
id: _this.order_id
|
||
}
|
||
_this.$api.personorderdetail(data, function(res) {
|
||
if (res.code ==1 ) {
|
||
let data = res.data.info
|
||
_this.orderInfo = data;
|
||
_this.order_person_time = data.order_person_time;
|
||
} else {
|
||
uni.showToast({ title: res.msg , icon: 'none' })
|
||
}
|
||
})
|
||
},
|
||
call(phone){
|
||
uni.makePhoneCall({
|
||
phoneNumber:phone,
|
||
success:function(){
|
||
console.log('拨打电话成功');
|
||
},
|
||
fail() {
|
||
console.log('打电话失败了');
|
||
}
|
||
})
|
||
},
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
page{
|
||
background: #F5F5FA;
|
||
}
|
||
|
||
.news_title{
|
||
border-bottom: 1px solid #eee;
|
||
padding: 20rpx 5%;
|
||
box-sizing: border-box;
|
||
overflow: hidden;
|
||
position: relative;
|
||
width: 100%; }
|
||
.news_title .title{
|
||
color: #333;
|
||
line-height: 50rpx;
|
||
}
|
||
.news_title .time{
|
||
color: #777;
|
||
margin-top: 20rpx;
|
||
}
|
||
.news_title .tag{
|
||
color: #e01f20;
|
||
}
|
||
|
||
|
||
.biaoti{
|
||
color: #777777;
|
||
height: 90rpx;
|
||
line-height: 90rpx;
|
||
margin-top: 20rpx; }
|
||
.biaoti image{width: 35rpx;margin-right: 10rpx; margin-bottom: -6rpx;}
|
||
.main{
|
||
line-height: 60rpx;}
|
||
.main .li{
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
|
||
.line{border:solid 3px #eee}.button-bottom {
|
||
padding: 15upx 26upx;
|
||
text-align: right;
|
||
display: block;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
height: unset;
|
||
}
|
||
.buttonEdit{
|
||
width: 224rpx;
|
||
height: 90rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 45rpx;
|
||
border: 1px solid #FB8F0C;
|
||
font-weight: 500;
|
||
font-size: 30rpx;
|
||
color: #FB8F0C;
|
||
}
|
||
.button-bottom .btn {
|
||
margin-left: 20upx;
|
||
width: 224rpx!important;
|
||
height: 90rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 45rpx;
|
||
border: 1px solid #FB8F0C;
|
||
font-weight: 500;
|
||
font-size: 30rpx;
|
||
color: #FB8F0C;
|
||
flex: unset;
|
||
}
|
||
.ti{width:115px}
|
||
|
||
.topBox{
|
||
width: 100%;
|
||
height: 280rpx;
|
||
background: linear-gradient(0deg, #F5F5FA 0%, #FFF3D5 100%);
|
||
padding: 0 72rpx;
|
||
overflow: hidden;
|
||
}
|
||
.statusText{
|
||
font-weight: bold;
|
||
font-size: 36rpx;
|
||
color: #413A2A;
|
||
margin-top: 52rpx;
|
||
}
|
||
.statusTip{
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #A69879;
|
||
margin-top: 20rpx;
|
||
}
|
||
|
||
|
||
.orderInfoBox{
|
||
padding: 0 35rpx;
|
||
margin-top: -80rpx;
|
||
}
|
||
|
||
.viewBox{
|
||
background: #fff;
|
||
border-radius: 30rpx;
|
||
padding: 35rpx;
|
||
.goodsInfo{
|
||
margin-top: 32rpx;
|
||
background: #FFF9F5;
|
||
border-radius: 20rpx;
|
||
padding: 14rpx 16rpx;
|
||
padding-right: 35rpx;
|
||
.infoLeft{
|
||
.goodsImg{
|
||
width: 80rpx;
|
||
height: 80rpx;
|
||
}
|
||
.text1{
|
||
font-weight: 500;
|
||
font-size: 22rpx;
|
||
color: #333333;
|
||
}
|
||
.text2{
|
||
font-weight: 500;
|
||
font-size: 30rpx;
|
||
color: #333333;
|
||
margin-top: 15rpx;
|
||
}
|
||
}
|
||
.infoCenter{
|
||
.text1{
|
||
font-weight: 500;
|
||
font-size: 22rpx;
|
||
color: #333333;
|
||
}
|
||
.textIcon{
|
||
font-weight: 500;
|
||
font-size: 30rpx;
|
||
color: #333333;
|
||
}
|
||
.textNum{
|
||
font-weight: 500;
|
||
font-size: 30rpx;
|
||
color: #333333;
|
||
margin-left: 7rpx;
|
||
}
|
||
}
|
||
.infoRight{
|
||
.text1{
|
||
font-weight: 500;
|
||
font-size: 22rpx;
|
||
color: #333333;
|
||
text-align: center;
|
||
}
|
||
.textIcon{
|
||
font-weight: 500;
|
||
font-size: 24rpx;
|
||
color: #ED6343;
|
||
}
|
||
.textNum{
|
||
font-weight: 500;
|
||
font-size: 36rpx;
|
||
color: #ED6343;
|
||
margin-left: 7rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.specsBox{
|
||
height: 70rpx;
|
||
background: #FFF7F7;
|
||
border-radius: 20rpx;
|
||
margin-top: 10rpx;
|
||
font-weight: 500;
|
||
font-size: 22rpx;
|
||
color: #333333;
|
||
// display: flex;
|
||
// flex-direction: row;
|
||
// justify-content: flex-start;
|
||
// align-items: center;
|
||
padding-left: 33rpx;
|
||
padding-right: 25rpx;
|
||
.specsText{
|
||
font-weight: 500;
|
||
font-size: 22rpx;
|
||
color: #333333;
|
||
margin-right: 18rpx;
|
||
margin-top: -5rpx;
|
||
}
|
||
.updateBtn{
|
||
width: 91rpx;
|
||
height: 51rpx;
|
||
line-height: 51rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 26rpx;
|
||
font-weight: 500;
|
||
font-size: 22rpx;
|
||
color: #FF8E3B;
|
||
text-align: center;
|
||
}
|
||
}
|
||
.countBox{
|
||
display: flex;
|
||
justify-content: flex-start;
|
||
// align-items: flex-end;
|
||
align-items: center;
|
||
margin-top: 15rpx;
|
||
padding-left: 10rpx;
|
||
.text1{
|
||
font-weight: 500;
|
||
font-size: 22rpx;
|
||
color: #333333;
|
||
text-align: center;
|
||
margin-right: 14rpx;
|
||
margin-top: 7rpx;
|
||
}
|
||
.textIcon{
|
||
font-weight: 500;
|
||
font-size: 24rpx;
|
||
color: #ED6343;
|
||
}
|
||
.textNum{
|
||
font-weight: 500;
|
||
font-size: 36rpx;
|
||
color: #ED6343;
|
||
margin-left: 7rpx;
|
||
}
|
||
}
|
||
.infoWrap{
|
||
.bgHead{
|
||
height: 108rpx;
|
||
line-height: 108rpx;
|
||
background: linear-gradient(180deg, #FFFAF5 0%, #FFFFFF 100%);
|
||
border-radius: 30rpx 30rpx 0rpx 0rpx;
|
||
padding-left: 41rpx;
|
||
font-weight: bold;
|
||
font-size: 30rpx;
|
||
color: #333333;
|
||
.infoTip2{
|
||
font-weight: 400;
|
||
font-size: 22rpx;
|
||
color: #FF7F18;
|
||
margin-left: 38rpx;
|
||
}
|
||
}
|
||
.infoBox{
|
||
padding: 0 39rpx 45rpx;
|
||
margin-top: -5rpx;
|
||
.infoText1{
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #333333;
|
||
}
|
||
.infoText2{
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #333333;
|
||
margin-left: 28rpx;
|
||
}
|
||
.infoAddress{
|
||
font-weight: 300;
|
||
font-size: 22rpx;
|
||
color: #95979B;
|
||
// font-weight: 300;
|
||
// font-size: 28rpx;
|
||
// color: #95979B;
|
||
// margin-top: 30rpx;
|
||
}
|
||
.infoTip{
|
||
font-weight: 400;
|
||
font-size: 22rpx;
|
||
color: #E4AA45;
|
||
margin-top: 12rpx;
|
||
border-bottom: 1px solid #DEDEDE;
|
||
padding-bottom: 29rpx;
|
||
}
|
||
.infoDate{
|
||
font-weight: 400;
|
||
font-size: 32rpx;
|
||
color: #999999;
|
||
}
|
||
.infoTip3{
|
||
background: #FFF4ED;
|
||
border-radius: 10rpx;
|
||
font-weight: 400;
|
||
font-size: 22rpx;
|
||
color: #FF7F18;
|
||
padding: 16rpx 11rpx;
|
||
}
|
||
.infoBtnBox{
|
||
font-weight: 400;
|
||
font-size: 32rpx;
|
||
color: #333333;
|
||
margin-top: 41rpx;
|
||
}
|
||
}
|
||
}
|
||
.detailBox{
|
||
padding: 45rpx 37rpx 60rpx;
|
||
border-radius: 30rpx;
|
||
background: #fff;
|
||
margin-top: 20rpx;
|
||
font-weight: bold;
|
||
font-size: 30rpx;
|
||
color: #333333;
|
||
.detailText{
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #333333;
|
||
margin-top: 41rpx;
|
||
}
|
||
}
|
||
.funBtnBox{
|
||
padding-bottom: 45rpx;
|
||
.leftBtn{
|
||
height: 58rpx;
|
||
width: 50%;
|
||
border-right: 1rpx solid #B0B0B0;;
|
||
}
|
||
.rightBtn{
|
||
height: 58rpx;
|
||
width: 50%;
|
||
}
|
||
.btnIcon{
|
||
width: 33rpx;
|
||
height: 33rpx;
|
||
margin-right: 15rpx;
|
||
}
|
||
}
|
||
.toDoorDate{
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #999999;
|
||
margin-top: 40rpx;
|
||
}
|
||
.recordLable{
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #333333;
|
||
margin-right: 30rpx;
|
||
}
|
||
.infoDate2{
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #FF7F18;
|
||
}
|
||
.infoDate3{
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #333333;
|
||
}
|
||
.updateLable{
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #333333;
|
||
margin-right: 15rpx;
|
||
}
|
||
.buttonType2{
|
||
width: 224rpx;
|
||
height: 90rpx;
|
||
background: linear-gradient(45deg, #FFAD38 0%, #FF9023 100%);
|
||
border-radius: 45rpx;
|
||
font-weight: 500;
|
||
font-size: 30rpx;
|
||
color: #FFFFFF;
|
||
margin-left: 24rpx;
|
||
}
|
||
.tipBox{
|
||
position: absolute;
|
||
left: 0;
|
||
height: 60rpx;
|
||
width: 100%;
|
||
text-align: left;
|
||
line-height: 60rpx;
|
||
// bottom: 100rpx;
|
||
padding-left: 56rpx;
|
||
top: -60rpx;
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #FF8C27;
|
||
background: #FFF8F3;
|
||
}
|
||
.pop4Box{
|
||
width: 640rpx;
|
||
height: 480rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 30rpx;
|
||
.pop4Title{
|
||
font-weight: bold;
|
||
font-size: 36rpx;
|
||
color: #000000;
|
||
}
|
||
.pop4Input{
|
||
width: 560rpx;
|
||
height: 173rpx;
|
||
background: #EFEFEF;
|
||
border-radius: 7rpx;
|
||
margin: 29rpx auto 0;
|
||
}
|
||
.pop4Btn1{
|
||
width: 260rpx;
|
||
height: 80rpx;
|
||
line-height: 80rpx;
|
||
background: #F6F6F6;
|
||
border-radius: 40rpx;
|
||
font-weight: 500;
|
||
font-size: 28rpx;
|
||
color: #333333;
|
||
text-align: center;
|
||
}
|
||
.pop4Btn2{
|
||
width: 260rpx;
|
||
height: 80rpx;
|
||
line-height: 80rpx;
|
||
background: #FB7D06;
|
||
border-radius: 40rpx;
|
||
font-weight: 500;
|
||
font-size: 28rpx;
|
||
color: #fff;
|
||
text-align: center;
|
||
margin-left: 20rpx;
|
||
}
|
||
}
|
||
.popBoxOne{
|
||
width: 520rpx;
|
||
height: 620rpx;
|
||
background: linear-gradient(0deg, #FFFFFF 0%, #FFF3EA 100%);
|
||
border-radius: 30rpx;
|
||
position: relative;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: flex-start;
|
||
align-items: center;
|
||
.popOneImg{
|
||
width: 429rpx;
|
||
height: 429rpx;
|
||
position: absolute;
|
||
top: -182rpx;
|
||
left: 0;
|
||
right: 0;
|
||
margin: 0 auto;
|
||
}
|
||
.popOneText1{
|
||
font-weight: bold;
|
||
font-size: 36rpx;
|
||
color: #181622;
|
||
margin-top: 205rpx;
|
||
}
|
||
.popOneText2{
|
||
font-weight: 500;
|
||
font-size: 26rpx;
|
||
color: #181622;
|
||
margin-top: 26rpx;
|
||
}
|
||
.popOneText3{
|
||
font-weight: 500;
|
||
font-size: 26rpx;
|
||
color: #181622;
|
||
}
|
||
.popOneBtn{
|
||
width: 260rpx;
|
||
height: 90rpx;
|
||
background: #FB8F0C;
|
||
border-radius: 45rpx;
|
||
font-weight: 500;
|
||
font-size: 28rpx;
|
||
color: #FFFFFF;
|
||
margin-top: 72rpx;
|
||
}
|
||
}
|
||
</style>
|