|
@@ -1,369 +1,368 @@
|
|
|
-<template>
|
|
|
- <view class="content">
|
|
|
- <!-- <userInfo /> -->
|
|
|
- <!-- <view>
|
|
|
- <view>点击授权{{showModal}}</view>
|
|
|
- <button v-if="showModal" open-type="getUserInfo" @click="wxlogion">请点击授权</button>
|
|
|
- </view> -->
|
|
|
- <scroll-view style="height: 100vh;" class="floor-list"
|
|
|
- :scroll-top="scrollTop" scroll-y="true" @scroll="scroll" @scrolltoupper="upper" @scrolltolower="lower"
|
|
|
- refresher-enabled="true">
|
|
|
- <uniNavBar class="top" :shadow="false" :fixed="false" color="#333333" background-color="#FFFFFF">
|
|
|
- <block style="width: 70%;" slot="left">
|
|
|
- <view class="city">
|
|
|
- <view style="font-size: 35upx;">{{ location }}</view>
|
|
|
- </view>
|
|
|
- </block>
|
|
|
- <view class="input-view" style="float: right;">
|
|
|
- <uni-icon size="22" @click="scan" type="scan"></uni-icon>
|
|
|
- </view>
|
|
|
- <block slot="right">
|
|
|
- <view>
|
|
|
- <uni-icon size="22" type="chat"></uni-icon>
|
|
|
- </view>
|
|
|
- </block>
|
|
|
- </uniNavBar>
|
|
|
- <view class="searchType" style="background: #fff;">
|
|
|
- <view class="input-view">
|
|
|
- <uni-icon type="search" size="22" color="#666666" />
|
|
|
- <input confirm-type="search" class="input" type="text" placeholder="输入搜索关键词" @confirm="confirm" />
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view @tap="shopDetail" class="scrollswiper">
|
|
|
- <swiper class="swiper" :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration">
|
|
|
- <swiper-item>
|
|
|
- <view class="swiper-item uni-bg-red">A</view>
|
|
|
- </swiper-item>
|
|
|
- <swiper-item>
|
|
|
- <view class="swiper-item uni-bg-green">B</view>
|
|
|
- </swiper-item>
|
|
|
- <swiper-item>
|
|
|
- <view class="swiper-item uni-bg-blue">C</view>
|
|
|
- </swiper-item>
|
|
|
- </swiper>
|
|
|
- </view>
|
|
|
- <view class="tips">
|
|
|
- 在附近酒店找到您入住的酒店
|
|
|
- </view>
|
|
|
-
|
|
|
- <view style="border-bottom: 2upx solid #EEEEEE;width: 100%;margin-bottom: 24upx 0;"></view>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- <view @tap="openinfo">
|
|
|
- <view class="hotelList">
|
|
|
- <view class="hotleLeft">
|
|
|
- <image style="width: 214upx;height: 152upx;" src=""/>
|
|
|
- </view>
|
|
|
- <view class="hotelright">
|
|
|
- <view style="font-size: 36upx;color: #303133;">华南城市酒店</view>
|
|
|
- <view style="display: flex;flex-direction: row;justify-content: space-between;align-items: center;">
|
|
|
- <view style="font-size: 40upx; color: #303133;"> 0.0</view>
|
|
|
- <view>月访客990</view>
|
|
|
- <view>8km</view>
|
|
|
- </view>
|
|
|
- <view class="undertip">
|
|
|
- <view class="tipsTop">有停车为</view>
|
|
|
- <view class="tipsTop">内置酒店</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </scroll-view>
|
|
|
-
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
- import {
|
|
|
- mapMutations,mapState
|
|
|
- } from 'vuex'
|
|
|
- import uniNavBar from '@/component/uni-nav-bar/uni-nav-bar.vue'
|
|
|
- import uniIcon from '@/component/uni-icon/uni-icon.vue'
|
|
|
- export default {
|
|
|
- components: {
|
|
|
- uniNavBar,
|
|
|
- uniIcon
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- background: ['color1', 'color2', 'color3'],
|
|
|
- indicatorDots: true,
|
|
|
- autoplay: true,
|
|
|
- interval: 2000,
|
|
|
- duration: 500,
|
|
|
- title: 'Hello',
|
|
|
- location:'测试定位信息',
|
|
|
- scrollTop: 0,
|
|
|
- old: {
|
|
|
- scrollTop: 0
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- computed:{
|
|
|
- ...mapState([
|
|
|
- 'showModal',
|
|
|
- 'userInfo'
|
|
|
- ]),
|
|
|
- },
|
|
|
- onLoad() {
|
|
|
- this.isGetLocation(); // 检查是否开启定位权限
|
|
|
- this.isUserInfo(); // 检查是否允许获取用户授权
|
|
|
- // 用户授全
|
|
|
-
|
|
|
- },
|
|
|
- methods: {
|
|
|
- ...mapMutations(['login','showDialog']),
|
|
|
- // 滚动到顶部
|
|
|
- upper(e) {
|
|
|
- console.log(e)
|
|
|
- console.log("顶部")
|
|
|
- },
|
|
|
-
|
|
|
- // 滚到底部
|
|
|
- lower(e) {
|
|
|
- console.log("底部")
|
|
|
- },
|
|
|
-
|
|
|
- // 滚动时触发
|
|
|
- scroll(e) {
|
|
|
- this.old.scrollTop = e.detail.scrollTop
|
|
|
- },
|
|
|
- isGetLocation(a="scope.userLocation"){ // 检查当前是否已经授权访问scope属性WEW
|
|
|
- let _this=this;
|
|
|
- uni.getSetting({
|
|
|
- success(res) {
|
|
|
- // 用户定位接口
|
|
|
- if (!res.authSetting[a]) { // 每次进入程序判断当前是否获得授权,如果没有就去获得授权,如果获得授权,就直接获取当前地理位置
|
|
|
- _this.getAuthorizeInfo()
|
|
|
- }else{
|
|
|
- _this.getLocationInfo()
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- isUserInfo(b='scope.userInfo') {
|
|
|
- let _this = this;
|
|
|
- uni.getSetting({
|
|
|
- success(res) {
|
|
|
- // 未授权
|
|
|
- if(!res.authSetting[b]) {
|
|
|
- // 打开授权按钮 用户点击授权
|
|
|
- _this.showDialog(true);
|
|
|
- }else {
|
|
|
- _this.showDialog(false);
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
- getAuthorizeInfo(a="scope.userLocation"){ //uniapp弹窗弹出获取授权弹窗
|
|
|
- let _this=this;
|
|
|
- uni.authorize({
|
|
|
- scope: a,
|
|
|
- success() { //允许授权
|
|
|
- console.log("调用位置授权")
|
|
|
- _this.getLocationInfo();
|
|
|
- },
|
|
|
- fail(){ //拒绝授权
|
|
|
- _this.$msg("你拒绝了授权,无法获得周边信息")
|
|
|
-
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
- getLocationInfo(){ //获取地理位置
|
|
|
- let _this=this;
|
|
|
- uni.getLocation({
|
|
|
- type: 'wgs84',
|
|
|
- success (res) {
|
|
|
- console.log(res)
|
|
|
- let latitude,longitude;
|
|
|
- latitude = res.latitude.toString();
|
|
|
- longitude = res.longitude.toString();
|
|
|
- _this.loaction = '测试定位';
|
|
|
- uni.request({
|
|
|
- header:{
|
|
|
- "Content-Type": "application/text"
|
|
|
- },
|
|
|
- url:'',
|
|
|
- success(re) {
|
|
|
- console.log("中文位置")
|
|
|
- console.log(re)
|
|
|
- if(re.statusCode===200){
|
|
|
- console.log("获取中文街道地理位置成功")
|
|
|
- }else{
|
|
|
- console.log("获取信息失败,请重试!")
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- fail(res) {
|
|
|
- if(res.errMsg == 'getLocation:fail:system permission denied') {
|
|
|
- _this.$msg("定位失败开启手机微信定位权限")
|
|
|
- }
|
|
|
- console.log(res.errMsg)
|
|
|
-
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- wxlogion() {
|
|
|
- let that = this;
|
|
|
- uni.getUserInfo({
|
|
|
- success(res) {
|
|
|
- that.login(res.userInfo);
|
|
|
- that.showDialog(false);
|
|
|
- },
|
|
|
- fail(res) {
|
|
|
- that.$msg("授权失败")
|
|
|
- // uni.showModal({
|
|
|
- // title: 'shouquanshibai',
|
|
|
- // })
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- // 点击扫码
|
|
|
- scan(){
|
|
|
- uni.scanCode({
|
|
|
- success: (res) => {
|
|
|
- console.log(res);
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
-
|
|
|
- // 跳转到新页面 酒店详情
|
|
|
- openinfo() {
|
|
|
- uni.navigateTo({
|
|
|
- url: './hotel',
|
|
|
- });
|
|
|
- },
|
|
|
-
|
|
|
- // 跳转到商品详情
|
|
|
- shopDetail() {
|
|
|
- uni.navigateTo({
|
|
|
- url: './shop',
|
|
|
- });
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</script>
|
|
|
-
|
|
|
-<style>
|
|
|
- .top .uni-navbar__header-btns {
|
|
|
- width: 80%!important;
|
|
|
- }
|
|
|
- .top .uni-navbar__header-container {
|
|
|
- width: 50%!important;
|
|
|
- }
|
|
|
-
|
|
|
- .content {
|
|
|
- background: #fff;
|
|
|
- }
|
|
|
- .city {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- white-space:nowrap;
|
|
|
- overflow:hidden;
|
|
|
- text-overflow:ellipsis;
|
|
|
- }
|
|
|
- .logo {
|
|
|
- height: 200upx;
|
|
|
- width: 200upx;
|
|
|
- margin-top: 200upx;
|
|
|
- margin-left: auto;
|
|
|
- margin-right: auto;
|
|
|
- margin-bottom: 50upx;
|
|
|
- }
|
|
|
-
|
|
|
- .text-area {
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- }
|
|
|
-
|
|
|
- .title {
|
|
|
- font-size: 36upx;
|
|
|
- color: #8f8f94;
|
|
|
- }
|
|
|
- .van-cell--borderless {
|
|
|
- background-color: #e7e7e7!important;
|
|
|
- }
|
|
|
- .searchType .input-view {
|
|
|
- width: 85%;
|
|
|
- display: flex;
|
|
|
- background-color: #e7e7e7;
|
|
|
- height: 30px;
|
|
|
- border-radius: 15px;
|
|
|
- padding: 0 4%;
|
|
|
- flex-wrap: nowrap;
|
|
|
- margin: 7px 0;
|
|
|
- line-height: 30px;
|
|
|
- margin: 24upx auto;
|
|
|
- }
|
|
|
-
|
|
|
- .searchType .input-view .uni-icon {
|
|
|
- line-height: 30px !important;
|
|
|
- }
|
|
|
-
|
|
|
- .searchType .input-view .input {
|
|
|
- height: 30px;
|
|
|
- line-height: 30px;
|
|
|
- width: 94%;
|
|
|
- padding: 0 3%;
|
|
|
- }
|
|
|
- .uni-navbar--border::after {
|
|
|
- background: #fff!important;
|
|
|
- }
|
|
|
- .swiper {
|
|
|
- height: 300upx;
|
|
|
- }
|
|
|
- .swiper-item {
|
|
|
- display: block;
|
|
|
- height: 300upx;
|
|
|
- line-height: 300upx;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
- .scrollswiper {
|
|
|
- width: 90%;
|
|
|
- margin: 20upx auto;
|
|
|
- }
|
|
|
-
|
|
|
- .tips {
|
|
|
- color: #303133;
|
|
|
- font-size: 28upx;
|
|
|
- text-align: center;
|
|
|
- margin: 24upx 0;
|
|
|
- }
|
|
|
-
|
|
|
- .hotelList {
|
|
|
- display: flex;
|
|
|
- flex-direction: row;
|
|
|
- padding: 24upx 32upx;
|
|
|
- }
|
|
|
-
|
|
|
- .hotleLeft {
|
|
|
- width: 214upx;
|
|
|
- height: 152upx;
|
|
|
- background-color: #007AFF;
|
|
|
- }
|
|
|
-
|
|
|
- .hotelright {
|
|
|
- padding-left: 16upx;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- width: 100%;
|
|
|
- }
|
|
|
-
|
|
|
- .undertip {
|
|
|
- display: flex;
|
|
|
- flex-direction: row;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
- .tipsTop {
|
|
|
- border: 2upx solid #BBBBBB;
|
|
|
- margin-right: 14upx;
|
|
|
- color: #BBBBBB;
|
|
|
- padding: 4upx;
|
|
|
- }
|
|
|
+<template>
|
|
|
+ <view class="content">
|
|
|
+ <!-- <userInfo /> -->
|
|
|
+ <!-- <view>
|
|
|
+ <view>点击授权{{showModal}}</view>
|
|
|
+ <button v-if="showModal" open-type="getUserInfo" @click="wxlogion">请点击授权</button>
|
|
|
+ </view> -->
|
|
|
+ <scroll-view style="height: 100vh;" class="floor-list"
|
|
|
+ :scroll-top="scrollTop" scroll-y="true" @scroll="scroll" @scrolltoupper="upper" @scrolltolower="lower"
|
|
|
+ refresher-enabled="true">
|
|
|
+ <uniNavBar class="top" :shadow="false" :fixed="false" color="#333333" background-color="#FFFFFF">
|
|
|
+ <block style="width: 70%;" slot="left">
|
|
|
+ <view class="city">
|
|
|
+ <view style="font-size: 35upx;">{{ location }}</view>
|
|
|
+ </view>
|
|
|
+ </block>
|
|
|
+ <view class="input-view" style="float: right;">
|
|
|
+ <uni-icon size="22" @click="scan" type="scan"></uni-icon>
|
|
|
+ </view>
|
|
|
+ <block slot="right">
|
|
|
+ <view @click="goinfor">
|
|
|
+ <uni-icon size="22" type="chat"></uni-icon>
|
|
|
+ </view>
|
|
|
+ </block>
|
|
|
+ </uniNavBar>
|
|
|
+ <view @click="goSearch" class="searchType" style="background: #fff;">
|
|
|
+ <view class="input-view">
|
|
|
+ <uni-icon type="search" size="22" color="#666666" />
|
|
|
+ <input confirm-type="search" class="input" type="text" placeholder="输入搜索关键词" @confirm="confirm" />
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view @tap="shopDetail" class="scrollswiper">
|
|
|
+ <swiper class="swiper" :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration">
|
|
|
+ <swiper-item>
|
|
|
+ <view class="swiper-item uni-bg-red">A</view>
|
|
|
+ </swiper-item>
|
|
|
+ <swiper-item>
|
|
|
+ <view class="swiper-item uni-bg-green">B</view>
|
|
|
+ </swiper-item>
|
|
|
+ <swiper-item>
|
|
|
+ <view class="swiper-item uni-bg-blue">C</view>
|
|
|
+ </swiper-item>
|
|
|
+ </swiper>
|
|
|
+ </view>
|
|
|
+ <view class="tips">
|
|
|
+ 在附近酒店找到您入住的酒店
|
|
|
+ </view>
|
|
|
+ <view style="border-bottom: 2upx solid #EEEEEE;width: 100%;margin-bottom: 24upx 0;"></view>
|
|
|
+
|
|
|
+ <view @tap="openinfo">
|
|
|
+ <view class="hotelList">
|
|
|
+ <view class="hotleLeft">
|
|
|
+ <image style="width: 214upx;height: 152upx;" src=""/>
|
|
|
+ </view>
|
|
|
+ <view class="hotelright">
|
|
|
+ <view style="font-size: 36upx;color: #303133;">华南城市酒店</view>
|
|
|
+ <view style="display: flex;flex-direction: row;justify-content: space-between;align-items: center;">
|
|
|
+ <view style="font-size: 40upx; color: #303133;"> 0.0</view>
|
|
|
+ <view>月访客990</view>
|
|
|
+ <view>8km</view>
|
|
|
+ </view>
|
|
|
+ <view class="undertip">
|
|
|
+ <view class="tipsTop">有停车为</view>
|
|
|
+ <view class="tipsTop">内置酒店</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </scroll-view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ mapMutations,mapState
|
|
|
+ } from 'vuex'
|
|
|
+ import uniNavBar from '@/component/uni-nav-bar/uni-nav-bar.vue'
|
|
|
+ import uniIcon from '@/component/uni-icon/uni-icon.vue'
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ uniNavBar,
|
|
|
+ uniIcon
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ background: ['color1', 'color2', 'color3'],
|
|
|
+ indicatorDots: true,
|
|
|
+ autoplay: true,
|
|
|
+ interval: 2000,
|
|
|
+ duration: 500,
|
|
|
+ title: 'Hello',
|
|
|
+ location:'测试定位信息',
|
|
|
+ scrollTop: 0,
|
|
|
+ old: {
|
|
|
+ scrollTop: 0
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed:{
|
|
|
+ ...mapState([
|
|
|
+ 'showModal',
|
|
|
+ 'userInfo'
|
|
|
+ ]),
|
|
|
+ },
|
|
|
+ onLoad() {
|
|
|
+ this.isGetLocation(); // 检查是否开启定位权限
|
|
|
+ this.isUserInfo(); // 检查是否允许获取用户授权
|
|
|
+ // 用户授全
|
|
|
+
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ ...mapMutations(['login','showDialog']),
|
|
|
+ goinfor() {
uni.navigateTo({
url: '../myCenter/information' // 我的收藏
})
},
|
|
|
+ goSearch() {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: './searchresult' // 我的搜索
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 滚动到顶部
|
|
|
+ upper(e) {
|
|
|
+ console.log(e)
|
|
|
+ console.log("顶部")
|
|
|
+ },
|
|
|
+
|
|
|
+ // 滚到底部
|
|
|
+ lower(e) {
|
|
|
+ console.log("底部")
|
|
|
+ },
|
|
|
+
|
|
|
+ // 滚动时触发
|
|
|
+ scroll(e) {
|
|
|
+ this.old.scrollTop = e.detail.scrollTop
|
|
|
+ },
|
|
|
+ isGetLocation(a="scope.userLocation"){ // 检查当前是否已经授权访问scope属性W
|
|
|
+ let _this=this;
|
|
|
+ uni.getSetting({
|
|
|
+ success(res) {
|
|
|
+ // 用户定位接口
|
|
|
+ if (!res.authSetting[a]) { // 每次进入程序判断当前是否获得授权,如果没有就去获得授权,如果获得授权,就直接获取当前地理位置
|
|
|
+ _this.getAuthorizeInfo()
|
|
|
+ }else{
|
|
|
+ _this.getLocationInfo()
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ isUserInfo(b='scope.userInfo') {
|
|
|
+ let _this = this;
|
|
|
+ uni.getSetting({
|
|
|
+ success(res) {
|
|
|
+ // 未授权
|
|
|
+ if(!res.authSetting[b]) {
|
|
|
+ // 打开授权按钮 用户点击授权
|
|
|
+ _this.showDialog(true);
|
|
|
+ }else {
|
|
|
+ _this.showDialog(false);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getAuthorizeInfo(a="scope.userLocation"){ //uniapp弹窗弹出获取授权弹窗
|
|
|
+ let _this=this;
|
|
|
+ uni.authorize({
|
|
|
+ scope: a,
|
|
|
+ success() { //允许授权
|
|
|
+ console.log("调用位置授权")
|
|
|
+ _this.getLocationInfo();
|
|
|
+ },
|
|
|
+ fail(){ //拒绝授权
|
|
|
+ _this.$msg("你拒绝了授权,无法获得周边信息")
|
|
|
+
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getLocationInfo(){ //获取地理位置
|
|
|
+ let _this=this;
|
|
|
+ uni.getLocation({
|
|
|
+ type: 'wgs84',
|
|
|
+ success (res) {
|
|
|
+ console.log(res)
|
|
|
+ let latitude,longitude;
|
|
|
+ latitude = res.latitude.toString();
|
|
|
+ longitude = res.longitude.toString();
|
|
|
+ _this.loaction = '测试定位';
|
|
|
+ uni.request({
|
|
|
+ header:{
|
|
|
+ "Content-Type": "application/text"
|
|
|
+ },
|
|
|
+ url:'',
|
|
|
+ success(re) {
|
|
|
+ console.log("中文位置")
|
|
|
+ console.log(re)
|
|
|
+ if(re.statusCode===200){
|
|
|
+ console.log("获取中文街道地理位置成功")
|
|
|
+ }else{
|
|
|
+ console.log("获取信息失败,请重试!")
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ fail(res) {
|
|
|
+ if(res.errMsg == 'getLocation:fail:system permission denied') {
|
|
|
+ _this.$msg("定位失败开启手机微信定位权限")
|
|
|
+ }
|
|
|
+ console.log(res.errMsg)
|
|
|
+
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ wxlogion() {
|
|
|
+ let that = this;
|
|
|
+ uni.getUserInfo({
|
|
|
+ success(res) {
|
|
|
+ that.login(res.userInfo);
|
|
|
+ that.showDialog(false);
|
|
|
+ },
|
|
|
+ fail(res) {
|
|
|
+ that.$msg("授权失败")
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ // 点击扫码
|
|
|
+ scan(){
|
|
|
+ uni.scanCode({
|
|
|
+ success: (res) => {
|
|
|
+ console.log(res);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ // 跳转到新页面 酒店详情
|
|
|
+ openinfo() {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: './hotel',
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ // 跳转到商品详情
|
|
|
+ shopDetail() {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: './shop',
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+ .top .uni-navbar__header-btns {
|
|
|
+ width: 80%!important;
|
|
|
+ }
|
|
|
+ .top .uni-navbar__header-container {
|
|
|
+ width: 50%!important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .content {
|
|
|
+ background: #fff;
|
|
|
+ }
|
|
|
+ .city {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ white-space:nowrap;
|
|
|
+ overflow:hidden;
|
|
|
+ text-overflow:ellipsis;
|
|
|
+ }
|
|
|
+ .logo {
|
|
|
+ height: 200upx;
|
|
|
+ width: 200upx;
|
|
|
+ margin-top: 200upx;
|
|
|
+ margin-left: auto;
|
|
|
+ margin-right: auto;
|
|
|
+ margin-bottom: 50upx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .text-area {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title {
|
|
|
+ font-size: 36upx;
|
|
|
+ color: #8f8f94;
|
|
|
+ }
|
|
|
+ .van-cell--borderless {
|
|
|
+ background-color: #e7e7e7!important;
|
|
|
+ }
|
|
|
+ .searchType .input-view {
|
|
|
+ width: 85%;
|
|
|
+ display: flex;
|
|
|
+ background-color: #e7e7e7;
|
|
|
+ height: 30px;
|
|
|
+ border-radius: 15px;
|
|
|
+ padding: 0 4%;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ margin: 7px 0;
|
|
|
+ line-height: 30px;
|
|
|
+ margin: 24upx auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ .searchType .input-view .uni-icon {
|
|
|
+ line-height: 30px !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .searchType .input-view .input {
|
|
|
+ height: 30px;
|
|
|
+ line-height: 30px;
|
|
|
+ width: 94%;
|
|
|
+ padding: 0 3%;
|
|
|
+ }
|
|
|
+ .uni-navbar--border::after {
|
|
|
+ background: #fff!important;
|
|
|
+ }
|
|
|
+ .swiper {
|
|
|
+ height: 300upx;
|
|
|
+ }
|
|
|
+ .swiper-item {
|
|
|
+ display: block;
|
|
|
+ height: 300upx;
|
|
|
+ line-height: 300upx;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .scrollswiper {
|
|
|
+ width: 90%;
|
|
|
+ margin: 20upx auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tips {
|
|
|
+ color: #303133;
|
|
|
+ font-size: 28upx;
|
|
|
+ text-align: center;
|
|
|
+ margin: 24upx 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .hotelList {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ padding: 24upx 32upx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .hotleLeft {
|
|
|
+ width: 214upx;
|
|
|
+ height: 152upx;
|
|
|
+ background-color: #007AFF;
|
|
|
+ }
|
|
|
+
|
|
|
+ .hotelright {
|
|
|
+ padding-left: 16upx;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .undertip {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .tipsTop {
|
|
|
+ border: 2upx solid #BBBBBB;
|
|
|
+ margin-right: 14upx;
|
|
|
+ color: #BBBBBB;
|
|
|
+ padding: 4upx;
|
|
|
+ }
|
|
|
</style>
|