742 lines
20 KiB
Vue
742 lines
20 KiB
Vue
|
<template>
|
|||
|
|
<view class="content">
|
|||
|
|
<view class="head">
|
|||
|
|
<view class="head-title">
|
|||
|
|
<view style="display: flex;font-size: 28rpx;" @click="toMap" v-if="userCity != null">
|
|||
|
|
{{userCity}}
|
|||
|
|
<u-icon name="arrow-down" color="#101010" size="12" style="display: inline;"></u-icon>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="head-type" style="position:absolute;right:0px;" v-if="$store.state.token">
|
|||
|
|
<rudon-rowMenuDotDotDot style="color: #000;" :localdata="dropList" @change="dropAction($event)">
|
|||
|
|
<text class="mall-filter-text">{{ dropName }}</text>
|
|||
|
|
<u-icon name="arrow-down" color="#101010" size="12"></u-icon>
|
|||
|
|
</rudon-rowMenuDotDotDot>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="head">
|
|||
|
|
<view class="head-title">
|
|||
|
|
<view class="title-left">
|
|||
|
|
<view class="icon"></view>
|
|||
|
|
<view class="name">设备场所</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="list">
|
|||
|
|
<template v-if="locationList.length > 0">
|
|||
|
|
<view class="one-device" @click="deviceClick(item.id)" v-for="item,index in locationList" :key="index">
|
|||
|
|
<view class="left">
|
|||
|
|
<image class="left-img" :src="item.locaitonPic"></image>
|
|||
|
|
<view class="distance">{{item.distance/1000}}km</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="right">
|
|||
|
|
<view class="right-title">{{item.locationName}}</view>
|
|||
|
|
<view class="right-num">设备数量：{{item.equipmentNums}}</view>
|
|||
|
|
<view class="right-address">
|
|||
|
|
{{item.locationState + item.locationCity+item.locationDistrict + item.locationAddress }}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="tuijian" v-if="index<3">
|
|||
|
|
<image src="@/static/images/tuijian.png" mode=""></image>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png"
|
|||
|
|
v-if="locationList.length <= 0 && !showModal"></u-empty>
|
|||
|
|
<view class="device-button" @click="toLogin" v-if="showLogin">
|
|||
|
|
去登录
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="enter-map" @click="toMapMode">
|
|||
|
|
<text>设备</text>
|
|||
|
|
<text>地图</text>
|
|||
|
|
</view>
|
|||
|
|
<!-- <u-modal :show="showModal" :title="title" :content='content' @confirm="toMap"></u-modal> -->
|
|||
|
|
<u-modal :show="localShow" @confirm="localModalConfirm" @cancel="localModalCancel" confirmText="前往"
|
|||
|
|
:showCancelButton="true">
|
|||
|
|
<view class="slot-content">您已拒绝位置授权，请在小程序我的-隐私权限中自行打开授权</view>
|
|||
|
|
</u-modal>
|
|||
|
|
<view :class="['tip',pageOne ? 'one' : 'second']" v-if="!showLogin && showModal">
|
|||
|
|
<view class="one-tip" v-if="pageOne">
|
|||
|
|
<view class="tip-img">
|
|||
|
|
<image src="../../../static/images/bg.png"></image>
|
|||
|
|
</view>
|
|||
|
|
<view class="tip-content">
|
|||
|
|
<view class="one-row">亲爱的用户！你好：</view>
|
|||
|
|
<!-- <view class="row second-row">我知道你面临着一些困难，而我想让你知道，你并不孤单。虽然你身处孤独症的世界中，但是仍然有爱和支持等待着你，你的家人和朋友会在你身边，给你力量和支持。</view> -->
|
|||
|
|
<view class="row third-row">
|
|||
|
|
我们针对孤独症的医疗器械设备将于2025年上市，届时将遍布国内三甲医院及地方康复性医院，如果您将来希望通过设备地图查询治疗设备布设信息，则请填写您所希望接受治疗的地址和位置信息，如不需要获取设备地图服务，则可忽略此地址页面。
|
|||
|
|
<!-- 我想让你知道的是，自闭症并不是你生命的定义。它可能会让你面临一些挑战，但是也不能阻止你成为一个独特而有价值的人。你有自己的领域和兴趣，你有你的个性和特点，这些都是值得尊重的。自闭症不会改变你的真实内在，它只是让你看世界的方式和方式与众不同而已。 -->
|
|||
|
|
</view>
|
|||
|
|
<view class="four-row" @click="chooseAddress">
|
|||
|
|
<view class="title">地址:</view>
|
|||
|
|
<u--input v-model="user1.address" placeholder="请选择地址" border="none"
|
|||
|
|
placeholderStyle="color:#c7c7c7" fontSize="24rpx" readonly suffixIcon="arrow-right"
|
|||
|
|
suffixIconStyle="color: #c7c7c7" inputAlign="right"></u--input>
|
|||
|
|
</view>
|
|||
|
|
<!-- <view class="row four-row">
|
|||
|
|
作为一名医生，我的建议是为你提供最好的支持和帮助。首先，请尝试找到一个社交小组或社交活动，并与其他孤独症患者交流和学习。这些社交小组通常会有同样的挑战，他们会理解你的感受并支持你。同时，也可以尝试寻找专业治疗，例如行为疗法、言语疗法或认知行为疗法等，这些都可帮助你管理各种挑战和情感难题，以建立积极的情绪状态。
|
|||
|
|
</view>
|
|||
|
|
<view class="row five-row">
|
|||
|
|
此外，请记得寻求家人和朋友的支持。他们可能不理解你所面临的挑战，但是他们肯定会考虑你的感受，并为你提供帮助和支持。不要怀疑自己的价值。你和所有其他人一样，都是有价值、重要和有意义的。
|
|||
|
|
</view> -->
|
|||
|
|
<!-- <view class="row sex-row">最后，我希望你能够记住，你并不孤单。有很多人都想帮助和支持你。如果你需要更多的支持和建议，请随时和我联系。我们会站在你身边，给你最好的建议和帮助。</view> -->
|
|||
|
|
<!-- <view class="seven-row">祝你健康和快乐！</view> -->
|
|||
|
|
</view>
|
|||
|
|
<view class="btn-area">
|
|||
|
|
<view class="tip-button" @click="ignore">
|
|||
|
|
忽略
|
|||
|
|
</view>
|
|||
|
|
<view class="tip-button" style="margin-left: 40rpx;" @click="sure">
|
|||
|
|
确定
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<view class="second-tip" v-if="!pageOne">
|
|||
|
|
<view class="second-img">
|
|||
|
|
<image src="../../../static/images/bg.png"></image>
|
|||
|
|
</view>
|
|||
|
|
<view>
|
|||
|
|
<view class="second-content">
|
|||
|
|
<view class="row second-row">现在需要提供给我们，您最希望得到帮助的地点</view>
|
|||
|
|
<view class="row third-row">
|
|||
|
|
我们将根据您提供的信息，为您和您身边的人，布置完善的治疗体系，以及社区帮助。</view>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="tip-button-second" @click="toMap">
|
|||
|
|
确定
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
showModal: false,
|
|||
|
|
pageOne: true,
|
|||
|
|
localShow: false, //定位未授权提示弹框
|
|||
|
|
user: {},
|
|||
|
|
user1: {},
|
|||
|
|
userCity: null,
|
|||
|
|
userCity1: null,
|
|||
|
|
title: '提示',
|
|||
|
|
content: '现在需要提供给我们，您最希望得到帮助的地点,我们将根据您提供的信息，为您和您身边的人，布置完善的治疗体系，以及社区帮助',
|
|||
|
|
dropName: "距离优先",
|
|||
|
|
dropList: [{
|
|||
|
|
value: '距离优先',
|
|||
|
|
text: '距离优先'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
value: '数量优先',
|
|||
|
|
text: '数量优先'
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
locationList: [],
|
|||
|
|
location: {},
|
|||
|
|
pageNum: 1,
|
|||
|
|
pageSize: 10,
|
|||
|
|
loading: '',
|
|||
|
|
latitude: null,
|
|||
|
|
longitude: null,
|
|||
|
|
showLogin: false,
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
// this.pageOne = true;
|
|||
|
|
// console.log('142',this.$store.getters.token)
|
|||
|
|
if (this.$store.getters.token) {
|
|||
|
|
this.showLogin = false
|
|||
|
|
this.getUserInfo();
|
|||
|
|
} else {
|
|||
|
|
this.showLogin = true;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onReachBottom() {
|
|||
|
|
if (this.loading == 'moreByLl') {
|
|||
|
|
this.pageNum++;
|
|||
|
|
this.locationListByLl();
|
|||
|
|
}
|
|||
|
|
if (this.loading == 'moreByNums') {
|
|||
|
|
this.pageNum++;
|
|||
|
|
this.locationListByNums();
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
ignore() {
|
|||
|
|
this.showModal = false;
|
|||
|
|
},
|
|||
|
|
sure() {
|
|||
|
|
if(this.user1.longitude&&this.user1.latitude){
|
|||
|
|
this.showModal = false;
|
|||
|
|
this.updateUserLocation();
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: '/devicePackage/pages/deviceAdmin'
|
|||
|
|
})
|
|||
|
|
}else{
|
|||
|
|
uni.showToast({
|
|||
|
|
icon:'none',
|
|||
|
|
title:'地址不能为空'
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
toLogin() {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: '/loginPackage/pages/Login'
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
nextPage() {
|
|||
|
|
this.pageOne = false;
|
|||
|
|
},
|
|||
|
|
async getUserInfo() {
|
|||
|
|
const res = await this.$myRequest({
|
|||
|
|
url: '/getInfo'
|
|||
|
|
})
|
|||
|
|
this.user = res.data.user;
|
|||
|
|
this.userCity = this.user.city;
|
|||
|
|
console.log('89', this.user)
|
|||
|
|
// if ((this.user.longitude == null && this.user.latitude == null) || (this.user.longitude == '' && this.user.latitude == '')) {
|
|||
|
|
// // this.showModal = true;
|
|||
|
|
// } else {
|
|||
|
|
// this.showModal = false;
|
|||
|
|
// this.getLocationList(this.dropName)
|
|||
|
|
// }
|
|||
|
|
uni.getLocation({
|
|||
|
|
type: 'wgs84',
|
|||
|
|
success: (res) => {
|
|||
|
|
|
|||
|
|
this.location = res
|
|||
|
|
this.locationList = [];
|
|||
|
|
this.dropName == '距离优先' ? this.locationListByLl() : this
|
|||
|
|
.locationListByNums()
|
|||
|
|
},
|
|||
|
|
fail: (data) => {
|
|||
|
|
console.log('104', data)
|
|||
|
|
this.localShow = true;
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
toMap() {
|
|||
|
|
console.log('84')
|
|||
|
|
this.showModal = false;
|
|||
|
|
let that = this;
|
|||
|
|
let params = {};
|
|||
|
|
if (that.latitude && that.longitude) {
|
|||
|
|
params = {
|
|||
|
|
latitude: that.latitude,
|
|||
|
|
longitude: that.longitude
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
console.log('245', params)
|
|||
|
|
uni.chooseLocation({
|
|||
|
|
...params,
|
|||
|
|
success(data) {
|
|||
|
|
console.log('98', data)
|
|||
|
|
that.user.address = data.address + data.name;
|
|||
|
|
that.user.latitude = data.latitude;
|
|||
|
|
that.user.longitude = data.longitude;
|
|||
|
|
that.user.state = data.address.split('省')[0] + '省';
|
|||
|
|
console.log('121', that.state, data.address.split('省')[1])
|
|||
|
|
|
|||
|
|
// that.$nextTick(function(){
|
|||
|
|
that.user.city = data.address.split('省')[1].split('市')[0] + '市';
|
|||
|
|
that.userCity = that.user.city;
|
|||
|
|
console.log('122', that.city, data.address.split('省')[1].split('市')[1])
|
|||
|
|
// })
|
|||
|
|
that.updateUserLocation();
|
|||
|
|
that.getLocationList(this.dropName)
|
|||
|
|
},
|
|||
|
|
fail(data) {
|
|||
|
|
console.log('104', data)
|
|||
|
|
that.localShow = true;
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
chooseAddress() {
|
|||
|
|
uni.chooseLocation({
|
|||
|
|
latitude: this.location.latitude,
|
|||
|
|
longitude: this.location.longitude,
|
|||
|
|
success: (data) => {
|
|||
|
|
console.log('98', data)
|
|||
|
|
this.user1.address = data.address + data.name;
|
|||
|
|
this.user1.latitude = data.latitude;
|
|||
|
|
this.user1.longitude = data.longitude;
|
|||
|
|
this.user1.state = data.address.split('省')[0] + '省';
|
|||
|
|
console.log('121', this.state, data.address.split('省')[1])
|
|||
|
|
|
|||
|
|
// this.$nextTick(function(){
|
|||
|
|
this.user1.city = data.address.split('省')[1].split('市')[0] + '市';
|
|||
|
|
this.userCity1 = this.user1.city;
|
|||
|
|
// console.log('122', this.city, data.address.split('省')[1].split('市')[1])
|
|||
|
|
// })
|
|||
|
|
// this.updateUserLocation();
|
|||
|
|
// this.getLocationList(this.dropName)
|
|||
|
|
},
|
|||
|
|
fail: (data) => {
|
|||
|
|
console.log('104', data)
|
|||
|
|
this.localShow = true;
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
//定位未授权提示弹框前往
|
|||
|
|
localModalConfirm() {
|
|||
|
|
this.localShow = false;
|
|||
|
|
uni.switchTab({
|
|||
|
|
url: '/pages/tabbar/mine/Mine'
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
//定位未授权提示弹框关闭
|
|||
|
|
localModalCancel() {
|
|||
|
|
this.localShow = false;
|
|||
|
|
},
|
|||
|
|
toMapMode() {
|
|||
|
|
if (this.$store.getters.token) {
|
|||
|
|
//出弹框
|
|||
|
|
if (this.user.longitude && this.user.latitude) {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: '/devicePackage/pages/deviceAdmin'
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
this.showModal = true;
|
|||
|
|
this.pageOne = true;
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
// uni.showToast({
|
|||
|
|
// icon:'none',
|
|||
|
|
// title:'请登录后查看'
|
|||
|
|
// })
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: '/loginPackage/pages/Login'
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
async updateUserLocation() {
|
|||
|
|
const res = await this.$myRequest({
|
|||
|
|
method: 'PUT',
|
|||
|
|
url: '/system/user/profile/updateUserLocation',
|
|||
|
|
data: {
|
|||
|
|
longitude: this.user1.longitude,
|
|||
|
|
latitude: this.user1.latitude,
|
|||
|
|
state: this.user1.state, //省
|
|||
|
|
city: this.user1.city, // 市
|
|||
|
|
district: '', //县
|
|||
|
|
address: this.user1.address
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
console.log('97', res)
|
|||
|
|
},
|
|||
|
|
async getLocationList(dropName) {
|
|||
|
|
this.locationList = [];
|
|||
|
|
dropName == '距离优先' ? this.locationListByLl() : this
|
|||
|
|
.locationListByNums()
|
|||
|
|
// uni.authorize({
|
|||
|
|
// scope: 'scope.userLocation',
|
|||
|
|
// success: () => {
|
|||
|
|
// uni.getLocation({
|
|||
|
|
// type: 'wgs84',
|
|||
|
|
// success: (res) => {
|
|||
|
|
// console.log('当前位置的经度：' + res.longitude);
|
|||
|
|
// console.log('当前位置的纬度：' + res.latitude);
|
|||
|
|
// this.location = res
|
|||
|
|
// this.locationList = [];
|
|||
|
|
// dropName == '距离优先' ? this.locationListByLl() : this
|
|||
|
|
// .locationListByNums()
|
|||
|
|
|
|||
|
|
|
|||
|
|
// }
|
|||
|
|
// });
|
|||
|
|
// }
|
|||
|
|
// })
|
|||
|
|
},
|
|||
|
|
// 查询医疗设备场所列表(距离由近至远)
|
|||
|
|
async locationListByLl() {
|
|||
|
|
const res = await this.$myRequest({
|
|||
|
|
url: '/system/location/locationListByLl/?longitude=' + this.user.longitude +
|
|||
|
|
'&latitude=' + this.user.latitude,
|
|||
|
|
data: {
|
|||
|
|
pageNum: this.pageNum,
|
|||
|
|
pageSize: this.pageSize
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
// this.locationList = res.data.rows
|
|||
|
|
// console.log(this.locationList);
|
|||
|
|
if (res.data.rows.length >= this.pageSize) {
|
|||
|
|
this.loading = 'moreByLl';
|
|||
|
|
} else {
|
|||
|
|
this.loading = 'noMore';
|
|||
|
|
}
|
|||
|
|
this.locationList = this.locationList.concat(res.data.rows);
|
|||
|
|
this.locationList.forEach((item, index) => {
|
|||
|
|
item.locaitonPic = this.baseUrl + item.locaitonPic
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
// 查询医疗设备场所列表(数量有多至少)
|
|||
|
|
async locationListByNums() {
|
|||
|
|
const res = await this.$myRequest({
|
|||
|
|
url: '/system/location/locationListByNums/?longitude=' + this.user.longitude +
|
|||
|
|
'&latitude=' + this.user.latitude,
|
|||
|
|
data: {
|
|||
|
|
pageNum: this.pageNum,
|
|||
|
|
pageSize: this.pageSize
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
// this.locationList = res.data.rows
|
|||
|
|
if (res.data.rows.length >= this.pageSize) {
|
|||
|
|
this.loading = 'moreByNums';
|
|||
|
|
} else {
|
|||
|
|
this.loading = 'noMore';
|
|||
|
|
}
|
|||
|
|
this.locationList = this.locationList.concat(res.data.rows);
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
dropAction(e) {
|
|||
|
|
if (e === "") {
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
this.dropName = e ? e : '距离优先';
|
|||
|
|
this.getLocationList(e)
|
|||
|
|
this.pageNum = 1
|
|||
|
|
this.loading = ''
|
|||
|
|
},
|
|||
|
|
deviceClick(id) {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: "/devicePackage/pages/DeviceList?equipmentLocationId=" + id
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="less" scoped>
|
|||
|
|
.content {
|
|||
|
|
height: 100%;
|
|||
|
|
width: 100%;
|
|||
|
|
padding: 20rpx;
|
|||
|
|
|
|||
|
|
.head-title {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
margin-bottom: 20rpx;
|
|||
|
|
|
|||
|
|
.mall-filter-text {
|
|||
|
|
margin-right: 10rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.title-left {
|
|||
|
|
display: flex;
|
|||
|
|
|
|||
|
|
.icon {
|
|||
|
|
width: 6px;
|
|||
|
|
height: 38rpx;
|
|||
|
|
line-height: 22px;
|
|||
|
|
border-radius: 50px;
|
|||
|
|
background-color: rgba(40, 124, 206, 1);
|
|||
|
|
text-align: center;
|
|||
|
|
margin: 8rpx 10rpx 0rpx 0rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.name {
|
|||
|
|
color: rgba(16, 16, 16, 1);
|
|||
|
|
font-size: 40rpx;
|
|||
|
|
text-align: left;
|
|||
|
|
font-weight: 600;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.head-type {
|
|||
|
|
color: rgba(16, 16, 16, 1);
|
|||
|
|
font-size: 14px;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list {
|
|||
|
|
.one-device {
|
|||
|
|
padding: 20rpx;
|
|||
|
|
margin-bottom: 24rpx;
|
|||
|
|
line-height: 40rpx;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
background-color: rgba(255, 255, 255, 1);
|
|||
|
|
text-align: center;
|
|||
|
|
box-shadow: 0px 2px 8px 1px rgba(228, 228, 228, 100);
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
position: relative;
|
|||
|
|
|
|||
|
|
.left {
|
|||
|
|
position: relative;
|
|||
|
|
width: 268rpx;
|
|||
|
|
height: 182rpx;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
margin-right: 20rpx;
|
|||
|
|
|
|||
|
|
.left-img {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.distance {
|
|||
|
|
position: absolute;
|
|||
|
|
bottom: 0rpx;
|
|||
|
|
width: 258rpx;
|
|||
|
|
height: 24px;
|
|||
|
|
line-height: 20px;
|
|||
|
|
border-radius: 0rpx 0rpx 10rpx 10rpx;
|
|||
|
|
background-color: rgba(16, 16, 16, 0.51);
|
|||
|
|
color: rgba(16, 16, 16, 1);
|
|||
|
|
font-size: 14px;
|
|||
|
|
text-align: center;
|
|||
|
|
color: #fff;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.right {
|
|||
|
|
width: 61%;
|
|||
|
|
|
|||
|
|
// margin-left:20rpx;
|
|||
|
|
.right-title {
|
|||
|
|
color: rgba(16, 16, 16, 1);
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
overflow: hidden;
|
|||
|
|
text-overflow: ellipsis;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
text-align: left;
|
|||
|
|
font-weight: bold;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.right-num {
|
|||
|
|
color: rgba(16, 16, 16, 1);
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
overflow: hidden;
|
|||
|
|
text-overflow: ellipsis;
|
|||
|
|
display: -webkit-box;
|
|||
|
|
-webkit-box-orient: vertical;
|
|||
|
|
-webkit-line-clamp: 2;
|
|||
|
|
text-align: left;
|
|||
|
|
margin-top: 10rpx;
|
|||
|
|
margin-bottom: 10rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.right-address {
|
|||
|
|
color: rgba(113, 113, 113, 1);
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
overflow: hidden;
|
|||
|
|
text-overflow: ellipsis;
|
|||
|
|
display: -webkit-box;
|
|||
|
|
-webkit-box-orient: vertical;
|
|||
|
|
-webkit-line-clamp: 2;
|
|||
|
|
text-align: left;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.tuijian {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
width: 96rpx;
|
|||
|
|
height: 96rpx;
|
|||
|
|
|
|||
|
|
image {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.enter-map {
|
|||
|
|
position: fixed;
|
|||
|
|
right: 10rpx;
|
|||
|
|
bottom: 100rpx;
|
|||
|
|
width: 100rpx;
|
|||
|
|
height: 100rpx;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
background-color: #287CCE;
|
|||
|
|
box-shadow: 0rpx 4rpx 20rpx 4rpx rgba(0, 0, 0, .4);
|
|||
|
|
color: #fff;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.tip {
|
|||
|
|
width: 90%;
|
|||
|
|
// height: 620rpx;
|
|||
|
|
height: 700rpx;
|
|||
|
|
position: fixed;
|
|||
|
|
top: 200rpx;
|
|||
|
|
left: 5%;
|
|||
|
|
background-color: #fff;
|
|||
|
|
// padding-bottom: 20px;
|
|||
|
|
|
|||
|
|
&.one {
|
|||
|
|
border-radius: 20px;
|
|||
|
|
box-shadow: 0px 2px 0px #E1E2FF, inset 0px -4px 2px #D1D3FF;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.one-tip {
|
|||
|
|
// position: relative;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
|
|||
|
|
.tip-img {
|
|||
|
|
width: 100%;
|
|||
|
|
// height: 250px;
|
|||
|
|
height: 300px;
|
|||
|
|
|
|||
|
|
// background: #FFFFFF;
|
|||
|
|
// mix-blend-mode: normal;
|
|||
|
|
// box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.5);
|
|||
|
|
image {
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
.second-img {
|
|||
|
|
width: 100%;
|
|||
|
|
margin-top: 32%;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
mix-blend-mode: normal;
|
|||
|
|
box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.5);
|
|||
|
|
|
|||
|
|
image {
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.tip-content {
|
|||
|
|
width: 100%;
|
|||
|
|
color: #333;
|
|||
|
|
font-size: 14px;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 27%;
|
|||
|
|
background: #fff;
|
|||
|
|
padding: 0px 10px;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
|
|||
|
|
.one-row {
|
|||
|
|
width: 89%;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.row {
|
|||
|
|
width: 89%;
|
|||
|
|
|
|||
|
|
text-indent: 2em;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.four-row {
|
|||
|
|
width: 89%;
|
|||
|
|
height: 100rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
|
|||
|
|
.title {
|
|||
|
|
margin-right: 30rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
input {
|
|||
|
|
// width: 70%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.right-img {
|
|||
|
|
width: 30rpx;
|
|||
|
|
height: 30rpx;
|
|||
|
|
float: right;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.second-content {
|
|||
|
|
color: #333;
|
|||
|
|
font-size: 12px;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 42%;
|
|||
|
|
background: #fff;
|
|||
|
|
width: 89%;
|
|||
|
|
left: 5%;
|
|||
|
|
padding: 0px 10px;
|
|||
|
|
height: 300rpx;
|
|||
|
|
box-shadow: 0px 2px 0px #E1E2FF, inset 0px -4px 2px #D1D3FF;
|
|||
|
|
border-radius: 20px;
|
|||
|
|
|
|||
|
|
.row {
|
|||
|
|
text-indent: 2em;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.btn-area {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
margin-top: 20rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.tip-button {
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
background: linear-gradient(278.96deg, #558FFF 3.23%, #0047FD 98.88%);
|
|||
|
|
mix-blend-mode: normal;
|
|||
|
|
box-shadow: inset 0px 4px 10px rgba(255, 255, 255, 0.3);
|
|||
|
|
border-radius: 22px;
|
|||
|
|
text-align: center;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
width: 28%;
|
|||
|
|
padding: 5px 0px;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
margin-top: 10rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.tip-button-second {
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
background: linear-gradient(278.96deg, #558FFF 3.23%, #0047FD 98.88%);
|
|||
|
|
mix-blend-mode: normal;
|
|||
|
|
box-shadow: inset 0px 4px 10px rgba(255, 255, 255, 0.3);
|
|||
|
|
border-radius: 22px;
|
|||
|
|
text-align: center;
|
|||
|
|
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
width: 22%;
|
|||
|
|
padding: 6px 0px;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 58%;
|
|||
|
|
left: 37%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.device-button {
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
background: linear-gradient(278.96deg, #558FFF 3.23%, #0047FD 98.88%);
|
|||
|
|
mix-blend-mode: normal;
|
|||
|
|
box-shadow: inset 0px 4px 10px rgba(255, 255, 255, 0.3);
|
|||
|
|
border-radius: 22px;
|
|||
|
|
text-align: center;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
width: 40%;
|
|||
|
|
padding: 10px;
|
|||
|
|
margin: 40px auto;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|