提交代码
This commit is contained in:
parent
c91f0f45b5
commit
d21dd4c3c8
|
|
@ -7,8 +7,8 @@ const config = {
|
||||||
// #endif
|
// #endif
|
||||||
// #ifndef H5
|
// #ifndef H5
|
||||||
// host: 'http://91f.xyz:8080',
|
// host: 'http://91f.xyz:8080',
|
||||||
host: 'https://1e2a734e.r24.cpolar.top',
|
host: 'https://3dea4c80.r9.cpolar.top',
|
||||||
// host: 'http://puys83.natappfree.cc',
|
// host: 'http://192.168.31.61:8080',
|
||||||
// #endif
|
// #endif
|
||||||
// 是否vivo显示
|
// 是否vivo显示
|
||||||
showVivo: true,
|
showVivo: true,
|
||||||
|
|
|
||||||
|
|
@ -30,10 +30,10 @@
|
||||||
"path": "pages/shop/shop",
|
"path": "pages/shop/shop",
|
||||||
"style": {
|
"style": {
|
||||||
"navigationBarTitleText": "商城",
|
"navigationBarTitleText": "商城",
|
||||||
// "leftWindow": true,
|
|
||||||
"onReachBottomDistance": 100,
|
"onReachBottomDistance": 100,
|
||||||
"enablePullDownRefresh": true,
|
"enablePullDownRefresh": true,
|
||||||
"navigationBarBackgroundColor": "#fff"
|
"navigationBarBackgroundColor": "#fff",
|
||||||
|
"navigationStyle": "custom"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|
@ -297,7 +297,7 @@
|
||||||
{
|
{
|
||||||
"path": "pages/shop/settle",
|
"path": "pages/shop/settle",
|
||||||
"style": {
|
"style": {
|
||||||
"navigationBarTitleText": "商家入驻",
|
"navigationBarTitleText": "平台入驻",
|
||||||
"navigationBarBackgroundColor": "#fff"
|
"navigationBarBackgroundColor": "#fff"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
@ -791,6 +791,25 @@
|
||||||
"navigationBarTitleText": "礼包专区",
|
"navigationBarTitleText": "礼包专区",
|
||||||
"navigationBarBackgroundColor": "#fff"
|
"navigationBarBackgroundColor": "#fff"
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/shop/store/settled",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "商家入驻"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/shop/offline/settled",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "店家入驻"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path" : "pages/shop/offline/hotel",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText" : "酒店民宿"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
|
|
||||||
|
|
@ -881,7 +900,7 @@
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"name": "test",
|
"name": "test",
|
||||||
"path": "pages/mine/setting/about"
|
"path": "pages/shop/shop"
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -1,65 +0,0 @@
|
||||||
<template>
|
|
||||||
<view class="box">
|
|
||||||
<view class="box_next" v-if="loading">
|
|
||||||
<image :src="loadingGif" mode="widthFix" class="box_next_img"></image>
|
|
||||||
<text class="box_next_text">加载中...</text>
|
|
||||||
</view>
|
|
||||||
<view v-else>
|
|
||||||
<text class="box_else_text">{{ hasMore ? '上拉加载更多' : '触碰到底线了' }}</text>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
props: {
|
|
||||||
loadingGif: {
|
|
||||||
type: String,
|
|
||||||
default: ''
|
|
||||||
},
|
|
||||||
loading: Boolean,
|
|
||||||
hasMore: Boolean
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
.box {
|
|
||||||
/* #ifndef APP-NVUE */
|
|
||||||
display: flex;
|
|
||||||
/* #endif */
|
|
||||||
|
|
||||||
flex-direction: row;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
padding: 30rpx;
|
|
||||||
height: 100rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.box_next {
|
|
||||||
/* #ifndef APP-NVUE */
|
|
||||||
display: flex;
|
|
||||||
/* #endif */
|
|
||||||
|
|
||||||
flex-direction: row;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.box_next_img {
|
|
||||||
width: 35rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.box_next_text {
|
|
||||||
font-size: 26rpx;
|
|
||||||
color: #666666;
|
|
||||||
margin-left: 10rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.box_else_text {
|
|
||||||
font-size: 26rpx;
|
|
||||||
color: #666666;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,101 +0,0 @@
|
||||||
<template>
|
|
||||||
<view class="container">
|
|
||||||
<view class="input-search">
|
|
||||||
<image class="wh30 mr20" @click="skipSearch" :src="search"></image>
|
|
||||||
<input @click="skipSearch" v-model="searchValue" class="input" type="text" :placeholder="placeholder"
|
|
||||||
@change="search_change">
|
|
||||||
<uni-icons @click="emit('camera')" class="icon" type="camera" size="30"></uni-icons>
|
|
||||||
</view>
|
|
||||||
<view @click="search_change(searchValue)" class="search wsn">搜索</view>
|
|
||||||
</view>
|
|
||||||
</template>
|
|
||||||
<script setup>
|
|
||||||
import { ref, defineEmits } from 'vue'
|
|
||||||
import search from '@/static/search.png'
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
disabled: {
|
|
||||||
type: Boolean,
|
|
||||||
default: true
|
|
||||||
},
|
|
||||||
placeholder: {
|
|
||||||
type: String,
|
|
||||||
default: '请输入搜索内容'
|
|
||||||
}
|
|
||||||
})
|
|
||||||
const searchValue = ref('')
|
|
||||||
const emit = defineEmits(["search", "camera"])
|
|
||||||
//改变内容
|
|
||||||
const updateSearch = (val) => {
|
|
||||||
searchValue.value = val
|
|
||||||
search_change(val)
|
|
||||||
}
|
|
||||||
const search_change = (val) => {
|
|
||||||
//搜索
|
|
||||||
console.log(val)
|
|
||||||
//通知父组建改变
|
|
||||||
emit('search', val)
|
|
||||||
}
|
|
||||||
|
|
||||||
const skipSearch = () => {
|
|
||||||
if (!props.disabled) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
//跳转搜索 传递参数
|
|
||||||
uni.navigateTo({
|
|
||||||
url: '/pages/shop/search/index'
|
|
||||||
})
|
|
||||||
}
|
|
||||||
defineExpose({
|
|
||||||
updateSearch
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
top: 10px;
|
|
||||||
padding: 10rpx 20rpx;
|
|
||||||
background-color: $uni-bg-color;
|
|
||||||
//圆角
|
|
||||||
border-radius: 30rpx;
|
|
||||||
|
|
||||||
.input-search {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
align-items: center;
|
|
||||||
width: 100%;
|
|
||||||
padding-right: 10rpx;
|
|
||||||
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
padding-right: 10rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.overlay {
|
|
||||||
width: calc(100% - 280rpx);
|
|
||||||
position: absolute;
|
|
||||||
height: 60rpx;
|
|
||||||
opacity: 0;
|
|
||||||
z-index: 2;
|
|
||||||
}
|
|
||||||
|
|
||||||
.input {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.search {
|
|
||||||
border-radius: 30rpx;
|
|
||||||
opacity: 1;
|
|
||||||
width: fit-content;
|
|
||||||
padding: 14rpx 20rpx;
|
|
||||||
font-size: 24rpx;
|
|
||||||
line-height: 24rpx;
|
|
||||||
color: #333333;
|
|
||||||
/* 外部/按钮 */
|
|
||||||
background: linear-gradient(180deg, #FDDC85 -3%, #FFCE4F 100%);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -0,0 +1,146 @@
|
||||||
|
<script setup>
|
||||||
|
/**
|
||||||
|
* 线下店铺
|
||||||
|
*/
|
||||||
|
import {
|
||||||
|
ref,
|
||||||
|
reactive,
|
||||||
|
getCurrentInstance,
|
||||||
|
defineExpose,
|
||||||
|
} from 'vue'
|
||||||
|
// 工具库
|
||||||
|
import util from '@/common/js/util.js'
|
||||||
|
//
|
||||||
|
import api from '@/api/index.js'
|
||||||
|
// 商品列表
|
||||||
|
import productList from '@/components/shop/productList/productList'
|
||||||
|
|
||||||
|
const {
|
||||||
|
proxy
|
||||||
|
} = getCurrentInstance()
|
||||||
|
|
||||||
|
// 初始化
|
||||||
|
function init() {
|
||||||
|
//
|
||||||
|
}
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
init,
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<view class="header oh pt20 plr30 pb30 br20">
|
||||||
|
<view class="location df aic">
|
||||||
|
<uni-icons class="b" type="location" size="40rpx" />
|
||||||
|
<view class="name thd">希岸酒店</view>
|
||||||
|
<uni-icons type="right" />
|
||||||
|
<view class="f1"></view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="rows mt20">
|
||||||
|
<view class="searchBox rows f1 bfff bar">
|
||||||
|
<input class="f1 mlr20" type="text" placeholder="请输入" />
|
||||||
|
<view class="btn bar sm button plr20">搜索</view>
|
||||||
|
</view>
|
||||||
|
<uni-icons type="scan" size="60rpx" class="ml20" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 频道 -->
|
||||||
|
<view class="channel bfff">
|
||||||
|
<view class="item fmid fdc ptb30">
|
||||||
|
<image class="image wh80 br10" src="/static/logo.png" mode="aspectFill" />
|
||||||
|
<view class="name mt10 c333 f28">休闲娱乐</view>
|
||||||
|
</view>
|
||||||
|
<view class="item fmid fdc ptb30">
|
||||||
|
<image class="image wh80 br10" src="/static/logo.png" mode="aspectFill" />
|
||||||
|
<view class="name mt10 c333 f28">美食/堂食</view>
|
||||||
|
</view>
|
||||||
|
<view class="item fmid fdc ptb30">
|
||||||
|
<image class="image wh80 br10" src="/static/logo.png" mode="aspectFill" />
|
||||||
|
<view class="name mt10 c333 f28">酒店 | 民宿</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 精品推荐 -->
|
||||||
|
<view class="recommend">
|
||||||
|
<view class="title ptb15 plr30 c333 f44 bfff">精品推荐</view>
|
||||||
|
<view class="list mt30 mb80 plr30">
|
||||||
|
<view class="item bfff" v-for="(item,index) in 10" :key="index">
|
||||||
|
<view class="icon">
|
||||||
|
<image class="image" src="/static/logo.png" mode="aspectFill" />
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="info ptb10 plr10">
|
||||||
|
<view class="name f32">项目名称</view>
|
||||||
|
<view class="price df aife">
|
||||||
|
<view class="now cFF4242">
|
||||||
|
<text class="f24">￥</text>
|
||||||
|
<text class="f30 b">100.00</text>
|
||||||
|
</view>
|
||||||
|
<view class="old c999 f24 mlr10">
|
||||||
|
<text class="">￥</text>
|
||||||
|
<text class="">200</text>
|
||||||
|
</view>
|
||||||
|
<view class="discount plr10 cFF4242 f24 br4">5.0折</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
// 顶部
|
||||||
|
.header {
|
||||||
|
background-color: rgb(255, 155, 25);
|
||||||
|
|
||||||
|
.searchBox {
|
||||||
|
padding: 5rpx;
|
||||||
|
|
||||||
|
.button {
|
||||||
|
background-color: rgb(255, 155, 25);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 频道
|
||||||
|
.channel {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(4, 1fr);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 推荐
|
||||||
|
.recommend {
|
||||||
|
|
||||||
|
// 商品列表
|
||||||
|
.list {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
grid-gap: 15rpx;
|
||||||
|
|
||||||
|
.item {
|
||||||
|
border-radius: 20rpx;
|
||||||
|
box-shadow: 0 0 10rpx rgba(0, 0, 0, 0.1);
|
||||||
|
|
||||||
|
// 展示图
|
||||||
|
.image {
|
||||||
|
width: 100%;
|
||||||
|
height: 300rpx;
|
||||||
|
border-radius: 20rpx 20rpx 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 原价
|
||||||
|
.old {
|
||||||
|
text-decoration: line-through;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 折扣
|
||||||
|
.discount {
|
||||||
|
background-color: rgb(255, 241, 240);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,248 @@
|
||||||
|
<script setup>
|
||||||
|
/**
|
||||||
|
* 商城首页
|
||||||
|
*/
|
||||||
|
import {
|
||||||
|
ref,
|
||||||
|
reactive,
|
||||||
|
getCurrentInstance,
|
||||||
|
defineExpose,
|
||||||
|
} from 'vue'
|
||||||
|
// 工具库
|
||||||
|
import util from '@/common/js/util.js'
|
||||||
|
//
|
||||||
|
import api from '@/api/index.js'
|
||||||
|
// 商品列表
|
||||||
|
import productList from '@/components/shop/productList/productList'
|
||||||
|
|
||||||
|
const {
|
||||||
|
proxy
|
||||||
|
} = getCurrentInstance()
|
||||||
|
// 分类
|
||||||
|
const cateList = reactive([{
|
||||||
|
id: '',
|
||||||
|
name: '推荐',
|
||||||
|
}])
|
||||||
|
// 分类下标
|
||||||
|
const cateIndex = ref(0)
|
||||||
|
// 礼物下标
|
||||||
|
const giftCateList = reactive([])
|
||||||
|
// 搜索的关键字
|
||||||
|
const keyword = ref('')
|
||||||
|
|
||||||
|
// 初始化
|
||||||
|
function init() {
|
||||||
|
// 获取普通商品分类
|
||||||
|
getCategory()
|
||||||
|
// 获取礼包分类
|
||||||
|
getGiftCate()
|
||||||
|
// 获取商品
|
||||||
|
proxy.$refs.product.getList()
|
||||||
|
}
|
||||||
|
// 获取商品分类
|
||||||
|
function getCategory() {
|
||||||
|
api.shop.getCategory({
|
||||||
|
query: {
|
||||||
|
// categoryCode: null,
|
||||||
|
},
|
||||||
|
}).then(rs => {
|
||||||
|
if (rs.code === 200) {
|
||||||
|
cateList.length = 1
|
||||||
|
cateList.push(...rs.data)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
util.alert({
|
||||||
|
content: rs.msg,
|
||||||
|
showCancel: false,
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取礼包分类
|
||||||
|
function getGiftCate() {
|
||||||
|
api.shop.getCategory({
|
||||||
|
query: {
|
||||||
|
categoryCode: 'GIFT_PACK',
|
||||||
|
},
|
||||||
|
}).then(rs => {
|
||||||
|
if (rs.code === 200) {
|
||||||
|
giftCateList.length = 0
|
||||||
|
giftCateList.push(...rs.data)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
util.alert({
|
||||||
|
content: rs.msg,
|
||||||
|
showCancel: false,
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 切换分类下标
|
||||||
|
* @param {Object} index
|
||||||
|
*/
|
||||||
|
function handleCateIndex(index) {
|
||||||
|
if (cateIndex.value === index) return
|
||||||
|
cateIndex.value = index
|
||||||
|
// 分类
|
||||||
|
proxy.$refs.product.listPrototype.categoryId = cateList[index].id
|
||||||
|
// 重载列表
|
||||||
|
proxy.$refs.product.refreshList()
|
||||||
|
}
|
||||||
|
|
||||||
|
// 搜索
|
||||||
|
function handleSearch() {
|
||||||
|
// 分类
|
||||||
|
proxy.$refs.product.listPrototype.searchValue = keyword.value
|
||||||
|
// 重载列表
|
||||||
|
proxy.$refs.product.refreshList()
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 更新
|
||||||
|
* @param {Object} item
|
||||||
|
*/
|
||||||
|
function handleGiftCate(item) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/shop/gift'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
init,
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<!-- 轮播图 -->
|
||||||
|
<!-- <swiper class="banner oh" autoplay="true">
|
||||||
|
<swiper-item v-for="(item, index) in 3" :key="index">
|
||||||
|
<view class="item">
|
||||||
|
<image class="poster"
|
||||||
|
src="https://img12.360buyimg.com/babel/jfs/t20271206/247554/11/28097/64155/675290e6F829316f2/0722626e5b28b005.jpg.avif"
|
||||||
|
mode="aspectFill" />
|
||||||
|
</view>
|
||||||
|
</swiper-item>
|
||||||
|
</swiper> -->
|
||||||
|
|
||||||
|
<view class="gift mt30 bfff">
|
||||||
|
<view class="item fdc fmid" :class="{'big': item.categoryCode == 'GIFT_PACK'}"
|
||||||
|
v-for="(item,index) in giftCateList" :key="index" @click="handleGiftCate(item)">
|
||||||
|
<view class="icon">
|
||||||
|
<image class="image" :src="item.image" mode="widthFix" />
|
||||||
|
</view>
|
||||||
|
<view class="mt10 c333 f28">{{item.name}}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="oh bfff">
|
||||||
|
<!-- 功能区 -->
|
||||||
|
<view class="fn rows mtb30 mlr30">
|
||||||
|
<!-- <uni-icons type="scan" class="mr20" size="48rpx" color="#FF7F37" /> -->
|
||||||
|
<view class="searchBox rows f1 ptb10 plr20 bar">
|
||||||
|
<input type="text" v-model="keyword" class="f1" placeholder="请输入关键字" @blur="handleSearch" />
|
||||||
|
<uni-icons type="search" size="30rpx" color="#999" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 滚动条 -->
|
||||||
|
<view class="cate">
|
||||||
|
<scroll-view scroll-x="true" class="scroll f30">
|
||||||
|
<view class="item" v-for="(item,index) in cateList" :key="index"
|
||||||
|
:class="{'active': index === cateIndex}" @click="handleCateIndex(index)">
|
||||||
|
<view class="name ptb20 plr40">{{item.name}}</view>
|
||||||
|
<view class="line"></view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 商品卡片组 加载更多 -->
|
||||||
|
<view class="product oh ptb30 plr30">
|
||||||
|
<productList ref="product" />
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
// 轮播图
|
||||||
|
.banner {
|
||||||
|
height: 180rpx;
|
||||||
|
|
||||||
|
.item {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.poster {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 礼包专区
|
||||||
|
.gift {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item.big {
|
||||||
|
width: 400rpx;
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
width: 240rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.item {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: flex-end;
|
||||||
|
width: 100%;
|
||||||
|
height: 200rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 功能区
|
||||||
|
.fn {
|
||||||
|
.searchBox {
|
||||||
|
background-color: #f3f3f3;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 分类
|
||||||
|
.cate {
|
||||||
|
.scroll {
|
||||||
|
white-space: nowrap;
|
||||||
|
|
||||||
|
.item {
|
||||||
|
display: inline-block;
|
||||||
|
color: #999;
|
||||||
|
transition: .3s;
|
||||||
|
|
||||||
|
.line {
|
||||||
|
width: 0;
|
||||||
|
margin: 0 auto;
|
||||||
|
border-bottom: 3rpx solid #FF7F37;
|
||||||
|
opacity: 0;
|
||||||
|
transition: .3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
color: #FF7F37;
|
||||||
|
font-weight: bold;
|
||||||
|
|
||||||
|
.line {
|
||||||
|
width: 100%;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,13 @@
|
||||||
|
<script setup>
|
||||||
|
// 酒店民宿
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<view class="app">
|
||||||
|
<!-- -->
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,613 @@
|
||||||
|
<script setup>
|
||||||
|
// 店铺入驻
|
||||||
|
/**
|
||||||
|
* 先从首页线下店铺分类选择其中之一身份带过来
|
||||||
|
* 添加一个选择位置的内容
|
||||||
|
*/
|
||||||
|
import {
|
||||||
|
ref,
|
||||||
|
reactive,
|
||||||
|
computed,
|
||||||
|
getCurrentInstance,
|
||||||
|
} from 'vue';
|
||||||
|
import {
|
||||||
|
onLoad,
|
||||||
|
onReady,
|
||||||
|
} from '@dcloudio/uni-app';
|
||||||
|
// vuex
|
||||||
|
import {
|
||||||
|
useStore
|
||||||
|
} from 'vuex'
|
||||||
|
//
|
||||||
|
import api from '@/api/index.js';
|
||||||
|
// 工具库
|
||||||
|
import util from '@/common/js/util.js'
|
||||||
|
// 选择省市区
|
||||||
|
import regionSelection from '@/components/public/regionSelection/regionSelection.vue';
|
||||||
|
// 二级密码验证
|
||||||
|
import payPwd from '@/components/mine/payPwd.vue'
|
||||||
|
//
|
||||||
|
const store = useStore()
|
||||||
|
const {
|
||||||
|
proxy
|
||||||
|
} = getCurrentInstance();
|
||||||
|
// 表单
|
||||||
|
const form = reactive({
|
||||||
|
rectangleLogo: '',
|
||||||
|
qualificationPicture: [],
|
||||||
|
idCardFront: '',
|
||||||
|
idCardBack: '',
|
||||||
|
})
|
||||||
|
// 当前模式 code 0待缴纳1待申请2待审核3已通过4已拒绝 form表单
|
||||||
|
const mode = reactive({
|
||||||
|
code: 0,
|
||||||
|
})
|
||||||
|
// 文本内容
|
||||||
|
const content = ref({})
|
||||||
|
// 字典列表
|
||||||
|
const dictList = reactive([])
|
||||||
|
// 选择下标分类
|
||||||
|
const dictIndex = ref('')
|
||||||
|
// 二级密码回调
|
||||||
|
const pwdCb = ref('')
|
||||||
|
// 用户信息
|
||||||
|
const userinfo = computed(() => store.state.userinfo)
|
||||||
|
// 系统配置
|
||||||
|
const config = computed(() => store.state.config)
|
||||||
|
|
||||||
|
onLoad(() => {
|
||||||
|
// 获取店铺入驻状态
|
||||||
|
getShopStatus()
|
||||||
|
})
|
||||||
|
|
||||||
|
onReady(() => {
|
||||||
|
// 测试缴纳接口
|
||||||
|
// callPwd('depositsPay')
|
||||||
|
})
|
||||||
|
|
||||||
|
// 获取表单信息
|
||||||
|
function getForm() {
|
||||||
|
Promise.all([getDetail(), getDict()]).then(rs => {
|
||||||
|
// 获取详情
|
||||||
|
const detail = rs[0]
|
||||||
|
// 获取字典分类
|
||||||
|
const dict = rs[1]
|
||||||
|
if (!detail) return
|
||||||
|
form.id = detail.id
|
||||||
|
form.rectangleLogo = detail.rectangleLogo
|
||||||
|
form.qualificationPicture = detail.qualificationPicture.split(',')
|
||||||
|
form.idCardFront = detail.idCardFront
|
||||||
|
form.idCardBack = detail.idCardBack
|
||||||
|
form.name = detail.name
|
||||||
|
form.phone = detail.phone
|
||||||
|
form.addressDetail = detail.addressDetail
|
||||||
|
form.categoryId = detail.categoryId
|
||||||
|
form.province = detail.province
|
||||||
|
form.city = detail.city
|
||||||
|
form.district = detail.district
|
||||||
|
// 赋值
|
||||||
|
dictIndex.value = dict.findIndex(item => item.id == detail.categoryId)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取申请信息
|
||||||
|
function getDetail() {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
api.shop.getStoreDetail().then(rs => {
|
||||||
|
if (rs.code == 200) {
|
||||||
|
resolve(rs.data)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
util.alert({
|
||||||
|
showCancel: false,
|
||||||
|
content: rs.msg,
|
||||||
|
})
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 切换模式code
|
||||||
|
function handleModeCode(code) {
|
||||||
|
// 模式
|
||||||
|
mode.code = code
|
||||||
|
switch (code) {
|
||||||
|
case 0:
|
||||||
|
// 获取文章
|
||||||
|
getarticle()
|
||||||
|
break;
|
||||||
|
case 1:
|
||||||
|
// 获取文章
|
||||||
|
getarticle()
|
||||||
|
break;
|
||||||
|
case 'form':
|
||||||
|
// 获取表单信息
|
||||||
|
getForm()
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取字典分类
|
||||||
|
function getDict() {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
api.shop.categoryAll({}).then(rs => {
|
||||||
|
if (rs.code == 200) {
|
||||||
|
resolve(rs.data)
|
||||||
|
dictList.length = 0
|
||||||
|
dictList.push(...rs.data)
|
||||||
|
resolve()
|
||||||
|
return
|
||||||
|
}
|
||||||
|
util.alert({
|
||||||
|
showCancel: false,
|
||||||
|
content: rs.msg,
|
||||||
|
})
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取店铺入驻状态
|
||||||
|
function getShopStatus() {
|
||||||
|
api.shop.getShopStatus().then(rs => {
|
||||||
|
if (rs.code == 200) {
|
||||||
|
Object.assign(mode, rs.data)
|
||||||
|
handleModeCode(mode.code)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
util.alert({
|
||||||
|
showCancel: false,
|
||||||
|
content: rs.msg,
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 店铺缴纳押金
|
||||||
|
function depositsPay() {
|
||||||
|
api.shop.depositsPay().then(rs => {
|
||||||
|
if (rs.code == 200) {
|
||||||
|
// 修改状态 变为已缴纳
|
||||||
|
mode.code = 1
|
||||||
|
return
|
||||||
|
}
|
||||||
|
util.alert({
|
||||||
|
showCancel: false,
|
||||||
|
content: rs.msg,
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取文章
|
||||||
|
function getarticle() {
|
||||||
|
api.getArticle({
|
||||||
|
query: {
|
||||||
|
agreementId: 4,
|
||||||
|
},
|
||||||
|
}).then(rs => {
|
||||||
|
if (rs.code == 200) {
|
||||||
|
content.value = rs.data
|
||||||
|
return
|
||||||
|
}
|
||||||
|
util.alert({
|
||||||
|
showCancel: false,
|
||||||
|
content: rs.msg,
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 上传图片
|
||||||
|
* @param {String} key 键值
|
||||||
|
* @param {String} type 类型 1单 2多
|
||||||
|
*/
|
||||||
|
function uploadImg(key, type) {
|
||||||
|
util.upload_image({
|
||||||
|
value: form[key],
|
||||||
|
success: rs => {
|
||||||
|
switch (type) {
|
||||||
|
case 1:
|
||||||
|
form[key] = rs.value
|
||||||
|
break
|
||||||
|
case 2:
|
||||||
|
form[key].push(rs.value)
|
||||||
|
break
|
||||||
|
}
|
||||||
|
},
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 移除文件
|
||||||
|
* @param {Number} index 下标
|
||||||
|
* @param {String} key 键
|
||||||
|
*/
|
||||||
|
function removeMedia(index, key) {
|
||||||
|
util.alert({
|
||||||
|
content: '确认删除？',
|
||||||
|
}).then(rs => {
|
||||||
|
if (rs.confirm) form[key].splice(index, 1)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 选择省市区
|
||||||
|
* @param {Object} ev
|
||||||
|
*/
|
||||||
|
function handleRegion(ev) {
|
||||||
|
console.log('handleRegion', ev)
|
||||||
|
form.province = ev.province.regionName
|
||||||
|
form.city = ev.city.regionName
|
||||||
|
form.district = ev.area.regionName
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 切换产品分类
|
||||||
|
* @param {Object} ev 默认事件
|
||||||
|
*/
|
||||||
|
function handleDict(ev) {
|
||||||
|
if (!ev || typeof ev.detail.value === 'undefined') {
|
||||||
|
console.error('Invalid event object or missing value');
|
||||||
|
return
|
||||||
|
}
|
||||||
|
const index = ev.detail.value;
|
||||||
|
if (index === dictIndex.value) return;
|
||||||
|
if (index >= 0 && index < dictList.length) {
|
||||||
|
dictIndex.value = index;
|
||||||
|
form.categoryId = dictList[index].id;
|
||||||
|
} else {
|
||||||
|
console.error('Invalid index:', index);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 店铺入驻
|
||||||
|
function handleSubmit() {
|
||||||
|
const data = {
|
||||||
|
...form
|
||||||
|
}
|
||||||
|
console.log('data', data)
|
||||||
|
|
||||||
|
// 验证必填项
|
||||||
|
if (!data.rectangleLogo) {
|
||||||
|
util.alert('店铺头像不能为空')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!data.name) {
|
||||||
|
util.alert('店铺名称不能为空')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!data.phone) {
|
||||||
|
util.alert('联系方式不能为空')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!data.province) {
|
||||||
|
util.alert('产品所在地不能为空')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!data.categoryId) {
|
||||||
|
util.alert('产品类别不能为空')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!data.qualificationPicture[0]) {
|
||||||
|
util.alert('营业执照不能为空')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!data.idCardFront) {
|
||||||
|
util.alert('身份证正面不能为空')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!data.idCardBack) {
|
||||||
|
util.alert('身份证反面不能为空')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
// 营业执照
|
||||||
|
data.qualificationPicture = data.qualificationPicture.join(',')
|
||||||
|
|
||||||
|
api.shop.application({
|
||||||
|
data: data,
|
||||||
|
}).then(rs => {
|
||||||
|
if (rs.code === 200) {
|
||||||
|
util.alert({
|
||||||
|
content: '资料已申请，请等待后台审核',
|
||||||
|
showCancel: false,
|
||||||
|
}).then(rs => {
|
||||||
|
uni.navigateBack()
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
util.alert({
|
||||||
|
content: rs.msg,
|
||||||
|
showCancel: false,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 退出缴纳押金
|
||||||
|
function outDepositsPayAlt() {
|
||||||
|
util.alert({
|
||||||
|
content: '确认缴纳押金并放弃店铺身份？',
|
||||||
|
}).then(rs => {
|
||||||
|
if (!rs.confirm) return
|
||||||
|
// 调用二级密码
|
||||||
|
callPwd('outDepositsPay')
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 店铺退出押金
|
||||||
|
function outDepositsPay() {
|
||||||
|
// 店铺退出押金
|
||||||
|
api.shop.outDepositsPay().then(rs => {
|
||||||
|
if (rs.code == 200) {
|
||||||
|
// 修改状态 变为待缴纳
|
||||||
|
handleModeCode(0)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
util.alert({
|
||||||
|
showCancel: false,
|
||||||
|
content: rs.msg,
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 调用二级密码
|
||||||
|
* @param {Object} key 后续方法key
|
||||||
|
*/
|
||||||
|
function callPwd(key) {
|
||||||
|
util.isAuth({
|
||||||
|
success: () => {
|
||||||
|
pwdCb.value = {
|
||||||
|
// 缴纳押金
|
||||||
|
'depositsPay': depositsPay,
|
||||||
|
// 取消押金并退出店铺身份
|
||||||
|
'outDepositsPay': outDepositsPay,
|
||||||
|
} [key]
|
||||||
|
console.log('pwdCb', pwdCb.value)
|
||||||
|
// 拉起弹窗
|
||||||
|
proxy.$refs.payPwdRef.open()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 二级密码验证
|
||||||
|
function handlePayPwd() {
|
||||||
|
// 执行二级密码确认回调
|
||||||
|
pwdCb.value()
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<!-- 须知 -->
|
||||||
|
<template v-if="[0,1].includes(mode.code)">
|
||||||
|
<view class="app">
|
||||||
|
<view class="notice oh mtb30 mlr30 plr30 ptb20 bfff br20">
|
||||||
|
<view class="title tac f34 c333 b">店铺入驻须知</view>
|
||||||
|
<view class="content mtb50">
|
||||||
|
<rich-text :nodes="content.content"></rich-text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="tac c666 f28">继续即代表同意《店铺入驻须知》</view>
|
||||||
|
|
||||||
|
<view class="fill" style="height: 160rpx;" />
|
||||||
|
|
||||||
|
<view class="footer plr30 bfff shadow">
|
||||||
|
<!-- 未缴纳押金 -->
|
||||||
|
<template v-if="mode.code == 0">
|
||||||
|
<view class="btn black" @click="callPwd('depositsPay')">缴纳押金</view>
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
|
<view class="rows">
|
||||||
|
<view class="btn cancel plr30" @click="outDepositsPayAlt">退回押金</view>
|
||||||
|
<view class="btn colourful f1" @click="handleModeCode('form')">申请入驻</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<!-- 待审核 -->
|
||||||
|
<template v-else-if="mode.code == 2">
|
||||||
|
<view class="app">
|
||||||
|
<view class="result ver">
|
||||||
|
<uni-icons type="checkbox-filled" color="#20D200" size="160rpx" />
|
||||||
|
<view class="title mtb30 f34">申请中</view>
|
||||||
|
<view class="value f30">
|
||||||
|
<text class="c333">提交成功，请等待后台审核</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="fill" style="height: 160rpx;"></view>
|
||||||
|
|
||||||
|
<view class="footer rows plr30 bfff shadow">
|
||||||
|
<view class="btn cancel f1" @click="outDepositsPayAlt">取消申请并退回押金</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<!-- 审核驳回 -->
|
||||||
|
<template v-else-if="mode.code == 4">
|
||||||
|
<view class="app">
|
||||||
|
<view class="result ver">
|
||||||
|
<uni-icons type="clear" color="#ff0000" size="160rpx" />
|
||||||
|
<view class="title mtb30 f34">审核驳回</view>
|
||||||
|
<view class="value f30">
|
||||||
|
<text class="c666">驳回原因：</text>
|
||||||
|
<text class="c333">{{mode.msg}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="reject mtb30 c666 f28">
|
||||||
|
<view>驳回结果异议？ 可在个人中心-设置里面联系我们</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="fill" style="height: 160rpx;"></view>
|
||||||
|
|
||||||
|
<view class="footer rows plr30 bfff shadow">
|
||||||
|
<view class="btn cancel plr30" @click="outDepositsPayAlt">退回押金</view>
|
||||||
|
<view class="btn colourful f1" @click="handleModeCode('form')">修改信息</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<!-- 申请成功 -->
|
||||||
|
<template v-else-if="mode.code == 3">
|
||||||
|
<view class="app">
|
||||||
|
<view class="result ver">
|
||||||
|
<uni-icons type="checkbox-filled" color="#20D200" size="160rpx" />
|
||||||
|
<view class="title mtb30 f34">恭喜您，您已成为店铺</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="fill" style="height: 160rpx;"></view>
|
||||||
|
|
||||||
|
<view class="footer plr30 bfff shadow">
|
||||||
|
<view class="btn cancel plr30" @click="outDepositsPayAlt">退回押金并放弃店铺身份</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<!-- 表单申请 -->
|
||||||
|
<template v-else-if="mode.code == 'form'">
|
||||||
|
<view class="appbw plr30">
|
||||||
|
<!-- 头像 -->
|
||||||
|
<view class="avatarBox ver mt50">
|
||||||
|
<view class="avatar oh pr wh220 br20" @click="uploadImg('rectangleLogo',1)">
|
||||||
|
<image class="img br20" :src="form.rectangleLogo" mode="aspectFill" v-if="form.rectangleLogo" />
|
||||||
|
<view class="pfull fmid" v-else>
|
||||||
|
<uni-icons type="plusempty" color="#999" size="80rpx" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="name mt20 c666 f24">店铺头像</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 表单 -->
|
||||||
|
<view class="form mt60 c333 f32">
|
||||||
|
<view class="title f36">我的资料</view>
|
||||||
|
|
||||||
|
<view class="item rows ptb20">
|
||||||
|
<view class="key c666">店铺名称</view>
|
||||||
|
<view class="value f1 ml20 tar">
|
||||||
|
<input v-model="form.name" type="text" placeholder="请输入店铺名称" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="item rows ptb20">
|
||||||
|
<view class="key c666">联系方式</view>
|
||||||
|
<view class="value f1 ml20 tar">
|
||||||
|
<input v-model="form.phone" type="number" placeholder="请输入联系方式" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="item rows ptb20" @click="$refs.regionSelectionRef.open()">
|
||||||
|
<view class="key c666">产品所在地</view>
|
||||||
|
<view class="value f1 ml20 tar">
|
||||||
|
<!-- 省市区选择 -->
|
||||||
|
<regionSelection ref="regionSelectionRef" :province="form.province" :city="form.city"
|
||||||
|
:area="form.district" @change="handleRegion" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="item rows ptb20">
|
||||||
|
<view class="key c666">详细所在地</view>
|
||||||
|
<view class="value f1 ml20 tar">
|
||||||
|
<input v-model="form.addressDetail" type="text" placeholder="请选择产品所在地" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="item ptb20">
|
||||||
|
<picker :range="dictList" range-key="name" :vlaue="dictIndex" @change="handleDict">
|
||||||
|
<view class="rows">
|
||||||
|
<view class="key c666">产品类别</view>
|
||||||
|
<view class="value f1 ml20 tar">
|
||||||
|
<text class="placeholderStyle" v-if="dictIndex === ''">请选择产品类别</text>
|
||||||
|
<text v-else>{{dictList[dictIndex].name}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</picker>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="item ptb20">
|
||||||
|
<view class="key c666">营业执照</view>
|
||||||
|
<view class="value imgList f1 mt20 tar">
|
||||||
|
<view class="imgs wh200" v-for="(item, index) in form.qualificationPicture" :key="index">
|
||||||
|
<image class="img br10" :src="item" mode="aspectFill" />
|
||||||
|
<view class="close" @click="removeMedia(index,'qualificationPicture')">
|
||||||
|
<uni-icons type="clear" size="50rpx" color="#f00" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="upload imgs fmid wh200 br10" @click="uploadImg('qualificationPicture',2)">
|
||||||
|
<uni-icons type="plusempty" color="#E8E8E8" size="80rpx" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="item ptb20">
|
||||||
|
<view class="key c666">身份证正面</view>
|
||||||
|
<view class="value imgList f1 mt20 tar">
|
||||||
|
<view class="imgs wh200" v-if="form.idCardFront" @click="uploadImg('idCardFront',1)">
|
||||||
|
<image class="img br10" :src="form.idCardFront" mode="aspectFill" />
|
||||||
|
</view>
|
||||||
|
<view class="upload imgs fmid wh200 br10" v-else @click="uploadImg('idCardFront',1)">
|
||||||
|
<uni-icons type="plusempty" color="#E8E8E8" size="80rpx" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="item ptb20">
|
||||||
|
<view class="key c666">身份证反面</view>
|
||||||
|
<view class="value imgList f1 mt20 tar">
|
||||||
|
<view class="imgs wh200" v-if="form.idCardBack" @click="uploadImg('idCardBack',1)">
|
||||||
|
<image class="img br10" :src="form.idCardBack" mode="aspectFill" />
|
||||||
|
</view>
|
||||||
|
<view class="upload imgs fmid wh200 br10" v-else @click="uploadImg('idCardBack',1)">
|
||||||
|
<uni-icons type="plusempty" color="#E8E8E8" size="80rpx" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="fill" style="height: 150rpx;"></view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="footer plr30 bfff shadow">
|
||||||
|
<view class="rows">
|
||||||
|
<view class="btn cancel plr30" @click="outDepositsPayAlt">退回押金</view>
|
||||||
|
<view class="btn colourful f1" @click="handleSubmit">申请入驻</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<!-- 二级密码 -->
|
||||||
|
<payPwd ref="payPwdRef" :check="true" :price="config.DEPOSIT_ALLOCATION" @confirm="handlePayPwd" />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 头像
|
||||||
|
.avatar {
|
||||||
|
background-color: #F6F8FE;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 上传
|
||||||
|
.upload {
|
||||||
|
background-color: #f4f4ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 审核结果
|
||||||
|
.result {
|
||||||
|
margin-top: 30rpx;
|
||||||
|
padding: 50rpx 0;
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 发布
|
||||||
|
.menu {
|
||||||
|
.line {
|
||||||
|
padding: 20rpx 10rpx;
|
||||||
|
|
||||||
|
&+.line {
|
||||||
|
border-top: 2rpx solid #eee;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -1,12 +1,5 @@
|
||||||
<script setup>
|
<script setup>
|
||||||
/**
|
// 平台入驻
|
||||||
* 商家入驻
|
|
||||||
* 进入页面获取最新的数据 如果发生变化 同步用户信息
|
|
||||||
* 1 待申请 显示入驻须知 是否缴纳押金
|
|
||||||
* 2 已申请/待审核 已缴纳押金并且提交表单
|
|
||||||
* 3 审核驳回 可选择取消押金 或 修改表单内容继续提交审核
|
|
||||||
* 4 审核成功 已成为商家 可选择取消商家身份 拿回押金 修改店铺信息重新提交审核
|
|
||||||
*/
|
|
||||||
import {
|
import {
|
||||||
ref,
|
ref,
|
||||||
reactive,
|
reactive,
|
||||||
|
|
@ -25,559 +18,75 @@
|
||||||
import api from '@/api/index.js';
|
import api from '@/api/index.js';
|
||||||
// 工具库
|
// 工具库
|
||||||
import util from '@/common/js/util.js'
|
import util from '@/common/js/util.js'
|
||||||
// 选择省市区
|
|
||||||
import regionSelection from '@/components/public/regionSelection/regionSelection.vue';
|
|
||||||
// 二级密码验证
|
|
||||||
import payPwd from '@/components/mine/payPwd.vue'
|
|
||||||
//
|
//
|
||||||
const store = useStore()
|
const store = useStore()
|
||||||
const {
|
const {
|
||||||
proxy
|
proxy
|
||||||
} = getCurrentInstance();
|
} = getCurrentInstance()
|
||||||
// 表单
|
// 身份选择列表
|
||||||
const form = reactive({
|
const identityList = reactive([{
|
||||||
rectangleLogo: '',
|
icon: '/static/store1.png',
|
||||||
qualificationPicture: [],
|
name: '商家入驻',
|
||||||
idCardFront: '',
|
url: '/pages/shop/store/settled',
|
||||||
idCardBack: '',
|
},
|
||||||
})
|
{
|
||||||
// 当前模式 code 0待缴纳1待申请2待审核3已通过4已拒绝 form表单
|
icon: '/static/store2.png',
|
||||||
const mode = reactive({
|
name: '线下店铺入驻',
|
||||||
code: 0,
|
url: '/pages/shop/offline/settled',
|
||||||
})
|
}
|
||||||
// 文本内容
|
])
|
||||||
const content = ref({})
|
// 身份选择下标
|
||||||
// 字典列表
|
const identityIndex = ref(0)
|
||||||
const dictList = reactive([])
|
|
||||||
// 选择下标分类
|
|
||||||
const dictIndex = ref('')
|
|
||||||
// 二级密码回调
|
|
||||||
const pwdCb = ref('')
|
|
||||||
// 用户信息
|
// 用户信息
|
||||||
const userinfo = computed(() => store.state.userinfo)
|
const userinfo = computed(() => store.state.userinfo)
|
||||||
// 系统配置
|
|
||||||
const config = computed(() => store.state.config)
|
|
||||||
|
|
||||||
onLoad(() => {
|
onLoad(() => {
|
||||||
// 获取商家入驻状态
|
//
|
||||||
getShopStatus()
|
|
||||||
})
|
})
|
||||||
|
|
||||||
onReady(() => {
|
|
||||||
// 测试缴纳接口
|
|
||||||
// callPwd('depositsPay')
|
|
||||||
})
|
|
||||||
|
|
||||||
// 获取表单信息
|
|
||||||
function getForm() {
|
|
||||||
Promise.all([getDetail(), getDict()]).then(rs => {
|
|
||||||
// 获取详情
|
|
||||||
const detail = rs[0]
|
|
||||||
// 获取字典分类
|
|
||||||
const dict = rs[1]
|
|
||||||
if (!detail) return
|
|
||||||
form.id = detail.id
|
|
||||||
form.rectangleLogo = detail.rectangleLogo
|
|
||||||
form.qualificationPicture = detail.qualificationPicture.split(',')
|
|
||||||
form.idCardFront = detail.idCardFront
|
|
||||||
form.idCardBack = detail.idCardBack
|
|
||||||
form.name = detail.name
|
|
||||||
form.phone = detail.phone
|
|
||||||
form.addressDetail = detail.addressDetail
|
|
||||||
form.categoryId = detail.categoryId
|
|
||||||
form.province = detail.province
|
|
||||||
form.city = detail.city
|
|
||||||
form.district = detail.district
|
|
||||||
// 赋值
|
|
||||||
dictIndex.value = dict.findIndex(item => item.id == detail.categoryId)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取申请信息
|
|
||||||
function getDetail() {
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
api.shop.getStoreDetail().then(rs => {
|
|
||||||
if (rs.code == 200) {
|
|
||||||
resolve(rs.data)
|
|
||||||
return
|
|
||||||
}
|
|
||||||
util.alert({
|
|
||||||
showCancel: false,
|
|
||||||
content: rs.msg,
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// 切换模式code
|
|
||||||
function handleModeCode(code) {
|
|
||||||
// 模式
|
|
||||||
mode.code = code
|
|
||||||
switch (code) {
|
|
||||||
case 0:
|
|
||||||
// 获取文章
|
|
||||||
getarticle()
|
|
||||||
break;
|
|
||||||
case 1:
|
|
||||||
// 获取文章
|
|
||||||
getarticle()
|
|
||||||
break;
|
|
||||||
case 'form':
|
|
||||||
// 获取表单信息
|
|
||||||
getForm()
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取字典分类
|
|
||||||
function getDict() {
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
api.shop.categoryAll({}).then(rs => {
|
|
||||||
if (rs.code == 200) {
|
|
||||||
resolve(rs.data)
|
|
||||||
dictList.length = 0
|
|
||||||
dictList.push(...rs.data)
|
|
||||||
resolve()
|
|
||||||
return
|
|
||||||
}
|
|
||||||
util.alert({
|
|
||||||
showCancel: false,
|
|
||||||
content: rs.msg,
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取商家入驻状态
|
|
||||||
function getShopStatus() {
|
|
||||||
api.shop.getShopStatus().then(rs => {
|
|
||||||
if (rs.code == 200) {
|
|
||||||
Object.assign(mode, rs.data)
|
|
||||||
handleModeCode(mode.code)
|
|
||||||
return
|
|
||||||
}
|
|
||||||
util.alert({
|
|
||||||
showCancel: false,
|
|
||||||
content: rs.msg,
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// 商家缴纳押金
|
|
||||||
function depositsPay() {
|
|
||||||
api.shop.depositsPay().then(rs => {
|
|
||||||
if (rs.code == 200) {
|
|
||||||
// 修改状态 变为已缴纳
|
|
||||||
mode.code = 1
|
|
||||||
return
|
|
||||||
}
|
|
||||||
util.alert({
|
|
||||||
showCancel: false,
|
|
||||||
content: rs.msg,
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取文章
|
|
||||||
function getarticle() {
|
|
||||||
api.getArticle({
|
|
||||||
query: {
|
|
||||||
agreementId: 4,
|
|
||||||
},
|
|
||||||
}).then(rs => {
|
|
||||||
if (rs.code == 200) {
|
|
||||||
content.value = rs.data
|
|
||||||
return
|
|
||||||
}
|
|
||||||
util.alert({
|
|
||||||
showCancel: false,
|
|
||||||
content: rs.msg,
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 上传图片
|
* 选择身份
|
||||||
* @param {String} key 键值
|
* @param {Object} index
|
||||||
* @param {String} type 类型 1单 2多
|
|
||||||
*/
|
*/
|
||||||
function uploadImg(key, type) {
|
function handleIdentityIndex(index) {
|
||||||
util.upload_image({
|
if (identityIndex.value === index) return
|
||||||
value: form[key],
|
identityIndex.value = index
|
||||||
success: rs => {
|
}
|
||||||
switch (type) {
|
|
||||||
case 1:
|
// 下一步
|
||||||
form[key] = rs.value
|
function handleNext() {
|
||||||
break
|
uni.navigateTo({
|
||||||
case 2:
|
url: identityList[identityIndex.value].url
|
||||||
form[key].push(rs.value)
|
|
||||||
break
|
|
||||||
}
|
|
||||||
},
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* 移除文件
|
|
||||||
* @param {Number} index 下标
|
|
||||||
* @param {String} key 键
|
|
||||||
*/
|
|
||||||
function removeMedia(index, key) {
|
|
||||||
util.alert({
|
|
||||||
content: '确认删除？',
|
|
||||||
}).then(rs => {
|
|
||||||
if (rs.confirm) form[key].splice(index, 1)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 选择省市区
|
|
||||||
* @param {Object} ev
|
|
||||||
*/
|
|
||||||
function handleRegion(ev) {
|
|
||||||
console.log('handleRegion', ev)
|
|
||||||
form.province = ev.province.regionName
|
|
||||||
form.city = ev.city.regionName
|
|
||||||
form.district = ev.area.regionName
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 切换产品分类
|
|
||||||
* @param {Object} ev 默认事件
|
|
||||||
*/
|
|
||||||
function handleDict(ev) {
|
|
||||||
if (!ev || typeof ev.detail.value === 'undefined') {
|
|
||||||
console.error('Invalid event object or missing value');
|
|
||||||
return
|
|
||||||
}
|
|
||||||
const index = ev.detail.value;
|
|
||||||
if (index === dictIndex.value) return;
|
|
||||||
if (index >= 0 && index < dictList.length) {
|
|
||||||
dictIndex.value = index;
|
|
||||||
form.categoryId = dictList[index].id;
|
|
||||||
} else {
|
|
||||||
console.error('Invalid index:', index);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 商家入驻
|
|
||||||
function handleSubmit() {
|
|
||||||
const data = {
|
|
||||||
...form
|
|
||||||
}
|
|
||||||
console.log('data', data)
|
|
||||||
|
|
||||||
// 验证必填项
|
|
||||||
if (!data.rectangleLogo) {
|
|
||||||
util.alert('商家头像不能为空')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if (!data.name) {
|
|
||||||
util.alert('商家名称不能为空')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if (!data.phone) {
|
|
||||||
util.alert('联系方式不能为空')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if (!data.province) {
|
|
||||||
util.alert('产品所在地不能为空')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if (!data.categoryId) {
|
|
||||||
util.alert('产品类别不能为空')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if (!data.qualificationPicture[0]) {
|
|
||||||
util.alert('营业执照不能为空')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if (!data.idCardFront) {
|
|
||||||
util.alert('身份证正面不能为空')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if (!data.idCardBack) {
|
|
||||||
util.alert('身份证反面不能为空')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
// 营业执照
|
|
||||||
data.qualificationPicture = data.qualificationPicture.join(',')
|
|
||||||
|
|
||||||
api.shop.application({
|
|
||||||
data: data,
|
|
||||||
}).then(rs => {
|
|
||||||
if (rs.code === 200) {
|
|
||||||
util.alert({
|
|
||||||
content: '资料已申请，请等待后台审核',
|
|
||||||
showCancel: false,
|
|
||||||
}).then(rs => {
|
|
||||||
uni.navigateBack()
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
util.alert({
|
|
||||||
content: rs.msg,
|
|
||||||
showCancel: false,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// 退出缴纳押金
|
|
||||||
function outDepositsPayAlt() {
|
|
||||||
util.alert({
|
|
||||||
content: '确认缴纳押金并放弃商家身份？',
|
|
||||||
}).then(rs => {
|
|
||||||
if (!rs.confirm) return
|
|
||||||
// 调用二级密码
|
|
||||||
callPwd('outDepositsPay')
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// 商家退出押金
|
|
||||||
function outDepositsPay() {
|
|
||||||
// 商家退出押金
|
|
||||||
api.shop.outDepositsPay().then(rs => {
|
|
||||||
if (rs.code == 200) {
|
|
||||||
// 修改状态 变为待缴纳
|
|
||||||
handleModeCode(0)
|
|
||||||
return
|
|
||||||
}
|
|
||||||
util.alert({
|
|
||||||
showCancel: false,
|
|
||||||
content: rs.msg,
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 调用二级密码
|
|
||||||
* @param {Object} key 后续方法key
|
|
||||||
*/
|
|
||||||
function callPwd(key) {
|
|
||||||
util.isAuth({
|
|
||||||
success: () => {
|
|
||||||
pwdCb.value = {
|
|
||||||
// 缴纳押金
|
|
||||||
'depositsPay': depositsPay,
|
|
||||||
// 取消押金并退出商家身份
|
|
||||||
'outDepositsPay': outDepositsPay,
|
|
||||||
} [key]
|
|
||||||
console.log('pwdCb', pwdCb.value)
|
|
||||||
// 拉起弹窗
|
|
||||||
proxy.$refs.payPwdRef.open()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// 二级密码验证
|
|
||||||
function handlePayPwd() {
|
|
||||||
// 执行二级密码确认回调
|
|
||||||
pwdCb.value()
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<!-- 须知 -->
|
<view class="app">
|
||||||
<template v-if="[0,1].includes(mode.code)">
|
<view class="list">
|
||||||
<view class="app">
|
<view class="item fmid mtb30 mlr30 ptb20 br20 bfff" v-for="(item,index) in identityList" :key="index"
|
||||||
<view class="notice oh mtb30 mlr30 plr30 ptb20 bfff br20">
|
:class="{'active': index === identityIndex}" @click="handleIdentityIndex(index)">
|
||||||
<view class="title tac f34 c333 b">商家入驻须知</view>
|
<image class="wh50" :src="item.icon" mode="aspectFit" />
|
||||||
<view class="content mtb50">
|
|
||||||
<rich-text :nodes="content.content"></rich-text>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="tac c666 f28">继续即代表同意《商家入驻须知》</view>
|
<view class="name wsn mlr20 c333">{{item.name}}</view>
|
||||||
|
|
||||||
<view class="fill" style="height: 160rpx;" />
|
<template v-if="index === identityIndex">
|
||||||
|
<uni-icons type="circle-filled" color="#3d3d3d" />
|
||||||
<view class="footer plr30 bfff shadow">
|
|
||||||
<!-- 未缴纳押金 -->
|
|
||||||
<template v-if="mode.code == 0">
|
|
||||||
<view class="btn black" @click="callPwd('depositsPay')">缴纳押金</view>
|
|
||||||
</template>
|
</template>
|
||||||
<template v-else>
|
<template v-else>
|
||||||
<view class="rows">
|
<uni-icons type="circle" color="#D8D8D8" />
|
||||||
<view class="btn cancel plr30" @click="outDepositsPayAlt">退回押金</view>
|
|
||||||
<view class="btn colourful f1" @click="handleModeCode('form')">申请入驻</view>
|
|
||||||
</view>
|
|
||||||
</template>
|
</template>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
|
||||||
|
|
||||||
<!-- 待审核 -->
|
<view class="fill" style="height: 150rpx;"></view>
|
||||||
<template v-else-if="mode.code == 2">
|
|
||||||
<view class="app">
|
|
||||||
<view class="result ver">
|
|
||||||
<uni-icons type="checkbox-filled" color="#20D200" size="160rpx" />
|
|
||||||
<view class="title mtb30 f34">申请中</view>
|
|
||||||
<view class="value f30">
|
|
||||||
<text class="c333">提交成功，请等待后台审核</text>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="fill" style="height: 160rpx;"></view>
|
<view class="footer plr30 bfff">
|
||||||
|
<view class="btn lg black" @click="handleNext">下一步</view>
|
||||||
<view class="footer rows plr30 bfff shadow">
|
|
||||||
<view class="btn cancel f1" @click="outDepositsPayAlt">取消申请并退回押金</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</view>
|
||||||
|
|
||||||
<!-- 审核驳回 -->
|
|
||||||
<template v-else-if="mode.code == 4">
|
|
||||||
<view class="app">
|
|
||||||
<view class="result ver">
|
|
||||||
<uni-icons type="clear" color="#ff0000" size="160rpx" />
|
|
||||||
<view class="title mtb30 f34">审核驳回</view>
|
|
||||||
<view class="value f30">
|
|
||||||
<text class="c666">驳回原因：</text>
|
|
||||||
<text class="c333">{{mode.msg}}</text>
|
|
||||||
</view>
|
|
||||||
<view class="reject mtb30 c666 f28">
|
|
||||||
<view>驳回结果异议？ 可在个人中心-设置里面联系我们</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="fill" style="height: 160rpx;"></view>
|
|
||||||
|
|
||||||
<view class="footer rows plr30 bfff shadow">
|
|
||||||
<view class="btn cancel plr30" @click="outDepositsPayAlt">退回押金</view>
|
|
||||||
<view class="btn colourful f1" @click="handleModeCode('form')">修改信息</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<!-- 申请成功 -->
|
|
||||||
<template v-else-if="mode.code == 3">
|
|
||||||
<view class="app">
|
|
||||||
<view class="result ver">
|
|
||||||
<uni-icons type="checkbox-filled" color="#20D200" size="160rpx" />
|
|
||||||
<view class="title mtb30 f34">恭喜您，您已成为商家</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="fill" style="height: 160rpx;"></view>
|
|
||||||
|
|
||||||
<view class="footer plr30 bfff shadow">
|
|
||||||
<view class="btn cancel plr30" @click="outDepositsPayAlt">退回押金并放弃商家身份</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<!-- 表单申请 -->
|
|
||||||
<template v-else-if="mode.code == 'form'">
|
|
||||||
<view class="appbw plr30">
|
|
||||||
<!-- 头像 -->
|
|
||||||
<view class="avatarBox ver mt50">
|
|
||||||
<view class="avatar oh pr wh220 br20" @click="uploadImg('rectangleLogo',1)">
|
|
||||||
<image class="img br20" :src="form.rectangleLogo" mode="aspectFill" v-if="form.rectangleLogo" />
|
|
||||||
<view class="pfull fmid" v-else>
|
|
||||||
<uni-icons type="plusempty" color="#999" size="80rpx" />
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="name mt20 c666 f24">店铺头像</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<!-- 表单 -->
|
|
||||||
<view class="form mt60 c333 f32">
|
|
||||||
<view class="title f36">我的资料</view>
|
|
||||||
|
|
||||||
<view class="item rows ptb20">
|
|
||||||
<view class="key c666">店铺名称</view>
|
|
||||||
<view class="value f1 ml20 tar">
|
|
||||||
<input v-model="form.name" type="text" placeholder="请输入店铺名称" />
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="item rows ptb20">
|
|
||||||
<view class="key c666">联系方式</view>
|
|
||||||
<view class="value f1 ml20 tar">
|
|
||||||
<input v-model="form.phone" type="number" placeholder="请输入联系方式" />
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="item rows ptb20" @click="$refs.regionSelectionRef.open()">
|
|
||||||
<view class="key c666">产品所在地</view>
|
|
||||||
<view class="value f1 ml20 tar">
|
|
||||||
<!-- 省市区选择 -->
|
|
||||||
<regionSelection ref="regionSelectionRef" :province="form.province" :city="form.city"
|
|
||||||
:area="form.district" @change="handleRegion" />
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="item rows ptb20">
|
|
||||||
<view class="key c666">详细所在地</view>
|
|
||||||
<view class="value f1 ml20 tar">
|
|
||||||
<input v-model="form.addressDetail" type="text" placeholder="请选择产品所在地" />
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="item ptb20">
|
|
||||||
<picker :range="dictList" range-key="name" :vlaue="dictIndex" @change="handleDict">
|
|
||||||
<view class="rows">
|
|
||||||
<view class="key c666">产品类别</view>
|
|
||||||
<view class="value f1 ml20 tar">
|
|
||||||
<text class="placeholderStyle" v-if="dictIndex === ''">请选择产品类别</text>
|
|
||||||
<text v-else>{{dictList[dictIndex].name}}</text>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</picker>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="item ptb20">
|
|
||||||
<view class="key c666">营业执照</view>
|
|
||||||
<view class="value imgList f1 mt20 tar">
|
|
||||||
<view class="imgs wh200" v-for="(item, index) in form.qualificationPicture" :key="index">
|
|
||||||
<image class="img br10" :src="item" mode="aspectFill" />
|
|
||||||
<view class="close" @click="removeMedia(index,'qualificationPicture')">
|
|
||||||
<uni-icons type="clear" size="50rpx" color="#f00" />
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="upload imgs fmid wh200 br10" @click="uploadImg('qualificationPicture',2)">
|
|
||||||
<uni-icons type="plusempty" color="#E8E8E8" size="80rpx" />
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="item ptb20">
|
|
||||||
<view class="key c666">身份证正面</view>
|
|
||||||
<view class="value imgList f1 mt20 tar">
|
|
||||||
<view class="imgs wh200" v-if="form.idCardFront" @click="uploadImg('idCardFront',1)">
|
|
||||||
<image class="img br10" :src="form.idCardFront" mode="aspectFill" />
|
|
||||||
</view>
|
|
||||||
<view class="upload imgs fmid wh200 br10" v-else @click="uploadImg('idCardFront',1)">
|
|
||||||
<uni-icons type="plusempty" color="#E8E8E8" size="80rpx" />
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="item ptb20">
|
|
||||||
<view class="key c666">身份证反面</view>
|
|
||||||
<view class="value imgList f1 mt20 tar">
|
|
||||||
<view class="imgs wh200" v-if="form.idCardBack" @click="uploadImg('idCardBack',1)">
|
|
||||||
<image class="img br10" :src="form.idCardBack" mode="aspectFill" />
|
|
||||||
</view>
|
|
||||||
<view class="upload imgs fmid wh200 br10" v-else @click="uploadImg('idCardBack',1)">
|
|
||||||
<uni-icons type="plusempty" color="#E8E8E8" size="80rpx" />
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
</view>
|
|
||||||
<view class="fill" style="height: 150rpx;"></view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="footer plr30 bfff shadow">
|
|
||||||
<view class="rows">
|
|
||||||
<view class="btn cancel plr30" @click="outDepositsPayAlt">退回押金</view>
|
|
||||||
<view class="btn colourful f1" @click="handleSubmit">申请入驻</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<!-- 二级密码 -->
|
|
||||||
<payPwd ref="payPwdRef" :check="true" :price="config.DEPOSIT_ALLOCATION" @confirm="handlePayPwd" />
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
|
|
@ -586,30 +95,11 @@
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
// 头像
|
.list {
|
||||||
.avatar {
|
.item {
|
||||||
background-color: #F6F8FE;
|
.name {
|
||||||
}
|
width: 220rpx;
|
||||||
|
font-size: 34rpx;
|
||||||
// 上传
|
|
||||||
.upload {
|
|
||||||
background-color: #f4f4ff;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 审核结果
|
|
||||||
.result {
|
|
||||||
margin-top: 30rpx;
|
|
||||||
padding: 50rpx 0;
|
|
||||||
background-color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 发布
|
|
||||||
.menu {
|
|
||||||
.line {
|
|
||||||
padding: 20rpx 10rpx;
|
|
||||||
|
|
||||||
&+.line {
|
|
||||||
border-top: 2rpx solid #eee;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,9 @@
|
||||||
import {
|
import {
|
||||||
ref,
|
ref,
|
||||||
reactive,
|
reactive,
|
||||||
getCurrentInstance
|
getCurrentInstance,
|
||||||
|
computed,
|
||||||
|
nextTick
|
||||||
} from 'vue'
|
} from 'vue'
|
||||||
import {
|
import {
|
||||||
onReachBottom,
|
onReachBottom,
|
||||||
|
|
@ -14,12 +16,16 @@
|
||||||
onLoad,
|
onLoad,
|
||||||
onReady,
|
onReady,
|
||||||
} from '@dcloudio/uni-app';
|
} from '@dcloudio/uni-app';
|
||||||
|
// 状态栏
|
||||||
|
import statusBar from '@/components/header/statusBar.vue'
|
||||||
// 工具库
|
// 工具库
|
||||||
import util from '@/common/js/util.js'
|
import util from '@/common/js/util.js'
|
||||||
//
|
//
|
||||||
import api from '@/api/index.js'
|
import api from '@/api/index.js'
|
||||||
// 商品列表
|
// 商城首页
|
||||||
import productList from '@/components/shop/productList/productList'
|
import shopIndex from '@/pages/shop/components/shopIndex.vue'
|
||||||
|
// 线下店铺
|
||||||
|
import offlineIndex from './components/offlineIndex.vue';
|
||||||
//
|
//
|
||||||
import footerMneu from '@/components/footerMenu/footerMenu'
|
import footerMneu from '@/components/footerMenu/footerMenu'
|
||||||
|
|
||||||
|
|
@ -27,36 +33,40 @@
|
||||||
proxy
|
proxy
|
||||||
} = getCurrentInstance()
|
} = getCurrentInstance()
|
||||||
// 分类
|
// 分类
|
||||||
const cateList = reactive([{
|
const navList = reactive([{
|
||||||
id: '',
|
key: 'shop',
|
||||||
name: '推荐',
|
name: '商城',
|
||||||
}])
|
load: false,
|
||||||
|
domRef: 'shopIndexRef',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'offline',
|
||||||
|
name: '线下店铺',
|
||||||
|
load: false,
|
||||||
|
domRef: 'offlineIndexRef',
|
||||||
|
}
|
||||||
|
])
|
||||||
// 分类下标
|
// 分类下标
|
||||||
const cateIndex = ref(0)
|
const navIndex = ref('')
|
||||||
// 礼物下标
|
// 当前导航项
|
||||||
const giftCateList = reactive([])
|
const navCurrent = computed(() => navList[navIndex.value] || {})
|
||||||
// 搜索的关键字
|
|
||||||
const keyword = ref('')
|
|
||||||
|
|
||||||
onLoad(() => {
|
onLoad(() => {
|
||||||
// 获取普通商品分类
|
handleNavIndex(1)
|
||||||
getCategory()
|
|
||||||
// 获取礼包分类
|
|
||||||
getGiftCate()
|
|
||||||
})
|
})
|
||||||
|
|
||||||
onReady(() => {
|
onReady(() => {
|
||||||
proxy.$refs.product.getList()
|
// proxy.$refs.product.getList()
|
||||||
})
|
})
|
||||||
|
|
||||||
onReachBottom(() => {
|
onReachBottom(() => {
|
||||||
// 重载列表
|
// 重载列表
|
||||||
proxy.$refs.product.getMoreList()
|
// proxy.$refs.product.getMoreList()
|
||||||
})
|
})
|
||||||
|
|
||||||
onPullDownRefresh(() => {
|
onPullDownRefresh(() => {
|
||||||
// 重载列表
|
// 重载列表
|
||||||
proxy.$refs.product.refreshList()
|
// proxy.$refs.product.refreshList()
|
||||||
})
|
})
|
||||||
|
|
||||||
onShow(() => {
|
onShow(() => {
|
||||||
|
|
@ -64,125 +74,45 @@
|
||||||
uni.$emit('changeMine', 'shop')
|
uni.$emit('changeMine', 'shop')
|
||||||
})
|
})
|
||||||
|
|
||||||
// 获取商品分类
|
// 切换导航
|
||||||
function getCategory() {
|
function handleNavIndex(index) {
|
||||||
api.shop.getCategory({
|
if (navIndex.value === index) return
|
||||||
query: {
|
navIndex.value = index
|
||||||
// categoryCode: null,
|
navCurrent.value.load = true
|
||||||
},
|
|
||||||
}).then(rs => {
|
|
||||||
if (rs.code === 200) {
|
|
||||||
cateList.length = 1
|
|
||||||
cateList.push(...rs.data)
|
|
||||||
return
|
|
||||||
}
|
|
||||||
util.alert({
|
|
||||||
content: rs.msg,
|
|
||||||
showCancel: false,
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取礼包分类
|
nextTick(() => {
|
||||||
function getGiftCate() {
|
if (navCurrent.value.domRef) proxy.$refs[navCurrent.value.domRef].init()
|
||||||
api.shop.getCategory({
|
|
||||||
query: {
|
|
||||||
categoryCode: 'GIFT_PACK',
|
|
||||||
},
|
|
||||||
}).then(rs => {
|
|
||||||
if (rs.code === 200) {
|
|
||||||
giftCateList.length = 0
|
|
||||||
giftCateList.push(...rs.data)
|
|
||||||
return
|
|
||||||
}
|
|
||||||
util.alert({
|
|
||||||
content: rs.msg,
|
|
||||||
showCancel: false,
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 切换分类下标
|
|
||||||
* @param {Object} index
|
|
||||||
*/
|
|
||||||
function handleCateIndex(index) {
|
|
||||||
if (cateIndex.value === index) return
|
|
||||||
cateIndex.value = index
|
|
||||||
// 分类
|
|
||||||
proxy.$refs.product.listPrototype.categoryId = cateList[index].id
|
|
||||||
// 重载列表
|
|
||||||
proxy.$refs.product.refreshList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 搜索
|
|
||||||
function handleSearch() {
|
|
||||||
// 分类
|
|
||||||
proxy.$refs.product.listPrototype.searchValue = keyword.value
|
|
||||||
// 重载列表
|
|
||||||
proxy.$refs.product.refreshList()
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 更新
|
|
||||||
* @param {Object} item
|
|
||||||
*/
|
|
||||||
function handleGiftCate(item) {
|
|
||||||
uni.navigateTo({
|
|
||||||
url: '/pages/shop/gift'
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<view class="app">
|
<view class="app">
|
||||||
<!-- 轮播图 -->
|
<!-- 菜单首页 -->
|
||||||
<!-- <swiper class="banner oh" autoplay="true">
|
<view class="navBox bfff">
|
||||||
<swiper-item v-for="(item, index) in 3" :key="index">
|
<statusBar />
|
||||||
<view class="item">
|
|
||||||
<image class="poster"
|
|
||||||
src="https://img12.360buyimg.com/babel/jfs/t20271206/247554/11/28097/64155/675290e6F829316f2/0722626e5b28b005.jpg.avif"
|
|
||||||
mode="aspectFill" />
|
|
||||||
</view>
|
|
||||||
</swiper-item>
|
|
||||||
</swiper> -->
|
|
||||||
|
|
||||||
<view class="gift mt30 bfff">
|
<view class="nav">
|
||||||
<view class="item fdc fmid" :class="{'big': item.categoryCode == 'GIFT_PACK'}"
|
<view class="item fmid f1" :class="{'active': index === navIndex}" v-for="(item,index) in navList"
|
||||||
v-for="(item,index) in giftCateList" :key="index" @click="handleGiftCate(item)">
|
:key="index" @click="handleNavIndex(index)">
|
||||||
<view class="icon">
|
<view class="">{{item.name}}</view>
|
||||||
<image class="image" :src="item.image" mode="widthFix" />
|
|
||||||
</view>
|
</view>
|
||||||
<view class="mt10 c333 f28">{{item.name}}</view>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="oh bfff">
|
<template v-if="navList[0].load">
|
||||||
<!-- 功能区 -->
|
<view v-show="navCurrent.key == 'shop'">
|
||||||
<view class="fn rows mtb30 mlr30">
|
<!-- 商城首页 -->
|
||||||
<!-- <uni-icons type="scan" class="mr20" size="48rpx" color="#FF7F37" /> -->
|
<shopIndex ref="shopIndexRef" />
|
||||||
<view class="searchBox rows f1 ptb10 plr20 bar">
|
|
||||||
<input type="text" v-model="keyword" class="f1" placeholder="请输入关键字" @blur="handleSearch" />
|
|
||||||
<uni-icons type="search" size="30rpx" color="#999" />
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
<!-- 滚动条 -->
|
<template v-if="navList[1].load">
|
||||||
<view class="cate">
|
<view v-show="navCurrent.key == 'offline'">
|
||||||
<scroll-view scroll-x="true" class="scroll f30">
|
<!-- 商城首页 -->
|
||||||
<view class="item" v-for="(item,index) in cateList" :key="index"
|
<offlineIndex ref="offlineIndexRef" />
|
||||||
:class="{'active': index === cateIndex}" @click="handleCateIndex(index)">
|
|
||||||
<view class="name ptb20 plr40">{{item.name}}</view>
|
|
||||||
<view class="line"></view>
|
|
||||||
</view>
|
|
||||||
</scroll-view>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</template>
|
||||||
|
|
||||||
<!-- 商品卡片组 加载更多 -->
|
|
||||||
<view class="product oh ptb30 plr30">
|
|
||||||
<productList ref="product" />
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- 底部导航 -->
|
<!-- 底部导航 -->
|
||||||
|
|
@ -190,90 +120,22 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
// 轮播图
|
// 顶部导航
|
||||||
.banner {
|
.nav {
|
||||||
height: 180rpx;
|
|
||||||
|
|
||||||
.item {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.poster {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 礼包专区
|
|
||||||
.gift {
|
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
||||||
.image {
|
//
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.item.big {
|
|
||||||
width: 400rpx;
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
width: 240rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.item {
|
.item {
|
||||||
flex: 1;
|
color: #3d3d3d;
|
||||||
}
|
font-size: 36rpx;
|
||||||
|
height: 100rpx;
|
||||||
|
transition: .3s;
|
||||||
|
|
||||||
.icon {
|
//
|
||||||
display: flex;
|
&.active {
|
||||||
justify-content: center;
|
font-weight: bold;
|
||||||
align-items: flex-end;
|
color: #000;
|
||||||
width: 100%;
|
|
||||||
height: 200rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 功能区
|
|
||||||
.fn {
|
|
||||||
.searchBox {
|
|
||||||
background-color: #f3f3f3;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 分类
|
|
||||||
.cate {
|
|
||||||
.scroll {
|
|
||||||
white-space: nowrap;
|
|
||||||
|
|
||||||
.item {
|
|
||||||
display: inline-block;
|
|
||||||
color: #999;
|
|
||||||
transition: .3s;
|
|
||||||
|
|
||||||
.line {
|
|
||||||
width: 0;
|
|
||||||
margin: 0 auto;
|
|
||||||
border-bottom: 3rpx solid #FF7F37;
|
|
||||||
opacity: 0;
|
|
||||||
transition: .3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.active {
|
|
||||||
color: #FF7F37;
|
|
||||||
font-weight: bold;
|
|
||||||
|
|
||||||
.line {
|
|
||||||
width: 100%;
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 产品图
|
|
||||||
.product {
|
|
||||||
background-color: #f8f8f8;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|
@ -0,0 +1,616 @@
|
||||||
|
<script setup>
|
||||||
|
/**
|
||||||
|
* 商家入驻
|
||||||
|
* 进入页面获取最新的数据 如果发生变化 同步用户信息
|
||||||
|
* 1 待申请 显示入驻须知 是否缴纳押金
|
||||||
|
* 2 已申请/待审核 已缴纳押金并且提交表单
|
||||||
|
* 3 审核驳回 可选择取消押金 或 修改表单内容继续提交审核
|
||||||
|
* 4 审核成功 已成为商家 可选择取消商家身份 拿回押金 修改店铺信息重新提交审核
|
||||||
|
*/
|
||||||
|
import {
|
||||||
|
ref,
|
||||||
|
reactive,
|
||||||
|
computed,
|
||||||
|
getCurrentInstance,
|
||||||
|
} from 'vue';
|
||||||
|
import {
|
||||||
|
onLoad,
|
||||||
|
onReady,
|
||||||
|
} from '@dcloudio/uni-app';
|
||||||
|
// vuex
|
||||||
|
import {
|
||||||
|
useStore
|
||||||
|
} from 'vuex'
|
||||||
|
//
|
||||||
|
import api from '@/api/index.js';
|
||||||
|
// 工具库
|
||||||
|
import util from '@/common/js/util.js'
|
||||||
|
// 选择省市区
|
||||||
|
import regionSelection from '@/components/public/regionSelection/regionSelection.vue';
|
||||||
|
// 二级密码验证
|
||||||
|
import payPwd from '@/components/mine/payPwd.vue'
|
||||||
|
//
|
||||||
|
const store = useStore()
|
||||||
|
const {
|
||||||
|
proxy
|
||||||
|
} = getCurrentInstance();
|
||||||
|
// 表单
|
||||||
|
const form = reactive({
|
||||||
|
rectangleLogo: '',
|
||||||
|
qualificationPicture: [],
|
||||||
|
idCardFront: '',
|
||||||
|
idCardBack: '',
|
||||||
|
})
|
||||||
|
// 当前模式 code 0待缴纳1待申请2待审核3已通过4已拒绝 form表单
|
||||||
|
const mode = reactive({
|
||||||
|
code: 0,
|
||||||
|
})
|
||||||
|
// 文本内容
|
||||||
|
const content = ref({})
|
||||||
|
// 字典列表
|
||||||
|
const dictList = reactive([])
|
||||||
|
// 选择下标分类
|
||||||
|
const dictIndex = ref('')
|
||||||
|
// 二级密码回调
|
||||||
|
const pwdCb = ref('')
|
||||||
|
// 用户信息
|
||||||
|
const userinfo = computed(() => store.state.userinfo)
|
||||||
|
// 系统配置
|
||||||
|
const config = computed(() => store.state.config)
|
||||||
|
|
||||||
|
onLoad(() => {
|
||||||
|
// 获取商家入驻状态
|
||||||
|
getShopStatus()
|
||||||
|
})
|
||||||
|
|
||||||
|
onReady(() => {
|
||||||
|
// 测试缴纳接口
|
||||||
|
// callPwd('depositsPay')
|
||||||
|
})
|
||||||
|
|
||||||
|
// 获取表单信息
|
||||||
|
function getForm() {
|
||||||
|
Promise.all([getDetail(), getDict()]).then(rs => {
|
||||||
|
// 获取详情
|
||||||
|
const detail = rs[0]
|
||||||
|
// 获取字典分类
|
||||||
|
const dict = rs[1]
|
||||||
|
if (!detail) return
|
||||||
|
form.id = detail.id
|
||||||
|
form.rectangleLogo = detail.rectangleLogo
|
||||||
|
form.qualificationPicture = detail.qualificationPicture.split(',')
|
||||||
|
form.idCardFront = detail.idCardFront
|
||||||
|
form.idCardBack = detail.idCardBack
|
||||||
|
form.name = detail.name
|
||||||
|
form.phone = detail.phone
|
||||||
|
form.addressDetail = detail.addressDetail
|
||||||
|
form.categoryId = detail.categoryId
|
||||||
|
form.province = detail.province
|
||||||
|
form.city = detail.city
|
||||||
|
form.district = detail.district
|
||||||
|
// 赋值
|
||||||
|
dictIndex.value = dict.findIndex(item => item.id == detail.categoryId)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取申请信息
|
||||||
|
function getDetail() {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
api.shop.getStoreDetail().then(rs => {
|
||||||
|
if (rs.code == 200) {
|
||||||
|
resolve(rs.data)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
util.alert({
|
||||||
|
showCancel: false,
|
||||||
|
content: rs.msg,
|
||||||
|
})
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 切换模式code
|
||||||
|
function handleModeCode(code) {
|
||||||
|
// 模式
|
||||||
|
mode.code = code
|
||||||
|
switch (code) {
|
||||||
|
case 0:
|
||||||
|
// 获取文章
|
||||||
|
getarticle()
|
||||||
|
break;
|
||||||
|
case 1:
|
||||||
|
// 获取文章
|
||||||
|
getarticle()
|
||||||
|
break;
|
||||||
|
case 'form':
|
||||||
|
// 获取表单信息
|
||||||
|
getForm()
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取字典分类
|
||||||
|
function getDict() {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
api.shop.categoryAll({}).then(rs => {
|
||||||
|
if (rs.code == 200) {
|
||||||
|
resolve(rs.data)
|
||||||
|
dictList.length = 0
|
||||||
|
dictList.push(...rs.data)
|
||||||
|
resolve()
|
||||||
|
return
|
||||||
|
}
|
||||||
|
util.alert({
|
||||||
|
showCancel: false,
|
||||||
|
content: rs.msg,
|
||||||
|
})
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取商家入驻状态
|
||||||
|
function getShopStatus() {
|
||||||
|
api.shop.getShopStatus().then(rs => {
|
||||||
|
if (rs.code == 200) {
|
||||||
|
Object.assign(mode, rs.data)
|
||||||
|
handleModeCode(mode.code)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
util.alert({
|
||||||
|
showCancel: false,
|
||||||
|
content: rs.msg,
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 商家缴纳押金
|
||||||
|
function depositsPay() {
|
||||||
|
api.shop.depositsPay().then(rs => {
|
||||||
|
if (rs.code == 200) {
|
||||||
|
// 修改状态 变为已缴纳
|
||||||
|
mode.code = 1
|
||||||
|
return
|
||||||
|
}
|
||||||
|
util.alert({
|
||||||
|
showCancel: false,
|
||||||
|
content: rs.msg,
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取文章
|
||||||
|
function getarticle() {
|
||||||
|
api.getArticle({
|
||||||
|
query: {
|
||||||
|
agreementId: 4,
|
||||||
|
},
|
||||||
|
}).then(rs => {
|
||||||
|
if (rs.code == 200) {
|
||||||
|
content.value = rs.data
|
||||||
|
return
|
||||||
|
}
|
||||||
|
util.alert({
|
||||||
|
showCancel: false,
|
||||||
|
content: rs.msg,
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 上传图片
|
||||||
|
* @param {String} key 键值
|
||||||
|
* @param {String} type 类型 1单 2多
|
||||||
|
*/
|
||||||
|
function uploadImg(key, type) {
|
||||||
|
util.upload_image({
|
||||||
|
value: form[key],
|
||||||
|
success: rs => {
|
||||||
|
switch (type) {
|
||||||
|
case 1:
|
||||||
|
form[key] = rs.value
|
||||||
|
break
|
||||||
|
case 2:
|
||||||
|
form[key].push(rs.value)
|
||||||
|
break
|
||||||
|
}
|
||||||
|
},
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 移除文件
|
||||||
|
* @param {Number} index 下标
|
||||||
|
* @param {String} key 键
|
||||||
|
*/
|
||||||
|
function removeMedia(index, key) {
|
||||||
|
util.alert({
|
||||||
|
content: '确认删除？',
|
||||||
|
}).then(rs => {
|
||||||
|
if (rs.confirm) form[key].splice(index, 1)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 选择省市区
|
||||||
|
* @param {Object} ev
|
||||||
|
*/
|
||||||
|
function handleRegion(ev) {
|
||||||
|
console.log('handleRegion', ev)
|
||||||
|
form.province = ev.province.regionName
|
||||||
|
form.city = ev.city.regionName
|
||||||
|
form.district = ev.area.regionName
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 切换产品分类
|
||||||
|
* @param {Object} ev 默认事件
|
||||||
|
*/
|
||||||
|
function handleDict(ev) {
|
||||||
|
if (!ev || typeof ev.detail.value === 'undefined') {
|
||||||
|
console.error('Invalid event object or missing value');
|
||||||
|
return
|
||||||
|
}
|
||||||
|
const index = ev.detail.value;
|
||||||
|
if (index === dictIndex.value) return;
|
||||||
|
if (index >= 0 && index < dictList.length) {
|
||||||
|
dictIndex.value = index;
|
||||||
|
form.categoryId = dictList[index].id;
|
||||||
|
} else {
|
||||||
|
console.error('Invalid index:', index);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 商家入驻
|
||||||
|
function handleSubmit() {
|
||||||
|
const data = {
|
||||||
|
...form
|
||||||
|
}
|
||||||
|
console.log('data', data)
|
||||||
|
|
||||||
|
// 验证必填项
|
||||||
|
if (!data.rectangleLogo) {
|
||||||
|
util.alert('商家头像不能为空')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!data.name) {
|
||||||
|
util.alert('商家名称不能为空')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!data.phone) {
|
||||||
|
util.alert('联系方式不能为空')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!data.province) {
|
||||||
|
util.alert('产品所在地不能为空')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!data.categoryId) {
|
||||||
|
util.alert('产品类别不能为空')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!data.qualificationPicture[0]) {
|
||||||
|
util.alert('营业执照不能为空')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!data.idCardFront) {
|
||||||
|
util.alert('身份证正面不能为空')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!data.idCardBack) {
|
||||||
|
util.alert('身份证反面不能为空')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
// 营业执照
|
||||||
|
data.qualificationPicture = data.qualificationPicture.join(',')
|
||||||
|
|
||||||
|
api.shop.application({
|
||||||
|
data: data,
|
||||||
|
}).then(rs => {
|
||||||
|
if (rs.code === 200) {
|
||||||
|
util.alert({
|
||||||
|
content: '资料已申请，请等待后台审核',
|
||||||
|
showCancel: false,
|
||||||
|
}).then(rs => {
|
||||||
|
uni.navigateBack()
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
util.alert({
|
||||||
|
content: rs.msg,
|
||||||
|
showCancel: false,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 退出缴纳押金
|
||||||
|
function outDepositsPayAlt() {
|
||||||
|
util.alert({
|
||||||
|
content: '确认缴纳押金并放弃商家身份？',
|
||||||
|
}).then(rs => {
|
||||||
|
if (!rs.confirm) return
|
||||||
|
// 调用二级密码
|
||||||
|
callPwd('outDepositsPay')
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 商家退出押金
|
||||||
|
function outDepositsPay() {
|
||||||
|
// 商家退出押金
|
||||||
|
api.shop.outDepositsPay().then(rs => {
|
||||||
|
if (rs.code == 200) {
|
||||||
|
// 修改状态 变为待缴纳
|
||||||
|
handleModeCode(0)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
util.alert({
|
||||||
|
showCancel: false,
|
||||||
|
content: rs.msg,
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 调用二级密码
|
||||||
|
* @param {Object} key 后续方法key
|
||||||
|
*/
|
||||||
|
function callPwd(key) {
|
||||||
|
util.isAuth({
|
||||||
|
success: () => {
|
||||||
|
pwdCb.value = {
|
||||||
|
// 缴纳押金
|
||||||
|
'depositsPay': depositsPay,
|
||||||
|
// 取消押金并退出商家身份
|
||||||
|
'outDepositsPay': outDepositsPay,
|
||||||
|
} [key]
|
||||||
|
console.log('pwdCb', pwdCb.value)
|
||||||
|
// 拉起弹窗
|
||||||
|
proxy.$refs.payPwdRef.open()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 二级密码验证
|
||||||
|
function handlePayPwd() {
|
||||||
|
// 执行二级密码确认回调
|
||||||
|
pwdCb.value()
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<!-- 须知 -->
|
||||||
|
<template v-if="[0,1].includes(mode.code)">
|
||||||
|
<view class="app">
|
||||||
|
<view class="notice oh mtb30 mlr30 plr30 ptb20 bfff br20">
|
||||||
|
<view class="title tac f34 c333 b">商家入驻须知</view>
|
||||||
|
<view class="content mtb50">
|
||||||
|
<rich-text :nodes="content.content"></rich-text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="tac c666 f28">继续即代表同意《商家入驻须知》</view>
|
||||||
|
|
||||||
|
<view class="fill" style="height: 160rpx;" />
|
||||||
|
|
||||||
|
<view class="footer plr30 bfff shadow">
|
||||||
|
<!-- 未缴纳押金 -->
|
||||||
|
<template v-if="mode.code == 0">
|
||||||
|
<view class="btn black" @click="callPwd('depositsPay')">缴纳押金</view>
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
|
<view class="rows">
|
||||||
|
<view class="btn cancel plr30" @click="outDepositsPayAlt">退回押金</view>
|
||||||
|
<view class="btn colourful f1" @click="handleModeCode('form')">申请入驻</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<!-- 待审核 -->
|
||||||
|
<template v-else-if="mode.code == 2">
|
||||||
|
<view class="app">
|
||||||
|
<view class="result ver">
|
||||||
|
<uni-icons type="checkbox-filled" color="#20D200" size="160rpx" />
|
||||||
|
<view class="title mtb30 f34">申请中</view>
|
||||||
|
<view class="value f30">
|
||||||
|
<text class="c333">提交成功，请等待后台审核</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="fill" style="height: 160rpx;"></view>
|
||||||
|
|
||||||
|
<view class="footer rows plr30 bfff shadow">
|
||||||
|
<view class="btn cancel f1" @click="outDepositsPayAlt">取消申请并退回押金</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<!-- 审核驳回 -->
|
||||||
|
<template v-else-if="mode.code == 4">
|
||||||
|
<view class="app">
|
||||||
|
<view class="result ver">
|
||||||
|
<uni-icons type="clear" color="#ff0000" size="160rpx" />
|
||||||
|
<view class="title mtb30 f34">审核驳回</view>
|
||||||
|
<view class="value f30">
|
||||||
|
<text class="c666">驳回原因：</text>
|
||||||
|
<text class="c333">{{mode.msg}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="reject mtb30 c666 f28">
|
||||||
|
<view>驳回结果异议？ 可在个人中心-设置里面联系我们</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="fill" style="height: 160rpx;"></view>
|
||||||
|
|
||||||
|
<view class="footer rows plr30 bfff shadow">
|
||||||
|
<view class="btn cancel plr30" @click="outDepositsPayAlt">退回押金</view>
|
||||||
|
<view class="btn colourful f1" @click="handleModeCode('form')">修改信息</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<!-- 申请成功 -->
|
||||||
|
<template v-else-if="mode.code == 3">
|
||||||
|
<view class="app">
|
||||||
|
<view class="result ver">
|
||||||
|
<uni-icons type="checkbox-filled" color="#20D200" size="160rpx" />
|
||||||
|
<view class="title mtb30 f34">恭喜您，您已成为商家</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="fill" style="height: 160rpx;"></view>
|
||||||
|
|
||||||
|
<view class="footer plr30 bfff shadow">
|
||||||
|
<view class="btn cancel plr30" @click="outDepositsPayAlt">退回押金并放弃商家身份</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<!-- 表单申请 -->
|
||||||
|
<template v-else-if="mode.code == 'form'">
|
||||||
|
<view class="appbw plr30">
|
||||||
|
<!-- 头像 -->
|
||||||
|
<view class="avatarBox ver mt50">
|
||||||
|
<view class="avatar oh pr wh220 br20" @click="uploadImg('rectangleLogo',1)">
|
||||||
|
<image class="img br20" :src="form.rectangleLogo" mode="aspectFill" v-if="form.rectangleLogo" />
|
||||||
|
<view class="pfull fmid" v-else>
|
||||||
|
<uni-icons type="plusempty" color="#999" size="80rpx" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="name mt20 c666 f24">店铺头像</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 表单 -->
|
||||||
|
<view class="form mt60 c333 f32">
|
||||||
|
<view class="title f36">我的资料</view>
|
||||||
|
|
||||||
|
<view class="item rows ptb20">
|
||||||
|
<view class="key c666">店铺名称</view>
|
||||||
|
<view class="value f1 ml20 tar">
|
||||||
|
<input v-model="form.name" type="text" placeholder="请输入店铺名称" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="item rows ptb20">
|
||||||
|
<view class="key c666">联系方式</view>
|
||||||
|
<view class="value f1 ml20 tar">
|
||||||
|
<input v-model="form.phone" type="number" placeholder="请输入联系方式" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="item rows ptb20" @click="$refs.regionSelectionRef.open()">
|
||||||
|
<view class="key c666">产品所在地</view>
|
||||||
|
<view class="value f1 ml20 tar">
|
||||||
|
<!-- 省市区选择 -->
|
||||||
|
<regionSelection ref="regionSelectionRef" :province="form.province" :city="form.city"
|
||||||
|
:area="form.district" @change="handleRegion" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="item rows ptb20">
|
||||||
|
<view class="key c666">详细所在地</view>
|
||||||
|
<view class="value f1 ml20 tar">
|
||||||
|
<input v-model="form.addressDetail" type="text" placeholder="请选择产品所在地" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="item ptb20">
|
||||||
|
<picker :range="dictList" range-key="name" :vlaue="dictIndex" @change="handleDict">
|
||||||
|
<view class="rows">
|
||||||
|
<view class="key c666">产品类别</view>
|
||||||
|
<view class="value f1 ml20 tar">
|
||||||
|
<text class="placeholderStyle" v-if="dictIndex === ''">请选择产品类别</text>
|
||||||
|
<text v-else>{{dictList[dictIndex].name}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</picker>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="item ptb20">
|
||||||
|
<view class="key c666">营业执照</view>
|
||||||
|
<view class="value imgList f1 mt20 tar">
|
||||||
|
<view class="imgs wh200" v-for="(item, index) in form.qualificationPicture" :key="index">
|
||||||
|
<image class="img br10" :src="item" mode="aspectFill" />
|
||||||
|
<view class="close" @click="removeMedia(index,'qualificationPicture')">
|
||||||
|
<uni-icons type="clear" size="50rpx" color="#f00" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="upload imgs fmid wh200 br10" @click="uploadImg('qualificationPicture',2)">
|
||||||
|
<uni-icons type="plusempty" color="#E8E8E8" size="80rpx" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="item ptb20">
|
||||||
|
<view class="key c666">身份证正面</view>
|
||||||
|
<view class="value imgList f1 mt20 tar">
|
||||||
|
<view class="imgs wh200" v-if="form.idCardFront" @click="uploadImg('idCardFront',1)">
|
||||||
|
<image class="img br10" :src="form.idCardFront" mode="aspectFill" />
|
||||||
|
</view>
|
||||||
|
<view class="upload imgs fmid wh200 br10" v-else @click="uploadImg('idCardFront',1)">
|
||||||
|
<uni-icons type="plusempty" color="#E8E8E8" size="80rpx" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="item ptb20">
|
||||||
|
<view class="key c666">身份证反面</view>
|
||||||
|
<view class="value imgList f1 mt20 tar">
|
||||||
|
<view class="imgs wh200" v-if="form.idCardBack" @click="uploadImg('idCardBack',1)">
|
||||||
|
<image class="img br10" :src="form.idCardBack" mode="aspectFill" />
|
||||||
|
</view>
|
||||||
|
<view class="upload imgs fmid wh200 br10" v-else @click="uploadImg('idCardBack',1)">
|
||||||
|
<uni-icons type="plusempty" color="#E8E8E8" size="80rpx" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="fill" style="height: 150rpx;"></view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="footer plr30 bfff shadow">
|
||||||
|
<view class="rows">
|
||||||
|
<view class="btn cancel plr30" @click="outDepositsPayAlt">退回押金</view>
|
||||||
|
<view class="btn colourful f1" @click="handleSubmit">申请入驻</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<!-- 二级密码 -->
|
||||||
|
<payPwd ref="payPwdRef" :check="true" :price="config.DEPOSIT_ALLOCATION" @confirm="handlePayPwd" />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 头像
|
||||||
|
.avatar {
|
||||||
|
background-color: #F6F8FE;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 上传
|
||||||
|
.upload {
|
||||||
|
background-color: #f4f4ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 审核结果
|
||||||
|
.result {
|
||||||
|
margin-top: 30rpx;
|
||||||
|
padding: 50rpx 0;
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 发布
|
||||||
|
.menu {
|
||||||
|
.line {
|
||||||
|
padding: 20rpx 10rpx;
|
||||||
|
|
||||||
|
&+.line {
|
||||||
|
border-top: 2rpx solid #eee;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 572 B |
Binary file not shown.
|
After Width: | Height: | Size: 535 B |
|
|
@ -4,7 +4,7 @@ import {
|
||||||
import uni from '@dcloudio/vite-plugin-uni';
|
import uni from '@dcloudio/vite-plugin-uni';
|
||||||
|
|
||||||
// let target = 'http://91f.xyz:8080'
|
// let target = 'http://91f.xyz:8080'
|
||||||
let target = 'https://1e2a734e.r24.cpolar.top'
|
let target = 'https://3dea4c80.r9.cpolar.top'
|
||||||
// let target = 'http://192.168.31.61:8080'
|
// let target = 'http://192.168.31.61:8080'
|
||||||
|
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue