ihotel-h5/pages/gongyuxiangqing/gongyuxiangqing.vue

<template>
	<view class="content">
		<view class="xuzhi">
			<view class="xiang_title">公寓介绍</view>
			<view class="xiang_txt">
				<!-- <view>{{intorduc}}</view> -->
				<rich-text :nodes="intorduc"></rich-text>
				<!-- <text style="display: block;text-indent: 56rpx;margin-top: 10px;">开业时间：{{yingye}}</text> -->
				<text style="display: block;text-indent: 56rpx;margin-top: 10px;">联系电话：<text @click="telphone(phone)" style="color:rgba(41, 109, 227, 1);">{{phone}}</text></text>
			</view>
		</view>
		<!-- 第二部分，公寓设施 -->
		<view class="sheshi">
			<view class="sheshi_title">公寓设施</view>
			<view v-for="(item,index) in sheshiList" :key="index">
				<view class="sheshi_txt_left" v-if="index%2===0">
					<view class="sheshi_txt" style="margin-top: 30rpx;">
						<!-- ../../static/gongyuxiangqing/sheshi_icon.png -->
						<image class="sheshi_icon" :src="item.iconPath"></image>{{item.houseService}}
					</view>
				</view>
				<view class="sheshi_txt_right" v-else>
					<view style="margin-top: 30rpx;">
						<image class="sheshi_icon" :src="item.iconPath"></image>{{item.houseService}}
					</view>
				</view>
			</view>
		</view>
		<!-- 第三部分 入住须知 -->
		<!-- <view class="xuzhi">
			<view class="xiang_title">入住须知</view>
			<view class="xiang_txt">
				         我们从分享时机、分享形式、分享动机、分享场景4个维度来聊聊「社交分享」的那些事儿。<br>
				<text style="display: block;text-indent: 56rpx;">所以监听用户的截图操作，提示用户进行分享，既缩短了以前分享截图的操作路径，避免了在之前长路径中的行为流失（比如截图完成后忘记分享或觉得麻烦放弃分享等等），也让用户觉得更加贴心。</text>
				         <text style="display: block;text-indent: 56rpx;">用户分享内容到社交媒体或好友，不应该是一种粗暴的强制行为，我们应该在保证产品本身内容有吸引力的核心前提下，仔细揣摩用户心理，结合产品本身的特色，在不同情境下提供给用户最合适的分享平台及方式，让用户分享成为一种水到渠。</text>
				        <text style="display: block;text-indent: 56rpx;">营业时间：24小时</text>
				         <text style="display: block;text-indent: 56rpx;">联系电话：<text @click="telphone(phone)" style="color:rgba(41, 109, 227, 1);">{{phone}}</text></text>
			</view>
		</view> -->
	</view>
</template>

<script>
	import {
		apartSet,
		gongyusheshi
	} from '../../utils/api_hotel.js'
	export default {
		data() {
			return {
				intorduc:'',
				sheshiList:[
					{id:1,list:'免费洗刷用品'},
					{id:2,list:'24小时热水'},
					{id:3,list:'客房wifi覆盖'},
					{id:4,list:'电视'},
					{id:5,list:'电吹风'},
					{id:6,list:'分体式空调'},
				],
				phone:'',
				yingye:'',
			}
		},
		onLoad() {
			this.getAllset()
			this.getsheshi()
		},
		methods: {
			//拨打电话
			telphone(phone){
				uni.makePhoneCall({ 
					phoneNumber: phone ,
				}) // 传参带入号码即可
			},
			getsheshi(){
				let _self = this
				_self.sheshiList=[]
				gongyusheshi().then((res) => {
					if (res.success) {
						this.sheshiList=res.data
						return;
					} else {
						uni.showModal({
							content:"没有符合条件的数据！"
						})
					}
				}).catch((err) => {
					  uni.showModal({
						content:err.message
					  })
				});
			},
			//公寓整体配置
			getAllset(){
				let _self = this
				apartSet().then((res) => {
					if (res.success) {
						this.intorduc=res.data.introductory
						this.phone=res.data.phoneNumbr
						this.yingye=res.data.openingTime
						return;
					} else {
						uni.showModal({
							content:"没有符合条件的数据！"
						})
					}
				}).catch((err) => {
					  uni.showModal({
						content:err.message
					  })
				});
			},
		}
	}
</script>

<style>
	@import url("./css/gongyuxiangqing.css");
</style>