样式调整

2 years ago · 0306ac457b
parent 842c8e8f42
commit 0306ac457b
5 changed files with 140 additions and 79 deletions
--- a/App.vue
+++ b/App.vue
@ -81,4 +81,5 @@ const aes = require('./common/aes.js');
 	/*每个页面公共css */
 	/* @import './static/css/common.css'; */
 	@import './static/ancss/an.css';
+	@import '/static/css/iconfont.css';
 </style>
--- a/pages/daolan/pointDetail.vue
+++ b/pages/daolan/pointDetail.vue
@ -1,9 +1,11 @@
 <template>
-	<view class="box">
-		<view class="top">
+	<view class="">
+		<view class="top box">
 			<view class="img-play">
 				<image style="width: 100%; height: 100%; background-color: #eeeeee" :mode="item.mode" :src="baseUrl + datas.imgsl"></image>
-				<view class="play-stop" v-if="plays&&datas.voiceurl" @click="play(datas.voiceurl)"><image style="width: 50rpx; height: 50rpx;padding:10rpx" src="../../static/img/icon_play.png"></image></view>
+				<view class="play-stop" v-if="plays && datas.voiceurl" @click="play(datas.voiceurl)">
+					<image style="width: 50rpx; height: 50rpx; padding: 10rpx" src="../../static/img/icon_play.png"></image>
+				</view>
 				<view class="play-stop" v-if="!plays" @click="pause()"><image style="width: 50rpx; height: 50rpx; padding: 10rpx" src="../../static/img/icon_stop.png"></image></view>
 			</view>
 			<view class="top-right">
@ -12,19 +14,30 @@
 				<view class="sencien-price">门票:{{ datas.ticketprice }}</view>
 			</view>
 		</view>
-		<view class="content">
-			<view>景区简介</view>
+		<view class="content box">
+			<view class="box-title">景区简介</view>
 			<mp-html :content="datas.content"></mp-html>
 		</view>
-		<view class="picture">
+		<view class="picture box">
+			<view class="box-title">景点图集</view>
 			<view class="img-box" v-for="(item, index) in imgs">
 				<image class="img" :src="baseUrl + item"></image>
 			</view>
 		</view>
-		<view class="bottom">
-			<view><uni-icons class="icn" type="location" size="20" color="#989898"></uni-icons>{{datas.addr}}</view>
-			<view><uni-icons class="icn" type="eye" size="20" color="#989898"></uni-icons>{{datas.opentime}}</view>
-			<view @click="callPhone('tel')"><uni-icons class="icn" type="phone" size="20" color="#989898"></uni-icons>{{datas.tel}}</view>
+		<view class="bottom box">
+			<view>
+				<uni-icons class="icn" type="location" size="20" color="#989898"></uni-icons>
+				{{ datas.addr }}
+			</view>
+			<view>
+				<!-- <uni-icons class="icn" type="eye" size="20" color="#989898"></uni-icons> -->
+				<span class="iconfont">&#xe680;</span>
+				{{ datas.opentime }}
+			</view>
+			<view @click="callPhone('tel')">
+				<uni-icons class="icn" type="phone" size="20" color="#989898"></uni-icons>
+				{{ datas.tel }}
+			</view>
 		</view>
 	</view>
 </template>
