景徳镇旅游微信小程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

148 lines
2.9 KiB

<template>
<!-- 无忧服务 -->
<view class="page">
<navbar title="无忧服务" leftClick @leftClick="$utils.navigateBack" />
<view class="picture" >
<!-- <image src="https://img-s-msn-com.akamaized.net/tenant/amp/entityid/BB1msKSi.img" mode=""></image> -->
<uv-swiper
:list="banner.service"
indicator
height="420rpx"
keyName="imageContent"></uv-swiper>
</view>
<view class="serve">
<view class="word">
无忧服务
</view>
<view class="list">
<view class="button1" @click="toM">
<image src="../static/service/carefree/1.png" mode=""></image>
<view class="">
瓷都美食
</view>
</view>
<view class="button2" @click="toMS">
<image src="../static/service/carefree/2.png" mode=""></image>
<view class="">
精品民宿
</view>
</view>
<view class="button3" @click="toDD">
<image src="../static/service/carefree/3.png" mode=""></image>
<view class="">
无忧租车
</view>
</view>
<view class="button4"
@click="$utils.navigateTo('/pages_order/service/StudyFurther')">
<image src="../static/service/carefree/4.png" mode=""></image>
<view class="">
我要研学
</view>
</view>
</view>
</view>
<tabber/>
</view>
</template>
<script>
import { mapState } from 'vuex'
export default {
data() {
return {
}
},
computed : {
...mapState(['banner']),
},
methods: {
// 跳转美团民宿
toMS(){
uni.navigateToMiniProgram({
appId: 'wxc147016e2b3bf9d6',
// path: '',
envVersion: "release",
success: res => {
// 打开成功
console.log("打开成功", res);
},
fail: err => {
console.log(err);
}
})
},
// 跳转美团美食
toM(){
uni.navigateToMiniProgram({
appId: 'wxde8ac0a21135c07d',
// path: '',
envVersion: "release",
success: res => {
// 打开成功
console.log("打开成功", res);
},
fail: err => {
console.log(err);
}
})
},
// 跳转DD打车
toDD(){
uni.navigateToMiniProgram({
appId: 'wxaf35009675aa0b2a',
// path: '',
envVersion: "release",
success: res => {
// 打开成功
console.log("打开成功", res);
},
fail: err => {
console.log(err);
}
})
},
}
}
</script>
<style scoped lang="scss">
.page{
.picture{
width: 100%;
}
.serve{
.word{
font-size: 32rpx;
font-weight: 700;
margin: 20rpx;
}
.list{
display: flex;
flex-wrap: wrap;
margin-top: 30rpx;
&>view{
color: white;
width: 335rpx;
height: 200rpx;
margin: 20rpx;
background-color: $uni-color;
border-radius: 16rpx;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
font-weight: 700;
image{
width: 80rpx;
height: 80rpx;
}
}
}
}
}
</style>