添加页面
This commit is contained in:
wangxiaowei
@ -150,7 +150,7 @@
|
|||||||
最多可上传9张图片
|
最多可上传9张图片
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<wd-upload :file-list="fileList" :limit="1" image-mode="scaleToFill" accept="video" :action="action"
|
<wd-upload :file-list="fileList" :limit="9" image-mode="scaleToFill" accept="image" :action="action"
|
||||||
@change="Add.handleUploadFile">
|
@change="Add.handleUploadFile">
|
||||||
<view
|
<view
|
||||||
class="border-2rpx border-dashed border-[#E5E5E5] w-184rpx h-184rpx flex flex-col items-center justify-center rounded-16rpx">
|
class="border-2rpx border-dashed border-[#E5E5E5] w-184rpx h-184rpx flex flex-col items-center justify-center rounded-16rpx">
|
||||||
|
|||||||
202
src/bundle/store/edit-store.vue
Normal file
202
src/bundle/store/edit-store.vue
Normal file
@ -0,0 +1,202 @@
|
|||||||
|
<route lang="jsonc" type="page">{
|
||||||
|
"layout": "default",
|
||||||
|
"style": {
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
}</route>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<view class="pb-40rpx">
|
||||||
|
<view>
|
||||||
|
<navbar title="修改门店信息" custom-class='!bg-[#fff]'></navbar>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="mt-44rpx mx-40rpx">
|
||||||
|
<!-- 门店名称 -->
|
||||||
|
<view>
|
||||||
|
<view class="font-bold text-32rpx text-[#303133] leading-44rpx">门店名称</view>
|
||||||
|
<view class="mt-10rpx">
|
||||||
|
<wd-input v-model="form.name" :maxlength="20" show-word-limit placeholder="请输入门店的名称"/>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 抖音UID -->
|
||||||
|
<view class="mt-32rpx">
|
||||||
|
<view class="font-bold text-32rpx text-[#303133] leading-44rpx">抖音UID</view>
|
||||||
|
<view class="mt-10rpx">
|
||||||
|
<wd-input v-model="form.uid" :maxlength="20" show-word-limit placeholder="请输入抖音UID"/>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 门店地址 -->
|
||||||
|
<view class="mt-32rpx">
|
||||||
|
<view class="font-bold text-32rpx text-[#303133] leading-44rpx">门店地址</view>
|
||||||
|
<view class="mt-50rpx">
|
||||||
|
<view class="text-30rpx leading-42rpx text-[#303133]">省市区</view>
|
||||||
|
<view class="border-b border-b-solid border-b-[#e5e7eb] area">
|
||||||
|
<wd-col-picker v-model="form.area" :columns="area" :column-change="columnChange" @confirm="EditStore.handleConfirmAddress" placeholder="请选择省市区"></wd-col-picker>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="mt-28rpx">
|
||||||
|
<view class="text-30rpx leading-42rpx text-[#303133]">省市区</view>
|
||||||
|
<view>
|
||||||
|
<wd-input v-model="form.address" placeholder="请填写具体地址"/>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 营业时间 -->
|
||||||
|
<view class="mt-32rpx">
|
||||||
|
<view class="font-bold text-32rpx text-[#303133] leading-44rpx">营业时间</view>
|
||||||
|
<view class="mt-50rpx">
|
||||||
|
<view class="text-30rpx leading-42rpx text-[#303133]">开始时间</view>
|
||||||
|
<view class="border-b border-b-solid border-b-[#e5e7eb] area">
|
||||||
|
<wd-datetime-picker v-model="form.start_time" type="time"></wd-datetime-picker>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="mt-28rpx">
|
||||||
|
<view class="text-30rpx leading-42rpx text-[#303133]">结束时间</view>
|
||||||
|
<view class="border-b border-b-solid border-b-[#e5e7eb] area">
|
||||||
|
<wd-datetime-picker v-model="form.end_time" type="time"></wd-datetime-picker>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 门店电话 -->
|
||||||
|
<view class="mt-32rpx">
|
||||||
|
<view class="font-bold text-32rpx text-[#303133] leading-44rpx">门店电话</view>
|
||||||
|
<view class="mt-10rpx">
|
||||||
|
<wd-input v-model="form.uid" :maxlength="20" show-word-limit placeholder="请输入门店电话"/>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 门店视频 -->
|
||||||
|
<view class="mt-32rpx">
|
||||||
|
<view class="font-bold text-32rpx text-[#303133] leading-44rpx">门店视频</view>
|
||||||
|
<view class="mt-32rpx">
|
||||||
|
<wd-upload :file-list="fileList" :limit="1" image-mode="scaleToFill" accept="video" :action="action"
|
||||||
|
@change="EditStore.handleUploadFile">
|
||||||
|
<view
|
||||||
|
class="border-2rpx border-dashed border-[#E5E5E5] w-184rpx h-184rpx flex flex-col items-center justify-center rounded-16rpx">
|
||||||
|
<view class="">
|
||||||
|
<wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_video.png`"
|
||||||
|
mode="aspectFill" />
|
||||||
|
</view>
|
||||||
|
<view class="font-400 text-26rpx leading-36rpx text-#303133">添加视频</view>
|
||||||
|
</view>
|
||||||
|
</wd-upload>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 门店图片 -->
|
||||||
|
<view class="mt-32rpx">
|
||||||
|
<view class="font-bold text-32rpx text-[#303133] leading-44rpx">门店图片</view>
|
||||||
|
<view class="mt-32rpx">
|
||||||
|
<wd-upload :file-list="fileList" :limit="9" image-mode="scaleToFill" accept="image" :action="action"
|
||||||
|
@change="EditStore.handleUploadFile">
|
||||||
|
<view
|
||||||
|
class="border-2rpx border-dashed border-[#E5E5E5] w-184rpx h-184rpx flex flex-col items-center justify-center rounded-16rpx">
|
||||||
|
<view class="">
|
||||||
|
<wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_upload.png`"
|
||||||
|
mode="aspectFill" />
|
||||||
|
</view>
|
||||||
|
<view class="font-400 text-26rpx leading-36rpx text-#303133">添加图片</view>
|
||||||
|
</view>
|
||||||
|
</wd-upload>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="font-bold text-30rpx leading-42rpx bg-[#4C9F44] text-#fff rounded-8rpx mx-60rpx h-90rpx leading-90rpx text-center mt-114rpx" @click="EditStore.handleSaveStoreInfo">
|
||||||
|
保存
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { useColPickerData } from '@/hooks/useColPickerData'
|
||||||
|
import { toast } from '@/utils/toast'
|
||||||
|
|
||||||
|
const OSS = inject('OSS')
|
||||||
|
|
||||||
|
// 上传文件
|
||||||
|
const fileList = ref<any[]>([])
|
||||||
|
const action = 'https://www.mocky.io/v2/5cc8019d300000980a055e76' // 仅做测试使用，实际请换成真实上传接口
|
||||||
|
|
||||||
|
// 表单数据
|
||||||
|
const form = ref({
|
||||||
|
name: "",
|
||||||
|
uid: "",
|
||||||
|
area: [],
|
||||||
|
address: "",
|
||||||
|
start_time: "",
|
||||||
|
end_time: "",
|
||||||
|
phone: ""
|
||||||
|
})
|
||||||
|
|
||||||
|
// 省市区数据
|
||||||
|
const { colPickerData, findChildrenByCode } = useColPickerData()
|
||||||
|
const value = ref<string[]>([])
|
||||||
|
const area = ref<any[]>([
|
||||||
|
colPickerData.map((item) => {
|
||||||
|
return {
|
||||||
|
value: item.value,
|
||||||
|
label: item.text
|
||||||
|
}
|
||||||
|
})
|
||||||
|
])
|
||||||
|
const columnChange = ({ selectedItem, resolve, finish }) => {
|
||||||
|
const areaData = findChildrenByCode(colPickerData, selectedItem.value)
|
||||||
|
if (areaData && areaData.length) {
|
||||||
|
resolve(
|
||||||
|
areaData.map((item) => {
|
||||||
|
return {
|
||||||
|
value: item.value,
|
||||||
|
label: item.text
|
||||||
|
}
|
||||||
|
})
|
||||||
|
)
|
||||||
|
} else {
|
||||||
|
finish()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const EditStore = {
|
||||||
|
/**
|
||||||
|
* 选择省市区
|
||||||
|
* @param selected
|
||||||
|
*/
|
||||||
|
handleConfirmAddress(selected) {
|
||||||
|
form.value.address = selected.map(item => item.label)
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 图片选择/删除
|
||||||
|
*/
|
||||||
|
handleUploadFile: (event: any) => {
|
||||||
|
fileList.value = event.fileList
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 保存门店信息
|
||||||
|
*/
|
||||||
|
handleSaveStoreInfo: () => {
|
||||||
|
toast.info('保存成功')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page {
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.area {
|
||||||
|
:deep() {
|
||||||
|
.wd-cell {
|
||||||
|
padding-left: 0 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
111
src/bundle/store/setting.vue
Normal file
111
src/bundle/store/setting.vue
Normal file
@ -0,0 +1,111 @@
|
|||||||
|
<route lang="jsonc" type="page">{
|
||||||
|
"layout": "default",
|
||||||
|
"style": {
|
||||||
|
"navigationStyle": "custom",
|
||||||
|
"navigationBarBackgroundColor": "#F6F7F9"
|
||||||
|
}
|
||||||
|
}</route>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<!-- 退出登录 -->
|
||||||
|
<wd-popup v-model="showLogoutPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
|
||||||
|
<view class="relative pt-54rpx pb-74rpx">
|
||||||
|
<view class="text-[#303133] text-36rpx leading-46rpx text-center">您确定要退出该账号吗？</view>
|
||||||
|
<view class="mt-76rpx">
|
||||||
|
<view class="bg-[#4C9F44] h-90rpx leading-90rpx mx-60rpx rounded-8rpx text-center text-[#fff]" @click="Setting.handleLogout">
|
||||||
|
退出登录
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="bg-[#fff] border-2rpx border-solid border-[#9CA3AF] h-90rpx leading-90rpx mx-60rpx rounded-8rpx text-center text-[#303133] mt-40rpx"
|
||||||
|
@click="showLogoutPopup = false">
|
||||||
|
取消
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</wd-popup>
|
||||||
|
|
||||||
|
<view>
|
||||||
|
<navbar title="我的设置" custom-class='!bg-[#fff]'></navbar>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="mt-36rpx mx-30rpx">
|
||||||
|
<view class="flex items-center justify-between" @click="router.navigateTo('/bundle/profile/profile')">
|
||||||
|
<view class="flex items-center">
|
||||||
|
<wd-img width="96rpx" height="96rpx" :src="`${OSS}icon/icon_info2.png`"></wd-img>
|
||||||
|
<view class="font-400 text-30rpx text-[#171717] leading-48rpx ml-24rpx">个人信息</view>
|
||||||
|
</view>
|
||||||
|
<view class="">
|
||||||
|
<wd-icon name="chevron-right" size="48rpx" color="#8F8F8F"></wd-icon>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="flex items-center justify-between mt-32rpx" @click="router.navigateTo('/bundle/wallet/wallet')">
|
||||||
|
<view class="flex items-center">
|
||||||
|
<wd-img width="96rpx" height="96rpx" :src="`${OSS}icon/icon_wallet2.png`"></wd-img>
|
||||||
|
<view class="font-400 text-30rpx text-[#171717] leading-48rpx ml-24rpx">我的钱包</view>
|
||||||
|
</view>
|
||||||
|
<view class="">
|
||||||
|
<wd-icon name="chevron-right" size="48rpx" color="#8F8F8F"></wd-icon>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="flex items-center justify-between mt-32rpx" @click="router.navigateTo('/bundle/parten/pages/bank-card/list')">
|
||||||
|
<view class="flex items-center">
|
||||||
|
<wd-img width="96rpx" height="96rpx" :src="`${OSS}icon/icon_card2.png`"></wd-img>
|
||||||
|
<view class="font-400 text-30rpx text-[#171717] leading-48rpx ml-24rpx">管理银行卡</view>
|
||||||
|
</view>
|
||||||
|
<view class="">
|
||||||
|
<wd-icon name="chevron-right" size="48rpx" color="#8F8F8F"></wd-icon>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="w-full fixed bottom-0 left-0 right-0 h-154rpx bg-white px-64rpx flex justify-center items-center">
|
||||||
|
<view class="bg-[#F6F7F8] w-630rpx h-90rpx text-center leading-90rpx text-[#303133] font-bold text-30rpx rounded-8rpx" @click="showLogoutPopup = true">退出账户</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { toast } from '@/utils/toast'
|
||||||
|
import { router } from '@/utils/tools'
|
||||||
|
import { useUserStore } from '@/store'
|
||||||
|
|
||||||
|
const OSS = inject('OSS')
|
||||||
|
const storeName = ref<string>('')
|
||||||
|
const showLogoutPopup = ref<boolean>(false) // 是否显示退出登录弹出框
|
||||||
|
|
||||||
|
// 表单相关
|
||||||
|
const model = reactive<{
|
||||||
|
code: string
|
||||||
|
}>({
|
||||||
|
code: ''
|
||||||
|
})
|
||||||
|
|
||||||
|
onLoad((args) => {
|
||||||
|
storeName.value = args.storeName || ''
|
||||||
|
})
|
||||||
|
|
||||||
|
const Setting = {
|
||||||
|
/**
|
||||||
|
* 退出
|
||||||
|
*/
|
||||||
|
handleLogout: () => {
|
||||||
|
const userStore = useUserStore()
|
||||||
|
userStore.logout()
|
||||||
|
if (!userStore.isLoggedIn) {
|
||||||
|
toast.info('退出成功')
|
||||||
|
router.reLaunch('/pages/my/my')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
page {
|
||||||
|
background-color: #FCFCFC;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
@ -132,13 +132,7 @@ const My = {
|
|||||||
// 跳转到设置页面
|
// 跳转到设置页面
|
||||||
handleToSettings: () => {
|
handleToSettings: () => {
|
||||||
// TODO: 跳转到设置页面
|
// TODO: 跳转到设置页面
|
||||||
console.log('跳转到设置页面')
|
router.navigateTo('/bundle/store/setting')
|
||||||
},
|
|
||||||
|
|
||||||
// 编辑门店信息
|
|
||||||
handleEditStore: () => {
|
|
||||||
// TODO: 编辑门店信息
|
|
||||||
console.log('编辑门店信息')
|
|
||||||
},
|
},
|
||||||
|
|
||||||
// 预览媒体（视频/图片）
|
// 预览媒体（视频/图片）
|
||||||
@ -161,11 +155,11 @@ const My = {
|
|||||||
},
|
},
|
||||||
|
|
||||||
handleToWallet: () => {
|
handleToWallet: () => {
|
||||||
// if (!isLogin.value) {
|
if (!isLogin.value) {
|
||||||
// router.navigateTo('/bundle/wallet/wallet')
|
router.navigateTo('/bundle/wallet/wallet')
|
||||||
// } else {
|
} else {
|
||||||
router.navigateTo('/pages/login/login')
|
router.navigateTo('/pages/login/login')
|
||||||
// }
|
}
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
@ -176,11 +170,11 @@ const My = {
|
|||||||
:style="{ backgroundImage: `url('${OSS}images/store/my/image2.png')` }">
|
:style="{ backgroundImage: `url('${OSS}images/store/my/image2.png')` }">
|
||||||
<wd-navbar safe-area-inset-top :bordered="false" custom-style="background-color: transparent !important;">
|
<wd-navbar safe-area-inset-top :bordered="false" custom-style="background-color: transparent !important;">
|
||||||
<template #left>
|
<template #left>
|
||||||
<view class="ml-16rpx flex items-center" @click="My.handleToSettings" />
|
<view class="ml-16rpx flex items-center"/>
|
||||||
</template>
|
</template>
|
||||||
<template #right>
|
<template #right>
|
||||||
<view class="right-slot mr-16rpx">
|
<view class="right-slot mr-16rpx">
|
||||||
<view class="mr-16rpx" @click="My.handleShowService">
|
<view class="mr-16rpx" @click="My.handleToSettings">
|
||||||
<wd-icon name="setting" color="#fff" size="16px" />
|
<wd-icon name="setting" color="#fff" size="16px" />
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
@ -245,7 +239,7 @@ const My = {
|
|||||||
</view>
|
</view>
|
||||||
<view class="modify-btn absolute right-0 flex items-center px-20rpx py-8rpx"
|
<view class="modify-btn absolute right-0 flex items-center px-20rpx py-8rpx"
|
||||||
:style="{ backgroundImage: `url('${OSS}images/store/my/image3.png')` }"
|
:style="{ backgroundImage: `url('${OSS}images/store/my/image3.png')` }"
|
||||||
@click="My.handleEditStore">
|
@click="router.navigateTo('/bundle/store/edit-store')">
|
||||||
<wd-img width="24rpx" height="24rpx" :src="`${OSS}images/store/my/image4.png`" class="mr-8rpx" />
|
<wd-img width="24rpx" height="24rpx" :src="`${OSS}images/store/my/image4.png`" class="mr-8rpx" />
|
||||||
<text class="text-24rpx text-[#fff]">修改</text>
|
<text class="text-24rpx text-[#fff]">修改</text>
|
||||||
</view>
|
</view>
|
||||||
|
|||||||
Reference in New Issue
Block a user