添加收藏茶室接口和完善茶室详情
This commit is contained in:
wangxiaowei
@ -29,9 +29,9 @@
|
||||
<view class="mt-50rpx mx-30rpx">
|
||||
<view class="text-[#333] leading-42rpx text-30rpx font-bold">已开通城市</view>
|
||||
<view class="mt-40rpx grid grid-cols-4 gap-20rpx w-full">
|
||||
<view class="bg-[#F8F9FA] rounded-28rpx h-56rpx text-[#606266] flex items-center justify-center" v-for="(item, index) in 9" :key="index">
|
||||
<view class="bg-[#F8F9FA] rounded-28rpx h-56rpx text-[#606266] flex items-center justify-center" v-for="(item, index) in openCityList" :key="index">
|
||||
<wd-img width="28rpx" height="28rpx" :src="`${OSS}icon/icon_location2.png`"></wd-img>
|
||||
<view class="text-26rpx text-[#606266] leading-36rpx">上海市</view>
|
||||
<view class="text-26rpx text-[#606266] leading-36rpx">{{ item.name }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -39,18 +39,31 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, inject } from 'vue'
|
||||
import { router } from '@/utils/tools'
|
||||
import { getOpenCityList } from '@/api/tea-room'
|
||||
|
||||
let OSS = inject('OSS')
|
||||
const OSS = inject('OSS')
|
||||
|
||||
onLoad(() => {
|
||||
// 经纬度
|
||||
const latitude = ref<number>(0)
|
||||
const longitude = ref<number>(0)
|
||||
|
||||
// 已开通城市列表
|
||||
const openCityList = ref<Array<any>>([])
|
||||
|
||||
onLoad((args) => {
|
||||
if (args.lat && args.lng) {
|
||||
latitude.value = Number(args.lat)
|
||||
longitude.value = Number(args.lng)
|
||||
}
|
||||
|
||||
City.handleInit()
|
||||
})
|
||||
|
||||
const city = {
|
||||
back: () => {
|
||||
uni.navigateBack({
|
||||
delta: 1,
|
||||
})
|
||||
const City = {
|
||||
handleInit: async () => {
|
||||
const res = await getOpenCityList()
|
||||
openCityList.value = res.list
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -13,13 +13,13 @@
|
||||
<view class="home-bg w-[100%] fixed top-0 left-0 z-100">
|
||||
<wd-navbar safeAreaInsetTop :bordered="false" custom-style="background-color: transparent !important;">
|
||||
<template #left>
|
||||
<view class="flex items-center line-1 w-130rpx" @click="Index.toCity">
|
||||
<view class="flex items-center line-1 w-130rpx" @click="Index.handleToCity">
|
||||
<view class="mr-10rpx font-400 leading-44rpx text-32rpx pl-10rpx line-1">上海市</view>
|
||||
<wd-img width="14rpx" height="9rpx" :src="`${OSS}icon/icon_arrow_down.png`" />
|
||||
</view>
|
||||
</template>
|
||||
<template #title>
|
||||
<view class="search-box flex items-center ml-26rpx" @click="Index.toSearch">
|
||||
<view class="search-box flex items-center ml-26rpx" @click="Index.handleToSearch">
|
||||
<wd-search placeholder="搜索茶址名称" hide-cancel disabled :placeholder-left="true"
|
||||
placeholderStyle="text-align:left;padding-left: 24rpx;line-heigt: 44rpx;color: #C9C9C9; font-size: 32rpx;font-weight: normal;">
|
||||
</wd-search>
|
||||
@ -30,9 +30,9 @@
|
||||
|
||||
<view :style="{ paddingTop: navbarHeight + 'px' }">
|
||||
<view class="mt-32rpx mx-30rpx">
|
||||
<wd-swiper value-key="image" height="240rpx" indicatorPosition="bottom-left"
|
||||
<wd-swiper height="240rpx" indicatorPosition="bottom-left"
|
||||
:indicator="{ type: 'dots-bar' }" :list="swiperList" v-model:current="current"
|
||||
@click="Index.handleClick" @change="Index.onChange" mode="aspectFit"></wd-swiper>
|
||||
@click="Index.handleClick" mode="aspectFit"></wd-swiper>
|
||||
</view>
|
||||
|
||||
<view class="mt-40rpx flex items-center h-36rpx mx-30rpx">
|
||||
@ -56,28 +56,29 @@
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<mescroll-body @init="mescrollInit" @down="downCallback" @up="Index.upCallback" top="28rpx"
|
||||
<mescroll-body @init="mescrollInit" :down="downOption" @down="downCallback" :up="upOption" @up="Index.upCallback" top="28rpx"
|
||||
:fixed="true">
|
||||
<view class="relative p-20rp mb-24rpx" v-for="(item, index) in 100" :key="index" @click="Index.handleToReserveRoom(item)">
|
||||
<view class="relative p-20rp mb-24rpx" v-for="(item, index) in list" :key="index" @click="Index.handleToReserveRoom(item.id)">
|
||||
<view class="absolute top--28rpx left-0 z-1">
|
||||
<wd-img width="110rpx" height="110rpx" :src="`${OSS}images/home/home_image4.png`"/>
|
||||
</view>
|
||||
|
||||
<view class="mx-30rpx p-30rpx flex bg-white rounded-10rpx">
|
||||
<wd-img width="200rpx" height="200rpx" :src="`${OSS}images/home/home_image5.png`" radius="10rpx" />
|
||||
<wd-img width="200rpx" height="200rpx" :src="item.image" radius="10rpx" />
|
||||
<view class="flex-1 ml-28rpx flex justify-between line-1 items-start relative">
|
||||
<view class="line-1">
|
||||
<view class="font-bold text-30rpx leading-42rpx line-1">
|
||||
凝香茶业凝香茶业凝香茶业凝香茶业凝香茶业凝香茶业凝香茶业凝香茶业凝香茶业凝香茶业凝香茶业凝香茶业凝香茶业凝香茶业</view>
|
||||
{{ item.name }}
|
||||
</view>
|
||||
<view class="flex items-center mt-12rpx leading-34rpx">
|
||||
<view class="font-400 text-[#F29747] text-24rpx mr-18rpx">半年预约300+</view>
|
||||
<view class="font-400 text-[#F29747] text-24rpx mr-18rpx">半年预约{{ item.half_year_nums > 10 ? item.half_year_nums + '+' : item.half_year_nums }}</view>
|
||||
<view class="font-400 bg-[#F3F3F3] text-[#818CA9] text-22rpx px-8rpx rounded-4rpx">刚有人预约了</view>
|
||||
</view>
|
||||
<view class="flex items-center mt-12rpx leading-34rpx">
|
||||
<view class="font-400 text-[#606266] text-24rpx mr-10rpx">
|
||||
营业时间:00:00-23:59
|
||||
营业时间:{{ item.start_time }}-{{ item.end_time }}
|
||||
</view>
|
||||
<view class="font-400 bg-[#FFEEED] text-[#FF5951] text-22rpx px-4rpx rounded-4rpx border-[#F2E2E1]">
|
||||
<view class="font-400 bg-[#FFEEED] text-[#FF5951] text-22rpx px-4rpx rounded-4rpx border-[#F2E2E1]" v-if="item.shop_status == 0">
|
||||
打烊了
|
||||
</view>
|
||||
</view>
|
||||
@ -85,7 +86,7 @@
|
||||
<wd-img width="26rpx" height="26rpx" :src="`${OSS}icon/icon_location.png`"
|
||||
mode="aspectFit" />
|
||||
<view class="ml-4rpx line-1 font-400 text-22rpx text-[#606266] leading-32rpx">
|
||||
青浦区仓路478号
|
||||
{{ item.address }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -95,7 +96,7 @@
|
||||
<wd-icon name="add" color="#fff" size="20rpx" custom-style="font-weight: bold;" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="text-24rpx text-[#92928C] font-400 mt-12rpx">距您14km</view>
|
||||
<view class="text-24rpx text-[#92928C] font-400 mt-12rpx">距您{{ item.distance }}km</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -107,69 +108,105 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { router } from '@/utils/tools'
|
||||
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
|
||||
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
|
||||
import { handleEnsureLocationAuthHooks } from '@/hooks/useLocation'
|
||||
import { LOCATION_DENY_TIME_KEY, handleEnsureLocationAuthHooks } from '@/hooks/useLocation'
|
||||
import { getHomeBannerList } from '@/api/home'
|
||||
import { getHomeTeaRoomList } from '@/api/tea-room'
|
||||
import { useUserStore } from '@/store'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
const navbarHeight = inject('navbarHeight')
|
||||
|
||||
/** 轮播图 **/
|
||||
const swiperList = ref<string[]>([
|
||||
`${OSS}images/banner1.png`,
|
||||
`${OSS}images/banner1.png`,
|
||||
`${OSS}images/banner1.png`
|
||||
])
|
||||
const swiperList = ref<string[]>([])
|
||||
const current = ref<number>(0)
|
||||
|
||||
// 分页
|
||||
const { mescrollInit, downCallback } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
|
||||
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
|
||||
const downOption = {
|
||||
auto: true
|
||||
}
|
||||
const upOption = {
|
||||
auto: true,
|
||||
textNoMore: '~ 已经到底啦 ~', //无更多数据的提示
|
||||
}
|
||||
const latitude = ref<number>(0)
|
||||
const longitude = ref<number>(0)
|
||||
const keywords = ref<string>('')
|
||||
const list = ref<Array<any>>([])
|
||||
|
||||
onShow(async() => {
|
||||
// 等到onLoad执行完毕且获取到授权KEY后，才执行定位授权检查
|
||||
if (uni.getStorageSync(LOCATION_DENY_TIME_KEY)) {
|
||||
const location = await checkLocationAuthWithModal()
|
||||
if (location) {
|
||||
latitude.value = location.lat
|
||||
longitude.value = location.lng
|
||||
Index.handleResetSearch()
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
onLoad(async() => {
|
||||
// 初始化页面数据
|
||||
Index.handleInit()
|
||||
|
||||
// 获取用户经纬度（带缓存和授权逻辑）
|
||||
const { lat, lng } = await handleEnsureLocationAuthHooks()
|
||||
// 你可以在这里根据经纬度做后续处理，比如请求附近门店等
|
||||
console.log('当前定位：', lat, lng)
|
||||
latitude.value = lat
|
||||
longitude.value = lng
|
||||
Index.handleResetSearch()
|
||||
|
||||
})
|
||||
|
||||
const Index = {
|
||||
toCity: () => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/city/city'
|
||||
})
|
||||
},
|
||||
|
||||
toSearch: () => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/search/search'
|
||||
})
|
||||
},
|
||||
|
||||
// 上拉加载的回调: 其中num:当前页 从1开始, size:每页数据条数,默认10
|
||||
upCallback: (mescroll) => {
|
||||
// 需要留一下数据为空的时候显示的空数据图标内容
|
||||
const userStore = useUserStore()
|
||||
const userId = userStore.userInfo?.id || 0
|
||||
|
||||
// apiGoods(mescroll.num, mescroll.size).then(res=>{
|
||||
// const curPageData = res.list || [] // 当前页数据
|
||||
// if(mescroll.num == 1) goods.value = []; // 第一页需手动制空列表
|
||||
// goods.value = goods.value.concat(curPageData); //追加新数据
|
||||
// //联网成功的回调,隐藏下拉刷新和上拉加载的状态;
|
||||
// //mescroll会根据传的参数,自动判断列表如果无任何数据,则提示空;列表无下一页数据,则提示无更多数据;
|
||||
const filter = {
|
||||
page: mescroll.num,
|
||||
size: mescroll.size,
|
||||
latitude: latitude.value,
|
||||
longitude: longitude.value,
|
||||
search: keywords.value,
|
||||
user_id: userId
|
||||
}
|
||||
|
||||
// //方法一(推荐): 后台接口有返回列表的总页数 totalPage
|
||||
// //mescroll.endByPage(curPageData.length, totalPage); //必传参数(当前页的数据个数, 总页数)
|
||||
getHomeTeaRoomList(filter).then( res => {
|
||||
console.log("🚀 ~ res:", res)
|
||||
const curPageData = res.list || [] // 当前页数据
|
||||
if(mescroll.num == 1) list.value = [] // 第一页需手动制空列表
|
||||
list.value = list.value.concat(curPageData) //追加新数据
|
||||
mescroll.endSuccess(curPageData.length, Boolean(res.more))
|
||||
}).catch(() => {
|
||||
mescroll.endErr() // 请求失败, 结束加载
|
||||
})
|
||||
},
|
||||
|
||||
// //方法二(推荐): 后台接口有返回列表的总数据量 totalSize
|
||||
// //mescroll.endBySize(curPageData.length, totalSize); //必传参数(当前页的数据个数, 总数据量)
|
||||
handleInit: () => {
|
||||
// 初始化操作
|
||||
getHomeBannerList().then(res => {
|
||||
swiperList.value = res.list.map(item => item.address)
|
||||
})
|
||||
},
|
||||
|
||||
// //方法三(推荐): 您有其他方式知道是否有下一页 hasNext
|
||||
// //mescroll.endSuccess(curPageData.length, hasNext); //必传参数(当前页的数据个数, 是否有下一页true/false)
|
||||
handleToCity: () => {
|
||||
router.navigateTo(`/pages/city/city?lat=${latitude.value}&lng=${longitude.value}`)
|
||||
},
|
||||
|
||||
// //方法四 (不推荐),会存在一个小问题:比如列表共有20条数据,每页加载10条,共2页.如果只根据当前页的数据个数判断,则需翻到第三页才会知道无更多数据.
|
||||
// mescroll.endSuccess(curPageData.length); // 请求成功, 结束加载
|
||||
// }).catch(()=>{
|
||||
mescroll.endErr(); // 请求失败, 结束加载
|
||||
// })
|
||||
// 跳转茶室搜索
|
||||
handleToSearch: () => {
|
||||
uni.$on('refreshTeaRoomList', params => {
|
||||
keywords.value = params.keywords
|
||||
Index.handleResetSearch()
|
||||
|
||||
uni.$off('refreshTeaRoomList')
|
||||
})
|
||||
router.navigateTo(`/pages/search/search?keywords=${keywords.value}`)
|
||||
},
|
||||
|
||||
handleClick: (item: any) => {
|
||||
@ -177,16 +214,16 @@
|
||||
console.log('Clicked item:', item)
|
||||
},
|
||||
|
||||
onChange: (e: any) => {
|
||||
// 设置 current.value 为当前轮播索引
|
||||
current.value = e.current
|
||||
},
|
||||
|
||||
handleToReserveRoom: (id: number = 1) => {
|
||||
handleToReserveRoom: (id: number = 0) => {
|
||||
// 跳转到预约茶室页面
|
||||
uni.navigateTo({
|
||||
url: `/bundle/tea-room/room?id=${id}`
|
||||
})
|
||||
},
|
||||
|
||||
handleResetSearch: () => {
|
||||
list.value = []
|
||||
getMescroll().resetUpScroll()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -19,16 +19,18 @@
|
||||
<wd-img :src="`${OSS}images/logo.png`" width="100%" height="100%" mode="aspectFill"></wd-img>
|
||||
</view>
|
||||
<view class="mt-124rpx mx-60rpx box-border">
|
||||
<wd-button open-type="getPhoneNumber" @getphonenumber="login.handleGetPhoneNumber" custom-class="!bg-[#4C9F44] !rounded-8rpx !text-[#fff] !text-30rpx !leading-42rpx !h-90rpx !w-[100%] box-border">手机号一键登录</wd-button>
|
||||
<view class="text-30rpx font-400 text-[#303133] leading-42rpx text-center mt-32rpx">其它手机号登录</view>
|
||||
<wd-button custom-class="!bg-[#4C9F44] !rounded-8rpx !text-[#fff] !text-30rpx !leading-42rpx !h-90rpx !w-[100%] box-border" @click="Login.handleLogin">立即登录</wd-button>
|
||||
<wd-button custom-class="!bg-[#4C9F44] !rounded-8rpx !text-[#fff] !text-30rpx !leading-42rpx !h-90rpx !w-[100%] box-border" @click="Login.handleMobileLogin">测试-账号登录</wd-button>
|
||||
<!-- <wd-button open-type="getUserInfo" @getuserinfo="Login.handleWxLogin" custom-class="!bg-[#4C9F44] !rounded-8rpx !text-[#fff] !text-30rpx !leading-42rpx !h-90rpx !w-[100%] box-border">立即登录</wd-button> -->
|
||||
<!-- <view class="text-30rpx font-400 text-[#303133] leading-42rpx text-center mt-32rpx">其它手机号登录</view> -->
|
||||
</view>
|
||||
|
||||
<view class="flex items-center mx-32rpx mt-64rpx">
|
||||
<view class="w-32rpx h-32rpx">
|
||||
<wd-checkbox v-model="agree" @change="login.handleAgree" checked-color="#4C9F44" size="large"> </wd-checkbox>
|
||||
<wd-checkbox v-model="agree" @change="Login.handleAgree" checked-color="#4C9F44" size="large"> </wd-checkbox>
|
||||
</view>
|
||||
<view class="font-400 text-26rpx leading-40rpx text-[#8F959E] ml-14rpx flex-1" @click="agree = !agree">
|
||||
我已阅读并同意 <text class="text-[#4C9F44]" @click.stop="login.handleToService">《服务协议》</text> 和<text class="text-[#4C9F44]" @click.stop="login.handleToPrivacy">《隐私政策》</text>，未注册手机号登录后将自动你为您创建账号
|
||||
我已阅读并同意 <text class="text-[#4C9F44]" @click.stop="Login.handleToService">《服务协议》</text> 和<text class="text-[#4C9F44]" @click.stop="Login.handleToPrivacy">《隐私政策》</text>，未注册手机号登录后将自动你为您创建账号
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -36,19 +38,46 @@
|
||||
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { toast } from '@/utils/toast'
|
||||
import { getWxCode } from '@/api/login'
|
||||
import { useUserStore } from '@/store'
|
||||
import { router } from '@/utils/tools'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
|
||||
// 服务协议条款
|
||||
const agree = ref<boolean>(false)
|
||||
|
||||
const login = {
|
||||
const Login = {
|
||||
// 获取手机号
|
||||
handleGetPhoneNumber: (e: object) => {
|
||||
console.log("🚀 ~ e:", e)
|
||||
|
||||
handleLogin: async (e: object) => {
|
||||
if (!agree.value) {
|
||||
toast.info('请同意服务协议和隐私政策')
|
||||
return
|
||||
}
|
||||
|
||||
const userStore = useUserStore()
|
||||
const res = await userStore.wxLogin()
|
||||
if (res) {
|
||||
toast.info('登录成功')
|
||||
router.navigateBack(1, 500)
|
||||
}
|
||||
},
|
||||
|
||||
handleAgree: (e: any) => {
|
||||
console.log('e', e)
|
||||
// 手机登录
|
||||
handleMobileLogin: async () => {
|
||||
const userStore = useUserStore()
|
||||
console.log("🚀 ~ userStore:", userStore)
|
||||
const res = await userStore.mobileLogin('18868040087', 1, 2)
|
||||
if (res) {
|
||||
uni.setStorageSync('latitude', '30.74744')
|
||||
uni.setStorageSync('longitude', '120.78483')
|
||||
toast.info('登录成功')
|
||||
router.navigateBack(1, 500)
|
||||
}
|
||||
},
|
||||
|
||||
handleAgree: async (e: any) => {
|
||||
},
|
||||
|
||||
// 跳转到服务协议页面
|
||||
|
||||
@ -83,7 +83,7 @@
|
||||
<wd-img width="100%" height="100%" :src="`${OSS}icon/icon_vip.png`" mode="aspectFill"></wd-img>
|
||||
</view>
|
||||
<view class="flex items-center leading-34rpx" @click="My.handleToVipBenefits">
|
||||
<view class="font-400 text-24rpx ml-12rpx mr-20rpx text-[#EECC99]">2026.03.06到期</view>
|
||||
<view class="font-400 text-24rpx ml-12rpx mr-20rpx text-[#EECC99]">{{ isLogin ? '会员到期时间' : '- -' }}</view>
|
||||
<view class="flex items-center mt-4rpx">
|
||||
<wd-icon name="arrow-right" size="24rpx" color="#EECC99"></wd-icon>
|
||||
</view>
|
||||
@ -98,7 +98,7 @@
|
||||
<view class="flex items-center justify-between mx-40rpx">
|
||||
<view class="flex item-center leading-34rpx text-[#EECC99]">
|
||||
<view class="font-400 text-24rpx mr-18rpx">上月消费</view>
|
||||
<view class="font-400 text-28rpx mr-18rpx">￥23014.02</view>
|
||||
<view class="font-400 text-28rpx mr-18rpx">￥{{ isLogin ? '上月消费金额显示' : '- -' }}</view>
|
||||
</view>
|
||||
<view class="font-400 text-24rpx text-[#D2D0D0] leading-34rpx">请尽快领取会员权益</view>
|
||||
</view>
|
||||
@ -240,8 +240,10 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {OrderStatus} from '@/utils/order'
|
||||
import {toast} from '@/utils/toast'
|
||||
import { OrderStatus } from '@/utils/order'
|
||||
import { toast } from '@/utils/toast'
|
||||
import { router } from '@/utils/tools'
|
||||
import { useUserStore } from '@/store'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
const navbarHeight = inject('navbarHeight')
|
||||
@ -249,10 +251,9 @@
|
||||
|
||||
// 登录信息相关
|
||||
const userInfo = ref<any>(null)
|
||||
const isLogin = ref<boolean>(true)
|
||||
const isLogin = ref<boolean>(false)
|
||||
const isVip = ref<boolean>(true)
|
||||
|
||||
|
||||
// 茶室订单
|
||||
const roomMenuList = reactive([
|
||||
{ id: 1, title: '全部订单', icon: `${OSS}icon/icon_room_all_order.png`, badge: '', status: 'all' },
|
||||
@ -287,6 +288,12 @@
|
||||
// 领取优惠券
|
||||
const isClaimCoupon = ref<boolean>(false)
|
||||
|
||||
onShow(() => {
|
||||
const userStore = useUserStore()
|
||||
isLogin.value = userStore.isLoggedIn
|
||||
console.log("🚀 ~ isLogin.value:", isLogin.value)
|
||||
})
|
||||
|
||||
onLoad(() => {
|
||||
|
||||
})
|
||||
@ -294,24 +301,21 @@
|
||||
const My = {
|
||||
// 跳转抖音团购
|
||||
handleToDouYinGroupBuying: () => {
|
||||
uni.navigateTo({
|
||||
url: '/bundle/order/douyin/order-list'
|
||||
})
|
||||
router.navigateTo('/bundle/order/douyin/order-list')
|
||||
},
|
||||
|
||||
// 跳转到个人信息
|
||||
handleToProfile: () => {
|
||||
|
||||
uni.navigateTo({
|
||||
url: '/bundle/profile/profile'
|
||||
})
|
||||
if (isLogin.value) {
|
||||
router.navigateTo('/bundle/profile/profile')
|
||||
} else {
|
||||
router.navigateTo('/pages/login/login')
|
||||
}
|
||||
},
|
||||
|
||||
// 跳转平台团购
|
||||
handleToPlatformGroupBuying: () => {
|
||||
uni.navigateTo({
|
||||
url: '/bundle/order/platform/order-list'
|
||||
})
|
||||
router.navigateTo('/bundle/order/platform/order-list')
|
||||
},
|
||||
|
||||
// 点击显示客服电话
|
||||
@ -335,40 +339,48 @@
|
||||
showPompoCodePopup.value = true
|
||||
} else {
|
||||
toast.info('请先登录')
|
||||
setTimeout(() => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/login'
|
||||
})
|
||||
}, 800)
|
||||
router.navigateTo('/pages/login/login', 800)
|
||||
}
|
||||
},
|
||||
|
||||
// 跳转到会员权益
|
||||
handleToVipBenefits: () => {
|
||||
uni.navigateTo({
|
||||
url: '/bundle/vip/benefits'
|
||||
})
|
||||
if (isLogin.value) {
|
||||
router.navigateTo('/bundle/vip/my-benefits')
|
||||
} else {
|
||||
toast.info('请先登录')
|
||||
router.navigateTo('/pages/login/login', 800)
|
||||
}
|
||||
},
|
||||
|
||||
// 跳转到优惠券
|
||||
handleToCoupon: () => {
|
||||
uni.navigateTo({
|
||||
url: '/bundle/coupon/my-coupon'
|
||||
})
|
||||
if (isLogin.value) {
|
||||
router.navigateTo('/bundle/coupon/my-coupon')
|
||||
} else {
|
||||
toast.info('请先登录')
|
||||
router.navigateTo('/pages/login/login', 800)
|
||||
}
|
||||
},
|
||||
|
||||
// 跳转到收藏
|
||||
handleToCollect: () => {
|
||||
uni.navigateTo({
|
||||
url: '/bundle/collect/collect'
|
||||
})
|
||||
if (isLogin.value) {
|
||||
router.navigateTo('/bundle/collect/collect')
|
||||
} else {
|
||||
toast.info('请先登录')
|
||||
router.navigateTo('/pages/login/login', 800)
|
||||
}
|
||||
},
|
||||
|
||||
// 跳转到我的钱包
|
||||
handleToWallet: () => {
|
||||
uni.navigateTo({
|
||||
url: '/bundle/wallet/wallet'
|
||||
})
|
||||
if (isLogin.value) {
|
||||
router.navigateTo('/bundle/wallet/wallet')
|
||||
} else {
|
||||
toast.info('请先登录')
|
||||
router.navigateTo('/pages/login/login', 800)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
<!-- 使用 type="home" 属性设置首页，其他页面不需要设置，默认为page -->
|
||||
<route lang="jsonc" type="page">{
|
||||
"needLogin": true,
|
||||
"layout": "tabbar",
|
||||
"style": {
|
||||
// 'custom' 表示开启自定义导航栏，默认 'default'
|
||||
@ -11,57 +12,125 @@
|
||||
<view class="">
|
||||
<view class="home-bg">
|
||||
<view class="home-bg w-[100vw] fixed top-0 left-0 z-100">
|
||||
<wd-navbar safeAreaInsetTop :bordered="false" custom-style="background-color: transparent !important;">
|
||||
<template #left>
|
||||
<view class="flex items-center" @click="search.back">
|
||||
<wd-img width="48rpx" height="48rpx" :src="`${OSS}icon/icon_arrow_left.png`" />
|
||||
<wd-navbar safeAreaInsetTop custom-class='!bg-[#F6F7F8]' :bordered="false" placeholder>
|
||||
<template #left>
|
||||
<view class="h-48rpx flex items-center">
|
||||
<view class="mt-4rpx" @click="router.navigateBack()">
|
||||
<wd-icon name="thin-arrow-left" size="30rpx"></wd-icon>
|
||||
</view>
|
||||
</template>
|
||||
<template #title>
|
||||
<view class="search-box flex items-center ml-26rpx">
|
||||
<wd-search v-model="keywords" placeholder="搜索茶址名称" hide-cancel placeholder-left
|
||||
placeholderStyle="text-align:left;line-heigt: 44rpx;color: #C9C9C9; font-size: 32rpx;font-weight: normal;"></wd-search>
|
||||
<view class="search-box ml-20rpx">
|
||||
<wd-search
|
||||
v-model="keywords"
|
||||
hide-cancel
|
||||
placeholder-left
|
||||
light
|
||||
placeholder="搜索茶址名称"
|
||||
placeholderStyle="text-align:left;line-heigt: 44rpx;color: #C9C9C9; font-size: 32rpx;font-weight: normal;"
|
||||
@search="Search.handleSearch">
|
||||
</wd-search>
|
||||
</view>
|
||||
</template>
|
||||
</wd-navbar>
|
||||
</view>
|
||||
</template>
|
||||
</wd-navbar>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mx-30rpx mt-30rpx" :style="{ paddingTop: navbarHeight + 'px' }">
|
||||
<view class="flex justify-between items-center">
|
||||
<view class="flex justify-between items-center" @click="Search.handleClearHistory">
|
||||
<view class="text-30rpx leading-42rpx text-[#303133] font-bold">历史搜索</view>
|
||||
<wd-icon name="delete-thin" size="22px" color="9D9D9D"></wd-icon>
|
||||
</view>
|
||||
|
||||
<view class="mt-40rpx flex flex-wrap items-center">
|
||||
<view class="bg-[#F8F9FA] rounded-28rpx w-112rpx h-56rpx text-center text-[#606266] text-26rpx leading-56rpx mr-20rpx mb-24rpx" v-for="(item, index) in 10" :key="index">
|
||||
茶叶
|
||||
<view class="bg-[#F8F9FA] rounded-28rpx w-112rpx h-56rpx text-center text-[#606266] text-26rpx leading-56rpx mr-20rpx mb-24rpx" v-for="(item, index) in searchHistory" :key="index">
|
||||
{{ item.content }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 删除历史 -->
|
||||
<wd-message-box selector="wd-message-box-slot"></wd-message-box>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, inject } from 'vue'
|
||||
import { getNavBarHeight } from '@/utils/index'
|
||||
import { getTeaRoomSearchHistory, clearTeaRoomSearchHistory } from '@/api/tea-room'
|
||||
import { router } from '@/utils/tools'
|
||||
import { useMessage } from 'wot-design-uni'
|
||||
|
||||
let navbarHeight = ref(0)
|
||||
let OSS = inject('OSS')
|
||||
const navbarHeight = ref(0)
|
||||
|
||||
// 提示框
|
||||
const message = useMessage('wd-message-box-slot')
|
||||
|
||||
// 搜索关键词
|
||||
const keywords = ref<string>('')
|
||||
|
||||
onLoad(() => {
|
||||
navbarHeight.value = getNavBarHeight()
|
||||
// 搜索历史
|
||||
const searchHistory = ref<Array<any>>([])
|
||||
|
||||
onShow(() => {
|
||||
Search.handleInit()
|
||||
})
|
||||
|
||||
const search = {
|
||||
back: () => {
|
||||
uni.navigateBack({
|
||||
delta: 1,
|
||||
onLoad((args) => {
|
||||
navbarHeight.value = getNavBarHeight()
|
||||
keywords.value = args.keywords || ''
|
||||
})
|
||||
|
||||
const Search = {
|
||||
// 初始化
|
||||
handleInit: () => {
|
||||
console.log("🚀 ~ Search.handleInit:")
|
||||
getTeaRoomSearchHistory().then( res => {
|
||||
searchHistory.value = res.list
|
||||
console.log('搜索历史123', res.list)
|
||||
})
|
||||
},
|
||||
|
||||
// 搜索
|
||||
handleSearch: () => {
|
||||
const params = {
|
||||
keywords: keywords.value
|
||||
}
|
||||
uni.$emit('refreshTeaRoomList', params)
|
||||
router.navigateBack()
|
||||
},
|
||||
|
||||
// 清除搜索历史
|
||||
handleClearHistory: () => {
|
||||
message.confirm({
|
||||
title: '删除',
|
||||
msg: '是否清空搜索历史',
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
cancelButtonProps: {
|
||||
customClass: '!bg-[#F6F7F8] !text-[#303133] !text-32rpx !leading-44rpx !rounded-8rpx',
|
||||
},
|
||||
confirmButtonProps: {
|
||||
customClass: '!bg-[#4C9F44] !text-[#fff] !text-32rpx !leading-44rpx !rounded-8rpx',
|
||||
}
|
||||
}).then((res) => {
|
||||
// 点击确认按钮回调事件
|
||||
if (res.action === 'confirm') {
|
||||
try {
|
||||
uni.showLoading({
|
||||
title: '删除中...',
|
||||
mask: true
|
||||
})
|
||||
clearTeaRoomSearchHistory().then(() => {
|
||||
searchHistory.value = []
|
||||
uni.hideLoading()
|
||||
})
|
||||
} catch (e) {
|
||||
uni.hideLoading()
|
||||
}
|
||||
}
|
||||
}).catch(() => {
|
||||
// 点击取消按钮回调事件
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user