@ -36,7 +49,7 @@ export default {
 			datas: null,
 			imgs: null,
 			baseUrl: this.$config.ROOTPATH,
-			plays: true,
+			plays: true
 		};
 	},
 	onLoad(options) {
@ -45,7 +58,7 @@ export default {
 	},
 	methods: {
 		getDetail(val) {
-			let this_ = this
+			let this_ = this;
 			uni.request({
 				url: this.$config.ROOTPATH + '/mobile/mapScenic/qylyScenicinfoById?userkey=' + this.$param.userkey + '&id=' + val,
 				method: 'get',
@ -71,7 +84,7 @@ export default {
 			});
 		},
 		pause() {
-			let this_ = this
+			let this_ = this;
 			uni.stopBackgroundAudio({
 				success: function () {
 					this_.showMp3Title = false;
@ -82,7 +95,7 @@ export default {
 		callPhone() {
 			uni.makePhoneCall({
 				phoneNumber: '03193928888' //仅为示例，并非真实的电话号码
-			})
+			});
 		}
 	}
 };
@ -90,12 +103,15 @@ export default {

 <style scoped>
 .box {
-		    padding: 20rpx 25rpx 100rpx 25rpx;
+	padding: 20rpx 25rpx 60rpx 25rpx;
+	border-bottom: solid 10rpx #d8d8d8;
+}
+.box:last-child {
+	border: none;
 }
 .top {
 	display: flex;
 	align-items: center;
-				margin-bottom: 40rpx;
 }
 .img-play {
 	width: 140rpx;
@ -130,7 +146,8 @@ export default {
 	color: #b31414;
 	margin-top: 10rpx;
 }
-	.content,.picture{
+.content,
+.picture {
 	margin-bottom: 40rpx;
 }
 .img-box {
@ -145,4 +162,8 @@ export default {
 .icn {
 	margin-right: 15rpx;
 }
+.box-title {
+	font-size: 38rpx;
+	margin-bottom: 25rpx;
+}
 </style>
--- a/pages/daolan/zhdl.vue
+++ b/pages/daolan/zhdl.vue
@ -11,6 +11,7 @@
 					:markers="covers"
 					:min-scale="min"
 					:max-scale="max"
+					:include-points="cloudPoints"
 					:show-location="true"
 					@markertap.stop="tryDemo"
 					@updated="showsd"
@ -99,6 +100,7 @@ export default {
 			pointData: null,
 			lineData: [],
 			polylines: [],
+			cloudPoints:[],
 			showCover: false,
 			showMp3Title: false,
 			plays: true,
@ -223,6 +225,12 @@ export default {
 						// if (item.id == 363) {
 						if (item.id == 334) {
 							this_.addCoverimg(item);
+							console.log(item)
+							this_.longitude = item.lon
+							this_.latitude = item.lat
+							this_.scale = item.start_maplevel
+							this_.min = item.min_maplevel
+							this_.max = item.max_maplevel
 						}
 					});
 					//添加标点
@ -274,20 +282,26 @@ export default {
 			this_.covers = [];
 			if (val.dicnum == 3602) {
 				this_.covers = this_.partLoat;
+				this_.cloudPoints = this_.partLoat
 			} else if (val.dicnum == 3603) {
 				this_.covers = this_.inAndOut;
+				this_.cloudPoints = this_.inAndOut
 			} else if (val.dicnum == 3604) {
 				this_.covers = this_.tolite;
+				this_.cloudPoints = this_.tolite
 			} else if (val.dicnum == 3607) {
 				this_.covers = this_.tourisCenter;
+				this_.cloudPoints = this_.tourisCenter
 			} else {
 				this_.covers = this_.jingdian;
+				this_.cloudPoints = this_.jingdian
 			}
 		},
 		// 全部
 		showAllpoint() {
 			let this_ = this;
 			this_.isAllActive = false;
+			this_.showCover = false;
 			this_.isLineActive = true;
 			this_.screenList.forEach((item) => {
 				item.isActive = false;
@ -298,6 +312,7 @@ export default {
 		showLine() {
 			let this_ = this;
 			this_.isLineActive = false;
+			this_.showCover = false;
 			this_.isAllActive = true;
 			this_.screenList.forEach((item) => {
 				item.isActive = false;
@ -355,8 +370,11 @@ export default {
 								padding: 5,
 								anchorX: 20,
 								anchorY: -30,
-								color: '#eee',
-								bgColor: '#5ec4f3'
+								color: '#600000',
+								borderWidth:0.5,
+								borderColor:'#600000',
+								borderRadius:5,
+								bgColor: '#fff'
 							},
 							iconPath: pathurl,
 							width: 33,
@ -382,6 +400,7 @@ export default {
 					}
 				});
 				this_.covers = this_.allPointData;
+				this_.cloudPoints = this_.allPointData
 			}
 		},
 		// 播音频
--- a/static/css/iconfont.css
+++ b/static/css/iconfont.css
@ -0,0 +1,20 @@
+@font-face {
+  font-family: "iconfont"; /* Project id 4249859 */
+  src: url('/static/css/iconfont.ttf') format('truetype');
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 20;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+	color: #989898;
+	margin-right: 15rpx;
+	margin-left: 5rpx;
+}
+
+.icon-time:before {
+  content: "\e680";
+}
+
--- a/static/css/iconfont.ttf
+++ b/static/css/iconfont.ttf