2023-11-18 10:47:46 +08:00
|
|
|
|
<template>
|
2023-12-02 15:29:39 +08:00
|
|
|
|
<view >
|
2023-11-18 10:47:46 +08:00
|
|
|
|
|
|
|
|
|
<view class="content-top-con">
|
|
|
|
|
<view class="content-img" @click="returnlog">
|
|
|
|
|
<image src="@/static/images/xiangyou.png" mode=""></image>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
<view class="">
|
|
|
|
|
订单信息
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="container-content">
|
|
|
|
|
<view class="container-content-left">
|
|
|
|
|
<view class="content-left-one">
|
|
|
|
|
<!-- <view ref="mapContainer" class="map-container"></view> -->
|
|
|
|
|
<!-- <map :latitude="latitude" :longitude="longitude" show-location class="map-container" scale='12'
|
|
|
|
|
:polyline="polyline" :markers='markers'><cover-image class="map_btn" @tap="getoption()"
|
|
|
|
|
src="@/static/images/DH.png">
|
|
|
|
|
</cover-image></map> -->
|
2023-11-28 08:59:04 +08:00
|
|
|
|
<a-map-walking :startPoint="startPoint" :endPoint="endPoint" @sbai='onshibai'
|
2023-11-18 10:47:46 +08:00
|
|
|
|
style="width: 100%;height: 265rpx;"></a-map-walking>
|
|
|
|
|
<view class="walking-img">
|
|
|
|
|
<image src="@/static/images/DH.png" mode="aspectFit" @click="getoption()"></image>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="left1" v-if="lisobj.logistics">
|
|
|
|
|
<view class="leftdd"></view>
|
|
|
|
|
<view class="leftdd1">起点:{{lisobj.logistics.shop_address}}</view>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
<view class="left1" v-if="lisobj.logistics">
|
|
|
|
|
<view class="leftdd2"></view>
|
|
|
|
|
<view class="leftdd1">终点:{{lisobj.logistics.receiver_address}}</view>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
2023-11-28 08:59:04 +08:00
|
|
|
|
<view class="btn" @click="openCamera(lisobj.logistics)" v-if="lisobj.logistics">
|
2023-11-18 10:47:46 +08:00
|
|
|
|
<view class="btn1">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<image src="@/static/images/er.png" mode=""></image>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="btn2"> 扫码取货</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<scroll-view scroll-y="true" style="height: 400rpx;overflow: hidden;">
|
|
|
|
|
<view class="">
|
|
|
|
|
<view class="container-content-right" v-if="lisobj.logistics">
|
|
|
|
|
<view class="content-right-two" v-if="lisobj.logistics">
|
|
|
|
|
<view class="two-lefta">
|
|
|
|
|
订单号信息:
|
|
|
|
|
</view>
|
|
|
|
|
<view class="two-leftb">
|
|
|
|
|
订单编号:{{lisobj.logistics.order_sn}}
|
|
|
|
|
</view>
|
|
|
|
|
<view class="two-leftb">
|
|
|
|
|
商户名称:{{lisobj.logistics.shop_name}}
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
<view class="two-leftb">
|
|
|
|
|
店铺地址:{{lisobj.logistics.shop_address}}
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
<view class="two-leftb">
|
|
|
|
|
联系电话:{{lisobj.logistics.shop_phone }}
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
<view class="content-one">
|
|
|
|
|
|
|
|
|
|
<view class="content-one-con">
|
|
|
|
|
<view style="margin-bottom: 10rpx;">物流信息:</view>
|
|
|
|
|
<view>用户名称:{{lisobj.logistics.receiver_name}}</view>
|
|
|
|
|
<view>联系方式:{{lisobj.logistics.receiver_phone}}</view>
|
|
|
|
|
<view>联系地址:{{lisobj.logistics.receiver_address}}</view>
|
|
|
|
|
<view>下单时间:{{lisobj.logistics.create_time}}</view>
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
<view class="container-content-right" v-if="lisobj.logistics">
|
|
|
|
|
|
|
|
|
|
<view class="content-one">
|
|
|
|
|
|
|
|
|
|
<view class="shop-content">
|
|
|
|
|
<view class="shop-content-a">
|
|
|
|
|
<view class="shop-content-a1">商品信息:</view>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
<view class="shop-list">
|
|
|
|
|
|
|
|
|
|
<view class="shop" v-for="(items,j) in lisobj.product" :key="j">
|
|
|
|
|
<view style="display: flex;">
|
|
|
|
|
<view class="shop-img">
|
|
|
|
|
<image :src="items.goods_pic" mode="aspectFit"></image>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="container-txt">
|
|
|
|
|
<text class=" centered-multi-line shop-txt">
|
|
|
|
|
{{ items.goods_name }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view style="line-height: 34rpx;">X{{ items.product_num}}</view>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
<view class="shop-botxt">
|
|
|
|
|
请详细核对订单信息。 <text
|
|
|
|
|
style="margin-left: 50rpx;color: #0022C7;">共计:{{ lisobj.product.length }}件</text>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
</scroll-view>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import {
|
|
|
|
|
detail,
|
2023-11-28 08:59:04 +08:00
|
|
|
|
takeGoods
|
2023-11-18 10:47:46 +08:00
|
|
|
|
} from '@/api/oa.js'
|
|
|
|
|
const ttAMapNavi = uni.requireNativePlugin('TT-AMapNavi');
|
|
|
|
|
import AMapWalking from "@/components/a-map-walking.vue";
|
|
|
|
|
export default {
|
|
|
|
|
props: {
|
|
|
|
|
type: ''
|
|
|
|
|
},
|
|
|
|
|
components: {
|
|
|
|
|
AMapWalking
|
|
|
|
|
},
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
|
|
|
|
|
lisobj: [],
|
|
|
|
|
page_no: 1,
|
|
|
|
|
page_size: 1,
|
|
|
|
|
keyword: '',
|
|
|
|
|
latitude: 39.90469,
|
|
|
|
|
longitude: 116.40717,
|
|
|
|
|
// 标记点
|
|
|
|
|
|
|
|
|
|
// markers: [ // 商家
|
|
|
|
|
// {
|
|
|
|
|
// id: 1,
|
|
|
|
|
// latitude: undefined,
|
|
|
|
|
// longitude: undefined,
|
|
|
|
|
// width: 30,
|
|
|
|
|
// height: 30,
|
|
|
|
|
// iconPath: '../../static/img/logistics/SJ.png', //显示的图标
|
|
|
|
|
// },
|
|
|
|
|
// // 骑手
|
|
|
|
|
// {
|
|
|
|
|
// id: 2,
|
|
|
|
|
// latitude: undefined,
|
|
|
|
|
// longitude: undefined,
|
|
|
|
|
// width: 30,
|
|
|
|
|
// height: 30,
|
|
|
|
|
// iconPath: '../../static/img/logistics/QS.png', //显示的图标
|
|
|
|
|
// }
|
|
|
|
|
// ],
|
|
|
|
|
startPoint: [],
|
|
|
|
|
endPoint: [],
|
|
|
|
|
// // 路线数据
|
|
|
|
|
// polyline: [{
|
|
|
|
|
// points: [],
|
|
|
|
|
// color: "#FF0000DD",
|
|
|
|
|
// width: 3
|
|
|
|
|
// }]
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
mounted() {
|
2023-12-02 15:29:39 +08:00
|
|
|
|
|
2023-11-18 10:47:46 +08:00
|
|
|
|
this.getlist(this.type)
|
|
|
|
|
this.getLocation()
|
|
|
|
|
|
|
|
|
|
|
2023-11-28 08:59:04 +08:00
|
|
|
|
// this.$refs.globalPopup.open()
|
2023-11-18 10:47:46 +08:00
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
methods: {
|
|
|
|
|
|
2023-11-28 08:59:04 +08:00
|
|
|
|
//返回
|
2023-11-18 10:47:46 +08:00
|
|
|
|
returnlog() {
|
|
|
|
|
|
|
|
|
|
this.$emit('outfun', '1')
|
|
|
|
|
},
|
|
|
|
|
mapUpdated(e) {
|
|
|
|
|
console.log('Map updated:', e);
|
|
|
|
|
// 在地图更新后,可以根据用户选择的起点和终点,调用地图服务的规划路线接口,获取路线数据并更新polyline和markers
|
|
|
|
|
},
|
2023-11-28 08:59:04 +08:00
|
|
|
|
//监听失败
|
|
|
|
|
onshibai(e) {
|
|
|
|
|
if (e == 1) {
|
|
|
|
|
uni.showToast({
|
|
|
|
|
title: '路线规划失败',
|
|
|
|
|
icon: none
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
2023-11-18 10:47:46 +08:00
|
|
|
|
|
|
|
|
|
//导航
|
|
|
|
|
getoption() {
|
|
|
|
|
|
|
|
|
|
// 传入高德地图key
|
|
|
|
|
ttAMapNavi.initParams({
|
|
|
|
|
androidKey: 'bbf571cadf2782f69f0eb373d516b4e0',
|
|
|
|
|
iOSKey: ''
|
|
|
|
|
});
|
|
|
|
|
// 开始导航,传入的坐标均为高德坐标系
|
|
|
|
|
ttAMapNavi.startNavi({
|
|
|
|
|
// 起点(只支持传入一个),选填,不传使用当前位置
|
|
|
|
|
startPoints: [{
|
|
|
|
|
name: '起点名称',
|
|
|
|
|
latitude: this.startPoint[1],
|
|
|
|
|
longitude: this.startPoint[0]
|
|
|
|
|
}],
|
|
|
|
|
// 终点(只支持传入一个)
|
|
|
|
|
endPoints: [{
|
|
|
|
|
name: '终点名称',
|
2023-11-28 08:59:04 +08:00
|
|
|
|
latitude: this.endPoint[1],
|
2023-11-18 10:47:46 +08:00
|
|
|
|
longitude: this.endPoint[0]
|
|
|
|
|
}],
|
|
|
|
|
// 途径点(最多支持三个),选填
|
|
|
|
|
wayPoints: [],
|
|
|
|
|
// 驾车路径规划策略
|
|
|
|
|
drivingStrategy: 10,
|
|
|
|
|
// 是否直接进入导航界面(跳过路径规划页面)
|
|
|
|
|
naviDirectly: true,
|
|
|
|
|
// 导航组件的主题皮肤类型
|
|
|
|
|
themeType: 1
|
|
|
|
|
});
|
2023-11-28 08:59:04 +08:00
|
|
|
|
|
2023-11-18 10:47:46 +08:00
|
|
|
|
// uni.navigateTo({
|
|
|
|
|
// url: '/pages/submap/index?task_id=' + this.type
|
|
|
|
|
// })
|
|
|
|
|
|
|
|
|
|
// console.log(this.lisobj.logistics.shop_lat, this.lisobj.logistics.shop_long)
|
|
|
|
|
// if (this.lisobj.logistics.shop_lat && this.lisobj.logistics.shop_long) {
|
|
|
|
|
|
|
|
|
|
// uni.openLocation({
|
|
|
|
|
// latitude: Number(this.lisobj.logistics.shop_lat),
|
|
|
|
|
// // 传入你要去的经度
|
|
|
|
|
// longitude: Number(this.lisobj.logistics.shop_long),
|
|
|
|
|
// address: this.lisobj.logistics.receiver_address,
|
|
|
|
|
// success: function() {
|
|
|
|
|
// console.log('success');
|
|
|
|
|
// }
|
|
|
|
|
// })
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
// uni.openLocation({
|
|
|
|
|
// latitude: Number(this.lisobj.logistics.shop_lat),
|
|
|
|
|
// // 传入你要去的经度
|
|
|
|
|
// longitude: Number(this.lisobj.logistics.shop_long),
|
|
|
|
|
// address: this.lisobj.logistics.receiver_address,
|
|
|
|
|
// success: function() {
|
|
|
|
|
// console.log('success');
|
|
|
|
|
// }
|
|
|
|
|
// })
|
|
|
|
|
|
|
|
|
|
// let that = this;
|
|
|
|
|
// uni.getSystemInfo({
|
|
|
|
|
// success(e) {
|
|
|
|
|
// if (e.platform === 'ios') {
|
|
|
|
|
// Toast('暂不支持唤起地图')
|
|
|
|
|
// } else {
|
|
|
|
|
// plus.nativeUI.actionSheet({
|
|
|
|
|
// title: "选择地图应用",
|
|
|
|
|
// cancel: "取消",
|
|
|
|
|
// buttons: [{
|
|
|
|
|
// title: "高德地图"
|
|
|
|
|
// }]
|
|
|
|
|
// }, function(e) {
|
|
|
|
|
// if (e.index != 1) return;
|
|
|
|
|
// try {
|
|
|
|
|
// var packageName = 'com.autonavi.minimap';
|
|
|
|
|
// var main = plus.android.runtimeMainActivity();
|
|
|
|
|
// var packageManager = main.getPackageManager();
|
|
|
|
|
// var PackageManager = plus.android.importClass(packageManager)
|
|
|
|
|
// var packageInfo = packageManager.getPackageInfo(packageName,
|
|
|
|
|
// PackageManager.GET_ACTIVITIES);
|
|
|
|
|
// if (packageInfo) {
|
|
|
|
|
// var Uri = plus.android.importClass("android.net.Uri");
|
|
|
|
|
// var url =
|
|
|
|
|
// `amapuri://route/plan?sourceApplication=maxuslife+
|
|
|
|
|
// &sid=A&slat=36.702558&slon=116.876678&sname=我的位置&did=B&dlat=${that.markers[that.markers.length-1].latitude}&dlon=${that.markers[that.markers.length-1].longitude}&dname=${that.lisobj.logistics.shop_name}&dev=0&t=0`;
|
|
|
|
|
// var Intent = plus.android.importClass('android.content.Intent');
|
|
|
|
|
// var intent = new Intent();
|
|
|
|
|
// intent.setAction(Intent.ACTION_VIEW);
|
|
|
|
|
// intent.addCategory(Intent.CATEGORY_DEFAULT);
|
|
|
|
|
// var uri = Uri.parse(url);
|
|
|
|
|
// //将功能Scheme以URI的方式传入data
|
|
|
|
|
// intent.setData(uri);
|
|
|
|
|
// intent.setPackage("com.autonavi.minimap");
|
|
|
|
|
// var main = plus.android.runtimeMainActivity();
|
|
|
|
|
// main.startActivity(intent);
|
|
|
|
|
// } else {
|
|
|
|
|
// // alert('未安装' + packageName + '')
|
|
|
|
|
// uni.showToast({
|
|
|
|
|
// title: `您的手机没有安装高德地图`,
|
|
|
|
|
// icon: 'none'
|
|
|
|
|
// })
|
|
|
|
|
// }
|
|
|
|
|
// console.log("唤醒高德线路规划")
|
|
|
|
|
// } catch (e) {
|
|
|
|
|
// console.log(e);
|
|
|
|
|
// Toast('启动出错')
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
// });
|
|
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
// })
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
//获取定位
|
2023-11-28 08:59:04 +08:00
|
|
|
|
async getLocation() {
|
2023-11-18 10:47:46 +08:00
|
|
|
|
|
|
|
|
|
uni.getLocation({
|
|
|
|
|
type: 'gcj02',
|
|
|
|
|
timeout: '1000',
|
|
|
|
|
success: (res) => {
|
|
|
|
|
this.latitude = res.latitude
|
|
|
|
|
this.longitude = res.longitude
|
|
|
|
|
// this.markers.unshift({
|
|
|
|
|
// latitude: Number(res.latitude),
|
|
|
|
|
// longitude: Number(res.longitude),
|
|
|
|
|
// iconPath: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/attach/zhongdian.png', // 起点图标路径
|
|
|
|
|
// width: 30,
|
|
|
|
|
// height: 30
|
|
|
|
|
// })
|
|
|
|
|
this.startPoint = [Number(res.longitude), Number(res.latitude)]
|
|
|
|
|
// this.markers[0].latitude = Number(res.latitude)
|
|
|
|
|
// this.markers[0].longitude = Number(res.longitude)
|
|
|
|
|
// this.polyline[0].points.unshift({
|
|
|
|
|
// latitude: Number(res.latitude),
|
|
|
|
|
// longitude: Number(res.longitude),
|
|
|
|
|
// })
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
fail: (res) => {
|
|
|
|
|
console.log(res)
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
//提取商品
|
|
|
|
|
getDocumentListApi(item, oredr) {
|
|
|
|
|
|
|
|
|
|
let data = {
|
|
|
|
|
id: item.id,
|
|
|
|
|
order_id: item.order_id,
|
|
|
|
|
order_sn: oredr
|
|
|
|
|
}
|
|
|
|
|
|
2023-12-02 15:29:39 +08:00
|
|
|
|
|
2023-11-28 08:59:04 +08:00
|
|
|
|
|
2023-11-18 10:47:46 +08:00
|
|
|
|
takeGoods(data).then(res => {
|
|
|
|
|
|
|
|
|
|
// Toast(res.msg)
|
|
|
|
|
if (res.code == 1) {
|
2023-12-02 15:29:39 +08:00
|
|
|
|
|
2023-11-18 10:47:46 +08:00
|
|
|
|
const subNVue = uni.getSubNVueById('concat'); // 通过 id 获取 nvue 子窗体
|
2023-11-28 08:59:04 +08:00
|
|
|
|
subNVue.show('none', 1000); // 打开 nvue 子窗体
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.$emit('outfun', '1')
|
|
|
|
|
}, 1500)
|
2023-11-18 10:47:46 +08:00
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
// 打开相机
|
|
|
|
|
openCamera(item) {
|
|
|
|
|
console.log(item)
|
|
|
|
|
uni.scanCode({
|
|
|
|
|
success: (res) => {
|
|
|
|
|
this.getDocumentListApi(item, res.result)
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
resultsaoma() {
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
async getlist(id) {
|
|
|
|
|
detail({
|
|
|
|
|
id: id
|
|
|
|
|
}).then(res => {
|
|
|
|
|
|
|
|
|
|
if (res.code == 1) {
|
|
|
|
|
this.lisobj = res.data
|
|
|
|
|
|
|
|
|
|
if (res.data.logistics.shop_lat || res.data.logistics.shop_long) {
|
|
|
|
|
|
|
|
|
|
// this.markers[1].latitude = Number(res.data.logistics.shop_lat)
|
|
|
|
|
// this.markers[1].longitude = Number(res.data.logistics.shop_long)
|
|
|
|
|
// this.polyline[0].points.push({
|
|
|
|
|
// latitude: res.data.logistics.shop_lat,
|
|
|
|
|
// longitude: res.data.logistics.shop_long,
|
|
|
|
|
// })
|
|
|
|
|
this.endPoint = [Number(res.data.logistics.shop_long), Number(res.data.logistics
|
|
|
|
|
.shop_lat)]
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
.content-top-con {
|
|
|
|
|
display: flex;
|
|
|
|
|
height: 35rpx;
|
|
|
|
|
line-height: 35rpx;
|
|
|
|
|
width: 100%;
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
border-radius: 9px 9px 9px 9px;
|
|
|
|
|
font-size: 13rpx;
|
|
|
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
color: #333333;
|
2023-12-02 15:29:39 +08:00
|
|
|
|
margin-top: 10rpx;
|
2023-11-18 10:47:46 +08:00
|
|
|
|
|
|
|
|
|
.content-img {
|
|
|
|
|
width: 22rpx;
|
|
|
|
|
height: 22rpx;
|
|
|
|
|
margin: auto 0;
|
|
|
|
|
margin-right: 5rpx;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
image {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.popup-content {
|
|
|
|
|
width: 308rpx;
|
|
|
|
|
height: 220rpx;
|
|
|
|
|
/* 根据需要调整弹窗内容的宽度 */
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
/* 设置弹窗内容的背景色 */
|
|
|
|
|
padding-top: 30rpx;
|
|
|
|
|
/* 根据需要设置内边距 */
|
|
|
|
|
border-radius: 9rpx 9rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.popup-content-a {
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center;
|
|
|
|
|
/* 水平居中 */
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.popup-item {
|
|
|
|
|
font-size: 13rpx;
|
|
|
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
color: #0022C7;
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
/* 可根据需要调整项之间的间距 */
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.container-top {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
border-radius: 24rpx 24rpx;
|
|
|
|
|
|
|
|
|
|
.serch {
|
|
|
|
|
width: 59rpx;
|
|
|
|
|
height: 31rpx;
|
|
|
|
|
line-height: 31rpx;
|
|
|
|
|
border-radius: 15rpx 15rpx;
|
|
|
|
|
opacity: 1;
|
|
|
|
|
border: 1px solid #0022c7;
|
|
|
|
|
text-align: center;
|
|
|
|
|
font-size: 12rpx;
|
|
|
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
color: #0022c7;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.container-content {
|
|
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
position: relative;
|
2023-12-02 15:29:39 +08:00
|
|
|
|
padding-top: 10rpx;
|
2023-11-18 10:47:46 +08:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.container-content-left {
|
|
|
|
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.content-left-one {
|
|
|
|
|
|
|
|
|
|
width: 276rpx;
|
|
|
|
|
height: 330rpx;
|
|
|
|
|
background: #ffffff;
|
|
|
|
|
box-shadow: 0px 3px 6px 1px rgba(0, 0, 0, 0.16);
|
|
|
|
|
border-radius: 15rpx 15rpx 15rpx 15rpx;
|
2023-12-02 15:29:39 +08:00
|
|
|
|
|
2023-11-18 10:47:46 +08:00
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
.walking-img {
|
|
|
|
|
width: 60rpx;
|
|
|
|
|
height: 60rpx;
|
|
|
|
|
position: absolute;
|
|
|
|
|
bottom: 80rpx;
|
|
|
|
|
right: 20rpx;
|
|
|
|
|
|
|
|
|
|
image {
|
|
|
|
|
width: 60rpx;
|
|
|
|
|
height: 60rpx;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.left1 {
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
|
|
font-size: 12rpx;
|
|
|
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
|
|
|
|
.leftdd {
|
|
|
|
|
width: 12rpx;
|
|
|
|
|
height: 12rpx;
|
|
|
|
|
background: #40bc5e;
|
|
|
|
|
border-radius: 50%;
|
|
|
|
|
opacity: 1;
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
margin-right: 10rpx;
|
|
|
|
|
margin-top: 5rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.leftdd2 {
|
|
|
|
|
width: 12rpx;
|
|
|
|
|
height: 12rpx;
|
|
|
|
|
background: #fe7d32;
|
|
|
|
|
border-radius: 50%;
|
|
|
|
|
opacity: 1;
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
margin-right: 10rpx;
|
|
|
|
|
margin-top: 5rpx;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.map-container {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 254rpx;
|
|
|
|
|
border-radius: 15rpx 15rpx 0 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.content-right-two {
|
|
|
|
|
width: 256rpx;
|
|
|
|
|
|
|
|
|
|
background: #ff7c32;
|
|
|
|
|
border-radius: 12rpx 12rpx;
|
|
|
|
|
margin-left: 20rpx;
|
|
|
|
|
padding-top: 10rpx;
|
|
|
|
|
padding-bottom: 10rpx;
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
.two-lefta {
|
|
|
|
|
padding-left: 18rpx;
|
|
|
|
|
|
|
|
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
color: #FFFFFF;
|
|
|
|
|
font-size: 12rpx;
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.two-leftb {
|
|
|
|
|
padding-left: 18rpx;
|
|
|
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
color: #FFFFFF;
|
|
|
|
|
font-size: 12rpx;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
2023-12-02 15:29:39 +08:00
|
|
|
|
.container-content-right {}
|
2023-11-18 10:47:46 +08:00
|
|
|
|
|
|
|
|
|
.map_btn {
|
|
|
|
|
width: 50px;
|
|
|
|
|
height: 50px;
|
|
|
|
|
position: absolute;
|
|
|
|
|
bottom: 0px;
|
|
|
|
|
right: 0;
|
|
|
|
|
z-index: 9999999;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.content-one {
|
|
|
|
|
margin-left: 20rpx;
|
|
|
|
|
width: 256rpx;
|
|
|
|
|
|
|
|
|
|
background: #ffffff;
|
|
|
|
|
box-shadow: 0px 3px 6px 1px rgba(51, 51, 51, 0.2);
|
|
|
|
|
border-radius: 12px 12px 12px 12px;
|
|
|
|
|
opacity: 1;
|
|
|
|
|
margin-top: 10rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.content-one-title {
|
|
|
|
|
height: 53rpx;
|
|
|
|
|
line-height: 53rpx;
|
|
|
|
|
padding-left: 20rpx;
|
|
|
|
|
background: #0022c7;
|
|
|
|
|
border-radius: 12px 12px 0px 0px;
|
|
|
|
|
font-size: 13rpx;
|
|
|
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
color: #ffffff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.content-one-con {
|
|
|
|
|
border-radius: 12px 12px 12px 12px;
|
|
|
|
|
background: #46BE61;
|
|
|
|
|
padding-left: 20rpx;
|
|
|
|
|
padding-right: 20rpx;
|
|
|
|
|
padding-bottom: 10rpx;
|
|
|
|
|
padding-top: 10rpx;
|
|
|
|
|
font-size: 12rpx;
|
|
|
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
color: #ffffff;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
view {}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.shop-content {
|
|
|
|
|
|
|
|
|
|
padding-left: 20rpx;
|
|
|
|
|
padding-right: 20rpx;
|
|
|
|
|
padding-top: 10rpx;
|
|
|
|
|
background-color: #40bc5e;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.shop-content-a {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.shop-content-a1 {
|
|
|
|
|
font-size: 12rpx;
|
|
|
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
color: #fff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.shop-content-a2 {
|
|
|
|
|
font-size: 12rpx;
|
|
|
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
color: #0022C7;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.shop-list {
|
|
|
|
|
padding-bottom: 10rpx;
|
|
|
|
|
padding-top: 10rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.shop {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
font-size: 10rpx;
|
|
|
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.shop-img {
|
|
|
|
|
width: 34rpx;
|
|
|
|
|
height: 34rpx;
|
|
|
|
|
|
|
|
|
|
border-radius: 6px 6px 6px 6px;
|
|
|
|
|
|
|
|
|
|
image {
|
|
|
|
|
width: 34rpx;
|
|
|
|
|
height: 34rpx;
|
|
|
|
|
border-radius: 6px 6px 6px 6px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.container-txt {
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
width: 130rpx;
|
|
|
|
|
/* 设置容器高度 */
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
/* 水平居中 */
|
|
|
|
|
align-items: center;
|
|
|
|
|
/* 垂直居中 */
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.centered-multi-line {
|
|
|
|
|
text-align: left;
|
|
|
|
|
/* 文本水平居中 */
|
|
|
|
|
width: 100%;
|
|
|
|
|
/* 宽度占满父容器 */
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.shop-txt {
|
|
|
|
|
display: inline-block;
|
|
|
|
|
/* 转换为行内块元素 */
|
|
|
|
|
white-space: normal;
|
|
|
|
|
/* 允许自动换行 */
|
|
|
|
|
word-break: break-all;
|
|
|
|
|
/* 单词内断行 */
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.shop-botxt {
|
|
|
|
|
font-size: 12rpx;
|
|
|
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
color: #737373;
|
|
|
|
|
padding-left: 18rpx;
|
|
|
|
|
padding-top: 5rpx;
|
|
|
|
|
padding-bottom: 5rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.btn {
|
|
|
|
|
width: 276rpx;
|
|
|
|
|
height: 44rpx;
|
|
|
|
|
line-height: 44rpx;
|
|
|
|
|
background: #0022c7;
|
|
|
|
|
border-radius: 23rpx 23rpx;
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.btn1 image {
|
|
|
|
|
width: 23rpx;
|
|
|
|
|
height: 23rpx;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.btn2 {
|
|
|
|
|
font-size: 12rpx;
|
|
|
|
|
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
color: #ffffff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.btn1 {
|
|
|
|
|
width: 23rpx;
|
|
|
|
|
height: 23rpx;
|
2023-11-28 08:59:04 +08:00
|
|
|
|
margin-left: 100rpx;
|
2023-11-18 10:47:46 +08:00
|
|
|
|
margin-top: 0rpx;
|
|
|
|
|
margin-right: 10rpx;
|
|
|
|
|
}
|
|
|
|
|
</style>
|