添加页面
This commit is contained in:
wangxiaowei
@ -7,7 +7,7 @@
|
||||
}</route>
|
||||
|
||||
<template>
|
||||
<view class="mt-26rpx">
|
||||
<view>
|
||||
<view>
|
||||
<navbar title="订单详情" custom-class="!bg-[transparent]"></navbar>
|
||||
</view>
|
||||
|
||||
241
src/bundle/profile/change-mobile.vue
Normal file
241
src/bundle/profile/change-mobile.vue
Normal file
@ -0,0 +1,241 @@
|
||||
<route lang="jsonc" type="page">{
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}</route>
|
||||
|
||||
<template>
|
||||
<view>
|
||||
<view class="mx-60rpx mt-20rpx">
|
||||
<view class="text-[#303133] text-48rpx leading-80rpx font-600">
|
||||
修改手机号码
|
||||
</view>
|
||||
<view class="font-400 text-28rpx leading-44rpx text-[#6B7280] mt-12rpx">手机号一年内可修改2次</view>
|
||||
</view>
|
||||
<view class="mt-106rpx mx-48rpx">
|
||||
<wd-form ref="form" :model="model">
|
||||
<view>
|
||||
<view class="font-400 text-30rpx text-[#606266] leading-44rpx">手机号</view>
|
||||
<view class="mt-20rpx">
|
||||
<wd-input
|
||||
v-model="model.mobile"
|
||||
type="text"
|
||||
placeholder="请输入手机号码"
|
||||
inputmode="numeric"
|
||||
no-border
|
||||
custom-class="!bg-[#F6F7F8] !border !border-solid !border-[#EAECF0] !rounded-16rpx"
|
||||
custom-input-class="!px-32rpx !h-104rpx"
|
||||
@input="mobile.handleInputMobile"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-40rpx">
|
||||
<view class="font-400 text-30rpx text-[#606266] leading-44rpx">验证码</view>
|
||||
<view class="mt-20rpx">
|
||||
<wd-input type="text" placeholder="请输入验证码" v-model="model.code" inputmode="numeric" no-border custom-class="!bg-[#F6F7F8] !border !border-solid !border-[#EAECF0] !rounded-16rpx" custom-input-class="!px-32rpx !h-104rpx">
|
||||
<template #suffix>
|
||||
<view class="flex items-center mr-34rpx">
|
||||
<view class="flex items-center">
|
||||
<wd-divider color="#C9C9C9" vertical />
|
||||
</view>
|
||||
|
||||
<view class="flex items-center">
|
||||
<view class="text-[#4C9F44] text-32rpx font-400 leading-44rpx" v-if="!startCountDown" @click="mobile.handleCountDown">发送验证码</view>
|
||||
<view class="!text-[#C9C9C9] text-32rpx font-400 leading-44rpx flex items-center" v-if="startCountDown">
|
||||
<wd-count-down ref="countDown" :time="countDownTime" millisecond :auto-start="false" format="ss" custom-class="!text-[#C9C9C9] !text-32rpx" @finish="mobile.handleFinishCountDown"></wd-count-down>
|
||||
<view> S后重发</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</wd-input>
|
||||
</view>
|
||||
</view>
|
||||
</wd-form>
|
||||
</view>
|
||||
|
||||
<view class="h-90rpx leading-90rpx mx-60rpx rounded-8rpx text-center mt-112rpx bg-[#4C9F44] text-[#fff]" :class="disabled ? 'opacity-40' : ''" @click="mobile.handleToLogin">登录</view>
|
||||
|
||||
<view class="flex items-center mx-52rpx mt-56rpx" v-if="pageType === 'login'">
|
||||
<view class="w-32rpx h-32rpx">
|
||||
<wd-checkbox v-model="agree" @change="mobile.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="mobile.handleToService">《服务协议》</text> 和<text class="text-[#4C9F44]" @click.stop="mobile.handleToPrivacy">《隐私政策》</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 手机号修改成功 -->
|
||||
<wd-popup v-model="showEditSuccessPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
|
||||
<view class="relative pt-64rpx pb-74rpx">
|
||||
<view class="flex justify-center items-center">
|
||||
<view class="bg-[#4C9F44] w-280rpx rounded-280rpx">
|
||||
<wd-img width="280rpx" height="280rpx" :src="`${OSS}images/reserve_room/reserve_room_image7.png`"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="text-[#303133] text-36rpx leading-46rpx text-center mt-48rpx">手机号修改成功</view>
|
||||
<view class="text-[#9CA3AF] text-28rpx leading-44rpx mt-16rpx text-center">{{ page.desc }}</view>
|
||||
<view class="w-630rpx h-90rpx leading-90rpx text-center bg-[#4C9F44] rounded-8rpx text-[#fff] mt-174rpx mx-auto" @click="mobile.handleToBack">好的</view>
|
||||
</view>
|
||||
</wd-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {mobile as testMobile} from '@/utils/test'
|
||||
import { useToast } from 'wot-design-uni'
|
||||
import { router } from '@/utils/tools'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
const toast = useToast()
|
||||
const disabled = ref<boolean>(true)
|
||||
|
||||
/** 页面 **/
|
||||
let pageType = 'login' // 页面类型 login:登录 edit:修改手机号
|
||||
const page = ref<{title: string, desc: string}>({title: '其他手机号登录', desc: '请输入你要登录的手机号'})
|
||||
const showEditSuccessPopup = ref<boolean>(false) // 显示手机号修改成功弹窗
|
||||
const userId = ref<number>(0) // 用户ID，修改手机号时需要传
|
||||
|
||||
/** 验证码倒计时 **/
|
||||
const countDownTime = ref<number>(1 * 60 * 1000) // 60s倒计时
|
||||
const startCountDown = ref<boolean>(false) // 是否开始倒计时
|
||||
const countDown = ref<any>(null) // 倒计时组件
|
||||
|
||||
/** 表单相关 **/
|
||||
const model = reactive<{
|
||||
mobile: string
|
||||
code: string
|
||||
}>({
|
||||
mobile: '',
|
||||
code: ''
|
||||
})
|
||||
/** 结束 **/
|
||||
|
||||
/** 服务协议和隐私政策 **/
|
||||
const agree = ref<boolean>(false)
|
||||
/** 结束 **/
|
||||
|
||||
onLoad((args) => {
|
||||
// 从个人登录页面进入
|
||||
if (args.type === 'edit') {
|
||||
userId.value = Number(args.userId) || 0 // userId仅做测试使用，实际请传真实用户ID
|
||||
|
||||
page.value.title = '修改手机号'
|
||||
page.value.desc = '手机号一年内可修改2次'
|
||||
pageType = 'edit'
|
||||
}
|
||||
})
|
||||
|
||||
const mobile = {
|
||||
// 验证手机号
|
||||
handleInputMobile: (e: {value: string}) => {
|
||||
model.mobile = e.value
|
||||
disabled.value = !testMobile(model.mobile)
|
||||
},
|
||||
|
||||
// 发送验证码
|
||||
handleCountDown: () => {
|
||||
if (disabled.value) {
|
||||
toast.show({
|
||||
iconClass: 'info-circle',
|
||||
msg: '手机号码错误请重新输入',
|
||||
direction: 'vertical'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
startCountDown.value = true
|
||||
nextTick(() => {
|
||||
countDown.value?.start()
|
||||
|
||||
// 发送验证码请求
|
||||
})
|
||||
},
|
||||
|
||||
// 验证码倒计时结束
|
||||
handleFinishCountDown: () => {
|
||||
startCountDown.value = false
|
||||
},
|
||||
|
||||
// 登录
|
||||
handleToLogin: () => {
|
||||
// TODO 如果是edit的话就是修改手机号
|
||||
|
||||
if (pageType === 'login' && !agree.value) {
|
||||
toast.show({
|
||||
iconClass: 'info-circle',
|
||||
msg: '请同意服务协议和隐私政策',
|
||||
direction: 'vertical'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
if (!testMobile(model.mobile)) {
|
||||
toast.show({
|
||||
iconClass: 'info-circle',
|
||||
msg: '手机号码错误请重新输入',
|
||||
direction: 'vertical'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
if (!model.code) {
|
||||
toast.show({
|
||||
iconClass: 'info-circle',
|
||||
msg: '验证码错误',
|
||||
direction: 'vertical'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
router.navigateTo('/bundle/profile/set-password')
|
||||
},
|
||||
|
||||
// 获取手机号
|
||||
handleGetPhoneNumber: (e: object) => {
|
||||
console.log("🚀 ~ e:", e)
|
||||
},
|
||||
|
||||
handleAgree: (e: any) => {
|
||||
console.log('e', e)
|
||||
},
|
||||
|
||||
// 跳转到服务协议页面
|
||||
handleToService: () => {
|
||||
disabled.value = !disabled.value
|
||||
console.log("🚀 ~ disabled:", disabled)
|
||||
},
|
||||
|
||||
// 跳转到隐私政策页面
|
||||
handleToPrivacy: () => {
|
||||
|
||||
},
|
||||
|
||||
// 修改手机成功后返回
|
||||
handleToBack: () => {
|
||||
uni.navigateBack()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.service {
|
||||
:deep() {
|
||||
.wd-checkbox {
|
||||
display: flex;
|
||||
align-content: flex-start;
|
||||
}
|
||||
|
||||
.wd-checkbox__label {
|
||||
margin-left: 6rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
219
src/bundle/profile/change-password.vue
Normal file
219
src/bundle/profile/change-password.vue
Normal file
@ -0,0 +1,219 @@
|
||||
<route lang="jsonc" type="page">{
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}</route>
|
||||
|
||||
<template>
|
||||
<view>
|
||||
<view class="mx-60rpx mt-20rpx">
|
||||
<view class="text-[#303133] text-48rpx leading-80rpx font-600">
|
||||
修改密码
|
||||
</view>
|
||||
<view class="font-400 text-28rpx leading-44rpx text-[#6B7280] mt-12rpx">需要验证绑定手机</view>
|
||||
</view>
|
||||
<view class="mt-106rpx mx-48rpx">
|
||||
<wd-form ref="form" :model="model">
|
||||
<view>
|
||||
<view class="font-400 text-30rpx text-[#606266] leading-44rpx">手机号</view>
|
||||
<view class="mt-20rpx">
|
||||
<wd-input
|
||||
v-model="model.mobile"
|
||||
type="text"
|
||||
placeholder="请输入手机号码"
|
||||
inputmode="numeric"
|
||||
no-border
|
||||
custom-class="!bg-[#F6F7F8] !border !border-solid !border-[#EAECF0] !rounded-16rpx"
|
||||
custom-input-class="!px-32rpx !h-104rpx"
|
||||
@input="mobile.handleInputMobile"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-40rpx">
|
||||
<view class="font-400 text-30rpx text-[#606266] leading-44rpx">验证码</view>
|
||||
<view class="mt-20rpx">
|
||||
<wd-input type="text" placeholder="请输入验证码" v-model="model.code" inputmode="numeric" no-border custom-class="!bg-[#F6F7F8] !border !border-solid !border-[#EAECF0] !rounded-16rpx" custom-input-class="!px-32rpx !h-104rpx">
|
||||
<template #suffix>
|
||||
<view class="flex items-center mr-34rpx">
|
||||
<view class="flex items-center">
|
||||
<wd-divider color="#C9C9C9" vertical />
|
||||
</view>
|
||||
|
||||
<view class="flex items-center">
|
||||
<view class="text-[#4C9F44] text-32rpx font-400 leading-44rpx" v-if="!startCountDown" @click="mobile.handleCountDown">发送验证码</view>
|
||||
<view class="!text-[#C9C9C9] text-32rpx font-400 leading-44rpx flex items-center" v-if="startCountDown">
|
||||
<wd-count-down ref="countDown" :time="countDownTime" millisecond :auto-start="false" format="ss" custom-class="!text-[#C9C9C9] !text-32rpx" @finish="mobile.handleFinishCountDown"></wd-count-down>
|
||||
<view> S后重发</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</wd-input>
|
||||
</view>
|
||||
</view>
|
||||
</wd-form>
|
||||
</view>
|
||||
|
||||
<view class="h-90rpx leading-90rpx mx-60rpx rounded-8rpx text-center mt-112rpx bg-[#4C9F44] text-[#fff]" :class="disabled ? 'opacity-40' : ''" @click="mobile.handleToLogin">下一步</view>
|
||||
|
||||
<!-- 手机号修改成功 -->
|
||||
<wd-popup v-model="showEditSuccessPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
|
||||
<view class="relative pt-64rpx pb-74rpx">
|
||||
<view class="flex justify-center items-center">
|
||||
<view class="bg-[#4C9F44] w-280rpx rounded-280rpx">
|
||||
<wd-img width="280rpx" height="280rpx" :src="`${OSS}images/reserve_room/reserve_room_image7.png`"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="text-[#303133] text-36rpx leading-46rpx text-center mt-48rpx">手机号修改成功</view>
|
||||
<view class="text-[#9CA3AF] text-28rpx leading-44rpx mt-16rpx text-center">{{ page.desc }}</view>
|
||||
<view class="w-630rpx h-90rpx leading-90rpx text-center bg-[#4C9F44] rounded-8rpx text-[#fff] mt-174rpx mx-auto" @click="mobile.handleToBack">好的</view>
|
||||
</view>
|
||||
</wd-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {mobile as testMobile} from '@/utils/test'
|
||||
import { useToast } from 'wot-design-uni'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
const toast = useToast()
|
||||
const disabled = ref<boolean>(true)
|
||||
|
||||
/** 页面 **/
|
||||
let pageType = 'login' // 页面类型 login:登录 edit:修改手机号
|
||||
const page = ref<{title: string, desc: string}>({title: '其他手机号登录', desc: '请输入你要登录的手机号'})
|
||||
const showEditSuccessPopup = ref<boolean>(false) // 显示手机号修改成功弹窗
|
||||
const userId = ref<number>(0) // 用户ID，修改手机号时需要传
|
||||
|
||||
/** 验证码倒计时 **/
|
||||
const countDownTime = ref<number>(1 * 60 * 1000) // 60s倒计时
|
||||
const startCountDown = ref<boolean>(false) // 是否开始倒计时
|
||||
const countDown = ref<any>(null) // 倒计时组件
|
||||
|
||||
/** 表单相关 **/
|
||||
const model = reactive<{
|
||||
mobile: string
|
||||
code: string
|
||||
}>({
|
||||
mobile: '',
|
||||
code: ''
|
||||
})
|
||||
/** 结束 **/
|
||||
|
||||
/** 服务协议和隐私政策 **/
|
||||
const agree = ref<boolean>(false)
|
||||
/** 结束 **/
|
||||
|
||||
onLoad((args) => {
|
||||
// 从个人登录页面进入
|
||||
if (args.type === 'edit') {
|
||||
userId.value = Number(args.userId) || 0 // userId仅做测试使用，实际请传真实用户ID
|
||||
|
||||
page.value.title = '修改手机号'
|
||||
page.value.desc = '手机号一年内可修改2次'
|
||||
pageType = 'edit'
|
||||
}
|
||||
})
|
||||
|
||||
const mobile = {
|
||||
// 验证手机号
|
||||
handleInputMobile: (e: {value: string}) => {
|
||||
model.mobile = e.value
|
||||
disabled.value = !testMobile(model.mobile)
|
||||
},
|
||||
|
||||
// 发送验证码
|
||||
handleCountDown: () => {
|
||||
if (disabled.value) {
|
||||
toast.show({
|
||||
iconClass: 'info-circle',
|
||||
msg: '手机号码错误请重新输入',
|
||||
direction: 'vertical'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
startCountDown.value = true
|
||||
nextTick(() => {
|
||||
countDown.value?.start()
|
||||
|
||||
// 发送验证码请求
|
||||
})
|
||||
},
|
||||
|
||||
// 验证码倒计时结束
|
||||
handleFinishCountDown: () => {
|
||||
startCountDown.value = false
|
||||
},
|
||||
|
||||
// 登录
|
||||
handleToLogin: () => {
|
||||
// TODO 如果是edit的话就是修改手机号
|
||||
if (!testMobile(model.mobile)) {
|
||||
toast.show({
|
||||
iconClass: 'info-circle',
|
||||
msg: '手机号码错误请重新输入',
|
||||
direction: 'vertical'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
if (!model.code) {
|
||||
toast.show({
|
||||
iconClass: 'info-circle',
|
||||
msg: '验证码错误',
|
||||
direction: 'vertical'
|
||||
})
|
||||
return
|
||||
}
|
||||
},
|
||||
|
||||
// 获取手机号
|
||||
handleGetPhoneNumber: (e: object) => {
|
||||
console.log("🚀 ~ e:", e)
|
||||
},
|
||||
|
||||
handleAgree: (e: any) => {
|
||||
console.log('e', e)
|
||||
},
|
||||
|
||||
// 跳转到服务协议页面
|
||||
handleToService: () => {
|
||||
disabled.value = !disabled.value
|
||||
console.log("🚀 ~ disabled:", disabled)
|
||||
},
|
||||
|
||||
// 跳转到隐私政策页面
|
||||
handleToPrivacy: () => {
|
||||
|
||||
},
|
||||
|
||||
// 修改手机成功后返回
|
||||
handleToBack: () => {
|
||||
uni.navigateBack()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.service {
|
||||
:deep() {
|
||||
.wd-checkbox {
|
||||
display: flex;
|
||||
align-content: flex-start;
|
||||
}
|
||||
|
||||
.wd-checkbox__label {
|
||||
margin-left: 6rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,6 +1,5 @@
|
||||
<route lang="jsonc" type="page">
|
||||
{
|
||||
"needLogin": true,
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
@ -101,7 +100,7 @@
|
||||
</view>
|
||||
|
||||
<!-- 修改手机号 -->
|
||||
<view class="flex justify-between items-center" @click="Profile.handleToEditMobile">
|
||||
<view class="flex justify-between items-center mb-54rpx" @click="Profile.handleToEditMobile">
|
||||
<view class="font-400 text-[#303133] text-30rpx leading-42rpx">修改手机号</view>
|
||||
<view class="flex justify-end">
|
||||
<view class="flex items-center">
|
||||
@ -114,6 +113,36 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 修改手机号 -->
|
||||
<view class="flex justify-between items-center mb-54rpx" @click="router.navigateTo('/bundle/profile/change-password')">
|
||||
<view class="font-400 text-[#303133] text-30rpx leading-42rpx">修改手机号</view>
|
||||
<view class="flex justify-end">
|
||||
<view class="flex items-center">
|
||||
<view class="font-400 text-[#303133] text-30rpx leading-42rpx">
|
||||
{{ user.nickname }}
|
||||
</view>
|
||||
<view>
|
||||
<wd-icon name="arrow-right" size="32rpx" color="#C0C4CC" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 修改绑定用户 -->
|
||||
<view class="flex justify-between items-center" @click="router.navigateTo('/bundle/profile/change-password')">
|
||||
<view class="font-400 text-[#303133] text-30rpx leading-42rpx">修改绑定用户</view>
|
||||
<view class="flex justify-end">
|
||||
<view class="flex items-center">
|
||||
<view class="font-400 text-[#303133] text-30rpx leading-42rpx">
|
||||
{{ user.nickname }}
|
||||
</view>
|
||||
<view>
|
||||
<wd-icon name="arrow-right" size="32rpx" color="#C0C4CC" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bg-white rounded-16rpx mt-144rpx mx-30rpx px-30rpx py-32rpx text-center font-400 text-[#303133] text-30rpx leading-42rpx" @click="showLogoutPopup = true">
|
||||
@ -166,7 +195,7 @@
|
||||
onLoad(() => {
|
||||
token.value = uni.getStorageSync('token')
|
||||
|
||||
Profile.handleInit()
|
||||
// Profile.handleInit()
|
||||
})
|
||||
|
||||
const Profile = {
|
||||
|
||||
223
src/bundle/profile/set-password.vue
Normal file
223
src/bundle/profile/set-password.vue
Normal file
@ -0,0 +1,223 @@
|
||||
<route lang="jsonc" type="page">{
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"navigationBarBackgroundColor": "#fff"
|
||||
}
|
||||
}</route>
|
||||
|
||||
<template>
|
||||
<view>
|
||||
<view class="mx-60rpx mt-20rpx">
|
||||
<view class="text-[#303133] text-48rpx leading-80rpx font-600">
|
||||
设置新密码
|
||||
</view>
|
||||
<view class="font-400 text-28rpx leading-44rpx text-[#6B7280] mt-12rpx">请设置你得新密码</view>
|
||||
</view>
|
||||
<view class="mt-106rpx mx-48rpx">
|
||||
<wd-form ref="form" :model="model">
|
||||
<view>
|
||||
<view class="font-400 text-30rpx text-[#606266] leading-44rpx">密码</view>
|
||||
<view class="mt-20rpx">
|
||||
<wd-input
|
||||
v-model="model.mobile"
|
||||
type="text"
|
||||
placeholder="请输入密码"
|
||||
inputmode="numeric"
|
||||
no-border
|
||||
custom-class="!bg-[#F6F7F8] !border !border-solid !border-[#EAECF0] !rounded-16rpx"
|
||||
custom-input-class="!px-32rpx !h-104rpx"
|
||||
@input="mobile.handleInputMobile"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<view class="font-400 text-30rpx text-[#606266] leading-44rpx">再次确认</view>
|
||||
<view class="mt-20rpx">
|
||||
<wd-input
|
||||
v-model="model.mobile"
|
||||
type="text"
|
||||
placeholder="再次确认新的密码"
|
||||
inputmode="numeric"
|
||||
no-border
|
||||
custom-class="!bg-[#F6F7F8] !border !border-solid !border-[#EAECF0] !rounded-16rpx"
|
||||
custom-input-class="!px-32rpx !h-104rpx"
|
||||
@input="mobile.handleInputMobile"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</wd-form>
|
||||
</view>
|
||||
|
||||
<view class="h-90rpx leading-90rpx mx-60rpx rounded-8rpx text-center mt-112rpx bg-[#4C9F44] text-[#fff]" :class="disabled ? 'opacity-40' : ''" @click="mobile.handleToLogin">确定</view>
|
||||
|
||||
<!-- 手机号修改成功 -->
|
||||
<wd-popup v-model="showEditSuccessPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
|
||||
<view class="relative pt-64rpx pb-74rpx">
|
||||
<view class="flex justify-center items-center">
|
||||
<view class="bg-[#4C9F44] w-280rpx rounded-280rpx">
|
||||
<wd-img width="280rpx" height="280rpx" :src="`${OSS}images/reserve_room/reserve_room_image7.png`"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="text-[#303133] text-36rpx leading-46rpx text-center mt-48rpx">密码修改成功</view>
|
||||
<view class="text-[#9CA3AF] text-28rpx leading-44rpx mt-16rpx text-center">请记住你的登录密码</view>
|
||||
<view class="w-630rpx h-90rpx leading-90rpx text-center bg-[#4C9F44] rounded-8rpx text-[#fff] mt-174rpx mx-auto" @click="mobile.handleToBack">好的</view>
|
||||
</view>
|
||||
</wd-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {mobile as testMobile} from '@/utils/test'
|
||||
import { useToast } from 'wot-design-uni'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
const toast = useToast()
|
||||
const disabled = ref<boolean>(true)
|
||||
|
||||
/** 页面 **/
|
||||
let pageType = 'login' // 页面类型 login:登录 edit:修改手机号
|
||||
const page = ref<{title: string, desc: string}>({title: '其他手机号登录', desc: '请输入你要登录的手机号'})
|
||||
const showEditSuccessPopup = ref<boolean>(false) // 显示手机号修改成功弹窗
|
||||
const userId = ref<number>(0) // 用户ID，修改手机号时需要传
|
||||
|
||||
/** 验证码倒计时 **/
|
||||
const countDownTime = ref<number>(1 * 60 * 1000) // 60s倒计时
|
||||
const startCountDown = ref<boolean>(false) // 是否开始倒计时
|
||||
const countDown = ref<any>(null) // 倒计时组件
|
||||
|
||||
/** 表单相关 **/
|
||||
const model = reactive<{
|
||||
mobile: string
|
||||
code: string
|
||||
}>({
|
||||
mobile: '',
|
||||
code: ''
|
||||
})
|
||||
/** 结束 **/
|
||||
|
||||
/** 服务协议和隐私政策 **/
|
||||
const agree = ref<boolean>(false)
|
||||
/** 结束 **/
|
||||
|
||||
onLoad((args) => {
|
||||
// 从个人登录页面进入
|
||||
if (args.type === 'edit') {
|
||||
userId.value = Number(args.userId) || 0 // userId仅做测试使用，实际请传真实用户ID
|
||||
|
||||
page.value.title = '修改手机号'
|
||||
page.value.desc = '手机号一年内可修改2次'
|
||||
pageType = 'edit'
|
||||
}
|
||||
})
|
||||
|
||||
const mobile = {
|
||||
// 验证手机号
|
||||
handleInputMobile: (e: {value: string}) => {
|
||||
model.mobile = e.value
|
||||
disabled.value = !testMobile(model.mobile)
|
||||
},
|
||||
|
||||
// 发送验证码
|
||||
handleCountDown: () => {
|
||||
if (disabled.value) {
|
||||
toast.show({
|
||||
iconClass: 'info-circle',
|
||||
msg: '手机号码错误请重新输入',
|
||||
direction: 'vertical'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
startCountDown.value = true
|
||||
nextTick(() => {
|
||||
countDown.value?.start()
|
||||
|
||||
// 发送验证码请求
|
||||
})
|
||||
},
|
||||
|
||||
// 验证码倒计时结束
|
||||
handleFinishCountDown: () => {
|
||||
startCountDown.value = false
|
||||
},
|
||||
|
||||
// 登录
|
||||
handleToLogin: () => {
|
||||
// TODO 如果是edit的话就是修改手机号
|
||||
|
||||
if (pageType === 'login' && !agree.value) {
|
||||
toast.show({
|
||||
iconClass: 'info-circle',
|
||||
msg: '请同意服务协议和隐私政策',
|
||||
direction: 'vertical'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
if (!testMobile(model.mobile)) {
|
||||
toast.show({
|
||||
iconClass: 'info-circle',
|
||||
msg: '手机号码错误请重新输入',
|
||||
direction: 'vertical'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
if (!model.code) {
|
||||
toast.show({
|
||||
iconClass: 'info-circle',
|
||||
msg: '验证码错误',
|
||||
direction: 'vertical'
|
||||
})
|
||||
return
|
||||
}
|
||||
},
|
||||
|
||||
// 获取手机号
|
||||
handleGetPhoneNumber: (e: object) => {
|
||||
console.log("🚀 ~ e:", e)
|
||||
},
|
||||
|
||||
handleAgree: (e: any) => {
|
||||
console.log('e', e)
|
||||
},
|
||||
|
||||
// 跳转到服务协议页面
|
||||
handleToService: () => {
|
||||
disabled.value = !disabled.value
|
||||
console.log("🚀 ~ disabled:", disabled)
|
||||
},
|
||||
|
||||
// 跳转到隐私政策页面
|
||||
handleToPrivacy: () => {
|
||||
|
||||
},
|
||||
|
||||
// 修改手机成功后返回
|
||||
handleToBack: () => {
|
||||
uni.navigateBack()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.service {
|
||||
:deep() {
|
||||
.wd-checkbox {
|
||||
display: flex;
|
||||
align-content: flex-start;
|
||||
}
|
||||
|
||||
.wd-checkbox__label {
|
||||
margin-left: 6rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -428,7 +428,6 @@
|
||||
|
||||
.add-textarea {
|
||||
:deep() {
|
||||
|
||||
.wd-textarea__value,
|
||||
.wd-textarea__count {
|
||||
background: transparent !important;
|
||||
|
||||
547
src/bundle/setmeal/detail.vue
Normal file
547
src/bundle/setmeal/detail.vue
Normal file
@ -0,0 +1,547 @@
|
||||
<!-- 使用 type="home" 属性设置首页，其他页面不需要设置，默认为page -->
|
||||
<route lang="jsonc" type="page">{
|
||||
"needLogin": true,
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}</route>
|
||||
<template>
|
||||
<view class="pb-180rpx">
|
||||
<!-- 费用明细 -->
|
||||
<wd-popup v-model="showCostPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" @close="showCostPopup = false" position="bottom">
|
||||
<view class='bg-[#FBFBFB] py-40rpx realtive'>
|
||||
<view class="absolute top-18rpx right-30rpx" @click="showCostPopup = false">
|
||||
<wd-img width="60rpx" height='60rpx' :src="`${OSS}icon/icon_close.png`"></wd-img>
|
||||
</view>
|
||||
<view class="text-36rpx text-[#121212] leading-50rpx text-center">费用明细</view>
|
||||
<view class="mx-30rpx bg-white rounded-16rpx px-30rpx pt-40rpx mt-40rpx pb-30rpx">
|
||||
<view class="flex justify-between items-center text-30rpx text-[#303133] leading-42rpx">
|
||||
<view>茶室费</view>
|
||||
<view>￥{{ bill.service.total }}</view>
|
||||
</view>
|
||||
|
||||
<view class="flex justify-between items-center text-24rpx text-[#909399] leading-34rpx mt-16rpx">
|
||||
<view>茶室费（￥{{ teaRoomPrice }}元/小时）</view>
|
||||
<view>x{{ bill.service.num }}</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-52rpx">
|
||||
<view class="flex justify-between items-center text-30rpx text-[#303133] leading-42rpx">
|
||||
<view>优惠</view>
|
||||
<view class="text-[#4C9F44]">-￥{{ bill.totalDiscount }}</view>
|
||||
</view>
|
||||
<view class="flex justify-between items-center text-24rpx text-[#909399] leading-34rpx mt-16rpx">
|
||||
<view>优惠券</view>
|
||||
<view>-￥{{ bill.coupon || 0 }}</view>
|
||||
</view>
|
||||
<view class="flex justify-between items-center text-24rpx text-[#909399] leading-34rpx mt-16rpx">
|
||||
<view>团购券</view>
|
||||
<view>-￥{{ bill.groupCoupon || 0 }}</view>
|
||||
</view>
|
||||
<view class="flex justify-between items-center text-24rpx text-[#909399] leading-34rpx mt-16rpx">
|
||||
<view>会员八折</view>
|
||||
<view>-￥{{ bill.discount || 0 }}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="my-30rpx">
|
||||
<wd-gap height="2rpx" bgColor='#F6F7F9'></wd-gap>
|
||||
</view>
|
||||
|
||||
<view class="flex justify-between items-center text-30rpx text-[#303133] leading-42rpx">
|
||||
<view>实付金额</view>
|
||||
<view>￥{{ bill.total }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</wd-popup>
|
||||
|
||||
<!-- 支付 -->
|
||||
<wd-popup v-model="showPayPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" @close="showPayPopup = false" position="bottom">
|
||||
<view class='bg-[#FBFBFB] py-40rpx realtive'>
|
||||
<view class="absolute top-18rpx right-30rpx" @click="showPayPopup = false">
|
||||
<wd-img width="60rpx" height='60rpx' :src="`${OSS}icon/icon_close.png`"></wd-img>
|
||||
</view>
|
||||
<view class="text-36rpx text-[#121212] leading-50rpx text-center">支付</view>
|
||||
<view class="mx-30rpx bg-white rounded-16rpx px-30rpx pt-40rpx mt-40rpx pb-30rpx">
|
||||
<wd-radio-group v-model="pay" shape="dot" checked-color="#4C9F44">
|
||||
<view class="pay" v-for="(item, index) in payList" :key="index" @click="pay = item.id">
|
||||
<view class="flex justify-between items-center" v-if="pay == item.value" >
|
||||
<view class="flex items-center">
|
||||
<wd-img width="50rpx" height="50rpx" :src="item.icon"></wd-img>
|
||||
<view class="ml-20rpx text-30rpx text-[#303133] leading-42rpx">{{ item.name }}</view>
|
||||
</view>
|
||||
<view class="flex items-center">
|
||||
<wd-radio :value="item.value">
|
||||
<view class="text-[#303133] text-26rpx leading-36rpx mr-20rpx">可用202.22</view>
|
||||
</wd-radio>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</wd-radio-group>
|
||||
</view>
|
||||
|
||||
<view class='bg-[#4C9F44] text-[#fff] rounded-8rpx h-90rpx leading-90rpx mx-60rpx box-border text-center mt-170rpx' @click="Detail.handlePay">确定付款</view>
|
||||
</view>
|
||||
</wd-popup>
|
||||
|
||||
<!-- 选择预定时间 -->
|
||||
<booking-time v-model="showBookTimePopup" :day="sevenDay" @selectedTime="Detail.handleChooseReserveTime"></booking-time>
|
||||
|
||||
<view>
|
||||
<navbar :title="isGroupBuying ? '团购套餐' : '预定'" custom-class='!bg-[#F6F7F8]'></navbar>
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<view class="mt-20rpx mx-30rpx swiper">
|
||||
<wd-swiper value-key="image" height="320rpx"
|
||||
:indicator="{ type: 'dots-bar' }" :list="swiperList" v-model:current="current" mode="aspectFit">
|
||||
</wd-swiper>
|
||||
</view>
|
||||
|
||||
<view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx">
|
||||
<view class="font-bold text-36rpx text-[#303133] leading-50rpx">{{ isGroupBuying ? teaRoomPackage.title : teaRoom.name }}</view>
|
||||
<view class="mt-14rpx flex" v-if="!isGroupBuying">
|
||||
<template v-for="(label, labelIndex) in teaRoom.label" :key="labelIndex">
|
||||
<view class="mr-20rpx flex items-start" v-if="label.category_id == 1">
|
||||
<wd-tag color="#40AE36" bg-color="#40AE36" plain custom-class="!rounded-4rpx">文艺小清新</wd-tag>
|
||||
</view>
|
||||
<view class="flex items-start" v-if="label.category_id == 2">
|
||||
<wd-tag color="#F55726" bg-color="#F55726" plain>全息投影</wd-tag>
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
<view class="flex justify-between items-center" :class="`${ isGroupBuying ? 'mt-24rpx' : ''}`">
|
||||
<view class="text-[#303133] text-26rpx leading-48rpx font-500" v-if="isGroupBuying">{{ teaRoomPackage.introduce }}</view>
|
||||
<!-- <view class="text-[#6A6363] flex-1 text-22rpx leading-32rpx text-right">已售 10+</view> -->
|
||||
</view>
|
||||
<view v-if="isGroupBuying">
|
||||
<view class="mt-20rpx mb-24rpx" >
|
||||
<wd-gap height="2rpx" bgColor="#F6F7F9"></wd-gap>
|
||||
</view>
|
||||
<view class="text-[#303133] text-28rpx leading-48rpx">
|
||||
<rich-text :nodes="teaRoomPackage.details"></rich-text>
|
||||
<!-- <view>
|
||||
<text class="font-bold mr-26rpx">须知</text>
|
||||
<text class="font-500">{{ teaRoomPackage.details }}</text>
|
||||
</view>
|
||||
<view class="mt-22rpx">
|
||||
<text class="font-bold mr-26rpx">保障</text>
|
||||
<text class="font-500">随时退</text>
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="!isGroupBuying">
|
||||
<!-- 使用说明 -->
|
||||
<view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx">
|
||||
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">使用说明</view>
|
||||
<view class="">
|
||||
<rich-text :nodes="teaRoom.textarea1"></rich-text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 预定时间 -->
|
||||
<view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx" @click="showBookTimePopup = true">
|
||||
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">预定时间</view>
|
||||
<view class="flex items-center justify-between">
|
||||
<view class="text-[26rpx] text-[#606266] leading-36rpx">{{ sevenDay.minimum_time }}小时起订</view>
|
||||
<view class="flex items-center">
|
||||
<view class="text-[28rpx] text-[#909399] leading-40rpx w-430rpx line-1 text-right">
|
||||
<template v-if="reserveTime.length > 0">
|
||||
{{ reserveTime[0] }} {{ reserveTime[1].join(',') }}
|
||||
</template>
|
||||
<template v-else>
|
||||
请选择
|
||||
</template>
|
||||
</view>
|
||||
<view>
|
||||
<wd-icon name="chevron-right" size="32rpx" color="#909399"></wd-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 优惠券 -->
|
||||
<view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx" @click="Detail.handleToCoupon(CouponType.Discount)">
|
||||
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">优惠券</view>
|
||||
<view class="flex items-center justify-between">
|
||||
<view class="text-[26rpx] text-[#606266] leading-36rpx">优惠券</view>
|
||||
<view class="flex items-center">
|
||||
<view class="text-[28rpx] text-[#909399] leading-40rpx">
|
||||
<template v-if="selectedCoupon?.id > 0">
|
||||
{{ selectedCoupon.name }}
|
||||
</template>
|
||||
<template v-else>
|
||||
请选择
|
||||
</template>
|
||||
</view>
|
||||
<view class="mt-4rpx">
|
||||
<wd-icon name="chevron-right" size="22px" color="#909399"></wd-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 团购券 -->
|
||||
<view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx" @click="Detail.handleToCoupon(CouponType.GroupBuy)">
|
||||
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">团购券</view>
|
||||
<view class="flex items-center justify-between">
|
||||
<view class="text-[26rpx] text-[#606266] leading-36rpx">团购券</view>
|
||||
<view class="flex items-center">
|
||||
<view class="text-[28rpx] text-[#909399] leading-40rpx">
|
||||
<template v-if="selectedGroupCoupon?.id > 0">
|
||||
{{ selectedGroupCoupon.name }}
|
||||
</template>
|
||||
<template v-else>
|
||||
请选择
|
||||
</template>
|
||||
</view>
|
||||
<view class="mt-4rpx">
|
||||
<wd-icon name="chevron-right" size="22px" color="#909399"></wd-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="isGroupBuying">
|
||||
<!-- 套餐详情 -->
|
||||
<view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx">
|
||||
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">套餐详情</view>
|
||||
<view class="">
|
||||
<rich-text :nodes="teaRoomPackage.introduce_details"></rich-text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 购买须知 -->
|
||||
<view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx">
|
||||
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">购买须知</view>
|
||||
<view class="">
|
||||
<rich-text :nodes="teaRoomPackage.buy_details"></rich-text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {toast} from '@/utils/toast'
|
||||
import { ReserveServiceCategory, OrderType } from '@/utils/order'
|
||||
import type { ITeaSpecialistFuture7DaysResult } from '@/api/types/tea'
|
||||
import { getNext7Days, getTeaRoomBalance, createTeaRoomOrder } from '@/api/tea-room'
|
||||
import { CouponType } from '@/utils/coupon'
|
||||
import { router, toTimes, toPlus, toMinus } from '@/utils/tools'
|
||||
import type { IUserInfoVo } from '@/api/types/login'
|
||||
import { useUserStore } from '@/store'
|
||||
import { getTeaRoomDetail, createTeaRoomPackageOrder, getTeaRoomPackageDetail, calculateTeaRoomPrice } from '@/api/tea-room'
|
||||
import PriceFormat from '@/components/PriceFormat.vue'
|
||||
import BookingTime from '@/components/BookingTime.vue'
|
||||
import { getUserInfo } from '@/api/user'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
|
||||
// 用户信息
|
||||
const userInfo = ref<IUserInfoVo>(null)
|
||||
|
||||
const swiperList = ref<string[]>([])
|
||||
const current = ref<number>(0)
|
||||
const html: string = '<p>这里是富文本内容，需要后台传递</p>'
|
||||
const isGroupBuying = ref<boolean>(false)// 是否是团购套餐
|
||||
const pay = ref<number>(1) // 支付方式
|
||||
const payList = ref<Array<any>>([
|
||||
{
|
||||
id: 1,
|
||||
name: '平台余额',
|
||||
icon: `${OSS}icon/icon_platform_balance.png`,
|
||||
balance: 0,
|
||||
value: 1
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: '门店余额',
|
||||
icon: `${OSS}icon/icon_store_balance.png`,
|
||||
balance: 0,
|
||||
value: 2
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: '微信支付',
|
||||
icon: `${OSS}icon/icon_weichat.png`,
|
||||
balance: 0,
|
||||
value: 3
|
||||
}
|
||||
])
|
||||
|
||||
// 选择预定时间
|
||||
const showBookTimePopup = ref<boolean>(false)
|
||||
const sevenDay = reactive<ITeaSpecialistFuture7DaysResult>({
|
||||
minimum_time: 0,
|
||||
time: []
|
||||
})
|
||||
const reserveTime = ref<Array<any>>([])
|
||||
|
||||
// 计算费用明细 service(服务费) coupon(优惠券) discount(会员优惠) totalDiscount(总优惠) total(总费用) groupCoupon(团购券)
|
||||
const bill = ref<{service: any, discount:number, totalDiscount: number, coupon: number, groupCoupon: number, total: number}>({
|
||||
service: {
|
||||
total: 0,
|
||||
unitPrice: 0,
|
||||
num: 0,
|
||||
startTime: 0,
|
||||
endTime: 0,
|
||||
dayTime: '',
|
||||
startHour: '',
|
||||
endHour: ''
|
||||
},
|
||||
discount: 0,
|
||||
totalDiscount: 0,
|
||||
coupon: 0,
|
||||
groupCoupon: 0,
|
||||
total: 0
|
||||
})
|
||||
|
||||
// 费用明细相关
|
||||
const showCostPopup = ref<boolean>(false) // 费用明细popup
|
||||
const showPayPopup = ref<boolean>(false) // 支付popup
|
||||
|
||||
// 包间内容
|
||||
const storeId = ref<number>(0) // 门店ID
|
||||
const id = ref<number>(0) // id
|
||||
const teaRoom = ref<any>({})
|
||||
const teaRoomPrice = ref<number>(0)
|
||||
|
||||
// 门店余额
|
||||
const storeMoney = ref<number>(0)
|
||||
|
||||
// 选择的优惠券
|
||||
const selectedCoupon = ref<{id: number, name: string}>({id: 0, name: ''})
|
||||
const selectedGroupCoupon = ref<{id: number, name: string}>({id: 0, name: ''})
|
||||
|
||||
// 用户信息
|
||||
const user = ref<any>(null)
|
||||
|
||||
// 套餐
|
||||
const teaRoomPackage = ref<any>({})
|
||||
|
||||
onLoad((args) => {
|
||||
storeId.value = Number(args.storeId)
|
||||
id.value = Number(args.id)
|
||||
teaRoomPrice.value = Number(args.price) || 0
|
||||
|
||||
if (args.type == ReserveServiceCategory.GroupBuying) {
|
||||
isGroupBuying.value = true
|
||||
pay.value = 3
|
||||
Detail.handleInitGroupBuying()
|
||||
}
|
||||
Detail.handleInitReserveRoom()
|
||||
|
||||
// 获取用户需求详
|
||||
getUserInfo().then(res => {
|
||||
user.value = res
|
||||
})
|
||||
})
|
||||
|
||||
const Detail = {
|
||||
/**
|
||||
* 初始包间详情
|
||||
*/
|
||||
handleInitReserveRoom: async () => {
|
||||
// 包间详情
|
||||
const userStore = useUserStore()
|
||||
userInfo.value = userStore.userInfo
|
||||
|
||||
const res = await getTeaRoomDetail({
|
||||
id: storeId.value,
|
||||
latitude: uni.getStorageSync('latitude'),
|
||||
longitude: uni.getStorageSync('longitude'),
|
||||
user_id: userInfo.value.id || 0
|
||||
})
|
||||
teaRoom.value = res.details
|
||||
swiperList.value = teaRoom.value.img_arr
|
||||
|
||||
// 预定时间
|
||||
const next7 = await getNext7Days()
|
||||
Object.assign(sevenDay, next7)
|
||||
|
||||
// 获取门店余额
|
||||
const balance = await getTeaRoomBalance({ store_id: storeId.value })
|
||||
storeMoney.value = balance.data.money || 0
|
||||
},
|
||||
|
||||
/*
|
||||
* 初始化套餐详情
|
||||
*/
|
||||
handleInitGroupBuying: async () => {
|
||||
const res = await getTeaRoomPackageDetail({ id: id.value })
|
||||
teaRoomPackage.value = res.details
|
||||
},
|
||||
|
||||
/**
|
||||
* 选中预定时间
|
||||
*/
|
||||
handleChooseReserveTime: (params: any) => {
|
||||
reserveTime.value = params
|
||||
|
||||
bill.value.service = {
|
||||
total: 0,
|
||||
unitPrice: 0,
|
||||
num: params[3],
|
||||
startTime: params[2][0],
|
||||
endTime: params[2][params[2].length - 1],
|
||||
dayTime: params[0],
|
||||
startHour: params[1][0],
|
||||
endHour: params[1][params[1].length - 1]
|
||||
}
|
||||
|
||||
Detail.handleCalculateTeaRoomPrice()
|
||||
},
|
||||
|
||||
/**
|
||||
* 跳转优惠券页面
|
||||
*/
|
||||
handleToCoupon(type) {
|
||||
if (reserveTime.value.length == 0) {
|
||||
toast.info('请选择预定时间')
|
||||
return
|
||||
}
|
||||
uni.$on('chooseCoupon', params => {
|
||||
console.log("🚀 ~ params:", params)
|
||||
uni.$off('chooseCoupon')
|
||||
|
||||
if (type === CouponType.Discount) {
|
||||
selectedCoupon.value = {id: params.coupon.user_coupon_id, name: `${params.coupon.name}减${params.coupon.coupon_price}` }
|
||||
bill.value.coupon = params.coupon.coupon_price
|
||||
} else {
|
||||
selectedGroupCoupon.value = {id: params.coupon.id, name: `团购券-${params.coupon.tea_store_group.title}` }
|
||||
bill.value.groupCoupon = params.coupon.coupon_price
|
||||
}
|
||||
|
||||
Detail.handleCalculateTeaRoomPrice()
|
||||
})
|
||||
|
||||
// 获取预定了几个小时
|
||||
const count = bill.value.service.num
|
||||
router.navigateTo(`/bundle/coupon/coupon?id=${id.value}&numbers=${count}&type=${type}&storeId=${storeId.value}`)
|
||||
},
|
||||
|
||||
// 选择支付方式
|
||||
handleGetPayValue: (value: number) => {
|
||||
pay.value = value
|
||||
},
|
||||
|
||||
/**
|
||||
* 提交订单
|
||||
*/
|
||||
handleSubmitOrder: async () => {
|
||||
// 只有预定茶室才会选择时间
|
||||
if (!isGroupBuying.value && bill.value.service.num == 0) {
|
||||
toast.info('请选择预定时间')
|
||||
return
|
||||
}
|
||||
|
||||
uni.showLoading({
|
||||
title: '提交中...'
|
||||
})
|
||||
|
||||
try {
|
||||
let res: any = null
|
||||
if (isGroupBuying.value) {
|
||||
res = await createTeaRoomPackageOrder({
|
||||
group_id: id.value
|
||||
})
|
||||
} else {
|
||||
res = await createTeaRoomOrder({
|
||||
store_id: storeId.value,
|
||||
room_id: id.value,
|
||||
day_time: bill.value.service.dayTime,
|
||||
start_time: bill.value.service.startHour,
|
||||
end_time: bill.value.service.endHour,
|
||||
user_coupon_id: selectedCoupon.value.id || 0,
|
||||
hours: bill.value.service.num,
|
||||
group_coupon_id: selectedGroupCoupon.value.id || 0
|
||||
})
|
||||
}
|
||||
|
||||
uni.hideLoading()
|
||||
|
||||
// 支付后的处理
|
||||
uni.$on('payment', params => {
|
||||
setTimeout(() => {
|
||||
uni.$off("payment")
|
||||
if (params.result) {
|
||||
uni.redirectTo({
|
||||
url: `/pages/notice/reserve?type=${OrderType.TeaRoomOrder}&orderId=${params.orderId}&isGroupBuying=${isGroupBuying.value ? 1 : 0}`
|
||||
})
|
||||
} else {
|
||||
if (isGroupBuying.value) {
|
||||
router.redirectTo(`/bundle/order/platform/order-list`)
|
||||
} else {
|
||||
router.redirectTo(`/bundle/order/tea-room/order-list?isGroupBuying=${isGroupBuying.value ? 1 : 0}`)
|
||||
}
|
||||
}
|
||||
}, 1000)
|
||||
})
|
||||
|
||||
setTimeout(() => {
|
||||
const name = isGroupBuying.value ? teaRoomPackage.value.title : teaRoom.value.name
|
||||
|
||||
router.navigateTo(
|
||||
`/pages/cashier/cashier?from=${OrderType.TeaRoomOrder}&orderId=${res.id}&name=${name}&storeId=${storeId.value}&isGroupBuying=${isGroupBuying.value ? 1 : 0}`
|
||||
)
|
||||
}, 800)
|
||||
} catch (error) {
|
||||
uni.hideLoading()
|
||||
toast.info('订单提交失败，请稍后重试')
|
||||
return
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 计算茶室价格
|
||||
*/
|
||||
handleCalculateTeaRoomPrice: async () => {
|
||||
const res = await calculateTeaRoomPrice({
|
||||
room_id: id.value,
|
||||
coupon_id: selectedCoupon.value.id || 0,
|
||||
group_coupon_id: selectedGroupCoupon.value.id,
|
||||
nums: bill.value.service.num,
|
||||
})
|
||||
|
||||
bill.value.service.total = res.details.room_price // 茶室价格
|
||||
bill.value.discount = res.details.discount_room_price // 茶室总价
|
||||
bill.value.totalDiscount = res.details.discount_all_price // 总优惠
|
||||
bill.value.groupCoupon = res.details.group_price // 团购优惠
|
||||
bill.value.total = res.details.order_amount // 订单金额
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: $cz-page-background;
|
||||
}
|
||||
|
||||
.swiper {
|
||||
:deep() {
|
||||
.wd-swiper-nav__item--dots-bar {
|
||||
width: 56rpx !important;
|
||||
height: 6rpx !important;
|
||||
border-radius: 3rpx !important;
|
||||
}
|
||||
|
||||
.is-active {
|
||||
background-color: #2B9F93 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pay {
|
||||
:deep() {
|
||||
.wd-radio {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
99
src/bundle/user/bill-detail.vue
Normal file
99
src/bundle/user/bill-detail.vue
Normal file
@ -0,0 +1,99 @@
|
||||
<route lang="jsonc" type="page">{
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarBackgroundColor": "#fff"
|
||||
}
|
||||
}</route>
|
||||
|
||||
<template>
|
||||
<view class="pb-40rpx">
|
||||
<view>
|
||||
<navbar title="消费明细" custom-class="!bg-[#F6F7F9]"></navbar>
|
||||
</view>
|
||||
|
||||
<view class="mt-28rpx mx-32rpx">
|
||||
<mescroll-body ref="mescrollItem0" @init="mescrollInit" @down="downCallback" @up="BillDetail.upCallback" :down="downOption" :up="upOption">
|
||||
<view class="bg-white rounded-16rpx py-28rpx mb-20rpx">
|
||||
<view class="flex items-center">
|
||||
<view class="w-8rpx h-32rpx bg-[#4C9F44] mr-22rpx"></view>
|
||||
<view class="font-bold text-28rpx leading-40rpx text-[#303133]">订单号：1744601722882174</view>
|
||||
</view>
|
||||
<view class="mx-18rpx mt-16rpx mb-22rpx">
|
||||
<wd-gap height="2rpx" bg-color="#E5E5E5"></wd-gap>
|
||||
</view>
|
||||
<view class="flex items-center justify-between px-18rpx">
|
||||
<view class="font-400 text-28rpx text-[#606266] leading-40rpx">
|
||||
<view class="mb-16rpx">门店：茶址24小时-碧云店</view>
|
||||
<view class="mb-16rpx">类型：包间预定</view>
|
||||
<view class="mb-16rpx">支付方式：平台余额</view>
|
||||
<view>支付时间：2025-04-14 11:35</view>
|
||||
</view>
|
||||
<view class="text-right">
|
||||
<price-format weight="bold" color="#303133" :first-size="44" :second-size="44" :subscript-size="28" :price="23.02"></price-format>
|
||||
<view class="mt-6rpx font-400 text-28rpx leading-40rpx text-[#303133]">金额</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</mescroll-body>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { toTimes, copy } from '@/utils/tools'
|
||||
import { router } from '@/utils/tools'
|
||||
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
|
||||
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
|
||||
|
||||
// mescroll
|
||||
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
|
||||
const downOption = {
|
||||
auto: true
|
||||
}
|
||||
const upOption = {
|
||||
auto: true,
|
||||
textNoMore: '~ 已经到底啦 ~', //无更多数据的提示
|
||||
}
|
||||
const list = ref<Array<any>>([]) // 茶室列表
|
||||
|
||||
const OSS = inject('OSS')
|
||||
|
||||
const mark = ref<string>('')
|
||||
|
||||
onLoad((args) => {
|
||||
})
|
||||
|
||||
const BillDetail = {
|
||||
/**
|
||||
* 分页加载
|
||||
* @param mescroll
|
||||
*/
|
||||
upCallback: (mescroll) => {
|
||||
// 需要留一下数据为空的时候显示的空数据图标内容
|
||||
// getTeaRoomOrderList(filter).then((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() // 请求失败, 结束加载
|
||||
// })
|
||||
},
|
||||
|
||||
// 打电话
|
||||
handleCall: (phone) => {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: phone
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: $cz-page-background;
|
||||
}
|
||||
|
||||
</style>
|
||||
132
src/bundle/user/user-detail.vue
Normal file
132
src/bundle/user/user-detail.vue
Normal file
@ -0,0 +1,132 @@
|
||||
<route lang="jsonc" type="page">{
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarBackgroundColor": "#fff"
|
||||
}
|
||||
}</route>
|
||||
|
||||
<template>
|
||||
<view class="pb-40rpx">
|
||||
<view>
|
||||
<navbar title="用户详情" custom-class="!bg-[#F6F7F9]"></navbar>
|
||||
</view>
|
||||
|
||||
<view class="mt-28rpx mx-30rpx">
|
||||
<view class="bg-white rounded-16rpx px-28rpx pt-40rpx pb-26rpx">
|
||||
<view>
|
||||
<view class="flex items-center">
|
||||
<wd-img width="140rpx" height='140rpx' src="https://shchazhi.oss-cn-hangzhou.aliyuncs.com/fronted/icon/icon_avatar.png" :round="true"></wd-img>
|
||||
<view class="ml-20rpx">
|
||||
<view class="flex items-center">
|
||||
<view class="font-bold text-28rpx text-[#303133] leading-40rpx mr-12rpx">用户昵称</view>
|
||||
<!-- TODO 如果是vip的话才显示这个皇冠 -->
|
||||
<view>
|
||||
<wd-img width="40rpx" height='40rpx' :src="`${OSS}icon/icon_crown.png`"></wd-img>
|
||||
</view>
|
||||
</view>
|
||||
<view class="mt-18rpx font-400 text-28rpx text-[#303133] leading-40rpx">手机号：18857339563</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- TODO VIP显示这块内容 -->
|
||||
<view class="relative mt-22rpx">
|
||||
<wd-img width="650rpx" height='70rpx' :src="`${OSS}images/store/user/image1.png`"></wd-img>
|
||||
<view class="absolute top-18rpx left-28rpx flex items-center">
|
||||
<wd-img width="40rpx" height='40rpx' :src="`${OSS}icon/icon_vip.png`"></wd-img>
|
||||
<view class="font-400 text-24rpx text-[#EECC99] leading-34rpx ml-18rpx">2026.03.06到期</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="flex items-center justify-around px-90rpx mt-46rpx">
|
||||
<view class="flex flex-col items-center justify-start">
|
||||
<view class="font-400 text-24rpx text-[#606266] text-34rpx">平台余额</view>
|
||||
<view class="font-bold text-32rpx text-[#303133] leading-34rpx mt-34rpx">3,1.46</view>
|
||||
</view>
|
||||
<view class="h-98rpx">
|
||||
<wd-divider vertical color="#EAEEF2" custom-class="!h-98rpx"></wd-divider>
|
||||
</view>
|
||||
<view class="flex flex-col items-center justify-start">
|
||||
<view class="font-400 text-24rpx text-[#606266] text-34rpx">门店余额</view>
|
||||
<view class="font-bold text-32rpx text-[#303133] leading-34rpx mt-34rpx">3,662.46</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-50rpx relative">
|
||||
<wd-img width="650rpx" height='216rpx' :src="`${OSS}images/store/user/image2.png`"></wd-img>
|
||||
<view class="absolute top-24rpx left-40rpx">
|
||||
<view class="">消费金额</view>
|
||||
<view class="mt-22rpx">
|
||||
<price-format color="#FF5951" :first-size="34" :second-size="34" :subscript-size="34" :price="23.02"></price-format>
|
||||
</view>
|
||||
<view
|
||||
@click="router.navigateTo('/bundle/user/bill-detail')"
|
||||
class="bg-[#3C7FFF] w-124rpx h-48rpx rounded-24rpx text-[#fff] text-center leading-48rpx text-28rpx font-bold mt-12rpx">
|
||||
去查看
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-26rpx mb-18rpx">
|
||||
<wd-gap height="2rpx" bg-color="#E5E5E5"></wd-gap>
|
||||
</view>
|
||||
|
||||
<view class="font-400 text-26rpx text-[#9CA3AF] leading-36rpx">注册日期：2025-04-23</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bg-white rounded-16rpx px-30rpx pt-36rpx pb-34rpx mt-20rpx">
|
||||
<view class="flex items-center">
|
||||
<wd-img width="40rpx" height='40rpx' :src="`${OSS}icon/icon_qizhi.png`"></wd-img>
|
||||
<view class="text-30rpx leading-42rpx text-[#303133] ml-10rpx">备注</view>
|
||||
</view>
|
||||
|
||||
<view class="add-textarea">
|
||||
<wd-textarea v-model="mark"
|
||||
placeholder="有想说的可以在这里写哦！"
|
||||
custom-class='!rounded-18rpx !border-2rpx !border-[#EFF0EF] !bg-[#F8F9FA] !mt-20rpx'
|
||||
custom-textarea-class='!bg-[#F8F9FA] !h-100rpx' :maxlength='30' show-word-limit />
|
||||
</view>
|
||||
|
||||
<view class="bg-[#4C9F44] rounded-8rpx text-[#fff] w-626rpx h-90rpx text-center leading-90rpx mt-52rpx">修改备注</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { toTimes, copy } from '@/utils/tools'
|
||||
import { router } from '@/utils/tools'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
|
||||
const mark = ref<string>('')
|
||||
|
||||
onLoad((args) => {
|
||||
})
|
||||
|
||||
const UserList = {
|
||||
// 打电话
|
||||
handleCall: (phone) => {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: phone
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: $cz-page-background;
|
||||
}
|
||||
|
||||
.add-textarea {
|
||||
:deep() {
|
||||
.wd-textarea__value,
|
||||
.wd-textarea__count {
|
||||
background: transparent !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
103
src/bundle/user/user-list.vue
Normal file
103
src/bundle/user/user-list.vue
Normal file
@ -0,0 +1,103 @@
|
||||
<route lang="jsonc" type="page">{
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarBackgroundColor": "#fff"
|
||||
}
|
||||
}</route>
|
||||
|
||||
<template>
|
||||
<view>
|
||||
<view>
|
||||
<navbar title="用户列表" custom-class="!bg-[transparent]"></navbar>
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<mescroll-body ref="mescrollItem0" @init="mescrollInit" @down="downCallback" @up="UserList.upCallback" :down="downOption" :up="upOption">
|
||||
<view class="mb-22rpx">
|
||||
<view class="mx-64rpx flex justify-between items-center mb-10rpx">
|
||||
<view class="flex items-center" @click="router.navigateTo('/bundle/user/user-detail')">
|
||||
<wd-img width="100rpx" height='100rpx' src="https://shchazhi.oss-cn-hangzhou.aliyuncs.com/fronted/icon/icon_avatar.png" :round="true"></wd-img>
|
||||
<view class="ml-20rpx">
|
||||
<view class="flex items-center">
|
||||
<view class="font-bold text-28rpx text-[#303133] leading-40rpx mr-12rpx">用户昵称</view>
|
||||
<!-- TODO 如果是vip的话才显示这个皇冠 -->
|
||||
<view>
|
||||
<wd-img width="40rpx" height='40rpx' :src="`${OSS}icon/icon_crown.png`"></wd-img>
|
||||
</view>
|
||||
</view>
|
||||
<view class="mt-14rpx font-400 text-26rpx text-[#303133] leading-36rpx">13525626532</view>
|
||||
<view class="mt-10rpx text-24rpx text-[#F29747] leading-34rpx w-400rpx line-1">这里是备注信息，备注信息这里是备注信息，备注信息</view>
|
||||
</view>
|
||||
</view>
|
||||
<view @click="UserList.handleCall">
|
||||
<wd-img width="64rpx" height='64rpx' :src="`${OSS}icon/icon_phone3.png`"></wd-img>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mx-30rpx">
|
||||
<wd-gap height="2rpx" bg-color="#E5E5E5"></wd-gap>
|
||||
</view>
|
||||
</view>
|
||||
</mescroll-body>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { router } from '@/utils/tools'
|
||||
import { toTimes, copy } from '@/utils/tools'
|
||||
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
|
||||
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
|
||||
|
||||
// mescroll
|
||||
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
|
||||
const downOption = {
|
||||
auto: true
|
||||
}
|
||||
const upOption = {
|
||||
auto: true,
|
||||
textNoMore: '~ 已经到底啦 ~', //无更多数据的提示
|
||||
}
|
||||
const list = ref<Array<any>>([]) // 茶室列表
|
||||
|
||||
const OSS = inject('OSS')
|
||||
|
||||
onLoad((args) => {
|
||||
})
|
||||
|
||||
const UserList = {
|
||||
/**
|
||||
* 分页加载
|
||||
* @param mescroll
|
||||
*/
|
||||
upCallback: (mescroll) => {
|
||||
// 需要留一下数据为空的时候显示的空数据图标内容
|
||||
// getTeaRoomOrderList(filter).then((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() // 请求失败, 结束加载
|
||||
// })
|
||||
},
|
||||
|
||||
/**
|
||||
* 电话
|
||||
* @param phone
|
||||
*/
|
||||
handleCall: (phone) => {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: phone
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #fff;
|
||||
}
|
||||
</style>
|
||||
@ -125,13 +125,67 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<!-- 茶室管理端-订单管理 -->
|
||||
<view v-if="type === OrderSource.Admin" class="bg-white rounded-10rpx p-30rpx">
|
||||
<view class="flex justify-between items-center">
|
||||
<view class="flex items-center">
|
||||
<view class="mr-10rpx flex items-center">
|
||||
<wd-img width="40rpx" height="40rpx" :src="`${OSS}icon/icon_tea_room.png`"></wd-img>
|
||||
</view>
|
||||
<view class="flex items-center w-400rpx" @click="router.navigateTo(`/pages/order/order-detail?storeId=${order.store_id}`)">
|
||||
<view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx line-1">{{ order.store_name }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="font-400 text-28rpx leading-40rpx mt-12rpx text-[#4C9F44]">
|
||||
<text v-if="order.order_status === AdminOrderStatus.ToUse" class="text-[#FF5951]" >待使用</text>
|
||||
<text v-if="order.order_status === AdminOrderStatus.Consuming">使用中</text>
|
||||
<text v-if="order.order_status === AdminOrderStatus.Finished" class="text-[#606266]">完成</text>
|
||||
<text v-if="order.order_status === AdminOrderStatus.Cancelled" class="text-[#C9C9C9]">订单取消</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="mt-22rpx">
|
||||
<view class="flex items-center">
|
||||
<view class="mr-28rpx">
|
||||
<wd-img width="200rpx" height="200rpx" :src="`${OSS}images/home/home_image5.png`"></wd-img>
|
||||
</view>
|
||||
<view class="flex-1">
|
||||
<view @click="ComboCard.handleToOrderDetail">
|
||||
<view class="font-500 text-30rpx text-[#303133] leading-42rpx line-1 w-400rpx">{{ order.room_name }}</view>
|
||||
<view class="font-400 leading-36rpx text-26rpx text-[#606266] mt-34rpx">
|
||||
<view>预约时间：{{ order.day_time }} {{ order.start_time }}-{{ order.end_time }}</view>
|
||||
<view class="mt-18rpx">预约时长：{{ order.hours }}小时</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 操作按钮 -->
|
||||
<template v-if="order.order_status === AdminOrderStatus.ToUse || order.order_status === AdminOrderStatus.Consuming">
|
||||
<view class="text-center flex items-center text-28rpx mt-28rpx justify-end">
|
||||
<view class="w-178rpx h-70rpx rounded-8rpx border-[2rpx] border-[#9CA3AF] text-[#303133] mr-28rpx flex items-center justify-center"
|
||||
@click="ComboCard.handleCancelOrder(OrderSource.TeaRoom)">释放时间</view>
|
||||
<view class="w-178rpx h-70rpx rounded-8rpx border-[2rpx] border-[#4C9F44] text-[#4C9F44] flex items-center justify-center"
|
||||
@click="ComboCard.handleToPayOrder(OrderSource.TeaRoom)">取消订单</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<template v-if="order.order_status === AdminOrderStatus.Finished || order.order_status === AdminOrderStatus.Cancelled">
|
||||
<view class="text-center flex items-center text-28rpx mt-28rpx justify-end">
|
||||
<view class="w-178rpx h-70rpx rounded-8rpx border-[2rpx] border-[#9CA3AF] text-[#303133] mr-28rpx flex items-center justify-center"
|
||||
@click="ComboCard.handleCancelOrder(OrderSource.TeaRoom)">删除</view>
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 取消订单, 删除订单 -->
|
||||
<wd-message-box selector="wd-message-box-slot"></wd-message-box>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="ComboCard">
|
||||
import { OrderSource, OrderStatus, TeaRoomOrderStatus, TeaRoomPackageOrderStatus } from '@/utils/order'
|
||||
import { OrderSource, OrderStatus, AdminOrderStatus, TeaRoomPackageOrderStatus } from '@/utils/order'
|
||||
import { useMessage } from 'wot-design-uni'
|
||||
import { toast } from '@/utils/toast'
|
||||
import { handleTRCancelOrderHooks, handleTRDeleteOrderHooks, handleTRToPayHooks, handleToTRStoreHooks, handleTGOrderRefundHooks } from '@/hooks/useOrder'
|
||||
@ -173,7 +227,7 @@
|
||||
* 详情页
|
||||
*/
|
||||
handleToOrderDetail: () => {
|
||||
|
||||
router.navigateTo('/bundle/setmeal/detail')
|
||||
},
|
||||
|
||||
/**
|
||||
@ -234,6 +288,113 @@
|
||||
* 编辑商品
|
||||
*/
|
||||
handleEdit: () => {
|
||||
},
|
||||
|
||||
/**
|
||||
* 跳转到对对应室的详情页
|
||||
*/
|
||||
handleToStore: () => {
|
||||
handleToTRStoreHooks(props.order.store_id, props.order.operation_type)
|
||||
},
|
||||
|
||||
/**
|
||||
* 删除订单
|
||||
*/
|
||||
handleDeleteOrder: (source: string) => {
|
||||
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) => {
|
||||
switch (source) {
|
||||
case OrderSource.Combo:
|
||||
// TODO 这里调用删除直营订单的接口
|
||||
break;
|
||||
case OrderSource.DouYin:
|
||||
// TODO 这里调用删除抖音订单的接口
|
||||
break;
|
||||
case OrderSource.TeaRoom:
|
||||
// 这里调用删除茶室订单的接口
|
||||
handleTRDeleteOrderHooks(props.order.id)
|
||||
break;
|
||||
case OrderSource.TeaSpecialist:
|
||||
// TODO 这里调用删除茶室订单的接口
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}).catch(() => {
|
||||
// 点击取消按钮回调事件
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 取消订单
|
||||
*/
|
||||
handleCancelOrder: (source: string) => {
|
||||
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') {
|
||||
switch (source) {
|
||||
case OrderSource.Combo:
|
||||
// TODO 这里调用删除直营订单的接口
|
||||
break;
|
||||
case OrderSource.DouYin:
|
||||
// TODO 这里调用删除抖音订单的接口
|
||||
break;
|
||||
case OrderSource.TeaRoom:
|
||||
// 这里调用删除茶室订单的接口
|
||||
handleTRCancelOrderHooks(props.order.id)
|
||||
break;
|
||||
case OrderSource.TeaSpecialist:
|
||||
// TODO 这里调用删除茶室订单的接口
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
}).catch(() => {
|
||||
// 点击取消按钮回调事件
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 支付
|
||||
*/
|
||||
handleToPayOrder: (source: string) => {
|
||||
switch (source) {
|
||||
case OrderSource.Combo:
|
||||
router.navigateTo(`/bundle/order/platform/order-detail?orderStatus=${props.orderStatus}&toPay=true`)
|
||||
break;
|
||||
case OrderSource.DouYin:
|
||||
router.navigateTo(`/bundle/order/douyin/douyin-order-detail?orderStatus=${props.orderStatus}&toPay=true`)
|
||||
break;
|
||||
case OrderSource.TeaRoom:
|
||||
handleTRToPayHooks(props.order.id, props.order.room_name, props.order.store_id)
|
||||
break;
|
||||
case OrderSource.TeaSpecialist:
|
||||
router.navigateTo( `/bundle/order/tea-specialist/order-detail?orderStatus=${props.orderStatus}&toPay=true`)
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -132,3 +132,17 @@ export async function handleTGOrderRefundHooks(orderId: number) {
|
||||
export function handleToTGComboHooks(storeId: number, id: number) {
|
||||
router.navigateTo(`/bundle/tea-room/detail?storeId=${storeId}&id=${id}&type=${ReserveServiceCategory.GroupBuying}`)
|
||||
}
|
||||
|
||||
/**
|
||||
* 释放时间
|
||||
*/
|
||||
export async function handleReleaseTimeHooks(orderId: number) {
|
||||
try {
|
||||
// await releaseTeaRoomOrderTime({ id: orderId })
|
||||
uni.$emit('refreshOrderList')
|
||||
uni.$emit('refreshOrderDetail')
|
||||
} catch (error) {
|
||||
router.navigateBack()
|
||||
throw error
|
||||
}
|
||||
}
|
||||
@ -1,84 +0,0 @@
|
||||
<route lang="jsonc" type="page">
|
||||
{
|
||||
"layout": "tabbar",
|
||||
"style": {
|
||||
"navigationBarTitleText": "关于"
|
||||
}
|
||||
}
|
||||
</route>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import RequestComp from './components/request.vue'
|
||||
|
||||
// 奇怪：同样的代码放在 vue 里面不会校验到错误，放在 .ts 文件里面会校验到错误
|
||||
// const testOxlint = (name: string) => {
|
||||
// console.log('oxlint')
|
||||
// }
|
||||
// testOxlint('oxlint')
|
||||
console.log('about')
|
||||
|
||||
function gotoAlova() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/about/alova',
|
||||
})
|
||||
}
|
||||
function gotoVueQuery() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/about/vue-query',
|
||||
})
|
||||
}
|
||||
function gotoSubPage() {
|
||||
uni.navigateTo({
|
||||
url: '/bundle/demo/index',
|
||||
})
|
||||
}
|
||||
// uniLayout里面的变量通过 expose 暴露出来后可以在 onReady 钩子获取到（onLoad 钩子不行）
|
||||
const uniLayout = ref()
|
||||
onLoad(() => {
|
||||
console.log('onLoad:', uniLayout.value) // onLoad: undefined
|
||||
})
|
||||
onReady(() => {
|
||||
console.log('onReady:', uniLayout.value) // onReady: Proxy(Object)
|
||||
console.log('onReady:', uniLayout.value.testUniLayoutExposedData) // onReady: testUniLayoutExposedData
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<view>
|
||||
<view class="mt-8 text-center text-xl text-gray-400">
|
||||
组件使用、请求调用、unocss
|
||||
</view>
|
||||
<RequestComp />
|
||||
<view class="mb-6 h-1px bg-#eee" />
|
||||
<view class="text-center">
|
||||
<button type="primary" size="mini" class="w-160px" @click="gotoAlova">
|
||||
前往 alova 示例页面
|
||||
</button>
|
||||
</view>
|
||||
<view class="text-center">
|
||||
<button type="primary" size="mini" class="w-160px" @click="gotoVueQuery">
|
||||
vue-query 示例页面
|
||||
</button>
|
||||
</view>
|
||||
<view class="text-center">
|
||||
<button type="primary" size="mini" class="w-160px" @click="gotoSubPage">
|
||||
前往分包页面
|
||||
</button>
|
||||
</view>
|
||||
<view class="mt-6 text-center text-sm">
|
||||
<view class="inline-block w-80% text-gray-400">
|
||||
为了方便脚手架动态生成不同UI模板，本页的按钮统一使用UI库无关的原生button
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.test-css {
|
||||
// 16rpx=>0.5rem
|
||||
padding-bottom: 16rpx;
|
||||
// mt-4=>1rem=>16px;
|
||||
margin-top: 16px;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
@ -1,56 +0,0 @@
|
||||
<route lang="jsonc" type="page">
|
||||
{
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationBarTitleText": "Alova 请求演示"
|
||||
}
|
||||
}
|
||||
</route>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { useRequest } from 'alova/client'
|
||||
import { foo } from '@/api/foo-alova'
|
||||
|
||||
const initialData = undefined
|
||||
|
||||
const { loading, data, send } = useRequest(foo, {
|
||||
initialData,
|
||||
immediate: true,
|
||||
})
|
||||
console.log(data)
|
||||
function reset() {
|
||||
data.value = initialData
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<view class="p-6 text-center">
|
||||
<button type="primary" size="mini" class="my-6 w-160px" @click="send">
|
||||
发送请求
|
||||
</button>
|
||||
<view class="h-16">
|
||||
<view v-if="loading">
|
||||
loading...
|
||||
</view>
|
||||
<block v-else>
|
||||
<view class="text-xl">
|
||||
请求数据如下
|
||||
</view>
|
||||
<view class="text-green leading-8">
|
||||
{{ JSON.stringify(data) }}
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<view class="text-red">
|
||||
{{ data?.id }}
|
||||
</view>
|
||||
</view>
|
||||
<button type="default" size="mini" class="my-6 w-160px" @click="reset">
|
||||
重置数据
|
||||
</button>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
//
|
||||
</style>
|
||||
@ -1,54 +0,0 @@
|
||||
<script lang="ts" setup>
|
||||
import type { IFooItem } from '@/api/foo'
|
||||
import { getFooAPI } from '@/api/foo'
|
||||
|
||||
// const initialData = {
|
||||
// name: 'initialData',
|
||||
// id: '1234',
|
||||
// }
|
||||
const initialData = undefined
|
||||
|
||||
const { loading, error, data, run } = useRequest<IFooItem>(() => getFooAPI('菲鸽'), {
|
||||
immediate: true,
|
||||
initialData,
|
||||
})
|
||||
|
||||
function reset() {
|
||||
data.value = initialData
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<view class="p-6 text-center">
|
||||
<view class="my-2">
|
||||
pages 里面的 vue 文件会扫描成页面，将自动添加到 pages.json 里面。
|
||||
</view>
|
||||
<view class="my-2 text-green-400">
|
||||
但是 pages/components 里面的 vue 不会。
|
||||
</view>
|
||||
|
||||
<view class="my-4 text-center">
|
||||
<button type="primary" size="mini" class="w-160px" @click="run">
|
||||
发送请求
|
||||
</button>
|
||||
</view>
|
||||
<view class="h-16">
|
||||
<view v-if="loading">
|
||||
loading...
|
||||
</view>
|
||||
<block v-else>
|
||||
<view class="text-xl">
|
||||
请求数据如下
|
||||
</view>
|
||||
<view class="text-green leading-8">
|
||||
{{ JSON.stringify(data) }}
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
<view class="my-4 text-center">
|
||||
<button type="warn" size="mini" class="w-160px" :disabled="!data" @click="reset">
|
||||
重置数据
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
@ -1,53 +0,0 @@
|
||||
<route lang="jsonc" type="page">
|
||||
{
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationBarTitleText": "Vue Query 请求演示"
|
||||
}
|
||||
}
|
||||
</route>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { useQuery } from '@tanstack/vue-query'
|
||||
import { foo } from '@/api/foo'
|
||||
import { getFooQueryOptions } from '@/api/foo-vue-query'
|
||||
|
||||
// 简单使用
|
||||
onShow(async () => {
|
||||
const res = await foo()
|
||||
console.log('res: ', res)
|
||||
})
|
||||
|
||||
// vue-query 版
|
||||
const {
|
||||
data,
|
||||
error,
|
||||
isLoading: loading,
|
||||
refetch: send,
|
||||
} = useQuery(getFooQueryOptions('菲鸽-vue-query'))
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<view class="p-6 text-center">
|
||||
<button type="primary" size="mini" class="my-6 w-160px" @click="send">
|
||||
发送请求
|
||||
</button>
|
||||
<view class="h-16">
|
||||
<view v-if="loading">
|
||||
loading...
|
||||
</view>
|
||||
<block v-else>
|
||||
<view class="text-xl">
|
||||
请求数据如下
|
||||
</view>
|
||||
<view class="text-green leading-8">
|
||||
{{ JSON.stringify(data) }}
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
//
|
||||
</style>
|
||||
@ -1,127 +0,0 @@
|
||||
<!-- 使用 type="home" 属性设置首页，其他页面不需要设置，默认为page -->
|
||||
<route lang="jsonc" type="page">{
|
||||
"needLogin": true,
|
||||
"layout": "tabbar",
|
||||
"style": {
|
||||
// 'custom' 表示开启自定义导航栏，默认 'default'
|
||||
"navigationStyle": "default",
|
||||
"navigationBarTitleText": "选择城市"
|
||||
}
|
||||
}</route>
|
||||
|
||||
<template>
|
||||
<view class="">
|
||||
<view class="search-box mx-30rpx mt-30rpx">
|
||||
<wd-search
|
||||
placeholder="请输入城市名称"
|
||||
placeholder-left></wd-search>
|
||||
</view>
|
||||
|
||||
<view class="mt-52rpx mx-30rpx">
|
||||
<view class="text-[#333] leading-42rpx text-30rpx font-bold">当前定位</view>
|
||||
<view class="mt-40rpx">
|
||||
<view class="bg-[#F8F9FA] rounded-28rpx w-162rpx h-56rpx text-[#606266] flex items-center justify-center">
|
||||
<wd-img width="28rpx" height="28rpx" :src="`${OSS}icon/icon_location2.png`"></wd-img>
|
||||
<view class="text-26rpx text-[#606266] leading-36rpx">{{ city || LOCATION_DEFAULT_CITY }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<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 openCityList" :key="index"
|
||||
@click="City.handleChooseCity(item)"
|
||||
>
|
||||
<wd-img width="28rpx" height="28rpx" :src="`${OSS}icon/icon_location2.png`"></wd-img>
|
||||
<view class="text-26rpx text-[#606266] leading-36rpx">{{ item.name }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { router } from '@/utils/tools'
|
||||
import { getOpenCityList } from '@/api/tea-room'
|
||||
import { LOCATION_CITY_KEY, LOCATION_LAT_KEY, LOCATION_LNG_KEY } from '@/hooks/useLocation'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
|
||||
// 经纬度
|
||||
const latitude = ref<number>(0)
|
||||
const longitude = ref<number>(0)
|
||||
const city = ref<string>('')
|
||||
|
||||
// 已开通城市列表
|
||||
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 = {
|
||||
handleInit: async () => {
|
||||
city.value = uni.getStorageSync(LOCATION_CITY_KEY)
|
||||
const res = await getOpenCityList()
|
||||
openCityList.value = res.list
|
||||
},
|
||||
|
||||
/**
|
||||
* 选择城市
|
||||
*/
|
||||
handleChooseCity: (item: any) => {
|
||||
|
||||
const params = {
|
||||
latitude: item.latitude,
|
||||
longitude: item.longitude,
|
||||
city: item.name
|
||||
}
|
||||
uni.$emit('locationUpdate', params)
|
||||
|
||||
uni.setStorageSync(LOCATION_LAT_KEY, item.latitude)
|
||||
uni.setStorageSync(LOCATION_LNG_KEY, item.longitude)
|
||||
uni.setStorageSync(LOCATION_CITY_KEY, item.name)
|
||||
router.navigateBack()
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.search-box {
|
||||
display: flex;
|
||||
height: 100%;
|
||||
margin-right: 32px;
|
||||
--wot-search-padding: 0;
|
||||
--wot-search-side-padding: 0;
|
||||
|
||||
:deep() {
|
||||
.wd-search {
|
||||
background: transparent !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.wd-search__block {
|
||||
height: 72rpx;
|
||||
background-color: #F8F9FA !important;
|
||||
}
|
||||
|
||||
.wd-search__input {
|
||||
// #ifndef MP
|
||||
padding-right: 0 !important;
|
||||
// #endif
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -73,7 +73,7 @@
|
||||
<view class="font-400 text-24rpx text-[#303133] leading-34rpx">套餐管理</view>
|
||||
</view>
|
||||
|
||||
<view class="flex flex-col justify-center items-center w-[25%]">
|
||||
<view class="flex flex-col justify-center items-center w-[25%]" @click="router.navigateTo('/bundle/user/user-list')">
|
||||
<wd-img width="90rpx" height="90rpx" :src="`${OSS}images/store/home/image6.png`" mode="aspectFit" />
|
||||
<view class="font-400 text-24rpx text-[#303133] leading-34rpx">用户列表</view>
|
||||
</view>
|
||||
|
||||
@ -174,7 +174,7 @@
|
||||
return
|
||||
}
|
||||
|
||||
router.navigateTo( '/pages/login/set-password')
|
||||
router.navigateTo('/pages/login/set-password')
|
||||
},
|
||||
|
||||
// 获取手机号
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 664 B |
Binary file not shown.
|
Before Width: | Height: | Size: 394 B |
Binary file not shown.
|
Before Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 734 B |
Binary file not shown.
|
Before Width: | Height: | Size: 266 B |
Binary file not shown.
|
Before Width: | Height: | Size: 3.9 KiB |
@ -1,37 +1,20 @@
|
||||
<route lang="jsonc" type="page">
|
||||
{
|
||||
<route lang="jsonc" type="page">{
|
||||
"layout": "tabbar",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}
|
||||
</route>
|
||||
}</route>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import type { IUserResult } from '@/api/types/user'
|
||||
import { getUserInfo } from '@/api/user'
|
||||
import { useUserStore } from '@/store'
|
||||
import { router } from '@/utils/tools'
|
||||
import headerBgImg from './img/bg.png'
|
||||
import modifyBgImg from './img/modify.png'
|
||||
import editIconImg from './img/修改 (1).png'
|
||||
import defaultAvatarImg from './img/头像.png'
|
||||
import playIconImg from './img/播放 (5).png'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
const navbarHeight = inject('navbarHeight')
|
||||
const rightPadding = inject('capsuleOffset')
|
||||
|
||||
// 本地图片资源
|
||||
const defaultAvatar = defaultAvatarImg as string
|
||||
const editIcon = editIconImg as string
|
||||
const playIcon = playIconImg as string
|
||||
const headerBg = headerBgImg as string
|
||||
const modifyBg = modifyBgImg as string
|
||||
|
||||
// 调试：检查背景图片路径
|
||||
console.log('headerBg:', headerBg)
|
||||
|
||||
// 登录信息相关
|
||||
const user = ref<IUserResult>({
|
||||
id: 0,
|
||||
@ -124,7 +107,7 @@ const My = {
|
||||
// 跳转到个人信息
|
||||
handleToProfile: () => {
|
||||
if (!isLogin.value) {
|
||||
router.navigateTo('/pages/my/profile')
|
||||
router.navigateTo('/bundle/profile/profile')
|
||||
}
|
||||
else {
|
||||
router.navigateTo('/pages/login/login')
|
||||
@ -181,7 +164,8 @@ const My = {
|
||||
|
||||
<template>
|
||||
<view>
|
||||
<view class="home-bg fixed left-0 top-0 w-[100%]" :style="{ backgroundImage: headerBg ? `url('${headerBg}')` : 'none' }">
|
||||
<view class="home-bg fixed left-0 top-0 w-[100%]"
|
||||
:style="{ backgroundImage: `url('${OSS}images/store/my/image2.png')` }">
|
||||
<wd-navbar safe-area-inset-top :bordered="false" custom-style="background-color: transparent !important;">
|
||||
<template #left>
|
||||
<view class="ml-16rpx flex items-center" @click="My.handleToSettings" />
|
||||
@ -198,9 +182,11 @@ const My = {
|
||||
|
||||
<view class="pb-0rpx" :style="{ paddingTop: `${navbarHeight}px` }">
|
||||
<!-- 账号昵称显示 -->
|
||||
<view class="user-info-bg relative z-10 ml-30rpx mr-30rpx flex items-center" :style="{ backgroundImage: headerBg ? `url('${headerBg}')` : 'none' }">
|
||||
<view class="user-info-bg relative z-10 ml-30rpx mr-30rpx flex items-center"
|
||||
:style="{ backgroundImage: `url('${OSS}images/store/my/image2.png')` }">
|
||||
<view class="relative z-10">
|
||||
<wd-img width="120rpx" height="120rpx" :src="(isLogin && user.avatar) ? user.avatar : defaultAvatar" mode="aspectFill" round />
|
||||
<wd-img width="120rpx" height="120rpx" :src="(isLogin && user.avatar) ? user.avatar : `${OSS}images/store/my/image1.png`"
|
||||
mode="aspectFill" round />
|
||||
</view>
|
||||
<view class="relative z-10 ml-22rpx flex flex-1 items-center justify-between">
|
||||
<view class="flex-1" @click="My.handleToProfile">
|
||||
@ -214,7 +200,8 @@ const My = {
|
||||
</view>
|
||||
<view class="relative ml-20rpx" @click="router.navigateTo('/bundle/wallet/wallet')">
|
||||
<view class="h-148rpx w-300rpx">
|
||||
<wd-img width="100%" height="100%" :src="`${OSS}images/my/my_image3.png`" mode="aspectFill" />
|
||||
<wd-img width="100%" height="100%" :src="`${OSS}images/my/my_image3.png`"
|
||||
mode="aspectFill" />
|
||||
</view>
|
||||
<view class="absolute bottom-12rpx left-24rpx">
|
||||
<view class="flex items-center">
|
||||
@ -248,8 +235,10 @@ const My = {
|
||||
<text class="w-140rpx">营业时间:</text>
|
||||
<text class="flex-1 text-[#000]">{{ storeInfo.business_hours || '08:00-22:00' }}</text>
|
||||
</view>
|
||||
<view class="modify-btn absolute right-0 flex items-center px-20rpx py-8rpx" :style="{ backgroundImage: modifyBg ? `url('${modifyBg}')` : 'none' }" @click="My.handleEditStore">
|
||||
<wd-img width="24rpx" height="24rpx" :src="editIcon" class="mr-8rpx" />
|
||||
<view class="modify-btn absolute right-0 flex items-center px-20rpx py-8rpx"
|
||||
:style="{ backgroundImage: `url('${OSS}images/store/my/image3.png')` }"
|
||||
@click="My.handleEditStore">
|
||||
<wd-img width="24rpx" height="24rpx" :src="`${OSS}images/store/my/image4.png`" class="mr-8rpx" />
|
||||
<text class="text-24rpx text-[#fff]">修改</text>
|
||||
</view>
|
||||
</view>
|
||||
@ -265,24 +254,17 @@ const My = {
|
||||
门店视频/图片
|
||||
</view>
|
||||
<view class="grid grid-cols-3 gap-16rpx">
|
||||
<view
|
||||
v-for="(item, index) in storeMediaList"
|
||||
:key="index"
|
||||
<view v-for="(item, index) in storeMediaList" :key="index"
|
||||
class="relative aspect-square w-full overflow-hidden rounded-8rpx"
|
||||
@click="My.handlePreviewMedia(index)"
|
||||
>
|
||||
<wd-img
|
||||
width="100%"
|
||||
height="100%"
|
||||
:src="item.url"
|
||||
mode="aspectFill"
|
||||
/>
|
||||
@click="My.handlePreviewMedia(index)">
|
||||
<wd-img width="100%" height="100%" :src="item.url" mode="aspectFill" />
|
||||
<!-- 视频播放图标 -->
|
||||
<view v-if="item.type === 'video'" class="absolute inset-0 flex items-center justify-center">
|
||||
<wd-img width="60rpx" height="60rpx" :src="playIcon" />
|
||||
<wd-img width="60rpx" height="60rpx" :src="`${OSS}images/store/my/image5.png')`" />
|
||||
</view>
|
||||
<!-- +8 遮罩 -->
|
||||
<view v-if="item.overlay" class="absolute inset-0 flex items-center justify-center bg-black bg-opacity-50">
|
||||
<view v-if="item.overlay"
|
||||
class="absolute inset-0 flex items-center justify-center bg-black bg-opacity-50">
|
||||
<text class="text-32rpx text-[#fff] font-bold">+{{ item.overlay }}</text>
|
||||
</view>
|
||||
</view>
|
||||
@ -291,12 +273,13 @@ const My = {
|
||||
</view>
|
||||
|
||||
<!-- 客服电话 -->
|
||||
<wd-action-sheet v-model="showServiceMobile" :actions="sheetMenu" cancel-text="取消" @close="showServiceMobile = false" @select="My.handleSelectMenu" />
|
||||
<wd-action-sheet v-model="showServiceMobile" :actions="sheetMenu" cancel-text="取消"
|
||||
@close="showServiceMobile = false" @select="My.handleSelectMenu" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
|
||||
@ -1,11 +1,9 @@
|
||||
<route lang="jsonc" type="page">
|
||||
{
|
||||
<route lang="jsonc" type="page">{
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}
|
||||
</route>
|
||||
}</route>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import type { IUserResult } from '@/api/types/user'
|
||||
@ -13,14 +11,10 @@ import { updateUserInfo } from '@/api/user'
|
||||
import { toast } from '@/utils/toast'
|
||||
import { router } from '@/utils/tools'
|
||||
import { uploadFileUrl, useUpload } from '@/utils/uploadFile'
|
||||
import defaultAvatarImg from './img/头像.png'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
const navbarHeight = inject('navbarHeight')
|
||||
|
||||
// 本地图片资源
|
||||
const defaultAvatar = defaultAvatarImg as string
|
||||
|
||||
// 用户信息相关
|
||||
const user = ref<IUserResult>({
|
||||
id: 0,
|
||||
@ -58,6 +52,7 @@ const avatarActions = ref([
|
||||
const showEditNicknamePopup = ref(false)
|
||||
const nicknameInput = ref('')
|
||||
|
||||
console.log(`${OSS}images/store/my/image1.png`)
|
||||
/**
|
||||
* 上传头像文件
|
||||
*/
|
||||
@ -265,7 +260,9 @@ onLoad(() => {
|
||||
<!-- 头像 -->
|
||||
<wd-cell is-link title="头像" @click="Profile.handleEditAvatar">
|
||||
<template #value>
|
||||
<wd-img width="64rpx" height="64rpx" :src="(user.avatar && typeof user.avatar === 'string' && user.avatar.trim()) ? user.avatar : defaultAvatar" mode="aspectFill" round />
|
||||
<wd-img width="64rpx" height="64rpx"
|
||||
:src="(user.avatar && typeof user.avatar === 'string' && user.avatar.trim()) ? user.avatar : `${OSS}images/store/my/image1.png`"
|
||||
mode="aspectFill" round />
|
||||
</template>
|
||||
</wd-cell>
|
||||
|
||||
@ -284,22 +281,12 @@ onLoad(() => {
|
||||
</view>
|
||||
|
||||
<!-- 头像选择 Action Sheet -->
|
||||
<wd-action-sheet
|
||||
v-model="showAvatarActionSheet"
|
||||
:actions="avatarActions"
|
||||
cancel-text="取消"
|
||||
@close="showAvatarActionSheet = false"
|
||||
@select="Profile.handleSelectAvatarAction"
|
||||
/>
|
||||
<wd-action-sheet v-model="showAvatarActionSheet" :actions="avatarActions" cancel-text="取消"
|
||||
@close="showAvatarActionSheet = false" @select="Profile.handleSelectAvatarAction" />
|
||||
|
||||
<!-- 编辑昵称弹窗 -->
|
||||
<wd-popup
|
||||
v-model="showEditNicknamePopup"
|
||||
lock-scroll
|
||||
custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;"
|
||||
position="bottom"
|
||||
@close="Profile.handleCloseEditNickname"
|
||||
>
|
||||
<wd-popup v-model="showEditNicknamePopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;"
|
||||
position="bottom" @close="Profile.handleCloseEditNickname">
|
||||
<view class="relative bg-white px-30rpx pb-78rpx pt-50rpx">
|
||||
<!-- 关闭按钮 -->
|
||||
<view class="absolute right-30rpx top-18rpx" @click="Profile.handleCloseEditNickname">
|
||||
@ -316,15 +303,9 @@ onLoad(() => {
|
||||
<view class="mb-20rpx text-30rpx text-[#303133] leading-44rpx">
|
||||
昵称:
|
||||
</view>
|
||||
<wd-input
|
||||
v-model="nicknameInput"
|
||||
type="text"
|
||||
placeholder="请输入昵称"
|
||||
no-border
|
||||
<wd-input v-model="nicknameInput" type="text" placeholder="请输入昵称" no-border
|
||||
custom-class="!bg-[#F6F7F8] !border !border-solid !border-[#EAECF0] !rounded-16rpx"
|
||||
custom-input-class="!px-32rpx !h-104rpx"
|
||||
:maxlength="10"
|
||||
/>
|
||||
custom-input-class="!px-32rpx !h-104rpx" :maxlength="10" />
|
||||
</view>
|
||||
|
||||
<!-- 提示文字 -->
|
||||
@ -333,11 +314,9 @@ onLoad(() => {
|
||||
</view>
|
||||
|
||||
<!-- 保存按钮 -->
|
||||
<view
|
||||
class="h-90rpx rounded-8rpx bg-[#4C9F44] text-center text-[#fff] leading-90rpx"
|
||||
<view class="h-90rpx rounded-8rpx bg-[#4C9F44] text-center text-[#fff] leading-90rpx"
|
||||
:class="{ 'opacity-40': !isNicknameValid }"
|
||||
@click="isNicknameValid && Profile.handleSaveNickname()"
|
||||
>
|
||||
@click="isNicknameValid && Profile.handleSaveNickname()">
|
||||
保存
|
||||
</view>
|
||||
</view>
|
||||
|
||||
593
src/pages/order/order-detail.vue
Normal file
593
src/pages/order/order-detail.vue
Normal file
@ -0,0 +1,593 @@
|
||||
<route lang="jsonc" type="page">
|
||||
{
|
||||
"needLogin": true,
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}
|
||||
</route>
|
||||
|
||||
<template>
|
||||
<view class="pb-254rpx">
|
||||
<!-- 一键续订 -->
|
||||
<!-- <wd-popup v-model="showRenewPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
|
||||
<view class="relative pb-26rpx">
|
||||
<view class="absolute top-18rpx right-30rpx" @click="showRenewPopup = false">
|
||||
<wd-img width="60rpx" height='60rpx' :src="`${OSS}icon/icon_close.png`"></wd-img>
|
||||
</view>
|
||||
<view class="text-36rpx text-[#121212] leading-50rpx text-center pt-50rpx pb-40rpx">续订包间</view>
|
||||
<view>
|
||||
<view class="mx-60rpx">
|
||||
<view class="text-[#01000D] text-32rpx leading-44rpx">续订时间</view>
|
||||
<view class="grid grid-cols-4 gap-x-20rpx gap-y-20rpx mt-28rpx">
|
||||
<view v-for="item in timeList" :key="item.time"
|
||||
class="h-72rpx rounded-16rpx flex items-center justify-center text-28rpx leading-40rpx"
|
||||
:class="[item.id == selectedRenewTime ? 'bg-[#4C9F44] text-[#fff]' : 'bg-[#F7F7F7] text-[#606266]']"
|
||||
@click="selectedRenewTime = item.id">
|
||||
{{ item.time }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mx-60rpx mt-60rpx">
|
||||
<view class="text-[#01000D] text-32rpx leading-44rpx">支付方式</view>
|
||||
<view class="mt-28rpx">
|
||||
<wd-radio-group v-model="pay" shape="dot" checked-color="#4C9F44">
|
||||
<view class="flex justify-between items-center mb-40rpx" v-for="(item, index) in payList" :key="index" @click="pay = item.id">
|
||||
<view class="flex items-center">
|
||||
<wd-img width="50rpx" height="50rpx" :src="item.icon"></wd-img>
|
||||
<view class="ml-20rpx text-30rpx text-[#303133] leading-42rpx">{{ item.name }}</view>
|
||||
</view>
|
||||
<view class="flex items-center">
|
||||
<wd-radio :value="item.value">
|
||||
<view class="text-[#303133] text-26rpx leading-36rpx mr-20rpx" v-if="item.id == 1">可用202.22</view>
|
||||
</wd-radio>
|
||||
</view>
|
||||
</view>
|
||||
</wd-radio-group>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-102rpx">
|
||||
<wd-gap height="2rpx" bg-color="#EFF0F2"></wd-gap>
|
||||
</view>
|
||||
|
||||
<view class="flex justify-between items-center mt-50rpx mx-60rpx">
|
||||
<view class="flex items-center">
|
||||
<view class="text-24rpx text-[#303133] leading-34rpx">合计：</view>
|
||||
<view class="flex items-center h-56rpx mr-16rpx">
|
||||
<price-format color="#FF5951" :first-size="40" :second-size="40" :subscript-size="28" :price="23.02"></price-format>
|
||||
<view class="ml-20rpx">
|
||||
<price-format color="#909399" :first-size="26" :second-size="26" :subscript-size="26" :price="23.02" lineThrough></price-format>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<wd-button custom-class='!bg-[#4C9F44] !rounded-8rpx !h-70rpx'>立即预定</wd-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</wd-popup> -->
|
||||
<wd-popup v-model="showRenewPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
|
||||
<view class="relative pb-26rpx">
|
||||
<view class="absolute top-18rpx right-30rpx" @click="showRenewPopup = false; ">
|
||||
<wd-img width="60rpx" height='60rpx' :src="`${OSS}icon/icon_close.png`"></wd-img>
|
||||
</view>
|
||||
<view class="text-36rpx text-[#121212] leading-50rpx text-center pt-50rpx pb-40rpx">续订包间</view>
|
||||
<!-- 预定时间 -->
|
||||
<view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx" @click="showBookTimePopup = true;">
|
||||
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">预定时间</view>
|
||||
<view class="flex items-center justify-between">
|
||||
<view class="text-[26rpx] text-[#606266] leading-36rpx">{{ sevenDay.minimum_time }}小时起订</view>
|
||||
<view class="flex items-center">
|
||||
<view class="text-[28rpx] text-[#909399] leading-40rpx w-430rpx line-1 text-right">
|
||||
<template v-if="reserveTime.length > 0">
|
||||
{{ reserveTime[0] }} {{ reserveTime[1].join(',') }}
|
||||
</template>
|
||||
<template v-else>
|
||||
请选择
|
||||
</template>
|
||||
</view>
|
||||
<view>
|
||||
<wd-icon name="chevron-right" size="32rpx" color="#909399"></wd-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-102rpx">
|
||||
<wd-gap height="2rpx" bg-color="#EFF0F2"></wd-gap>
|
||||
</view>
|
||||
|
||||
<view class="flex justify-between items-center mt-50rpx mx-60rpx">
|
||||
<view class="flex items-center">
|
||||
<view class="text-24rpx text-[#303133] leading-34rpx">合计：</view>
|
||||
<view class="flex items-center h-56rpx mr-16rpx">
|
||||
<price-format color="#FF5951" :first-size="40" :second-size="40" :subscript-size="28" :price="totalReserveMoney"></price-format>
|
||||
<!-- <view class="ml-20rpx">
|
||||
<price-format color="#909399" :first-size="26" :second-size="26" :subscript-size="26" :price="23.02" lineThrough></price-format>
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<wd-button custom-class='!bg-[#4C9F44] !rounded-8rpx !h-70rpx' @click="OrderDetail.handleRenewReserve">立即预定</wd-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</wd-popup>
|
||||
|
||||
<!-- 续订成功 -->
|
||||
<wd-popup v-model="showRenewSuccessPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
|
||||
<view class="relative pt-64rpx pb-74rpx">
|
||||
<view class="flex justify-center items-center">
|
||||
<view class="bg-[#4C9F44] w-280rpx rounded-280rpx">
|
||||
<wd-img width="280rpx" height="280rpx" :src="`${OSS}images/reserve_room/reserve_room_image7.png`"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="text-[#303133] text-36rpx leading-46rpx text-center mt-48rpx">包间续订成功</view>
|
||||
<view class="text-[#9CA3AF] text-28rpx leading-44rpx mt-16rpx text-center">可以刷新页面查看预约时间</view>
|
||||
<view class="w-630rpx h-90rpx leading-90rpx text-center bg-[#4C9F44] rounded-8rpx text-[#fff] mt-174rpx mx-auto" @click="showRenewSuccessPopup = false">好的</view>
|
||||
</view>
|
||||
</wd-popup>
|
||||
|
||||
<!-- 取消订单 -->
|
||||
<wd-message-box selector="wd-message-box-slot"></wd-message-box>
|
||||
|
||||
<!-- 费用详情 -->
|
||||
<wd-popup v-model="showCostPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
|
||||
<view class="relative pb-30rpx">
|
||||
<view class="absolute top-18rpx right-30rpx" @click="showCostPopup = false">
|
||||
<wd-img width="60rpx" height='60rpx' :src="`${OSS}icon/icon_close.png`"></wd-img>
|
||||
</view>
|
||||
<view class="text-36rpx text-[#121212] leading-50rpx text-center pt-50rpx pb-40rpx">费用明细</view>
|
||||
<view class="collapse">
|
||||
<view class="px-30rpx">
|
||||
<view class="flex justify-between items-center">
|
||||
<view class="font-bold text-30rpx leading-42rpx text-[#303133]">茶室费</view>
|
||||
<view class="font-bold text-30rpx leading-42rpx text-[#303133] flex items-center">
|
||||
￥640.00
|
||||
</view>
|
||||
</view>
|
||||
<view class="rounded-16rpx py-20rpx">
|
||||
<view class="mb-26rpx">
|
||||
<view class="font-400 text-28rpx leading-40rpx text-[#303133] flex items-center justify-between mb-16rpx">
|
||||
<view>茶室费（￥160元/小时）</view>
|
||||
<view>x4</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="px-30rpx">
|
||||
<view class="flex justify-between items-center">
|
||||
<view class="font-bold text-30rpx leading-42rpx text-[#303133]">优惠</view>
|
||||
<view class="font-bold text-30rpx leading-42rpx text-[#303133] flex items-center text-[#4C9F44]">
|
||||
-￥148.00
|
||||
</view>
|
||||
</view>
|
||||
<view class="rounded-16rpx pt-20rpx">
|
||||
<view class="font-400 text-28rpx leading-40rpx text-[#303133] flex items-center justify-between mb-16rpx">
|
||||
<view>优惠券</view>
|
||||
<view>-￥20</view>
|
||||
</view>
|
||||
|
||||
<view class="font-400 text-28rpx leading-40rpx text-[#303133] flex items-center justify-between mb-16rpx">
|
||||
<view>会员八折</view>
|
||||
<view>-￥20</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="mx-60rpx mt-30rpx">
|
||||
<wd-gap height="2rpx" bg-color="#F6F7F9"></wd-gap>
|
||||
</view>
|
||||
<view class="mx-60rpx text-30rpx text-[#303133] leading-42rpx flex items-center justify-between mt-30rpx">
|
||||
<view>实际退款</view>
|
||||
<view>￥698.90</view>
|
||||
</view>
|
||||
</view>
|
||||
</wd-popup>
|
||||
|
||||
<!-- 选择预定时间 -->
|
||||
<booking-time v-model="showBookTimePopup" :day="sevenDay" @selectedTime="OrderDetail.handleChooseReserveTime"></booking-time>
|
||||
|
||||
<view>
|
||||
<navbar :title="title" custom-class='!bg-[#F6F7F8]'></navbar>
|
||||
</view>
|
||||
|
||||
<view class="mx-30rpx coupon-bg" >
|
||||
<view class="flex items-center px-30rpx pt-30rpx pb-40rpx">
|
||||
<view class="mr-30rpx">
|
||||
<wd-img width="190rpx" height="190rpx" :src="order.room_msg.img" mode="scaleToFill"></wd-img>
|
||||
</view>
|
||||
<view class="flex-1">
|
||||
<view class="flex justify-between items-center" @click="OrderDetail.handleToStore">
|
||||
<view class="flex items-center font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx">
|
||||
<view class="line-1 w-300rpx">
|
||||
{{ order.room_msg.title }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="text-26rpx leading-36rpx text-[#909399]">￥{{ order.room_all_price }}</view>
|
||||
</view>
|
||||
<view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
|
||||
￥{{ order.room_price }}/小时
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-28rpx pb-36rpx">
|
||||
<view class="text-30rpx leading-42rpx text-[#303133] px-30rpx">预约信息</view>
|
||||
<view class="font-500 text-26rpx leading-48rpx text-[#606266] mt-20rpx">
|
||||
<view class="mb-20rpx px-30rpx">预约时间：{{ order.day_time }} {{ order.renew_dtime.start_time || order.start_time }}-{{ order.renew_dtime.end_time || order.end_time }}</view>
|
||||
<view class="flex justify-between items-center pl-30rpx" >
|
||||
<view>预约时长：{{ order.hours }}小时</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 订单信息 -->
|
||||
<view class="bg-white rounded-16rpx px-30rpx py-34rpx mx-30rpx mt-20rpx">
|
||||
<view class="text-[#303133] text-32rpx leading-44rpx">订单信息</view>
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
||||
<view>订单编号</view>
|
||||
<view>
|
||||
<text>{{ order.order_sn }}</text>
|
||||
<wd-divider vertical />
|
||||
<text class="text-[#4C9F44]" @click="copy(order.order_sn)">复制</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
||||
<view>创建时间</view>
|
||||
<view>{{ order.dtime }}</view>
|
||||
</view>
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
||||
<view>支付方式</view>
|
||||
<view>管理员添加</view>
|
||||
</view>
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
||||
<view>用户手机号</view>
|
||||
<view>1110</view>
|
||||
</view>
|
||||
<view class="my-22rpx">
|
||||
<wd-gap height="2rpx" bg-color='#F6F7F9'></wd-gap>
|
||||
</view>
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
||||
<view>续单时长</view>
|
||||
<view>{{ order.update_dtime }}</view>
|
||||
</view>
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
||||
<view>续单费用</view>
|
||||
<view>{{ order.update_dtime }}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 操作按钮 -->
|
||||
<view class="w-full fixed bottom-0 left-0 right-0 bg-white h-152rpx">
|
||||
<!-- 待使用 -->
|
||||
<view class="flex items-center justify-between mx-58rpx mt-34rpx" v-if="orderStatus == AdminOrderStatus.ToUse || orderStatus == AdminOrderStatus.Consuming">
|
||||
<view class="flex items-center">
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] mr-16rpx" @click="OrderDetail.handleCancelOrder">取消订单</view>
|
||||
</view>
|
||||
<view class="w-360rpx h-90rpx leading-90rpx text-center bg-[#4C9F44] rounded-8rpx text-[#fff]" @click="OrderDetail.handleToPay">释放时间</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { TeaRoomOrderStatusTextValue, TeaRoomOrderStatus, AdminOrderStatus } from '@/utils/order'
|
||||
import { useMessage } from 'wot-design-uni'
|
||||
import {toast} from '@/utils/toast'
|
||||
import { getTeaRoomOrderDetail } from '@/api/tea-room'
|
||||
import { handleTRCancelOrderHooks, handleTRToPayHooks, handleToTRStoreHooks } from '@/hooks/useOrder'
|
||||
import type { ITeaSpecialistOrderDetailsResult } from '@/api/types/tea'
|
||||
import { router } from '@/utils/tools'
|
||||
import { ReserveServiceCategory, OrderType } from '@/utils/order'
|
||||
import type { ITeaSpecialistFuture7DaysResult } from '@/api/types/tea'
|
||||
import { getNext7Days, renewTeaRoomOrder } from '@/api/tea-room'
|
||||
import { toTimes, copy } from '@/utils/tools'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
const title = ref<string>('')
|
||||
const orderStatus = ref<number>(0) // 订单状态：待使用、退款等
|
||||
|
||||
// 续订包间
|
||||
const showRenewPopup = ref<boolean>(false)
|
||||
const timeList = [
|
||||
{id: 1, time: '1小时'},
|
||||
{id: 2, time: '2小时'},
|
||||
{id: 3, time: '3小时'},
|
||||
{id: 4, time: '4小时'},
|
||||
{id: 5, time: '5小时'},
|
||||
{id: 6, time: '6小时'},
|
||||
]
|
||||
const selectedRenewTime = ref<number>(0) // 选择的续订时间
|
||||
const pay = ref<number>(1) // 支付方式
|
||||
const payList = ref<Array<any>>([
|
||||
{
|
||||
id: 1,
|
||||
name: '平台余额',
|
||||
icon: `${OSS}icon/icon_platform_balance.png`,
|
||||
balance: 0,
|
||||
value: 1
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: '微信支付',
|
||||
icon: `${OSS}icon/icon_weichat.png`,
|
||||
balance: 0,
|
||||
value: 3
|
||||
}
|
||||
])
|
||||
|
||||
const showRenewSuccessPopup = ref<boolean>(false)
|
||||
|
||||
// 选择预定时间
|
||||
const showBookTimePopup = ref<boolean>(false)
|
||||
const sevenDay = reactive<ITeaSpecialistFuture7DaysResult>({
|
||||
minimum_time: 0,
|
||||
time: []
|
||||
})
|
||||
const reserveTime = ref<Array<any>>([])
|
||||
|
||||
// 订单倒计时取消
|
||||
const time = ref<number>(30 * 60 * 60 * 1000)
|
||||
|
||||
// 取消订单弹窗
|
||||
const message = useMessage('wd-message-box-slot')
|
||||
|
||||
// 费用明细
|
||||
const showCostPopup = ref<boolean>(false) // 是否显示退款详情弹出框
|
||||
|
||||
// 订单
|
||||
const orderId = ref<number>(0)
|
||||
const order = ref<ITeaSpecialistOrderDetailsResult>({
|
||||
order_amount: '',
|
||||
order_sn: '',
|
||||
store_id: 0,
|
||||
room_msg: {
|
||||
id: 0,
|
||||
price: 0,
|
||||
img: '',
|
||||
title: '',
|
||||
},
|
||||
store_msg: {
|
||||
id: 0,
|
||||
address: '',
|
||||
name: '',
|
||||
operation_type: 1,
|
||||
image: '',
|
||||
latitude: '',
|
||||
longitude: '',
|
||||
contact_phone: ''
|
||||
},
|
||||
time1: 0,
|
||||
order_status: 0,
|
||||
room_all_price: 0,
|
||||
room_price: 0,
|
||||
day_time: '',
|
||||
start_time: '',
|
||||
end_time: '',
|
||||
hours: 0,
|
||||
distance: 0,
|
||||
pay_way: 0,
|
||||
pay_way_title: '',
|
||||
dtime: '',
|
||||
update_dtime: '',
|
||||
renew_price: 0,
|
||||
renew_dtime: {
|
||||
start_time: '',
|
||||
end_time: '',
|
||||
renew_price: 0
|
||||
}
|
||||
})
|
||||
|
||||
// 一键续订的金额
|
||||
const totalReserveMoney = ref<number>(0)
|
||||
|
||||
onLoad(async (args) => {
|
||||
orderId.value = args.orderId
|
||||
// 获取订单详情
|
||||
OrderDetail.handleInit()
|
||||
|
||||
// 预定时间
|
||||
const next7 = await getNext7Days()
|
||||
Object.assign(sevenDay, next7)
|
||||
})
|
||||
|
||||
onUnload(() => {
|
||||
uni.$off('refreshOrderDetail')
|
||||
})
|
||||
|
||||
onShareAppMessage(async (e) => {
|
||||
if (e.from === 'button') {
|
||||
return {
|
||||
title: `我在${order.value.store_msg.name}预定了${order.value.room_msg.title}，一起来吧！`,
|
||||
path: `/pages/share/tea-room/share-order-detail?orderId=${orderId.value}`,
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
const OrderDetail = {
|
||||
/**
|
||||
* 获取订单详情
|
||||
*/
|
||||
handleInit: async () => {
|
||||
const res = await getTeaRoomOrderDetail({
|
||||
id: orderId.value,
|
||||
latitude: uni.getStorageSync('latitude'),
|
||||
longitude: uni.getStorageSync('longitude')
|
||||
})
|
||||
order.value = res.details
|
||||
console.log("🚀 ~ order.value :", order.value )
|
||||
title.value = TeaRoomOrderStatusTextValue[order.value.order_status].title || '订单详情'
|
||||
orderStatus.value = order.value.order_status
|
||||
},
|
||||
|
||||
/**
|
||||
* 支付订单
|
||||
*/
|
||||
handleToPay: () => {
|
||||
uni.$on('refreshOrderDetail', () => {
|
||||
OrderDetail.handleInit()
|
||||
uni.$off('refreshOrderDetail')
|
||||
})
|
||||
|
||||
handleTRToPayHooks(orderId.value, order.value.store_msg.name, order.value.store_msg.id)
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取订单详情
|
||||
*/
|
||||
handleCancelOrder: () => {
|
||||
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') {
|
||||
// 点击确认按钮回调事件
|
||||
uni.$on('refreshOrderDetail', () => {
|
||||
OrderDetail.handleInit()
|
||||
uni.$off('refreshOrderDetail')
|
||||
})
|
||||
|
||||
handleTRCancelOrderHooks(orderId.value)
|
||||
}
|
||||
toast.info('订单取消成功')
|
||||
}).catch(() => {
|
||||
// 点击取消按钮回调事件
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 再次预定
|
||||
*/
|
||||
handleAgainReserve: () => {
|
||||
router.navigateTo(
|
||||
`/bundle/tea-room/detail?storeId=${order.value.store_msg.id}&roomId=${order.value.room_msg.id}&type=${ReserveServiceCategory.ReserveRoom}&price=${order.value.room_msg.price}`
|
||||
)
|
||||
},
|
||||
|
||||
/**
|
||||
* 选中预定时间
|
||||
*/
|
||||
handleChooseReserveTime: (params: any) => {
|
||||
reserveTime.value = params
|
||||
|
||||
// 一键续订的金额
|
||||
totalReserveMoney.value = Number(toTimes(params[3], order.value.room_price))
|
||||
},
|
||||
|
||||
/**
|
||||
* 确认一键续订
|
||||
*/
|
||||
handleRenewReserve: async () => {
|
||||
uni.showLoading({ title: '加载中...' })
|
||||
|
||||
try {
|
||||
await renewTeaRoomOrder({
|
||||
id: orderId.value,
|
||||
start_time: reserveTime.value[2][0],
|
||||
end_time: reserveTime.value[2][reserveTime.value[2].length - 1],
|
||||
renew_hour: reserveTime.value[3],
|
||||
})
|
||||
|
||||
uni.$on('payment', params => {
|
||||
uni.$off("payment")
|
||||
if (params.result) {
|
||||
OrderDetail.handleInit()
|
||||
showRenewSuccessPopup.value = true
|
||||
} else {
|
||||
message.alert({
|
||||
title: '提示',
|
||||
msg: '您已取消续订',
|
||||
confirmButtonText: '确定',
|
||||
confirmButtonProps: {
|
||||
customClass: '!bg-[#4C9F44] !text-[#fff] !text-32rpx !leading-44rpx !rounded-8rpx',
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
uni.hideLoading()
|
||||
showRenewPopup.value = false
|
||||
|
||||
router.navigateTo(
|
||||
`/pages/cashier/cashier?from=${OrderType.TeaRoomOrder}&renew=renewTeaRoomOrder&orderId=${orderId.value}&teaRoomName=${order.value.store_msg.name}&storeId=${order.value.store_msg.id}`
|
||||
)
|
||||
} catch (err) {
|
||||
uni.hideLoading()
|
||||
toast.info('续订失败')
|
||||
return false
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 跳转到对对应室的详情页
|
||||
*/
|
||||
handleToStore: () => {
|
||||
handleToTRStoreHooks(order.value.store_id, order.value.store_msg.operation_type)
|
||||
},
|
||||
|
||||
/**
|
||||
* 处理导航逻辑
|
||||
*/
|
||||
handleLocation: () => {
|
||||
uni.openLocation({
|
||||
latitude: Number(order.value.store_msg.latitude),
|
||||
longitude: Number(order.value.store_msg.longitude),
|
||||
name: order.value.store_msg.name,
|
||||
address: order.value.store_msg.address,
|
||||
scale: 18
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 处理拨打电话逻辑
|
||||
*/
|
||||
handleCallPhone: () => {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: order.value.store_msg.contact_phone
|
||||
})
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: $cz-page-background;
|
||||
}
|
||||
|
||||
.coupon-bg {
|
||||
background-image: url(#{$OSS}images/order/order_image2.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.collapse {
|
||||
:deep() {
|
||||
.wd-collapse-item::after,
|
||||
.wd-collapse-item__header.is-expanded::after {
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
.wd-collapse-item__body {
|
||||
padding-top: 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
222
src/pages/order/order.vue
Normal file
222
src/pages/order/order.vue
Normal file
@ -0,0 +1,222 @@
|
||||
<!-- 使用 type="home" 属性设置首页，其他页面不需要设置，默认为page -->
|
||||
<route lang="jsonc">{
|
||||
"layout": "tabbar",
|
||||
"style": {
|
||||
// 'custom' 表示开启自定义导航栏，默认 'default'
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTitleText": "首页"
|
||||
}
|
||||
}</route>
|
||||
|
||||
<template>
|
||||
<view class="">
|
||||
<view class="order-list sticky top-0 left-0 z-50 bg-[#F6F7F8] pb-10rpx">
|
||||
<wd-navbar safeAreaInsetTop custom-class='!bg-[#F6F7F8]' :bordered="false" placeholder>
|
||||
<template #left>
|
||||
<!-- <view class="search-box">
|
||||
<wd-search v-model="keywords" hide-cancel placeholder-left light placeholder="搜索订单信息"></wd-search>
|
||||
</view> -->
|
||||
<view class="search-box flex items-center ml-26rpx" @click="Order.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>
|
||||
</view>
|
||||
</template>
|
||||
</wd-navbar>
|
||||
<view class="tabs">
|
||||
<wd-tabs v-model="tab" swipeable slidable="always" :lazy="false" @click="Order.handleChangeTabs">
|
||||
<wd-tab title="全部" :name="AdminOrderStatusText.All"></wd-tab>
|
||||
<wd-tab title="待使用" :name="AdminOrderStatusText.ToUse"></wd-tab>
|
||||
<wd-tab title="使用中" :name="AdminOrderStatusText.Consuming"></wd-tab>
|
||||
<wd-tab title="已完成" :name="AdminOrderStatusText.Finished"></wd-tab>
|
||||
</wd-tabs>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="tabs mt-18rpx mx-30rpx">
|
||||
<mescroll-body ref="mescrollItem0" @init="mescrollInit" @down="downCallback" @up="Order.upCallback" :down="downOption" :up="upOption">
|
||||
<view class="mb-20rpx" v-for="(item, index) in list" :key="index">
|
||||
<combo-card :type="OrderSource.Admin" :order="item"></combo-card>
|
||||
</view>
|
||||
</mescroll-body>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { getTeaSpecialistOrderList } from '@/api/teaSpecialist-order'
|
||||
import ComboCard from '@/components/order/ComboCard.vue'
|
||||
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
|
||||
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
|
||||
import { OrderSource, AdminOrderStatusText, TeaSpecialistOrderStatusText, TeaSpecialistOrderStatusValue } from '@/utils/order'
|
||||
import { router } from '@/utils/tools'
|
||||
|
||||
/* mescroll */
|
||||
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
|
||||
const downOption = {
|
||||
auto: true
|
||||
}
|
||||
const upOption = {
|
||||
auto: true,
|
||||
textNoMore: '~ 已经到底啦 ~', //无更多数据的提示
|
||||
}
|
||||
const list = ref<Array<any>>([]) // 茶艺师列表
|
||||
const keywords = ref<string>('')
|
||||
const orderStatus = ref<string>('')
|
||||
|
||||
|
||||
// tab
|
||||
const tab = ref<string>('all')
|
||||
|
||||
onLoad((args) => {
|
||||
uni.$on('refreshOrderList', () => {
|
||||
list.value = []
|
||||
getMescroll().resetUpScroll()
|
||||
})
|
||||
|
||||
// 根据传过来的参数决定显示哪个tab
|
||||
if (args.orderStatus) {
|
||||
tab.value = args.orderStatus
|
||||
}
|
||||
})
|
||||
|
||||
onUnload(() => {
|
||||
uni.$off('refreshOrderList')
|
||||
})
|
||||
|
||||
const Order = {
|
||||
// 上拉加载的回调: 其中num:当前页 从1开始, size:每页数据条数,默认10
|
||||
upCallback: (mescroll) => {
|
||||
// const filter = {
|
||||
// page: mescroll.num,
|
||||
// size: mescroll.size,
|
||||
// order_status: orderStatus.value,
|
||||
// search: keywords.value
|
||||
// }
|
||||
|
||||
// getTeaSpecialistOrderList(filter).then((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() // 请求失败, 结束加载
|
||||
// })
|
||||
},
|
||||
|
||||
/**
|
||||
* 跳转茶室搜索
|
||||
*/
|
||||
handleToSearch: () => {
|
||||
uni.$on('refreshTeaRoomList', params => {
|
||||
keywords.value = params.keywords
|
||||
Order.handleResetSearch()
|
||||
|
||||
uni.$off('refreshTeaRoomList')
|
||||
})
|
||||
router.navigateTo(`/pages/search/search?keywords=${keywords.value}`)
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* 重置搜索
|
||||
*/
|
||||
handleResetSearch: () => {
|
||||
console.log("🚀 ~ location:", 456)
|
||||
|
||||
list.value = []
|
||||
getMescroll().resetUpScroll()
|
||||
},
|
||||
|
||||
|
||||
// 切换tab
|
||||
handleChangeTabs: (e: {index: number, name: string}) => {
|
||||
tab.value = e.name
|
||||
if (e.name === TeaSpecialistOrderStatusText.Pending) {
|
||||
orderStatus.value = '0'
|
||||
} else {
|
||||
orderStatus.value = TeaSpecialistOrderStatusValue[e.name] || ''
|
||||
}
|
||||
|
||||
// 切换tab时,重置当前的mescroll
|
||||
list.value = []
|
||||
getMescroll().resetUpScroll();
|
||||
},
|
||||
|
||||
// 返回上一页
|
||||
handleBack: () => {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
})
|
||||
},
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: $cz-page-background;
|
||||
}
|
||||
|
||||
.order-list {
|
||||
:deep() {
|
||||
.wd-navbar__left {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tabs {
|
||||
:deep() {
|
||||
.wd-tabs,
|
||||
.wd-tabs__nav {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.wd-tabs__nav-item {
|
||||
font-weight: 400 !important;
|
||||
font-size: 28rpx !important;
|
||||
color: #606266 !important;
|
||||
line-height: 40rpx !important;
|
||||
padding: 0 30rpx !important;
|
||||
}
|
||||
|
||||
.wd-tabs__nav-item.is-active {
|
||||
font-weight: 500 !important;
|
||||
color: #303133 !important;
|
||||
font-size: 32rpx !important;
|
||||
line-height: 44rpx !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-box {
|
||||
display: flex;
|
||||
height: 100%;
|
||||
margin-right: 40px;
|
||||
--wot-search-padding: 0;
|
||||
--wot-search-side-padding: 0;
|
||||
|
||||
:deep() {
|
||||
.wd-search {
|
||||
background: transparent !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.wd-search__block {
|
||||
background-color: #fff !important;
|
||||
}
|
||||
|
||||
.wd-search__input {
|
||||
// #ifdef MP
|
||||
padding-left: 32px !important;
|
||||
padding-right: 32px !important;
|
||||
// #endif
|
||||
|
||||
// #ifndef MP
|
||||
padding-right: 0 !important;
|
||||
// #endif
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,238 +0,0 @@
|
||||
<!-- 使用 type="home" 属性设置首页，其他页面不需要设置，默认为page -->
|
||||
<route lang="jsonc" type="page">{
|
||||
"layout": "tabbar",
|
||||
"style": {
|
||||
// 'custom' 表示开启自定义导航栏，默认 'default'
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTitleText": "首页"
|
||||
}
|
||||
}</route>
|
||||
|
||||
<template>
|
||||
<view>
|
||||
<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="search-box flex items-center ml-26rpx">
|
||||
<wd-search v-model="keywords" placeholder="请输入内容" hide-cancel disabled placeholder-left
|
||||
@search="Reserve.handleSearch()"
|
||||
placeholderStyle="text-align:left;padding-left: 24rpx;line-heigt: 44rpx;color: #C9C9C9; font-size: 32rpx;font-weight: normal;">
|
||||
</wd-search>
|
||||
</view>
|
||||
</template>
|
||||
</wd-navbar>
|
||||
|
||||
<view class="tabs">
|
||||
<wd-tabs v-model="tab" swipeable slidable="always" @change="Reserve.handleChangeTab" :lazy="false">
|
||||
<wd-tab title="茶室预约"></wd-tab>
|
||||
<wd-tab title="茶艺师预约"></wd-tab>
|
||||
</wd-tabs>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mx-30rpx" :style="{ paddingTop: navbarHeight + 'px' }">
|
||||
<mescroll-body ref="mescrollItem0" @init="mescrollInit" @down="downCallback" @up="Reserve.upCallback" :down="downOption" :up="upOption">
|
||||
<template v-if="tab === 0">
|
||||
<view class="mb-20rpx" v-for="(item, index) in list" :key="index">
|
||||
<combo-card :type="OrderSource.TeaRoom" :order="item"></combo-card>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<template v-if="tab === 1">
|
||||
<view class="mb-20rpx" v-for="(item, index) in list" :key="index">
|
||||
<combo-card :type="OrderSource.TeaSpecialist" :order="item"></combo-card>
|
||||
</view>
|
||||
</template>
|
||||
</mescroll-body>
|
||||
</view>
|
||||
|
||||
<!-- <view class="mx-30rpx" :style="{ paddingTop: navbarHeight + 'px' }"> -->
|
||||
<!-- 茶室预约 -->
|
||||
<!-- <view v-if="tab === 0">
|
||||
<mescroll-body @init="mescrollInit" @down="downCallback" @up="Reserve.upCallback" :up="upOption">
|
||||
<view v-for="(item, index) in 5" :key="index" >
|
||||
<view class="mb-20rpx" @click="Reserve.handleToReserveRoomOrder">
|
||||
<combo-card :type="OrderSource.TeaRoom" :order-status="OrderStatus.Consuming"></combo-card>
|
||||
</view>
|
||||
</view>
|
||||
</mescroll-body>
|
||||
</view> -->
|
||||
|
||||
<!-- 茶艺师预约 -->
|
||||
<!-- <view v-if="tab === 1">
|
||||
<mescroll-body @init="mescrollInit" @down="downCallback" @up="Reserve.upCallback" :up="upOption">
|
||||
<view v-for="(item, index) in 5" :key="index" >
|
||||
<view class="mb-20rpx" @click="Reserve.handleToTeaSpecialistOrder">
|
||||
<combo-card :type="OrderSource.TeaSpecialist" :order-status="OrderStatus.Consuming"></combo-card>
|
||||
</view>
|
||||
</view>
|
||||
</mescroll-body>
|
||||
</view> -->
|
||||
<!-- </view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import ComboCard from '@/components/order/ComboCard.vue'
|
||||
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
|
||||
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
|
||||
import { OrderSource, OrderStatus } from '@/utils/order'
|
||||
import { router } from '@/utils/tools'
|
||||
import { getTeaRoomOrderList } from '@/api/tea-room'
|
||||
import { getTeaSpecialistOrderList } from '@/api/teaSpecialist-order'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
const navbarHeight = Number(inject('navbarHeight')) + 42 + 14 // 42为tabs的高度 14是边距值
|
||||
|
||||
// tab切换
|
||||
const tab = ref<number>(0)
|
||||
const reserveType = ref<number>(0) // 0:茶室预约 1:茶艺师预约
|
||||
|
||||
// mescroll
|
||||
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
|
||||
const downOption = {
|
||||
auto: true
|
||||
}
|
||||
const upOption = {
|
||||
empty: {
|
||||
icon : OSS + 'icon/icon_reserver_empty.png',
|
||||
tip: '暂无预约信息',
|
||||
},
|
||||
auto: true,
|
||||
textNoMore: '~ 已经到底啦 ~', //无更多数据的提示
|
||||
}
|
||||
const orderStatus = ref<string>('')
|
||||
const list = ref<Array<any>>([]) // 茶室列表
|
||||
const keywords = ref<string>('') // 搜索关键词
|
||||
|
||||
onLoad(() => {
|
||||
})
|
||||
|
||||
const Reserve = {
|
||||
// 上拉加载的回调: 其中num:当前页 从1开始, size:每页数据条数,默认10
|
||||
upCallback: (mescroll) => {
|
||||
// 需要留一下数据为空的时候显示的空数据图标内容
|
||||
const filter = {
|
||||
page: mescroll.num,
|
||||
size: mescroll.size,
|
||||
order_status: orderStatus.value,
|
||||
search: keywords.value
|
||||
}
|
||||
|
||||
if (tab.value === 0) {
|
||||
getTeaRoomOrderList(filter).then((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() // 请求失败, 结束加载
|
||||
})
|
||||
} else if (tab.value === 1) {
|
||||
// 茶艺师预约接口调用
|
||||
getTeaSpecialistOrderList(filter).then((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() // 请求失败, 结束加载
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* tab切换获取index
|
||||
* @param item
|
||||
*/
|
||||
handleChangeTab: (item: { index: number }) => {
|
||||
tab.value = item.index
|
||||
|
||||
// 切换tab时,重置当前的mescroll
|
||||
list.value = []
|
||||
getMescroll().resetUpScroll();
|
||||
},
|
||||
|
||||
/**
|
||||
* 搜索
|
||||
*/
|
||||
handleSearch: () => {
|
||||
list.value = []
|
||||
getMescroll().resetUpScroll();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: $cz-page-background;
|
||||
}
|
||||
|
||||
.home-bg {
|
||||
background-color: $cz-page-background;
|
||||
background-image: url(#{$OSS}images/home/home_bg.png);
|
||||
// background-size: 100% 300rpx;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
padding-bottom: 20rpx;
|
||||
// background-position: top center;
|
||||
}
|
||||
|
||||
.search-box {
|
||||
display: flex;
|
||||
height: 100%;
|
||||
margin-right: 40px;
|
||||
--wot-search-padding: 0;
|
||||
--wot-search-side-padding: 0;
|
||||
|
||||
:deep() {
|
||||
.wd-search {
|
||||
background: transparent !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.wd-search__block {
|
||||
background-color: #fff !important;
|
||||
}
|
||||
|
||||
.wd-search__input {
|
||||
// #ifdef MP
|
||||
padding-left: 32px !important;
|
||||
padding-right: 32px !important;
|
||||
// #endif
|
||||
|
||||
// #ifndef MP
|
||||
padding-right: 0 !important;
|
||||
// #endif
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tabs {
|
||||
:deep() {
|
||||
.wd-tabs,
|
||||
.wd-tabs__nav {
|
||||
background: transparent !important;
|
||||
}
|
||||
.wd-tabs__nav-item {
|
||||
font-size: 32rpx !important;
|
||||
color: #303133 !important;
|
||||
line-height: 42rpx !important;
|
||||
padding: 0 30rpx !important;
|
||||
}
|
||||
|
||||
.wd-tabs__nav-item.is-active {
|
||||
font-weight: 500 !important;
|
||||
}
|
||||
|
||||
.wd-tabs__line {
|
||||
bottom: 0 !important;
|
||||
width: 60rpx !important;
|
||||
height: 16rpx !important;
|
||||
background-color: transparent !important;
|
||||
background-image: url(#{$OSS}images/reserve_room/reserve_room_image1.png) !important;
|
||||
background-size: cover !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,330 +0,0 @@
|
||||
<route lang="jsonc" type="page">
|
||||
{
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}
|
||||
</route>
|
||||
|
||||
<template>
|
||||
<view class="pb-100rpx">
|
||||
<view>
|
||||
<wd-navbar safeAreaInsetTop :bordered="false" :fixed="true" :placeholder="true" :zIndex="10">
|
||||
<template #left>
|
||||
<view class="h-48rpx flex items-center" @click="ShareOrderDetail.handleToHome">
|
||||
<view class="mt-4rpx">
|
||||
<wd-icon name="home" size="22px" color="#121212"></wd-icon>
|
||||
</view>
|
||||
<view class="text-[#303133] text-36rpx ml-24rpx leading-48rpx">分享订单</view>
|
||||
</view>
|
||||
</template>
|
||||
</wd-navbar>
|
||||
</view>
|
||||
|
||||
<!-- 描述信息 -->
|
||||
<view class="text-[#909399] text-26rpx leading-36rpx mb-40rpx mt-20rpx">
|
||||
<view class="ml-80rpx" v-if="orderStatus === TeaRoomOrderStatus.Pay || orderStatus === TeaRoomOrderStatus.Consumption">使用过程中有任何问题，请联系客服</view>
|
||||
<view class="flex items-center justify-center" v-if="orderStatus === TeaRoomOrderStatus.Pending">
|
||||
<view class="flex items-center mr-6rpx">
|
||||
<wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_time.png`"/>
|
||||
</view>
|
||||
<view class="flex items-center text-26rpx leading-36rpx text-[#909399]">
|
||||
<view>还剩</view>
|
||||
<view class="mx-6rpx">
|
||||
<wd-count-down :time="order.time1" custom-class="!text-[#FF5951]" />
|
||||
</view>
|
||||
<view>订单自动取消</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="ml-80rpx" v-if="orderStatus === TeaRoomOrderStatus.Finished">品一口香茗，让生活慢下来，从一杯好茶开始</view>
|
||||
</view>
|
||||
|
||||
<view class="mx-30rpx coupon-bg" >
|
||||
<view class="flex items-center px-30rpx pt-30rpx pb-40rpx">
|
||||
<view class="mr-30rpx">
|
||||
<wd-img width="190rpx" height="190rpx" :src="order.room_msg.img" mode="scaleToFill"></wd-img>
|
||||
</view>
|
||||
<view class="flex-1">
|
||||
<view class="flex justify-between items-center">
|
||||
<view class="flex items-center font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx">
|
||||
<view class="line-1 w-300rpx">
|
||||
{{ order.room_msg.title }}
|
||||
</view>
|
||||
<wd-icon name="chevron-right" size="32rpx"></wd-icon>
|
||||
</view>
|
||||
<view class="text-26rpx leading-36rpx text-[#909399]">￥{{ order.room_all_price }}</view>
|
||||
</view>
|
||||
<view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
|
||||
￥{{ order.room_price }}/小时
|
||||
</view>
|
||||
<!-- 等待付款不显示实付金额 -->
|
||||
<view class="text-[#606266] text-right mt-26rpx" v-if="orderStatus !== TeaRoomOrderStatus.Pending">
|
||||
<text class="text-24rpx leading-34rpx mr-12rpx">实付</text>
|
||||
<text class="tetx-32rpx leading-36rpx">￥{{ order.order_amount }}</text>
|
||||
<wd-icon name="chevron-right" size="32rpx"></wd-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-28rpx pb-36rpx">
|
||||
<view class="text-30rpx leading-42rpx text-[#303133] px-30rpx">预约信息</view>
|
||||
<view class="font-500 text-26rpx leading-48rpx text-[#606266] mt-20rpx">
|
||||
<view class="mb-20rpx px-30rpx">预约时间：{{ order.day_time }} {{ order.start_time }}-{{ order.end_time }}</view>
|
||||
<view class="flex justify-between items-center pl-30rpx" >
|
||||
<view>预约时长：{{ order.hours }}小时</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 已预约和消费中显示开门锁 -->
|
||||
<view class="bg-white rounded-16rpx mx-30rpx mt-20rpx" v-if="orderStatus === TeaRoomOrderStatus.Pay || orderStatus === TeaRoomOrderStatus.Consumption">
|
||||
<view class="pt-32rpx text-[#303133] text-32rpx leading-44rpx px-30rpx">开门锁</view>
|
||||
<view class="mt-20rpx">
|
||||
<wd-gap height="2rpx" bg-color="#F6F7F9"></wd-gap>
|
||||
</view>
|
||||
<view class="">
|
||||
<view class="flex justify-between items-center mt-18rpx pb-18rpx px-62rpx">
|
||||
<view class="w-224rpx">
|
||||
<view class="relative h-64rpx">
|
||||
<wd-img width="224rpx" height="64rpx" :src="`${OSS}images/reserve_room/reserve_room_image5.png`"/>
|
||||
<view class="text-[#4C9F44] font-bold text-32rpx leading-44rpx absolute top-[50%] transform translate-y-[-50%] right-22rpx">点击开锁</view>
|
||||
</view>
|
||||
<view class="text-[#303133] text-30rpx leading-42rpx mt-16rpx text-center">大门锁</view>
|
||||
<view class="text-[#606266] text-26rpx leading-48rpx mt-4rpx text-center font-500">手动输入 1052 32#</view>
|
||||
</view>
|
||||
<view class="border-r-2rpx border-r-solid border-r-[#F6F7F9] h-224rpx"></view>
|
||||
<view class="w-224rpx">
|
||||
<view class="relative h-64rpx">
|
||||
<wd-img width="224rpx" height="64rpx" :src="`${OSS}images/reserve_room/reserve_room_image6.png`"/>
|
||||
<view class="text-[#4C9F44] font-bold text-32rpx leading-44rpx absolute top-[50%] transform translate-y-[-50%] right-22rpx">点击开锁</view>
|
||||
</view>
|
||||
<view class="text-[#303133] text-30rpx leading-42rpx mt-16rpx text-center">房间锁</view>
|
||||
<view class="text-[#606266] text-26rpx leading-48rpx mt-4rpx text-center font-500">手动输入 1052 32#</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 适用门店 -->
|
||||
<view class="bg-white rounded-16rpx px-30rpx pb-32rpx mx-30rpx mt-20rpx">
|
||||
<view class="pt-32rpx text-[#303133] text-32rpx leading-44rpx">适用门店</view>
|
||||
<view class="mt-26rpx flex items-center">
|
||||
<view class="mr-24rpx">
|
||||
<wd-img width="170rpx" height="170rpx" :src="order.store_msg.image"></wd-img>
|
||||
</view>
|
||||
<view class="flex-1 flex justify-between items-center relative">
|
||||
<view class="">
|
||||
<view class="text-[#303133] text-30rpx leading-40rpx line-2">{{ order.store_msg.name }}</view>
|
||||
<view class="mt-26rpx text-[#909399] text-24rpx leading-34rpx">距您{{ order.distance }}km</view>
|
||||
<view class="flex items-center mt-14rpx">
|
||||
<view class="mr-8rpx">
|
||||
<wd-img width="28rpx" height="28rpx" :src="`${OSS}icon/icon_location.png`"/>
|
||||
</view>
|
||||
<view class="ml-2rpx text-26rpx text-[#606266] line-1 w-300rpx">{{ order.store_msg.address }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex absolute top-1/2 right-0 -translate-y-1/2">
|
||||
<view class="text-center mr-20rpx" >
|
||||
<wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_nav.png`"/>
|
||||
</view>
|
||||
<view class="text-center" >
|
||||
<wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_phone.png`"/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 订单信息 -->
|
||||
<view class="bg-white rounded-16rpx px-30rpx py-34rpx mx-30rpx mt-20rpx">
|
||||
<view class="text-[#303133] text-32rpx leading-44rpx">订单信息</view>
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
||||
<view>订单编号</view>
|
||||
<view>
|
||||
<text>{{ order.order_sn }}</text>
|
||||
<wd-divider vertical />
|
||||
<text class="text-[#4C9F44]" @click="copy(order.order_sn)">复制</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx" v-if="orderStatus != TeaRoomOrderStatus.Pending && order.pay_way">
|
||||
<view>交易方式</view>
|
||||
<view>{{ order.pay_way_title }}</view>
|
||||
</view>
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
|
||||
<view>创建时间</view>
|
||||
<view>{{ order.dtime }}</view>
|
||||
</view>
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx" v-if="orderStatus != TeaRoomOrderStatus.Pending && orderStatus != TeaRoomOrderStatus.Cancelled && order.pay_way_title">
|
||||
<view>付款时间</view>
|
||||
<view>{{ order.update_dtime }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { TeaRoomOrderStatusTextValue, TeaRoomOrderStatus } from '@/utils/order'
|
||||
import { useMessage } from 'wot-design-uni'
|
||||
import {toast} from '@/utils/toast'
|
||||
import { PayList, PayCategory, PayValue } from '@/utils/pay'
|
||||
import { getTeaRoomOrderDetail } from '@/api/tea-room'
|
||||
import { handleTRCancelOrderHooks, handleTRToPayHooks } from '@/hooks/useOrder'
|
||||
import type { ITeaSpecialistOrderDetailsResult } from '@/api/types/tea'
|
||||
import { router, copy } from '@/utils/tools'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
const title = ref<string>('')
|
||||
const orderStatus = ref<number>(0) // 订单状态：待使用、退款等
|
||||
|
||||
// 取消订单弹窗
|
||||
const message = useMessage('wd-message-box-slot')
|
||||
|
||||
// 订单
|
||||
const orderId = ref<number>(0)
|
||||
const order = ref<ITeaSpecialistOrderDetailsResult>({
|
||||
order_amount: '',
|
||||
order_sn: '',
|
||||
store_id: 0,
|
||||
room_msg: {
|
||||
id: 0,
|
||||
price: 0,
|
||||
img: '',
|
||||
title: '',
|
||||
},
|
||||
store_msg: {
|
||||
id: 0,
|
||||
address: '',
|
||||
name: '',
|
||||
operation_type: 1,
|
||||
image: '',
|
||||
latitude: '',
|
||||
longitude: '',
|
||||
contact_phone: ''
|
||||
},
|
||||
time1: 0,
|
||||
order_status: 0,
|
||||
room_all_price: 0,
|
||||
room_price: 0,
|
||||
day_time: '',
|
||||
start_time: '',
|
||||
end_time: '',
|
||||
hours: 0,
|
||||
distance: 0,
|
||||
pay_way: 0,
|
||||
pay_way_title: '',
|
||||
dtime: '',
|
||||
update_dtime: '',
|
||||
renew_price: 0,
|
||||
renew_dtime: {
|
||||
start_time: '',
|
||||
end_time: '',
|
||||
renew_price: 0
|
||||
}
|
||||
})
|
||||
|
||||
onLoad(async (args) => {
|
||||
orderId.value = args.orderId
|
||||
// 获取订单详情
|
||||
ShareOrderDetail.handleInit()
|
||||
})
|
||||
|
||||
onUnload(() => {
|
||||
uni.$off('refreshOrderDetail')
|
||||
})
|
||||
|
||||
const ShareOrderDetail = {
|
||||
/**
|
||||
* 获取订单详情
|
||||
*/
|
||||
handleInit: async () => {
|
||||
const res = await getTeaRoomOrderDetail({
|
||||
id: orderId.value,
|
||||
latitude: uni.getStorageSync('latitude'),
|
||||
longitude: uni.getStorageSync('longitude')
|
||||
})
|
||||
order.value = res.details
|
||||
console.log("🚀 ~ order.value :", order.value )
|
||||
title.value = TeaRoomOrderStatusTextValue[order.value.order_status].title || '订单详情'
|
||||
orderStatus.value = order.value.order_status
|
||||
},
|
||||
|
||||
/**
|
||||
* 支付订单
|
||||
*/
|
||||
handleToPay: () => {
|
||||
uni.$on('refreshOrderDetail', () => {
|
||||
ShareOrderDetail.handleInit()
|
||||
uni.$off('refreshOrderDetail')
|
||||
})
|
||||
|
||||
handleTRToPayHooks(orderId.value, order.value.store_msg.name, order.value.store_msg.id)
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取订单详情
|
||||
*/
|
||||
handleCancelOrder: () => {
|
||||
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') {
|
||||
// 点击确认按钮回调事件
|
||||
uni.$on('refreshOrderDetail', () => {
|
||||
ShareOrderDetail.handleInit()
|
||||
uni.$off('refreshOrderDetail')
|
||||
})
|
||||
|
||||
handleTRCancelOrderHooks(orderId.value)
|
||||
}
|
||||
toast.info('订单取消成功')
|
||||
}).catch(() => {
|
||||
// 点击取消按钮回调事件
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 跳转到首页
|
||||
*/
|
||||
handleToHome: () => {
|
||||
router.reLaunch('/pages/index/index')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: $cz-page-background;
|
||||
}
|
||||
|
||||
.coupon-bg {
|
||||
background-image: url(#{$OSS}images/order/order_image2.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.collapse {
|
||||
:deep() {
|
||||
.wd-collapse-item::after,
|
||||
.wd-collapse-item__header.is-expanded::after {
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
.wd-collapse-item__body {
|
||||
padding-top: 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
118
src/pages/store/device.vue
Normal file
118
src/pages/store/device.vue
Normal file
@ -0,0 +1,118 @@
|
||||
<route lang="jsonc" type="page">{
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}</route>
|
||||
|
||||
<template>
|
||||
<view class="pb-40rpx">
|
||||
<view>
|
||||
<navbar title="设备控制" custom-class='!bg-[#F6F7F8]'></navbar>
|
||||
</view>
|
||||
|
||||
<view class="mt-50rpx mx-40rpx">
|
||||
<view class="">
|
||||
<view class="font-bold text-36rpx leading-50rpx text-[#303133]">大门</view>
|
||||
<view class="relative mt-30rpx">
|
||||
<wd-img width="670rpx" height="202rpx" :src="`${OSS}images/store/store/image1.png`" mode="aspectFill" />
|
||||
<view class="absolute top-64rpx left-0 px-46rpx flex items-center justify-between w-full">
|
||||
<view class="flex items-center">
|
||||
<wd-img width="96rpx" height="96rpx" :src="`${OSS}images/store/store/image4.png`" mode="aspectFill" />
|
||||
<view class="font-bold text-34rpx leading-48rpx text-[#303133] ml-32rpx">门锁</view>
|
||||
</view>
|
||||
<view class="relative h-64rpx">
|
||||
<wd-img width="224rpx" height="64rpx" :src="`${OSS}images/reserve_room/reserve_room_image5.png`"/>
|
||||
<view class="text-[#4C9F44] font-bold text-32rpx leading-44rpx absolute top-[50%] transform translate-y-[-50%] left-74rpx">点击开锁</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-30rpx">
|
||||
<view class="mb-40rpx" v-for="(item, index) in 5" :key="index">
|
||||
<view class="font-bold text-36rpx leading-50rpx text-[#303133] mb-30rpx">大楼开门码</view>
|
||||
<view class="flex items-center justify-between">
|
||||
<view class="w-240rpx h-280rpx bg-white rounded-32rpx flex flex-col items-center justify-center">
|
||||
<view class="">
|
||||
<wd-img width="90rpx" height="90rpx" :src="`${OSS}images/store/store/image2.png`" mode="aspectFill" />
|
||||
</view>
|
||||
<view class="font-bold text-34rpx text-[#303133] leading-48rpx">门锁</view>
|
||||
<view class="bg-[#4C9F44] rounded-20rpx w-168rpx h-60rpx text-center leading-60rpx text-[#fff] mt-10rpx" @cliclk="Device.handleOpenLock">
|
||||
开锁
|
||||
</view>
|
||||
</view>
|
||||
<view class="w-410rpx h-280rpx bg-white rounded-16rpx pl-60rpx pr-34rpx">
|
||||
<view class="flex items-top justify-between px-20rpx py-4rpx pt-40rpx">
|
||||
<wd-img width="90rpx" height="90rpx" :src="`${OSS}images/store/store/image3.png`" mode="aspectFill" />
|
||||
<view class="text-28rpx leading-40rpx text-[#303133] mt-12rpx">ON</view>
|
||||
</view>
|
||||
<view class="font-bold text-28rpx text-[#303133] leading-40rpx mt-34rpx flex items-center justify-between">
|
||||
<view class="font-bold text-34rpx leading-48rpx text-[#303133]">插座空开</view>
|
||||
<wd-switch v-model="item.checked" size="48rpx" active-color="#4C9F44"/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { OrderSource, OrderStatus, TeaRoomOrderStatusText, TeaRoomOrderStatusValue } from '@/utils/order'
|
||||
import ComboCard from '@/components/order/ComboCard.vue'
|
||||
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
|
||||
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
|
||||
import { getTeaRoomOrderList } from '@/api/tea-room'
|
||||
import { router } from '@/utils/tools'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
|
||||
const checked = ref<boolean>(false)
|
||||
|
||||
// mescroll
|
||||
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
|
||||
const downOption = {
|
||||
auto: true
|
||||
}
|
||||
const upOption = {
|
||||
auto: true,
|
||||
textNoMore: '~ 已经到底啦 ~', //无更多数据的提示
|
||||
}
|
||||
const orderStatus = ref<string>('')
|
||||
const list = ref<Array<any>>([]) // 茶室列表
|
||||
const keywords = ref<string>('') // 搜索关键词
|
||||
|
||||
// tab
|
||||
const tab = ref<string>('list')
|
||||
const tabList = ref<Array<{title: string, num: number, name: string}>>([
|
||||
{ title: '已上架', num: 10, name: 'list'},
|
||||
{ title: '已下架', num: 11, name: 'delist' },
|
||||
// { title: '草稿箱', num: 0, name: 'draft' }
|
||||
])
|
||||
|
||||
onLoad((args) => {
|
||||
})
|
||||
|
||||
onUnload(() => {
|
||||
})
|
||||
|
||||
const Device = {
|
||||
/**
|
||||
* 开锁
|
||||
*/
|
||||
handleOpenLock: () => {
|
||||
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: $cz-page-background;
|
||||
}
|
||||
</style>
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 4.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 5.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 4.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.7 KiB |
164
src/pages/store/renew.vue
Normal file
164
src/pages/store/renew.vue
Normal file
@ -0,0 +1,164 @@
|
||||
<route lang="jsonc" type="page">{
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}</route>
|
||||
|
||||
<template>
|
||||
<view class="pb-40rpx">
|
||||
<view>
|
||||
<navbar title="订单续订" custom-class='!bg-[#F6F7F8]'></navbar>
|
||||
</view>
|
||||
|
||||
<view class="mt-38rpx">
|
||||
<mescroll-body ref="mescrollItem0" @init="mescrollInit" @down="downCallback" @up="Renew.upCallback" :down="downOption" :up="upOption">
|
||||
<view class="bg-white rounded-16rpx p-30rpx mx-32rpx relative">
|
||||
<view class="absolute top-0 right-0 bg-[#4C9F44] text-[#fff] w-160rpx h-64rpx leading-64rpx text-center xd" @click="showBookTimePopup = true">
|
||||
续单
|
||||
</view>
|
||||
<view class="flex items-center">
|
||||
<view class="mr-28rpx">
|
||||
<wd-img width="200rpx" height="200rpx" :src="`${OSS}images/home/home_image5.png`"></wd-img>
|
||||
</view>
|
||||
<view class="flex-1">
|
||||
<view @click="ComboCard.handleToOrderDetail">
|
||||
<view class="font-bold text-28rpx text-[#303133] leading-40rpx line-2 w-260rpx">这是茶室包间名称换行效果这是茶室包间名称换行效果</view>
|
||||
<view class="font-400 leading-36rpx text-26rpx text-[#606266] mt-10rpx">
|
||||
<view>预约时间：03/18 08:00-12:00</view>
|
||||
<view class="mt-18rpx">预约时长：2小时</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</mescroll-body>
|
||||
</view>
|
||||
|
||||
<view class="bg-[#4C9F44] w-630rpx h-90rpx text-[#fff] text-center leading-90rpx rounded-8rpx mx-auto mt-50rpx">确定</view>
|
||||
|
||||
<!-- 选择预定时间 -->
|
||||
<!-- <booking-time v-model="showBookTimePopup" :day="sevenDay" @selectedTime="Reserve.handleChooseReserveTime"></booking-time> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { OrderSource, OrderStatus, TeaRoomOrderStatusText, TeaRoomOrderStatusValue } from '@/utils/order'
|
||||
import ComboCard from '@/components/order/ComboCard.vue'
|
||||
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
|
||||
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
|
||||
import { getTeaRoomOrderList } from '@/api/tea-room'
|
||||
import { router } from '@/utils/tools'
|
||||
import type { ITeaSpecialistFuture7DaysResult } from '@/api/types/tea'
|
||||
import { getNext7Days, renewTeaRoomOrder } from '@/api/tea-room'
|
||||
|
||||
// mescroll
|
||||
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
|
||||
const downOption = {
|
||||
auto: true
|
||||
}
|
||||
const upOption = {
|
||||
auto: true,
|
||||
textNoMore: '~ 已经到底啦 ~', //无更多数据的提示
|
||||
}
|
||||
const orderStatus = ref<string>('')
|
||||
const list = ref<Array<any>>([]) // 茶室列表
|
||||
const keywords = ref<string>('') // 搜索关键词
|
||||
|
||||
const OSS = inject('OSS')
|
||||
|
||||
const checked = ref<boolean>(false)
|
||||
|
||||
const columns = ref<Array<{label: string, id: number}>>([
|
||||
{ label: '包厢A', id: 1 },
|
||||
{ label: '包厢B', id: 2 },
|
||||
{ label: '包厢C', id: 3 },
|
||||
])
|
||||
|
||||
// tab
|
||||
const tab = ref<string>('list')
|
||||
const tabList = ref<Array<{title: string, num: number, name: string}>>([
|
||||
{ title: '已上架', num: 10, name: 'list'},
|
||||
{ title: '已下架', num: 11, name: 'delist' },
|
||||
// { title: '草稿箱', num: 0, name: 'draft' }
|
||||
])
|
||||
|
||||
// 选择预定时间
|
||||
const showBookTimePopup = ref<boolean>(false)
|
||||
const sevenDay = reactive<ITeaSpecialistFuture7DaysResult>({
|
||||
minimum_time: 0,
|
||||
time: []
|
||||
})
|
||||
const reserveTime = ref<Array<any>>([])
|
||||
|
||||
const form = ref({
|
||||
name: '',
|
||||
price: '',
|
||||
})
|
||||
|
||||
onLoad(async (args) => {
|
||||
|
||||
// 预定时间
|
||||
// const next7 = await getNext7Days()
|
||||
// Object.assign(sevenDay, next7)
|
||||
})
|
||||
|
||||
onUnload(() => {
|
||||
})
|
||||
|
||||
const Renew = {
|
||||
/**
|
||||
* 分页加载
|
||||
* @param mescroll
|
||||
*/
|
||||
upCallback: (mescroll) => {
|
||||
// 需要留一下数据为空的时候显示的空数据图标内容
|
||||
// const filter = {
|
||||
// page: mescroll.num,
|
||||
// size: mescroll.size,
|
||||
// order_status: orderStatus.value,
|
||||
// search: keywords.value
|
||||
// }
|
||||
|
||||
// getTeaRoomOrderList(filter).then((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() // 请求失败, 结束加载
|
||||
// })
|
||||
},
|
||||
|
||||
/**
|
||||
* 开锁
|
||||
*/
|
||||
handleOpenLock: () => {
|
||||
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* 选中预定时间
|
||||
*/
|
||||
handleChooseReserveTime: (params: any) => {
|
||||
reserveTime.value = params
|
||||
console.log("🚀 ~ reserveTime:", reserveTime)
|
||||
|
||||
// 一键续订的金额
|
||||
// totalReserveMoney.value = Number(toTimes(params[3], order.value.room_price))
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: $cz-page-background;
|
||||
}
|
||||
|
||||
.xd {
|
||||
border-radius: 0rpx 10rpx 0rpx 10rpx;
|
||||
}
|
||||
</style>
|
||||
137
src/pages/store/reserve.vue
Normal file
137
src/pages/store/reserve.vue
Normal file
@ -0,0 +1,137 @@
|
||||
<route lang="jsonc" type="page">{
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}</route>
|
||||
|
||||
<template>
|
||||
<view class="pb-40rpx">
|
||||
<view>
|
||||
<navbar title="包间预定" custom-class='!bg-[#F6F7F8]'></navbar>
|
||||
</view>
|
||||
|
||||
<view class="mt-38rpx bg-white rounded-16rpx py-22rpx px-30rpx mx-30rpx">
|
||||
<view class="">
|
||||
<view class="text-26rpx leading-32rpx text-[#606266] mb-20rpx">包厢选择</view>
|
||||
<view class="">
|
||||
<wd-picker :columns="columns" value-key="label" value-name="id" v-model="form.name" use-default-slot>
|
||||
<wd-input type="text" v-model="form.name" placeholder="请选择包厢" readonly>
|
||||
<template #suffix>
|
||||
<wd-icon name="arrow-down" size="32rpx" color="#D8D8D8"></wd-icon>
|
||||
</template>
|
||||
</wd-input>
|
||||
</wd-picker>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-22rpx">
|
||||
<view class="text-26rpx leading-32rpx text-[#606266] mb-20rpx">包厢价格</view>
|
||||
<view class="">
|
||||
<wd-input type="text" v-model="form.price" placeholder="请选择包厢" readonly>
|
||||
<template #suffix>
|
||||
<wd-icon name="arrow-down" size="32rpx" color="#D8D8D8"></wd-icon>
|
||||
</template>
|
||||
</wd-input>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-22rpx">
|
||||
<view class="text-26rpx leading-32rpx text-[#606266] mb-20rpx">预定时间</view>
|
||||
<view class="" @click="showBookTimePopup = true">
|
||||
<wd-input type="text" v-model="form.name" placeholder="请选择预定时间" readonly no-border>
|
||||
<template #suffix>
|
||||
<wd-icon name="arrow-down" size="32rpx" color="#D8D8D8"></wd-icon>
|
||||
</template>
|
||||
</wd-input>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bg-[#4C9F44] w-630rpx h-90rpx text-[#fff] text-center leading-90rpx rounded-8rpx mx-auto mt-50rpx">确定</view>
|
||||
|
||||
<!-- 选择预定时间 -->
|
||||
<!-- <booking-time v-model="showBookTimePopup" :day="sevenDay" @selectedTime="Reserve.handleChooseReserveTime"></booking-time> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { OrderSource, OrderStatus, TeaRoomOrderStatusText, TeaRoomOrderStatusValue } from '@/utils/order'
|
||||
import ComboCard from '@/components/order/ComboCard.vue'
|
||||
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
|
||||
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
|
||||
import { getTeaRoomOrderList } from '@/api/tea-room'
|
||||
import { router } from '@/utils/tools'
|
||||
import type { ITeaSpecialistFuture7DaysResult } from '@/api/types/tea'
|
||||
import { getNext7Days, renewTeaRoomOrder } from '@/api/tea-room'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
|
||||
const checked = ref<boolean>(false)
|
||||
|
||||
const columns = ref<Array<{label: string, id: number}>>([
|
||||
{ label: '包厢A', id: 1 },
|
||||
{ label: '包厢B', id: 2 },
|
||||
{ label: '包厢C', id: 3 },
|
||||
])
|
||||
|
||||
// tab
|
||||
const tab = ref<string>('list')
|
||||
const tabList = ref<Array<{title: string, num: number, name: string}>>([
|
||||
{ title: '已上架', num: 10, name: 'list'},
|
||||
{ title: '已下架', num: 11, name: 'delist' },
|
||||
// { title: '草稿箱', num: 0, name: 'draft' }
|
||||
])
|
||||
|
||||
// 选择预定时间
|
||||
const showBookTimePopup = ref<boolean>(false)
|
||||
const sevenDay = reactive<ITeaSpecialistFuture7DaysResult>({
|
||||
minimum_time: 0,
|
||||
time: []
|
||||
})
|
||||
const reserveTime = ref<Array<any>>([])
|
||||
|
||||
const form = ref({
|
||||
name: '',
|
||||
price: '',
|
||||
})
|
||||
|
||||
onLoad(async (args) => {
|
||||
|
||||
// 预定时间
|
||||
// const next7 = await getNext7Days()
|
||||
// Object.assign(sevenDay, next7)
|
||||
})
|
||||
|
||||
onUnload(() => {
|
||||
})
|
||||
|
||||
const Reserve = {
|
||||
/**
|
||||
* 开锁
|
||||
*/
|
||||
handleOpenLock: () => {
|
||||
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* 选中预定时间
|
||||
*/
|
||||
handleChooseReserveTime: (params: any) => {
|
||||
reserveTime.value = params
|
||||
console.log("🚀 ~ reserveTime:", reserveTime)
|
||||
|
||||
// 一键续订的金额
|
||||
// totalReserveMoney.value = Number(toTimes(params[3], order.value.room_price))
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: $cz-page-background;
|
||||
}
|
||||
</style>
|
||||
@ -1,11 +1,9 @@
|
||||
<route lang="jsonc" type="page">
|
||||
{
|
||||
<route lang="jsonc" type="page">{
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}
|
||||
</route>
|
||||
}</route>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { toast } from '@/utils/toast'
|
||||
@ -298,14 +296,8 @@ const StoreManage = {
|
||||
<wd-img width="16rpx" height="16rpx" :src="`${OSS}icon/icon_validate.png`" />
|
||||
</view>
|
||||
</view>
|
||||
<wd-input
|
||||
v-model="form.roomName"
|
||||
no-border
|
||||
placeholder="请输入包间名称"
|
||||
:maxlength="10"
|
||||
show-word-limit
|
||||
custom-class="!bg-[#F6F7F8] !rounded-16rpx !px-28rpx !py-20rpx"
|
||||
/>
|
||||
<wd-input v-model="form.roomName" no-border placeholder="请输入包间名称" :maxlength="10" show-word-limit
|
||||
custom-class="!bg-[#F6F7F8] !rounded-16rpx !px-28rpx !py-20rpx" />
|
||||
</view>
|
||||
|
||||
<!-- 包间标签 -->
|
||||
@ -324,21 +316,17 @@ const StoreManage = {
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex flex-wrap items-center gap-16rpx">
|
||||
<view
|
||||
v-for="(tag, index) in form.tags"
|
||||
:key="index"
|
||||
class="flex items-center rounded-20rpx bg-[#F6F7F8] px-20rpx py-8rpx"
|
||||
>
|
||||
<view v-for="(tag, index) in form.tags" :key="index"
|
||||
class="flex items-center rounded-20rpx bg-[#F6F7F8] px-20rpx py-8rpx">
|
||||
<view class="mr-8rpx text-26rpx text-[#303133] leading-36rpx">
|
||||
{{ tag }}
|
||||
</view>
|
||||
<wd-icon name="close" size="14px" color="#909399" @click="StoreManage.handleRemoveTag(index)" />
|
||||
<wd-icon name="close" size="14px" color="#909399"
|
||||
@click="StoreManage.handleRemoveTag(index)" />
|
||||
</view>
|
||||
<view
|
||||
v-if="form.tags.length < 2"
|
||||
<view v-if="form.tags.length < 2"
|
||||
class="flex items-center border-2rpx border-[#E5E5E5] rounded-20rpx border-dashed px-20rpx py-8rpx"
|
||||
@click="StoreManage.handleAddTag"
|
||||
>
|
||||
@click="StoreManage.handleAddTag">
|
||||
<wd-icon name="add" size="16px" color="#909399" class="mr-8rpx" />
|
||||
<view class="text-26rpx text-[#909399] leading-36rpx">
|
||||
添加标签
|
||||
@ -361,21 +349,14 @@ const StoreManage = {
|
||||
</view>
|
||||
<view
|
||||
class="absolute right-8rpx top-8rpx h-32rpx w-32rpx flex items-center justify-center rounded-full bg-black bg-opacity-50"
|
||||
@click="StoreManage.handleRemoveVideo"
|
||||
>
|
||||
@click="StoreManage.handleRemoveVideo">
|
||||
<wd-icon name="close" size="14px" color="#fff" />
|
||||
</view>
|
||||
</view>
|
||||
<wd-upload
|
||||
v-else
|
||||
:file-list="[]"
|
||||
:limit="1"
|
||||
image-mode="scaleToFill"
|
||||
accept="video"
|
||||
:action="action"
|
||||
@change="StoreManage.handleUploadVideo"
|
||||
>
|
||||
<view class="h-184rpx w-184rpx flex flex-col items-center justify-center border-2rpx border-[#E5E5E5] rounded-16rpx border-dashed">
|
||||
<wd-upload v-else :file-list="[]" :limit="1" image-mode="scaleToFill" accept="video"
|
||||
:action="action" @change="StoreManage.handleUploadVideo">
|
||||
<view
|
||||
class="h-184rpx w-184rpx flex flex-col items-center justify-center border-2rpx border-[#E5E5E5] rounded-16rpx border-dashed">
|
||||
<wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_video.png`" mode="aspectFill" />
|
||||
<view class="mt-12rpx text-26rpx text-[#303133] font-400 leading-36rpx">
|
||||
添加视频
|
||||
@ -400,30 +381,22 @@ const StoreManage = {
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex flex-wrap items-center gap-16rpx">
|
||||
<view
|
||||
v-for="(image, index) in form.images"
|
||||
:key="index"
|
||||
class="relative h-184rpx w-184rpx overflow-hidden rounded-16rpx"
|
||||
>
|
||||
<view v-for="(image, index) in form.images" :key="index"
|
||||
class="relative h-184rpx w-184rpx overflow-hidden rounded-16rpx">
|
||||
<wd-img width="100%" height="100%" :src="image" mode="aspectFill" />
|
||||
<view
|
||||
class="absolute right-8rpx top-8rpx h-32rpx w-32rpx flex items-center justify-center rounded-full bg-black bg-opacity-50"
|
||||
@click="StoreManage.handleRemoveImage(index)"
|
||||
>
|
||||
@click="StoreManage.handleRemoveImage(index)">
|
||||
<wd-icon name="close" size="14px" color="#fff" />
|
||||
</view>
|
||||
</view>
|
||||
<wd-upload
|
||||
v-if="form.images.length < 9"
|
||||
:file-list="[]"
|
||||
:limit="9 - form.images.length"
|
||||
image-mode="scaleToFill"
|
||||
accept="image"
|
||||
:action="action"
|
||||
@change="StoreManage.handleUploadImage"
|
||||
>
|
||||
<view class="h-184rpx w-184rpx flex flex-col items-center justify-center border-2rpx border-[#E5E5E5] rounded-16rpx border-dashed">
|
||||
<wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_upload.png`" mode="aspectFill" />
|
||||
<wd-upload v-if="form.images.length < 9" :file-list="[]" :limit="9 - form.images.length"
|
||||
image-mode="scaleToFill" accept="image" :action="action"
|
||||
@change="StoreManage.handleUploadImage">
|
||||
<view
|
||||
class="h-184rpx w-184rpx flex flex-col items-center justify-center border-2rpx border-[#E5E5E5] rounded-16rpx border-dashed">
|
||||
<wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_upload.png`"
|
||||
mode="aspectFill" />
|
||||
<view class="mt-12rpx text-26rpx text-[#303133] font-400 leading-36rpx">
|
||||
添加图片
|
||||
</view>
|
||||
@ -449,13 +422,8 @@ const StoreManage = {
|
||||
<wd-img width="16rpx" height="16rpx" :src="`${OSS}icon/icon_validate.png`" />
|
||||
</view>
|
||||
</view>
|
||||
<wd-input
|
||||
v-model="form.hourlyPrice"
|
||||
no-border
|
||||
placeholder="请输入小时优惠价"
|
||||
type="digit"
|
||||
custom-class="!bg-[#F6F7F8] !rounded-16rpx !px-28rpx !py-20rpx"
|
||||
>
|
||||
<wd-input v-model="form.hourlyPrice" no-border placeholder="请输入小时优惠价" type="digit"
|
||||
custom-class="!bg-[#F6F7F8] !rounded-16rpx !px-28rpx !py-20rpx">
|
||||
<template #prefix>
|
||||
<view class="mr-8rpx text-28rpx text-[#303133]">
|
||||
¥
|
||||
@ -480,15 +448,8 @@ const StoreManage = {
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex items-center">
|
||||
<wd-input
|
||||
v-model="form.minBookingTime"
|
||||
no-border
|
||||
placeholder="请输入起订时间"
|
||||
type="number"
|
||||
:max="5"
|
||||
:min="1"
|
||||
custom-class="!bg-[#F6F7F8] !rounded-16rpx !px-28rpx !py-20rpx"
|
||||
/>
|
||||
<wd-input v-model="form.minBookingTime" no-border placeholder="请输入起订时间" type="number" :max="5"
|
||||
:min="1" custom-class="!bg-[#F6F7F8] !rounded-16rpx !px-28rpx !py-20rpx" />
|
||||
<view class="ml-16rpx text-28rpx text-[#303133]">
|
||||
小时
|
||||
</view>
|
||||
@ -510,15 +471,8 @@ const StoreManage = {
|
||||
输入范围1-999
|
||||
</view>
|
||||
</view>
|
||||
<wd-input
|
||||
v-model="form.inventory"
|
||||
no-border
|
||||
placeholder="请输入库存"
|
||||
type="number"
|
||||
:max="999"
|
||||
:min="1"
|
||||
custom-class="!bg-[#F6F7F8] !rounded-16rpx !px-28rpx !py-20rpx"
|
||||
/>
|
||||
<wd-input v-model="form.inventory" no-border placeholder="请输入库存" type="number" :max="999" :min="1"
|
||||
custom-class="!bg-[#F6F7F8] !rounded-16rpx !px-28rpx !py-20rpx" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -543,12 +497,9 @@ const StoreManage = {
|
||||
每条内容之间需要换行输入
|
||||
</view>
|
||||
</view>
|
||||
<wd-textarea
|
||||
v-model="form.packageIntro"
|
||||
<wd-textarea v-model="form.packageIntro"
|
||||
custom-class="!rounded-18rpx !border-2rpx !border-[#EFF0EF] !bg-[#F8F9FA] !mt-20rpx"
|
||||
custom-textarea-class="!bg-[#F8F9FA]"
|
||||
placeholder="请输入套餐介绍，每条内容换行输入"
|
||||
/>
|
||||
custom-textarea-class="!bg-[#F8F9FA]" placeholder="请输入套餐介绍，每条内容换行输入" />
|
||||
</view>
|
||||
|
||||
<!-- 其他说明 -->
|
||||
@ -558,12 +509,9 @@ const StoreManage = {
|
||||
其他说明
|
||||
</view>
|
||||
</view>
|
||||
<wd-textarea
|
||||
v-model="form.otherNotes"
|
||||
<wd-textarea v-model="form.otherNotes"
|
||||
custom-class="!rounded-18rpx !border-2rpx !border-[#EFF0EF] !bg-[#F8F9FA] !mt-20rpx"
|
||||
custom-textarea-class="!bg-[#F8F9FA]"
|
||||
placeholder="请输入其他说明"
|
||||
/>
|
||||
custom-textarea-class="!bg-[#F8F9FA]" placeholder="请输入其他说明" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -583,12 +531,8 @@ const StoreManage = {
|
||||
<wd-img width="16rpx" height="16rpx" :src="`${OSS}icon/icon_validate.png`" />
|
||||
</view>
|
||||
</view>
|
||||
<wd-input
|
||||
v-model="form.userCount"
|
||||
no-border
|
||||
placeholder="建议4~6人使用"
|
||||
custom-class="!bg-[#F6F7F8] !rounded-16rpx !px-28rpx !py-20rpx"
|
||||
/>
|
||||
<wd-input v-model="form.userCount" no-border placeholder="建议4~6人使用"
|
||||
custom-class="!bg-[#F6F7F8] !rounded-16rpx !px-28rpx !py-20rpx" />
|
||||
</view>
|
||||
|
||||
<!-- 退改说明 -->
|
||||
@ -601,12 +545,9 @@ const StoreManage = {
|
||||
<wd-img width="16rpx" height="16rpx" :src="`${OSS}icon/icon_validate.png`" />
|
||||
</view>
|
||||
</view>
|
||||
<wd-textarea
|
||||
v-model="form.refundPolicy"
|
||||
<wd-textarea v-model="form.refundPolicy"
|
||||
custom-class="!rounded-18rpx !border-2rpx !border-[#EFF0EF] !bg-[#F8F9FA] !mt-20rpx"
|
||||
custom-textarea-class="!bg-[#F8F9FA]"
|
||||
placeholder="请输入退改说明"
|
||||
/>
|
||||
custom-textarea-class="!bg-[#F8F9FA]" placeholder="请输入退改说明" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -614,23 +555,16 @@ const StoreManage = {
|
||||
<!-- 底部保存按钮 -->
|
||||
<view class="fixed bottom-0 left-0 right-0 h-152rpx bg-white">
|
||||
<view class="mt-34rpx flex items-center justify-center">
|
||||
<wd-button
|
||||
custom-class="!text-32rpx !w-630rpx !h-90rpx !bg-[#4C9F44] !rounded-8rpx !text-[#fff]"
|
||||
@click="StoreManage.handleSave"
|
||||
>
|
||||
<wd-button custom-class="!text-32rpx !w-630rpx !h-90rpx !bg-[#4C9F44] !rounded-8rpx !text-[#fff]"
|
||||
@click="StoreManage.handleSave">
|
||||
保存
|
||||
</wd-button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 选择标签弹窗 -->
|
||||
<wd-popup
|
||||
v-model="showTagSelectPopup"
|
||||
lock-scroll
|
||||
custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;"
|
||||
position="bottom"
|
||||
@close="StoreManage.handleCloseTagSelect"
|
||||
>
|
||||
<wd-popup v-model="showTagSelectPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;"
|
||||
position="bottom" @close="StoreManage.handleCloseTagSelect">
|
||||
<view class="relative bg-white px-30rpx pb-56rpx pt-50rpx">
|
||||
<!-- 关闭按钮 -->
|
||||
<view class="absolute right-30rpx top-18rpx" @click="StoreManage.handleCloseTagSelect">
|
||||
@ -647,10 +581,8 @@ const StoreManage = {
|
||||
<view class="text-32rpx text-[#303133] font-bold leading-44rpx">
|
||||
我的标签
|
||||
</view>
|
||||
<view
|
||||
class="text-28rpx text-[#4C9F44] leading-40rpx"
|
||||
@click="isTagManageMode ? StoreManage.handleExitManagement() : StoreManage.handleEnterManagement()"
|
||||
>
|
||||
<view class="text-28rpx text-[#4C9F44] leading-40rpx"
|
||||
@click="isTagManageMode ? StoreManage.handleExitManagement() : StoreManage.handleEnterManagement()">
|
||||
{{ isTagManageMode ? '退出管理' : '管理' }}
|
||||
</view>
|
||||
</view>
|
||||
@ -662,34 +594,23 @@ const StoreManage = {
|
||||
|
||||
<!-- 标签列表 -->
|
||||
<view class="flex flex-wrap gap-16rpx">
|
||||
<view
|
||||
v-for="tag in availableTags"
|
||||
:key="tag"
|
||||
<view v-for="tag in availableTags" :key="tag"
|
||||
class="flex items-center rounded-20rpx px-20rpx py-8rpx"
|
||||
:class="selectedTags.includes(tag) ? 'bg-[#4C9F44]' : 'bg-[#F6F7F8]'"
|
||||
@click="StoreManage.handleSelectTag(tag)"
|
||||
>
|
||||
<view
|
||||
class="text-26rpx leading-36rpx"
|
||||
@click="StoreManage.handleSelectTag(tag)">
|
||||
<view class="text-26rpx leading-36rpx"
|
||||
:class="selectedTags.includes(tag) ? 'text-[#fff]' : 'text-[#303133]'"
|
||||
:style="{ marginRight: isTagManageMode ? '8rpx' : '0' }"
|
||||
>
|
||||
:style="{ marginRight: isTagManageMode ? '8rpx' : '0' }">
|
||||
{{ tag }}
|
||||
</view>
|
||||
<wd-icon
|
||||
v-if="isTagManageMode"
|
||||
name="close-circle-filled"
|
||||
size="14px"
|
||||
<wd-icon v-if="isTagManageMode" name="close-circle-filled" size="14px"
|
||||
:color="selectedTags.includes(tag) ? '#fff' : '#909399'"
|
||||
@click.stop="StoreManage.handleRemoveTagFromList(tag, $event)"
|
||||
/>
|
||||
@click.stop="StoreManage.handleRemoveTagFromList(tag, $event)" />
|
||||
</view>
|
||||
<!-- 新建标签按钮 -->
|
||||
<view
|
||||
v-if="!isTagManageMode"
|
||||
<view v-if="!isTagManageMode"
|
||||
class="flex items-center border-2rpx border-[#E5E5E5] rounded-20rpx border-dashed px-20rpx py-8rpx"
|
||||
@click="StoreManage.handleShowCreateTag"
|
||||
>
|
||||
@click="StoreManage.handleShowCreateTag">
|
||||
<wd-icon name="add" size="16px" color="#909399" class="mr-8rpx" />
|
||||
<view class="text-26rpx text-[#909399] leading-36rpx">
|
||||
新建标签
|
||||
@ -701,21 +622,15 @@ const StoreManage = {
|
||||
<view
|
||||
class="mt-40rpx h-90rpx rounded-8rpx bg-[#4C9F44] text-center text-30rpx text-[#fff] leading-90rpx"
|
||||
:class="{ 'opacity-0 pointer-events-none': isTagManageMode }"
|
||||
@click="StoreManage.handleConfirmTags"
|
||||
>
|
||||
@click="StoreManage.handleConfirmTags">
|
||||
确认
|
||||
</view>
|
||||
</view>
|
||||
</wd-popup>
|
||||
|
||||
<!-- 新建标签弹窗 -->
|
||||
<wd-popup
|
||||
v-model="showCreateTagPopup"
|
||||
lock-scroll
|
||||
custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;"
|
||||
position="bottom"
|
||||
@close="StoreManage.handleCloseCreateTag"
|
||||
>
|
||||
<wd-popup v-model="showCreateTagPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;"
|
||||
position="bottom" @close="StoreManage.handleCloseCreateTag">
|
||||
<view class="relative bg-white px-30rpx pb-78rpx pt-50rpx">
|
||||
<!-- 导航栏 -->
|
||||
<view class="mb-40rpx flex items-center justify-between">
|
||||
@ -732,20 +647,13 @@ const StoreManage = {
|
||||
|
||||
<!-- 输入框 -->
|
||||
<view class="mb-40rpx">
|
||||
<wd-input
|
||||
v-model="newTagName"
|
||||
no-border
|
||||
placeholder="标签名称"
|
||||
:maxlength="5"
|
||||
custom-class="!bg-[#F6F7F8] !rounded-16rpx !px-28rpx !py-20rpx"
|
||||
/>
|
||||
<wd-input v-model="newTagName" no-border placeholder="标签名称" :maxlength="5"
|
||||
custom-class="!bg-[#F6F7F8] !rounded-16rpx !px-28rpx !py-20rpx" />
|
||||
</view>
|
||||
|
||||
<!-- 完成按钮 -->
|
||||
<view
|
||||
class="h-90rpx rounded-8rpx bg-[#4C9F44] text-center text-30rpx text-[#fff] leading-90rpx"
|
||||
@click="StoreManage.handleCompleteCreateTag"
|
||||
>
|
||||
<view class="h-90rpx rounded-8rpx bg-[#4C9F44] text-center text-30rpx text-[#fff] leading-90rpx"
|
||||
@click="StoreManage.handleCompleteCreateTag">
|
||||
完成
|
||||
</view>
|
||||
</view>
|
||||
@ -768,6 +676,7 @@ page {
|
||||
|
||||
.add-textarea {
|
||||
:deep() {
|
||||
|
||||
.wd-textarea__value,
|
||||
.wd-textarea__count {
|
||||
background: transparent !important;
|
||||
|
||||
@ -1,11 +1,9 @@
|
||||
<route lang="jsonc" type="page">
|
||||
{
|
||||
<route lang="jsonc" type="page">{
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}
|
||||
</route>
|
||||
}</route>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { router } from '@/utils/tools'
|
||||
@ -85,7 +83,7 @@ const RoomManage = {
|
||||
* 点击房间卡片
|
||||
*/
|
||||
handleClickRoom: (room: any) => {
|
||||
router.navigateTo(`/pages/store/room-detail?id=${room.id}`)
|
||||
router.navigateTo(`/bundle/tea-room/detail?id=${room.id}`)
|
||||
},
|
||||
|
||||
/**
|
||||
@ -133,20 +131,16 @@ function getStatusConfig(status: RoomStatus) {
|
||||
<!-- 房间列表 -->
|
||||
<view class="px-30rpx pb-40rpx pt-30rpx">
|
||||
<view class="grid grid-cols-2 gap-24rpx">
|
||||
<view
|
||||
v-for="room in roomList"
|
||||
:key="room.id"
|
||||
<view v-for="room in roomList" :key="room.id"
|
||||
class="flex flex-col overflow-hidden rounded-16rpx bg-white"
|
||||
@click="RoomManage.handleClickRoom(room)"
|
||||
>
|
||||
@click="RoomManage.handleClickRoom(room)">
|
||||
<!-- 房间图片 -->
|
||||
<view class="relative aspect-[4/3] w-full">
|
||||
<wd-img width="100%" height="100%" :src="room.image" mode="aspectFill" />
|
||||
<!-- 编辑图标覆盖层 -->
|
||||
<view
|
||||
class="absolute right-16rpx top-16rpx h-48rpx w-48rpx flex items-center justify-center rounded-24rpx bg-black bg-opacity-40"
|
||||
@click.stop="RoomManage.handleEditImage(room, $event)"
|
||||
>
|
||||
@click.stop="RoomManage.handleEditImage(room, $event)">
|
||||
<wd-icon name="edit" size="16px" color="#fff" />
|
||||
</view>
|
||||
</view>
|
||||
@ -161,15 +155,11 @@ function getStatusConfig(status: RoomStatus) {
|
||||
<!-- 状态指示器 -->
|
||||
<view class="flex items-baseline justify-center align-middle">
|
||||
<!-- 状态点 -->
|
||||
<view
|
||||
class="mr-8rpx h-12rpx w-12rpx flex-shrink-0 rounded-full"
|
||||
:style="{ backgroundColor: getStatusConfig(room.status).color }"
|
||||
/>
|
||||
<view class="mr-8rpx h-12rpx w-12rpx flex-shrink-0 rounded-full"
|
||||
:style="{ backgroundColor: getStatusConfig(room.status).color }" />
|
||||
<!-- 状态文字 -->
|
||||
<view
|
||||
class="text-24rpx text-[#303133] leading-34rpx"
|
||||
:style="{ color: getStatusConfig(room.status).color }"
|
||||
>
|
||||
<view class="text-24rpx text-[#303133] leading-34rpx"
|
||||
:style="{ color: getStatusConfig(room.status).color }">
|
||||
{{ getStatusConfig(room.status).text }}
|
||||
</view>
|
||||
<!-- 右箭头 -->
|
||||
|
||||
@ -1,52 +1,41 @@
|
||||
<route lang="jsonc" type="page">
|
||||
{
|
||||
<route lang="jsonc" type="page">{
|
||||
"layout": "tabbar",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}
|
||||
</route>
|
||||
}</route>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { router } from '@/utils/tools'
|
||||
import bookroomImg from './img/bookroom.png'
|
||||
import deviceImg from './img/device.png'
|
||||
import renewImg from './img/renew.png'
|
||||
import roomImg from './img/room.png'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
const navbarHeight = inject('navbarHeight')
|
||||
|
||||
// 本地图片资源
|
||||
const roomIcon = roomImg as string
|
||||
const deviceIcon = deviceImg as string
|
||||
const bookroomIcon = bookroomImg as string
|
||||
const renewIcon = renewImg as string
|
||||
|
||||
console.log(`${OSS}/images/store/store/room.png`)
|
||||
// 功能卡片数据
|
||||
const storeMenus = ref([
|
||||
{
|
||||
id: 1,
|
||||
title: '包间管理',
|
||||
icon: roomIcon,
|
||||
icon: `${OSS}images/store/store/room.png`,
|
||||
path: '/pages/store/room-manage',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: '设备控制',
|
||||
icon: deviceIcon,
|
||||
icon: `${OSS}images/store/store/device.png`,
|
||||
path: '/pages/store/device',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: '包间预定',
|
||||
icon: bookroomIcon,
|
||||
path: '/pages/store/bookroom',
|
||||
icon: `${OSS}images/store/store/bookroom.png`,
|
||||
path: '/pages/store/reserve',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
title: '订单续订',
|
||||
icon: renewIcon,
|
||||
icon: `${OSS}images/store/store/renew.png`,
|
||||
path: '/pages/store/renew',
|
||||
},
|
||||
])
|
||||
@ -74,6 +63,7 @@ const Store = {
|
||||
// TODO: 实现目标功能
|
||||
console.log('目标功能')
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -87,14 +77,12 @@ const Store = {
|
||||
<!-- 功能卡片网格 -->
|
||||
<view class="px-30rpx pt-40rpx">
|
||||
<view class="grid grid-cols-2 gap-30rpx">
|
||||
<view
|
||||
v-for="item in storeMenus"
|
||||
:key="item.id"
|
||||
<view v-for="item in storeMenus" :key="item.id"
|
||||
class="flex flex-col items-center rounded-16rpx bg-white p-40rpx"
|
||||
@click="Store.handleClickMenu(item)"
|
||||
>
|
||||
@click="Store.handleClickMenu(item)">
|
||||
<!-- 图标区域 -->
|
||||
<view class="mb-24rpx h-160rpx w-160rpx flex items-center justify-center rounded-16rpx bg-[#F0F9FF]">
|
||||
<view
|
||||
class="mb-24rpx h-160rpx w-160rpx flex items-center justify-center rounded-16rpx bg-[#F0F9FF]">
|
||||
<wd-img width="120rpx" height="120rpx" :src="item.icon" mode="aspectFit" />
|
||||
</view>
|
||||
<!-- 标题 -->
|
||||
@ -108,7 +96,7 @@ const Store = {
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #f6f7f8;
|
||||
}
|
||||
page {
|
||||
background-color: $cz-page-background;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -44,7 +44,7 @@ export const nativeTabbarList: NativeTabBarItem[] = [
|
||||
{
|
||||
iconPath: 'static/tabbar/order.png',
|
||||
selectedIconPath: 'static/tabbar/order_s.png',
|
||||
pagePath: 'pages/reserve/reserve',
|
||||
pagePath: 'pages/order/order',
|
||||
text: '订单',
|
||||
},
|
||||
{
|
||||
|
||||
@ -50,6 +50,7 @@ export enum OrderSource {
|
||||
TeaRoom = 'teaRoom', // 茶室
|
||||
TeaSpecialist = 'teaSpecialist', // 茶艺师
|
||||
SetMeal = 'setMeal', // 茶室管理端-套餐管理
|
||||
Admin = 'admin', // 茶室管理端-套餐管理
|
||||
}
|
||||
|
||||
// 订单来源对应名称
|
||||
@ -59,6 +60,7 @@ export const OrderSourceText: Record<OrderSource, string> = {
|
||||
[OrderSource.TeaRoom]: '茶室',
|
||||
[OrderSource.TeaSpecialist]: '茶艺师',
|
||||
[OrderSource.SetMeal]: '套餐管理',
|
||||
[OrderSource.Admin]: '管理员',
|
||||
}
|
||||
|
||||
// 订单状态
|
||||
@ -317,3 +319,22 @@ export const TeaRoomPackageOrderStatusTextValue: Record<TeaRoomPackageOrderStatu
|
||||
title: '售后完成'
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
// 管理员-订单管理状态
|
||||
export enum AdminOrderStatus {
|
||||
ToUse = 0, // 待使用
|
||||
Consuming = 1,// 使用中
|
||||
Finished = 2, // 已完成
|
||||
Cancelled = 3, // 取消订单
|
||||
}
|
||||
|
||||
// 管理员-订单状态文本
|
||||
export enum AdminOrderStatusText {
|
||||
All = 'all', // 全部
|
||||
ToUse = 'toUse', // 待使用
|
||||
Consuming = 'consuming',// 使用中
|
||||
Finished = 'finished', // 已完成
|
||||
Cancelled = 'cancelled', // 已取消
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user