初始化
This commit is contained in:
@@ -0,0 +1,658 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<!-- #ifndef APP-NVUE || MP-TOUTIAO -->
|
||||
<block v-if="ads.length > 0">
|
||||
<uv-gap height="16"></uv-gap>
|
||||
<view class="uv-demo-block" style="width: 688rpx; margin: auto">
|
||||
<uv-swiper :list="ads" bgColor="transparent" indicatorMode="dot" indicator circular :autoplay="false" radius="5" @click="onAds"></uv-swiper>
|
||||
</view>
|
||||
</block>
|
||||
<block v-else>
|
||||
<uni-card :border="false" :padding="'12px 4px'">
|
||||
<uv-skeleton rows="3" :loading="hideTools" :title="false"></uv-skeleton>
|
||||
</uni-card>
|
||||
</block>
|
||||
<!-- #endif -->
|
||||
<!-- 首页导航图标 -->
|
||||
<block v-if="mp_menu_display_method == 0">
|
||||
<block v-if="navigation.length > 0">
|
||||
<uni-card :border="false" :is-shadow="false" :padding="0">
|
||||
<uni-grid :column="4" :highlight="true" :showBorder="false" @change="onNavigation">
|
||||
<uni-grid-item v-for="(item, index) in navigation" :index="index" :key="index">
|
||||
<view class="grid-item-box" style="display: flex; flex-direction: column; justify-content: center; align-items: center; height: 6rem;">
|
||||
<uv-avatar :src="item.icon" class="image" style="width: 42px; height: 42px"></uv-avatar>
|
||||
<text class="text">{{ item.title }}</text>
|
||||
</view>
|
||||
</uni-grid-item>
|
||||
</uni-grid>
|
||||
</uni-card>
|
||||
</block>
|
||||
<block v-else>
|
||||
<uni-card :border="false" :padding="'12px 4px'">
|
||||
<uv-skeleton rows="3" avatar :loading="hideTools" :title="false"></uv-skeleton>
|
||||
</uni-card>
|
||||
</block>
|
||||
</block>
|
||||
|
||||
<!-- 首页导航图标单排 -->
|
||||
<block v-if="mp_menu_display_method == 1">
|
||||
<block v-if="navigation.length > 0">
|
||||
<uni-card :border="false" :is-shadow="false" :padding="0">
|
||||
<uv-scroll-list indicatorActiveColor="rgb(16, 128, 1)">
|
||||
<div class="user-oreder web-cell">
|
||||
<block v-for="(item, index) in navigation" :key="index">
|
||||
<div class="scroll-item" @click="openUrl(item.path)">
|
||||
<image :src="item.icon" style="width: 42px; height: 42px" mode="widthFix"></image>
|
||||
<text class="scrool-item-text">{{ item.title }}</text>
|
||||
</div>
|
||||
</block>
|
||||
</div>
|
||||
</uv-scroll-list>
|
||||
</uni-card>
|
||||
</block>
|
||||
<block v-else>
|
||||
<uni-card :border="false" :padding="'12px 4px'">
|
||||
<uv-skeleton avatar rows="2" :loading="hideTools" :title="false"></uv-skeleton>
|
||||
</uni-card>
|
||||
</block>
|
||||
</block>
|
||||
|
||||
<!-- 首页导航图标双排 -->
|
||||
<block v-if="mp_menu_display_method == 2 && navigation.length > 0">
|
||||
<uni-card :border="false" :is-shadow="false" :padding="0">
|
||||
<view class="navigation">
|
||||
<uv-scroll-list>
|
||||
<view class="scroll-list">
|
||||
<view class="scroll-list__line" v-for="(item, index) in doubleNavigation" :key="index">
|
||||
<view
|
||||
class="scroll-list__line__item"
|
||||
v-for="(item1, index1) in item"
|
||||
:key="index1"
|
||||
:class="[index1 === item.length - 1 && 'scroll-list__line__item--no-margin-right']"
|
||||
@click="openUrl(item1.path)"
|
||||
>
|
||||
<image class="scroll-list__line__item__image" style="width: 45px; height: 45px; border-radius: 8px" :src="item1.icon" mode=""></image>
|
||||
<text class="scroll-list__line__item__text">{{ item1.title }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</uv-scroll-list>
|
||||
</view>
|
||||
</uni-card>
|
||||
</block>
|
||||
|
||||
<view class="card-title web-text-heading">热门项目</view>
|
||||
<block v-if="itemList.length > 0">
|
||||
<view class="item-list">
|
||||
<uni-grid :column="5" :highlight="true" :showBorder="false" @change="onItem">
|
||||
<uni-grid-item v-for="(item, index) in itemList" :index="index" :key="index">
|
||||
<view
|
||||
class="grid-item-box"
|
||||
style="
|
||||
background-color: #ffffff;
|
||||
margin: 10rpx;
|
||||
border-radius: 10rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 5rem;
|
||||
"
|
||||
>
|
||||
<uv-avatar :src="item.image" :size="27" shape="square" fontSize="16" randomBgColor></uv-avatar>
|
||||
<text class="text">{{ item.name }}</text>
|
||||
</view>
|
||||
</uni-grid-item>
|
||||
</uni-grid>
|
||||
<!-- <block v-for="(item, index) in itemList" :key="index">
|
||||
<view class="item-bar" @click="openUrl(`/package/booking/merchant?type=` + item.id)">
|
||||
<uv-avatar :src="item.image" :size="30" shape="square" fontSize="16" randomBgColor></uv-avatar>
|
||||
{{ item.name }}
|
||||
</view>
|
||||
</block> -->
|
||||
</view>
|
||||
</block>
|
||||
<block v-else>
|
||||
<uni-card :border="false" :padding="'12px 4px'">
|
||||
<uv-skeleton rows="2" avatar :loading="hideTools" :title="false"></uv-skeleton>
|
||||
</uni-card>
|
||||
</block>
|
||||
|
||||
<!-- 商户列表 -->
|
||||
<view class="card-title web-text-heading">场地预定</view>
|
||||
<view class="card-body">
|
||||
<block v-if="merchant.length > 0">
|
||||
<uni-grid :column="3" borderColor="transparent" :highlight="true" @change="change">
|
||||
<uni-grid-item v-for="(item, index) in merchant" :index="index" :key="index">
|
||||
<view class="merchant-card" style="display: flex; flex-direction: column">
|
||||
<image :src="item.image" mode="widthFix" class="merchant-image" />
|
||||
<text class="merchant-name">{{ item.merchantName }}</text>
|
||||
</view>
|
||||
</uni-grid-item>
|
||||
</uni-grid>
|
||||
</block>
|
||||
<block v-else>
|
||||
<uni-card :border="false" :padding="'18px 6px'">
|
||||
<uv-skeleton rows="2" avatar :loading="hideTools" :title="false"></uv-skeleton>
|
||||
<uv-gap height="16"></uv-gap>
|
||||
<uv-skeleton rows="2" avatar :loading="hideTools" :title="false"></uv-skeleton>
|
||||
<uv-gap height="16"></uv-gap>
|
||||
<uv-skeleton rows="2" avatar :loading="hideTools" :title="false"></uv-skeleton>
|
||||
<uv-gap height="16"></uv-gap>
|
||||
<uv-skeleton rows="2" avatar :loading="hideTools" :title="false"></uv-skeleton>
|
||||
<uv-gap height="16"></uv-gap>
|
||||
</uni-card>
|
||||
</block>
|
||||
</view>
|
||||
|
||||
<!-- 推荐商品 -->
|
||||
<!-- <ws-booking :goods="goods"></ws-booking> -->
|
||||
</view>
|
||||
<!-- 登录组件 -->
|
||||
<ws-login ref="login" :logo="logo" @done="reload" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as GoodsApi from '@/api/shop/goods';
|
||||
import * as Api from '@/api/layout';
|
||||
import * as MerchantApi from '@/api/shop/merchant';
|
||||
import * as UserApi from '@/api/booking/users';
|
||||
import * as ItemApi from '@/api/booking/item';
|
||||
import { getWxOpenId } from '@/api/passport/login';
|
||||
import { updateUsers } from '@/api/shop/users';
|
||||
import { useTenantStore } from '@/store/modules/tenant';
|
||||
const tenantStore = useTenantStore();
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
items: ['关注', '推荐'],
|
||||
// 场馆列表
|
||||
merchant: [],
|
||||
// 网站参数
|
||||
fields: {},
|
||||
// 幻灯片广告
|
||||
ads: [],
|
||||
// 幻灯片链接地址
|
||||
pathList: [],
|
||||
// 项目列表
|
||||
itemList: [],
|
||||
// 小程序导航图标
|
||||
navigation: [],
|
||||
// 小程序导航图标(双排)
|
||||
doubleNavigation: [],
|
||||
isLogin: false,
|
||||
userInfo: {},
|
||||
// 骨架屏
|
||||
hideTools: true,
|
||||
mp_menu_display_method: 0,
|
||||
baseList: [
|
||||
{
|
||||
name: 'photo',
|
||||
title: '李白'
|
||||
},
|
||||
{
|
||||
name: 'lock',
|
||||
title: '韩信'
|
||||
},
|
||||
{
|
||||
name: 'star',
|
||||
title: '刘备'
|
||||
},
|
||||
{
|
||||
name: 'star',
|
||||
title: '元芳'
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.reload();
|
||||
},
|
||||
methods: {
|
||||
async reload() {
|
||||
const app = this;
|
||||
|
||||
// 获取服务租户信息包
|
||||
const info = await tenantStore.fetchTenantInfo();
|
||||
|
||||
// 登录状态
|
||||
if (uni.getStorageSync('user_id') && uni.getStorageSync('access_token')) {
|
||||
app.isLogin = true;
|
||||
if(!uni.getStorageSync('openid')){
|
||||
// 获取用户副表信息
|
||||
UserApi.getByPhone({
|
||||
phone: info.userInfo.phone
|
||||
}).then((data) => {
|
||||
if (data) {
|
||||
app.userInfo.ouid = data.uid;
|
||||
uni.setStorageSync('ouid',data.uid);
|
||||
app.userInfo = Object.assign({}, app.userInfo, data);
|
||||
}
|
||||
});
|
||||
// 更新openid
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.login({
|
||||
success: (res) => {
|
||||
getWxOpenId({
|
||||
code: res.code
|
||||
}).then((response) => {
|
||||
uni.setStorageSync('openid',response.openid);
|
||||
updateUsers({
|
||||
uid: app.userInfo.ouid,
|
||||
openid: response.openid,
|
||||
sessionKey: response.session_key,
|
||||
unionid: response.unionid
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
}
|
||||
}
|
||||
|
||||
// 解析网站参数
|
||||
if (info.fields) {
|
||||
info.fields.map((d) => {
|
||||
const key = d.name;
|
||||
app.fields[key] = d.value;
|
||||
|
||||
if (d.name == 'h5_url') {
|
||||
// 缓存H5地址
|
||||
uni.setStorageSync(d.name, d.value);
|
||||
}
|
||||
|
||||
if (d.name == 'mp_menu_display_method') {
|
||||
app.mp_menu_display_method = d.value;
|
||||
}
|
||||
});
|
||||
}
|
||||
// 解析幻灯片数据
|
||||
if (info.ads) {
|
||||
const ad = info.ads.filter((d) => d.adType == '幻灯片');
|
||||
if (ad) {
|
||||
const adsList = JSON.parse(ad[0].images);
|
||||
adsList.map((d) => {
|
||||
app.ads.push(d.url);
|
||||
});
|
||||
app.pathList = JSON.parse(ad[0].path);
|
||||
}
|
||||
app.hideTools = false;
|
||||
}
|
||||
// 解析小程序名称
|
||||
if (info.websiteName) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: info.websiteName
|
||||
});
|
||||
}
|
||||
// 解析网站logo
|
||||
if (info.websiteLogo) {
|
||||
uni.setStorageSync('app_logo', info.websiteLogo);
|
||||
app.logo = info.websiteLogo;
|
||||
}
|
||||
// 解析小程序导航图标
|
||||
if (info.mpMenus) {
|
||||
const arr = info.mpMenus.filter((d) => d.type == 2 && d.rows == 0);
|
||||
const arr1 = info.mpMenus.filter((d) => d.type == 2 && d.rows == 1);
|
||||
const arr2 = info.mpMenus.filter((d) => d.type == 2 && d.rows == 2);
|
||||
app.navigation = [];
|
||||
app.doubleNavigation = [];
|
||||
|
||||
if (arr1) {
|
||||
app.doubleNavigation.push(arr);
|
||||
app.doubleNavigation.push(arr1);
|
||||
} else {
|
||||
app.doubleNavigation.push(arr);
|
||||
}
|
||||
//
|
||||
if (arr) {
|
||||
app.navigation = arr;
|
||||
}
|
||||
}
|
||||
|
||||
// 请求数据
|
||||
Promise.all([app.getMerchantList(), app.getItemList()]).then((res) => {
|
||||
app.merchant = res[0];
|
||||
app.itemList = res[1];
|
||||
});
|
||||
},
|
||||
getSiteInfo() {
|
||||
const app = this;
|
||||
return new Promise((resolve, reject) => {
|
||||
Api.getSiteInfo()
|
||||
.then((result) => {
|
||||
resolve(result);
|
||||
})
|
||||
.catch(reject);
|
||||
});
|
||||
},
|
||||
listAdList() {},
|
||||
pageGoods() {
|
||||
const app = this;
|
||||
return new Promise((resolve, reject) => {
|
||||
GoodsApi.pageGoods({})
|
||||
.then((result) => {
|
||||
resolve(result.list);
|
||||
})
|
||||
.catch(reject);
|
||||
});
|
||||
},
|
||||
getMerchantList() {
|
||||
const app = this;
|
||||
return new Promise((resolve, reject) => {
|
||||
MerchantApi.listMerchant({})
|
||||
.then((result) => {
|
||||
resolve(result);
|
||||
})
|
||||
.catch(reject);
|
||||
});
|
||||
},
|
||||
getItemList() {
|
||||
const app = this;
|
||||
return new Promise((resolve, reject) => {
|
||||
ItemApi.listItem({})
|
||||
.then((result) => {
|
||||
resolve(result);
|
||||
})
|
||||
.catch(reject);
|
||||
});
|
||||
},
|
||||
change(e) {
|
||||
const { index } = e.detail;
|
||||
const id = this.merchant[index].merchantId;
|
||||
this.openUrl(`/package/booking/index?id=${id}`);
|
||||
},
|
||||
onNavigation(e) {
|
||||
const { index } = e.detail;
|
||||
this.openUrl(this.navigation[index].path);
|
||||
},
|
||||
onItem(e) {
|
||||
const { index } = e.detail;
|
||||
this.openUrl(`/package/booking/merchant?type=` + this.itemList[index].id);
|
||||
},
|
||||
onAds(index) {
|
||||
const { pathList } = this;
|
||||
this.openUrl(pathList[index]);
|
||||
},
|
||||
openUrl(url) {
|
||||
if (!this.isLogin) {
|
||||
this.$refs.login.open('bottom');
|
||||
return false;
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
page {
|
||||
/* background: url('https://oss.wsdns.cn/20240502/75fc744657544a38a32f83a825688286.png') no-repeat; */
|
||||
background-size: 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-color: #f0f2f5;
|
||||
width: 750rpx;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
}
|
||||
|
||||
.segmented {
|
||||
display: block;
|
||||
justify-content: space-around;
|
||||
text-align: center;
|
||||
width: 200rpx;
|
||||
margin: auto;
|
||||
color: #ffffff;
|
||||
|
||||
.item {
|
||||
color: #666;
|
||||
font-size: 26rpx;
|
||||
padding: 0 12rpx;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #333;
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
.user-oreder {
|
||||
display: flex;
|
||||
padding: 16px 0;
|
||||
|
||||
.scroll-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 0 25rpx;
|
||||
|
||||
.scrool-item-text {
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.web-cell-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.web-text-center {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.menu-list {
|
||||
display: flex;
|
||||
padding: 16px 0;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.scroll-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 0 25rpx;
|
||||
|
||||
.scrool-item-text {
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.web-cell-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.web-text-center {
|
||||
text-align: center;
|
||||
}
|
||||
.menu-title {
|
||||
white-space: nowrap;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.grid-item-box {
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100vh;
|
||||
}
|
||||
}
|
||||
.card-title {
|
||||
width: 700rpx;
|
||||
margin: 12rpx auto;
|
||||
font-size: 34rpx;
|
||||
font-weight: 500;
|
||||
margin-top: 32rpx;
|
||||
}
|
||||
|
||||
.merchant-card-title {
|
||||
width: 700rpx;
|
||||
margin: 12rpx auto;
|
||||
font-size: 40rpx;
|
||||
font-weight: 500;
|
||||
margin-top: 32rpx;
|
||||
}
|
||||
|
||||
.card-body {
|
||||
width: 740rpx;
|
||||
margin: auto;
|
||||
|
||||
.merchant-card {
|
||||
margin: 12rpx auto;
|
||||
background: #ffffff;
|
||||
border-radius: 10rpx;
|
||||
border-color: slategrey;
|
||||
border-radius: 16rpx;
|
||||
|
||||
.merchant-image {
|
||||
width: 200rpx;
|
||||
border-radius: 16rpx 16rpx 0 0;
|
||||
height: 140rpx !important;
|
||||
}
|
||||
|
||||
.merchant-name {
|
||||
padding: 10rpx;
|
||||
font-weight: 500;
|
||||
font-size: 26rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.merchant-desc {
|
||||
width: 400rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
.item-list {
|
||||
width: 710rpx;
|
||||
margin: auto;
|
||||
justify-content: space-between;
|
||||
|
||||
.item-bar {
|
||||
width: 145rpx;
|
||||
height: 145rpx;
|
||||
padding: 10rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
background-color: #ffffff;
|
||||
border-radius: 10rpx;
|
||||
margin: 10rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin flex($direction: row) {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: $direction;
|
||||
}
|
||||
|
||||
.navigation {
|
||||
padding: 0 30rpx 0 30rpx;
|
||||
}
|
||||
|
||||
.scroll-list {
|
||||
@include flex(column);
|
||||
|
||||
&__item {
|
||||
margin-right: 20px;
|
||||
|
||||
&__image {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
&__text {
|
||||
color: $uni-text-color-placeholder;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
&__line {
|
||||
@include flex;
|
||||
margin-top: 10px;
|
||||
|
||||
&__item {
|
||||
margin-right: 30px;
|
||||
text-align: center;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
&__image {
|
||||
width: 61px;
|
||||
height: 48px;
|
||||
}
|
||||
|
||||
&__text {
|
||||
margin-top: 5px;
|
||||
color: $uni-text-color-placeholder;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&--no-margin-right {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__line__item__text {
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
/* 单元格 */
|
||||
// .web-cell {
|
||||
// display: flex;
|
||||
|
||||
// &:not(.web-cell-align-top) {
|
||||
// align-items: center;
|
||||
// }
|
||||
|
||||
// &.web-cell-align-bottom {
|
||||
// align-items: flex-end;
|
||||
// }
|
||||
|
||||
// &>.web-cell-content {
|
||||
// flex: 1;
|
||||
// box-sizing: border-box;
|
||||
// }
|
||||
|
||||
// &>*+.web-cell-content {
|
||||
// // padding-left: @padding-sm;
|
||||
// }
|
||||
|
||||
// .web-cell-title {
|
||||
// // color: @heading-color;
|
||||
// // font-size: @font-size-base + 1px;
|
||||
// }
|
||||
|
||||
// .web-cell-desc {
|
||||
// // color: @text-color-secondary;
|
||||
// // font-size: @font-size-base - 1px;
|
||||
// // margin-top: (@padding-xs / 2);
|
||||
// }
|
||||
// }
|
||||
</style>
|
||||
@@ -0,0 +1,84 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="search">
|
||||
<uni-search-bar placeholder="搜索" @confirm="search" :focus="true" v-model="searchValue" @blur="blur" @focus="focus"
|
||||
@input="input" @cancel="cancel" cancelButton="none" @clear="clear">
|
||||
</uni-search-bar>
|
||||
</view>
|
||||
<ws-chat :list="list"></ws-chat>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
searchValue: '',
|
||||
list: [{
|
||||
userId: 1,
|
||||
nickname: '张三',
|
||||
avatar: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/unicloudlogo.png',
|
||||
note: '您收到一条消息',
|
||||
badge: 99,
|
||||
to: '/package/order/order',
|
||||
createTime: '2023-12-12'
|
||||
}, {
|
||||
userId: 2,
|
||||
nickname: '李四',
|
||||
avatar: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/unicloudlogo.png',
|
||||
note: '您收到一条消息',
|
||||
badge: 'dot',
|
||||
createTime: '2023-12-12'
|
||||
}, {
|
||||
userId: 3,
|
||||
nickname: '王五',
|
||||
avatar: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/unicloudlogo.png',
|
||||
note: '您收到一条消息',
|
||||
badge: 5,
|
||||
createTime: '2023-12-12'
|
||||
}]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
search(res) {
|
||||
uni.showToast({
|
||||
title: '搜索：' + res.value,
|
||||
icon: 'none'
|
||||
})
|
||||
},
|
||||
input(res) {
|
||||
console.log('----input:', res)
|
||||
},
|
||||
clear(res) {
|
||||
uni.showToast({
|
||||
title: 'clear事件，清除值为：' + res.value,
|
||||
icon: 'none'
|
||||
})
|
||||
},
|
||||
blur(res) {
|
||||
uni.showToast({
|
||||
title: 'blur事件，输入值为：' + res.value,
|
||||
icon: 'none'
|
||||
})
|
||||
},
|
||||
focus(e) {
|
||||
uni.showToast({
|
||||
title: 'focus事件，输出值为：' + e.value,
|
||||
icon: 'none'
|
||||
})
|
||||
},
|
||||
cancel(res) {
|
||||
uni.showToast({
|
||||
title: '点击取消，输入值为：' + res.value,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.search{
|
||||
background-color: #ffffff;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,415 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="segmented">
|
||||
<uni-segmented-control :current="current" :values="items" :styleType="styleType" :activeColor="activeColor"
|
||||
inActiveColor="#808080" @clickItem="onClickItem" />
|
||||
</view>
|
||||
<view class="order">
|
||||
<block v-if="orderList.length > 0">
|
||||
<block v-for="(item,index) in orderList" :key="index">
|
||||
<uni-card :border="false" :is-shadow="false" :padding="0">
|
||||
<template v-slot:title>
|
||||
<div class="order-title web-cell">
|
||||
<view class="web-cell web-cell-content">
|
||||
<view class="merchant-avatar">
|
||||
<uv-avatar :src="item.merchantAvatar" size="24"></uv-avatar>
|
||||
</view>
|
||||
<text class="merchant-name">{{ item.merchantName }}</text>
|
||||
</view>
|
||||
<block v-if="item.orderStatus == 2">
|
||||
<text class="btn-status web-text-secondary">已取消</text>
|
||||
</block>
|
||||
<block v-else-if="item.orderStatus == 1">
|
||||
<text class="btn-status web-text-success">已完成</text>
|
||||
</block>
|
||||
<block v-else>
|
||||
<text v-if="item.payStatus == 1" class="btn-status web-text-success">已支付</text>
|
||||
<view v-if="item.payStatus == 0" class="btn-status web-text-danger">
|
||||
<uv-count-down :time="item.timestamp" format="mm:ss"></uv-count-down>
|
||||
<text class="no-pay" style="margin-left: 10rpx;">未支付</text>
|
||||
</view>
|
||||
</block>
|
||||
</div>
|
||||
</template>
|
||||
<view class="order-body web-cell web-cell-align-top">
|
||||
<view class="web-cell-content">
|
||||
<uv-cell-group :customStyle="{backgroundColor: '#ffffff'}" :border="false">
|
||||
<block v-for="(sub,subIndex) in item.orderInfo" :key="subIndex">
|
||||
<uv-cell :title="`${sub.fieldName}`" :label="`${sub.comments}`"
|
||||
:cellStyle="{padding: '0', paddingBottom: '5px'}" :border="false"
|
||||
@click="openUrl(`/package/order/detail?id=${item.orderId}`)" />
|
||||
</block>
|
||||
</uv-cell-group>
|
||||
<view class="total-price">
|
||||
<view class="web-text-heading">合计：￥{{ item.totalPrice }}</view>
|
||||
<view class="web-text-heading" style="font-weight: 500;">
|
||||
实付：￥{{ item.payPrice }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view slot="actions" class="card-actions">
|
||||
<view class="card-actions-item" v-if="item.payStatus == 0 && item.orderStatus == 0">
|
||||
<button class="mini-btn" size="mini" @click="closeOrder(item)"
|
||||
style="margin-right: 20rpx;">取消订单</button>
|
||||
<button class="mini-btn" type="primary" size="mini"
|
||||
@click="toPay(item.orderId)">去支付</button>
|
||||
</view>
|
||||
<view class="card-actions-item" v-if="item.payStatus == 1">
|
||||
<button class="mini-btn" size="mini" v-if="item.isInvoice == 0" @click="onInvoice(item.orderId)">申请开票</button>
|
||||
<button class="mini-btn" size="mini" v-else @click="showInvoice(item.orderId)">查看发票</button>
|
||||
</view>
|
||||
</view>
|
||||
</uni-card>
|
||||
</block>
|
||||
</block>
|
||||
<block v-if="orderList.length == 0 && loadMore != 'no-more'">
|
||||
<uni-card :border="false" :padding="'18px 6px'">
|
||||
<uv-skeleton rows="3" avatar :loading="hideTools" :title="false">
|
||||
</uv-skeleton>
|
||||
<uv-gap height="16"></uv-gap>
|
||||
</uni-card>
|
||||
<uni-card :border="false" :padding="'18px 6px'">
|
||||
<uv-skeleton rows="3" avatar :loading="hideTools" :title="false">
|
||||
</uv-skeleton>
|
||||
<uv-gap height="16"></uv-gap>
|
||||
</uni-card>
|
||||
<uni-card :border="false" :padding="'18px 6px'">
|
||||
<uv-skeleton rows="3" avatar :loading="hideTools" :title="false">
|
||||
</uv-skeleton>
|
||||
<uv-gap height="16"></uv-gap>
|
||||
</uni-card>
|
||||
<uni-card :border="false" :padding="'18px 6px'">
|
||||
<uv-skeleton rows="3" avatar :loading="hideTools" :title="false">
|
||||
</uv-skeleton>
|
||||
<uv-gap height="16"></uv-gap>
|
||||
</uni-card>
|
||||
</block>
|
||||
<uni-load-more v-if="orderList.length > 0" :status="loadMore"></uni-load-more>
|
||||
<!-- 登录组件 -->
|
||||
<ws-login ref="login" :logo="logo" @done="reload" />
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as OrderApi from '@/api/shop/order'
|
||||
import {
|
||||
pageWechatDeposit
|
||||
} from '@/api/shop/wechatDeposit'
|
||||
import {
|
||||
getWeek,
|
||||
getKey
|
||||
} from '@/utils/common';
|
||||
|
||||
export default {
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
isRefresh: false,
|
||||
isLogin: false,
|
||||
userId: 0,
|
||||
where: {
|
||||
page: 1,
|
||||
type: 1, // 0商城订单 1场地预定
|
||||
sceneType: 'showOrderInfo' // 查询订单附加场地信息
|
||||
},
|
||||
canReset: false,
|
||||
loadMore: 'more',
|
||||
logo: '',
|
||||
items: ['全部订单', '未支付', '已支付', '已完成', '押金'],
|
||||
orderList: [],
|
||||
styles: [{
|
||||
value: 'button',
|
||||
text: '按钮',
|
||||
checked: true
|
||||
},
|
||||
{
|
||||
value: 'text',
|
||||
text: '文字'
|
||||
}
|
||||
],
|
||||
colors: ['#333333', '#4cd964', '#dd524d'],
|
||||
current: 0,
|
||||
colorIndex: 0,
|
||||
activeColor: '#108001',
|
||||
styleType: 'text',
|
||||
getWeek,
|
||||
// 骨架屏
|
||||
hideTools: true
|
||||
}
|
||||
},
|
||||
onLoad(option) {
|
||||
// 判断是否登录
|
||||
this.openLogin()
|
||||
// 加载数据
|
||||
// this.reload()
|
||||
// if(option.isRefresh){
|
||||
// this.isRefresh = true
|
||||
// }
|
||||
},
|
||||
onShow(e) {
|
||||
// 判断是否登录
|
||||
this.openLogin()
|
||||
this.reload()
|
||||
},
|
||||
// 触底函数
|
||||
onReachBottom() {
|
||||
const app = this
|
||||
const {
|
||||
where
|
||||
} = this
|
||||
if (app.canReset) {
|
||||
app.where.page = ++where.page;
|
||||
app.reload()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
reload() {
|
||||
const app = this
|
||||
const {
|
||||
where,
|
||||
userId
|
||||
} = this
|
||||
if (userId == 0) {
|
||||
app.openLogin()
|
||||
return;
|
||||
}
|
||||
where.userId = userId;
|
||||
// uni.showLoading({
|
||||
// title: '数据读取中.'
|
||||
// })
|
||||
app.loadMore = 'loading'
|
||||
OrderApi.pageOrder(where).then(res => {
|
||||
const list = res.list.map(d => {
|
||||
console.log(d);
|
||||
return d;
|
||||
});
|
||||
if (app.orderList.length < res.count) {
|
||||
console.log('11111: ', 11111);
|
||||
app.orderList = app.orderList.concat(list)
|
||||
app.canReset = true
|
||||
app.loadMore = 'no-more'
|
||||
} else {
|
||||
app.canReset = false;
|
||||
app.loadMore = 'no-more'
|
||||
console.log('22222: ', 22222);
|
||||
}
|
||||
uni.hideLoading()
|
||||
app.isRefresh = false
|
||||
}).catch(() => {
|
||||
uni.showToast({
|
||||
title: '请检查您的网络.',
|
||||
icon: 'none'
|
||||
})
|
||||
uni.hideLoading()
|
||||
app.isRefresh = false
|
||||
})
|
||||
},
|
||||
onClickItem(e) {
|
||||
const app = this
|
||||
const {
|
||||
where,
|
||||
userId
|
||||
} = this
|
||||
const index = e.currentIndex
|
||||
if (this.current !== e.currentIndex) {
|
||||
this.current = e.currentIndex
|
||||
}
|
||||
if (userId == 0) {
|
||||
app.openLogin()
|
||||
return;
|
||||
}
|
||||
// 全部
|
||||
if (index == 0) {
|
||||
where.payStatus = undefined;
|
||||
where.orderStatus = undefined;
|
||||
}
|
||||
// 未支付
|
||||
if (index == 1) {
|
||||
where.payStatus = 0;
|
||||
where.orderStatus = undefined;
|
||||
}
|
||||
// 已支付
|
||||
if (index == 2) {
|
||||
where.payStatus = 1;
|
||||
where.orderStatus = 0;
|
||||
}
|
||||
// 已完成
|
||||
if (index == 3) {
|
||||
where.payStatus = 1;
|
||||
where.orderStatus = 1;
|
||||
}
|
||||
// 押金
|
||||
if (index == 4) {
|
||||
pageWechatDeposit({
|
||||
uid: uni.getStorageSync('user_id')
|
||||
}).then(res => {
|
||||
app.orderList = res.list;
|
||||
if(res.count == 0){
|
||||
app.loadMore = 'no-more'
|
||||
}
|
||||
uni.hideLoading()
|
||||
})
|
||||
return false
|
||||
}
|
||||
this.where.page = 1;
|
||||
this.orderList = [];
|
||||
this.reload()
|
||||
},
|
||||
openUrl(url) {
|
||||
uni.navigateTo({
|
||||
url
|
||||
})
|
||||
},
|
||||
toPay(orderId) {
|
||||
uni.navigateTo({
|
||||
url: '/package/booking/confirm?id=' + orderId
|
||||
})
|
||||
},
|
||||
closeOrder(item) {
|
||||
uni.showModal({
|
||||
title: '确定取消此订单?',
|
||||
success(o) {
|
||||
if (o.confirm) {
|
||||
OrderApi.updateOrder({
|
||||
orderStatus: 2,
|
||||
orderId: item.orderId
|
||||
}).then(msg => {
|
||||
uni.showToast({
|
||||
title: msg,
|
||||
icon: 'none'
|
||||
})
|
||||
item.orderStatus = 2;
|
||||
}).catch(() => {
|
||||
uni.showToast({
|
||||
title: '请检查您的网络.',
|
||||
icon: 'none'
|
||||
})
|
||||
uni.hideLoading()
|
||||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
// 弹出登录提示框
|
||||
async openLogin() {
|
||||
this.userId = uni.getStorageSync('user_id');
|
||||
if (!this.userId) {
|
||||
this.$refs.login.open('bottom')
|
||||
return false;
|
||||
}
|
||||
},
|
||||
// 申请开票
|
||||
onInvoice(id) {
|
||||
uni.navigateTo({
|
||||
url: '/package/user/invoice?id=' + id
|
||||
})
|
||||
},
|
||||
showInvoice(id){
|
||||
uni.navigateTo({
|
||||
url: `/package/user/invoice-show?id=${id}`
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.content {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 150px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.segmented {
|
||||
padding: 0 12rpx;
|
||||
}
|
||||
|
||||
.content-text {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.color-tag {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
.uni-list {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.order {
|
||||
.order-title {
|
||||
|
||||
padding: 20rpx 0;
|
||||
border-bottom: 1px #eee solid;
|
||||
|
||||
.merchant-avatar {
|
||||
margin-right: 12rpx;
|
||||
}
|
||||
|
||||
.merchant-name {
|
||||
// padding-left: 12rpx;
|
||||
}
|
||||
|
||||
.btn-status {
|
||||
font-size: 30rpx;
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
.order-body {
|
||||
padding: 16px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.ele-flex {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.card-actions {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
height: 45px;
|
||||
border-top: 1px #eee solid;
|
||||
}
|
||||
|
||||
.card-actions-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.card-actions-item-text {
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.close {
|
||||
top: 60rpx !important;
|
||||
}
|
||||
|
||||
.total-price {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
font-size: 30rpx;
|
||||
align-items: flex-start;
|
||||
padding-left: 6rpx;
|
||||
margin-left: 450rpx;
|
||||
|
||||
.web-text-heading {
|
||||
font-size: 30rpx !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,407 @@
|
||||
<template>
|
||||
<view class="waterfall">
|
||||
<!-- 商城导航图标 -->
|
||||
<block v-if="navigation.length > 0">
|
||||
<div class="user-oreder web-cell">
|
||||
<block v-for="(item,index) in goodsCategoryList" :key="index">
|
||||
<div class="web-cell-content web-text-center" @click="onCategory(item)">
|
||||
<image :src="item.image" style="width: 30px; height: 30px;" mode="widthFix"></image>
|
||||
<text>{{ item.title }}</text>
|
||||
</div>
|
||||
</block>
|
||||
</div>
|
||||
</block>
|
||||
<block v-else>
|
||||
<uni-card :border="false" :padding="'12px 4px'">
|
||||
<view class="web-cell" style="justify-content: center; align-items: center;">
|
||||
<uv-skeleton rows="0" avatar :loading="hideTools" :title="false">
|
||||
</uv-skeleton>
|
||||
<uv-skeleton rows="0" avatar :loading="hideTools" :title="false">
|
||||
</uv-skeleton>
|
||||
<uv-skeleton rows="0" avatar :loading="hideTools" :title="false">
|
||||
</uv-skeleton>
|
||||
<uv-skeleton rows="0" avatar :loading="hideTools" :title="false">
|
||||
</uv-skeleton>
|
||||
</view>
|
||||
</uni-card>
|
||||
</block>
|
||||
<block v-if="!hideTools">
|
||||
<view class="waterfall">
|
||||
<uv-waterfall ref="waterfall" v-model="goodsList" :add-time="10" :left-gap="leftGap"
|
||||
:right-gap="rightGap" :column-gap="columnGap" @changeList="changeList">
|
||||
<!-- 第一列数据 -->
|
||||
<template v-slot:list1>
|
||||
<!-- 为了磨平部分平台的BUG，必须套一层view -->
|
||||
<view>
|
||||
<view v-for="(item, index) in list1" :key="item.id" class="waterfall-item">
|
||||
<view class="waterfall-item__image" :style="[imageStyle(item)]" @click="navTo(item)">
|
||||
<image :src="item.image ? JSON.parse(item.image)[0] : []" mode="widthFix"
|
||||
:style="{width:item.width+'px'}"></image>
|
||||
</view>
|
||||
<view class="waterfall-item__ft">
|
||||
<view class="waterfall-item__ft__title" @click="navTo(item)">
|
||||
<text class="value">{{item.goodsName}}</text>
|
||||
</view>
|
||||
<view class="waterfall-item__ft__desc uv-line-2">
|
||||
<text class="web-text-danger">￥{{ item.price }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<!-- 第二列数据 -->
|
||||
<template v-slot:list2>
|
||||
<!-- 为了磨平部分平台的BUG，必须套一层view -->
|
||||
<view>
|
||||
<view v-for="(item, index) in list2" :key="item.id" class="waterfall-item">
|
||||
<view class="waterfall-item__image" :style="[imageStyle(item)]" @click="navTo(item)">
|
||||
<image :src="item.image ? JSON.parse(item.image)[0] : []" mode="widthFix"
|
||||
:style="{width:item.width+'px'}"></image>
|
||||
</view>
|
||||
<view class="waterfall-item__ft">
|
||||
<view class="waterfall-item__ft__title" @click="navTo(item)">
|
||||
<text class="value">{{item.goodsName}}</text>
|
||||
</view>
|
||||
<view class="waterfall-item__ft__desc uv-line-2">
|
||||
<text class="web-text-danger">￥{{ item.price }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</uv-waterfall>
|
||||
</view>
|
||||
</block>
|
||||
<block v-else>
|
||||
<view class="skeleton" style="display: flex;">
|
||||
<uni-card :border="false" :padding="'18px 6px'">
|
||||
<uv-skeleton rows="0" avatar avatarShape="square" avatarSize="100" :loading="hideTools"
|
||||
:title="false">
|
||||
</uv-skeleton>
|
||||
<uv-gap height="16"></uv-gap>
|
||||
<uv-skeleton rows="2" :loading="hideTools" :title="false">
|
||||
</uv-skeleton>
|
||||
</uni-card>
|
||||
<uni-card :border="false" :padding="'18px 6px'">
|
||||
<uv-skeleton rows="0" avatar avatarShape="square" avatarSize="100" :loading="hideTools"
|
||||
:title="false">
|
||||
</uv-skeleton>
|
||||
<uv-gap height="16"></uv-gap>
|
||||
<uv-skeleton rows="2" :loading="hideTools" :title="false">
|
||||
</uv-skeleton>
|
||||
</uni-card>
|
||||
</view>
|
||||
<view class="skeleton" style="display: flex;">
|
||||
<uni-card :border="false" :padding="'18px 6px'">
|
||||
<uv-skeleton rows="0" avatar avatarShape="square" avatarSize="100" :loading="hideTools"
|
||||
:title="false">
|
||||
</uv-skeleton>
|
||||
<uv-gap height="16"></uv-gap>
|
||||
<uv-skeleton rows="2" :loading="hideTools" :title="false">
|
||||
</uv-skeleton>
|
||||
</uni-card>
|
||||
<uni-card :border="false" :padding="'18px 6px'">
|
||||
<uv-skeleton rows="0" avatar avatarShape="square" avatarSize="100" :loading="hideTools"
|
||||
:title="false">
|
||||
</uv-skeleton>
|
||||
<uv-gap height="16"></uv-gap>
|
||||
<uv-skeleton rows="2" :loading="hideTools" :title="false">
|
||||
</uv-skeleton>
|
||||
</uni-card>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import * as GoodsApi from '@/api/shop/goods';
|
||||
import * as GoodsCategoryApi from '@/api/shop/goodsCategory';
|
||||
import {
|
||||
guid
|
||||
} from '@/uni_modules/uv-ui-tools/libs/function/index.js'
|
||||
import {
|
||||
useTenantStore
|
||||
} from '@/store/modules/tenant';
|
||||
|
||||
|
||||
const tenantStore = useTenantStore();
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
goodsList: [], // 瀑布流全部数据
|
||||
list1: [], // 瀑布流第一列数据
|
||||
list2: [], // 瀑布流第二列数据
|
||||
goodsCategoryList: [], // 商品分类
|
||||
leftGap: 10,
|
||||
rightGap: 10,
|
||||
columnGap: 10,
|
||||
// 小程序导航图标
|
||||
navigation: [],
|
||||
// 骨架屏
|
||||
hideTools: true,
|
||||
// 商品分类
|
||||
categoryId: undefined
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
imageStyle(item) {
|
||||
return item => {
|
||||
const v = uni.upx2px(750) - this.leftGap - this.rightGap - this.columnGap;
|
||||
const w = v / 2;
|
||||
const rate = w / item.w;
|
||||
const h = rate * item.h;
|
||||
return {
|
||||
width: w + 'px',
|
||||
height: h + 'px'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
async onLoad() {
|
||||
// const {
|
||||
// data
|
||||
// } = await this.getData();
|
||||
// this.list = data;
|
||||
|
||||
// 获取服务租户信息包
|
||||
const info = await tenantStore.fetchTenantInfo();
|
||||
|
||||
// 解析小程序导航图标
|
||||
if (info.mpMenus) {
|
||||
const arr1 = info.mpMenus.filter(d => (d.type == 3))
|
||||
console.log('info.mpMenus: ', arr1);
|
||||
if (arr1) {
|
||||
this.navigation = arr1
|
||||
}
|
||||
}
|
||||
// 请求数据
|
||||
this.reload()
|
||||
|
||||
},
|
||||
methods: {
|
||||
async reload() {
|
||||
const app = this
|
||||
|
||||
// 获取服务租户信息包
|
||||
const info = await tenantStore.fetchTenantInfo();
|
||||
|
||||
// 登录状态
|
||||
if (uni.getStorageSync('user_id') && uni.getStorageSync('access_token')) {
|
||||
app.isLogin = true;
|
||||
}
|
||||
|
||||
// 解析小程序导航图标
|
||||
if (info.mpMenus) {
|
||||
const arr1 = info.mpMenus.filter(d => (d.type == 3))
|
||||
console.log('info.mpMenus: ', arr1);
|
||||
if (arr1) {
|
||||
app.navigation = arr1
|
||||
}
|
||||
}
|
||||
// 请求数据
|
||||
Promise.all([app.pageGoods(),app.getGoodsCategory()])
|
||||
.then((res) => {
|
||||
app.goodsList = res[0];
|
||||
app.goodsCategoryList = res[1];
|
||||
app.hideTools = false
|
||||
})
|
||||
},
|
||||
pageGoods() {
|
||||
const app = this
|
||||
const { categoryId } = this
|
||||
return new Promise((resolve, reject) => {
|
||||
GoodsApi.pageGoods({parentId: categoryId})
|
||||
.then(result => {
|
||||
resolve(result.list)
|
||||
})
|
||||
.catch(reject)
|
||||
})
|
||||
},
|
||||
getGoodsCategory(){
|
||||
const app = this
|
||||
return new Promise((resolve, reject) => {
|
||||
GoodsCategoryApi.pageGoodsCategory({parentId: 0})
|
||||
.then(result => {
|
||||
resolve(result.list)
|
||||
})
|
||||
.catch(reject)
|
||||
})
|
||||
},
|
||||
navTo(item) {
|
||||
uni.navigateTo({
|
||||
url: '/package/goods/detail?id=' + item.goodsId
|
||||
})
|
||||
},
|
||||
onCategory(item){
|
||||
this.categoryId = item.categoryId
|
||||
this.goodsList = []
|
||||
this.list1 = []
|
||||
this.list2 = []
|
||||
this.reload()
|
||||
},
|
||||
// 这点非常重要：e.name在这里返回是list1或list2，要手动将数据追加到相应列
|
||||
changeList(e) {
|
||||
console.log('e: ', e);
|
||||
this[e.name].push(e.value);
|
||||
},
|
||||
// 模拟的后端数据
|
||||
getData() {
|
||||
return new Promise((resolve) => {
|
||||
const imgs = [{
|
||||
url: 'https://via.placeholder.com/100x110.png/3c9cff/fff',
|
||||
width: 100,
|
||||
height: 110
|
||||
},
|
||||
{
|
||||
url: 'https://via.placeholder.com/200x220.png/f9ae3d/fff',
|
||||
width: 200,
|
||||
height: 220
|
||||
},
|
||||
{
|
||||
url: 'https://via.placeholder.com/300x340.png/5ac725/fff',
|
||||
width: 300,
|
||||
height: 340
|
||||
},
|
||||
{
|
||||
url: 'https://via.placeholder.com/400x400.png/f56c6c/fff',
|
||||
width: 400,
|
||||
height: 400
|
||||
},
|
||||
{
|
||||
url: 'https://via.placeholder.com/500x510.png/909399/fff',
|
||||
width: 500,
|
||||
height: 510
|
||||
},
|
||||
{
|
||||
url: 'https://via.placeholder.com/600x606.png/3c9cff/fff',
|
||||
width: 600,
|
||||
height: 606
|
||||
},
|
||||
{
|
||||
url: 'https://via.placeholder.com/310x422.png/f1a532/fff',
|
||||
width: 310,
|
||||
height: 422
|
||||
},
|
||||
{
|
||||
url: 'https://via.placeholder.com/320x430.png/3c9cff/fff',
|
||||
width: 320,
|
||||
height: 430
|
||||
},
|
||||
{
|
||||
url: 'https://via.placeholder.com/330x424.png/f9ae3d/fff',
|
||||
width: 330,
|
||||
height: 424
|
||||
},
|
||||
{
|
||||
url: 'https://via.placeholder.com/340x435.png/5ac725/fff',
|
||||
width: 340,
|
||||
height: 435
|
||||
},
|
||||
{
|
||||
url: 'https://via.placeholder.com/350x440.png/f56c6c/fff',
|
||||
width: 350,
|
||||
height: 440
|
||||
},
|
||||
{
|
||||
url: 'https://via.placeholder.com/380x470.png/909399/fff',
|
||||
width: 380,
|
||||
height: 470
|
||||
}
|
||||
];
|
||||
let list = [];
|
||||
const doFn = (i) => {
|
||||
const randomIndex = Math.floor(Math.random() * 10);
|
||||
return {
|
||||
id: guid(),
|
||||
allowEdit: i == 0,
|
||||
image: imgs[randomIndex].url,
|
||||
w: imgs[randomIndex].width,
|
||||
h: imgs[randomIndex].height,
|
||||
title: i % 2 == 0 ? `(${this.list.length + i + 1})体验uv-ui框架` :
|
||||
`(${this.list.length + i +1})uv-ui支持多平台`,
|
||||
desc: i % 2 == 0 ? `(${this.list.length + i + 1})欢迎使用uv-ui，uni-app生态专用的UI框架` :
|
||||
`(${this.list.length + i})开发者编写一套代码， 可发布到iOS、Android、H5、以及各种小程序`
|
||||
}
|
||||
};
|
||||
// 模拟异步
|
||||
setTimeout(() => {
|
||||
for (let i = 0; i < 20; i++) {
|
||||
list.push(doFn(i));
|
||||
}
|
||||
resolve({
|
||||
data: list
|
||||
});
|
||||
}, 200)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
page {
|
||||
/* background: url('https://oss.wsdns.cn/20240505/eaa18a0271fa42aa8395bd5eb874808a.png') no-repeat; */
|
||||
background-size: 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-color: #f0f2f5;
|
||||
width: 750rpx;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
</style>
|
||||
<style scoped lang="scss">
|
||||
$show-lines: 1;
|
||||
@import '@/uni_modules/uv-ui-tools/libs/css/variable.scss';
|
||||
|
||||
.waterfall-item {
|
||||
overflow: hidden;
|
||||
margin-top: 10px;
|
||||
border-radius: 6px;
|
||||
|
||||
&__image {
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.waterfall-item__ft {
|
||||
padding: 20rpx;
|
||||
background: #fff;
|
||||
|
||||
&__title {
|
||||
margin-bottom: 10rpx;
|
||||
line-height: 48rpx;
|
||||
font-weight: 700;
|
||||
|
||||
.value {
|
||||
font-size: 32rpx;
|
||||
color: #303133;
|
||||
}
|
||||
}
|
||||
|
||||
&__desc .value {
|
||||
font-size: 28rpx;
|
||||
color: #606266;
|
||||
}
|
||||
|
||||
&__btn {
|
||||
padding: 10px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.user-oreder {
|
||||
width: 720rpx;
|
||||
margin: 20rpx auto 8rpx auto;
|
||||
padding: 28rpx 0;
|
||||
border-radius: 16rpx;
|
||||
background: #fff;
|
||||
|
||||
.web-cell-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.web-text-center {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,231 @@
|
||||
<template>
|
||||
<view class="page">
|
||||
<!-- 顶部距离 -->
|
||||
<view class="header" :style="'margin-top: ' + statusBarHeight + 'px'"></view>
|
||||
<!-- 用户信息 -->
|
||||
<ws-user-card :data="userInfo" :is-login="isLogin" @openLogin="openLogin" />
|
||||
<block v-if="hideTools">
|
||||
<uni-card :border="false" :padding="'18px 8px'">
|
||||
<uv-skeleton rows="2" :loading="hideTools" :title="false"></uv-skeleton>
|
||||
</uni-card>
|
||||
<uni-card :border="false" :padding="'18px 8px'">
|
||||
<uv-skeleton rows="9" :loading="hideTools" :title="false"></uv-skeleton>
|
||||
</uni-card>
|
||||
</block>
|
||||
<block v-else>
|
||||
<!-- 收藏|关注|足迹|作品 -->
|
||||
<!-- <ws-user-collect></ws-user-collect> -->
|
||||
<!-- 我的资产 -->
|
||||
<ws-my-asset :data="userInfo" :is-login="isLogin" @done="openLogin"></ws-my-asset>
|
||||
<!-- 我的订单 -->
|
||||
<!-- <ws-user-order :order="order" :is-login="isLogin" @done="openLogin"></ws-user-order> -->
|
||||
<!-- 其他功能 -->
|
||||
<uni-card :border="false" :padding="0">
|
||||
<!-- 场馆管理可见-->
|
||||
<block v-if="hasMerchantRole || hasMerchantClerkRole">
|
||||
<view class="server" style="min-height: 200px">
|
||||
<uni-list :border="false">
|
||||
<block v-for="(item, index) in server" :key="index">
|
||||
<uni-list-item :thumb="item.icon" link @click="navTo(item)">
|
||||
<template v-slot:body>
|
||||
<view class="slot-box">
|
||||
<text class="slot-text" :style="{ color: item.color ? item.color : '#333333' }">{{ item.title }}</text>
|
||||
</view>
|
||||
</template>
|
||||
</uni-list-item>
|
||||
</block>
|
||||
</uni-list>
|
||||
</view>
|
||||
</block>
|
||||
<block v-else>
|
||||
<!-- 普通会员菜单 -->
|
||||
<view class="server" style="min-height: 200px">
|
||||
<uni-list :border="false">
|
||||
<block v-for="(item, index) in server" :key="index">
|
||||
<uni-list-item :thumb="item.icon" link @click="navTo(item)">
|
||||
<template v-slot:body>
|
||||
<view class="slot-box">
|
||||
<text class="slot-text" :style="{ color: item.color ? item.color : '#333333' }">{{ item.title }}</text>
|
||||
</view>
|
||||
</template>
|
||||
</uni-list-item>
|
||||
</block>
|
||||
</uni-list>
|
||||
</view>
|
||||
</block>
|
||||
</uni-card>
|
||||
<!-- 登录组件 -->
|
||||
<ws-login ref="login" :logo="logo" @done="reload" />
|
||||
<!-- 退出按钮 -->
|
||||
<ws-logout v-if="isLogin" @done="reload"></ws-logout>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
import * as UserApi from '@/api/booking/users';
|
||||
import * as MpMenuApi from '@/api/cms/mp-menu/index';
|
||||
import * as UserCardApi from '@/api/booking/userCard';
|
||||
import { updateUsers } from '@/api/shop/users';
|
||||
import { openUrl } from '@/utils/common';
|
||||
import { getWxOpenId } from '@/api/passport/login';
|
||||
|
||||
import { useTenantStore } from '@/store/modules/tenant';
|
||||
|
||||
const tenantStore = useTenantStore();
|
||||
|
||||
const userStore = useUserStore();
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
statusBarHeight: 104,
|
||||
isLogin: false,
|
||||
userInfo: {},
|
||||
fields: {},
|
||||
logo: '',
|
||||
bookingUser: {},
|
||||
merchantList: [],
|
||||
server: [],
|
||||
order: [],
|
||||
hideUser: true,
|
||||
hideTools: true,
|
||||
// 是否拥有场馆管理员权限
|
||||
hasMerchantRole: false,
|
||||
// 是否拥有场馆职员权限
|
||||
hasMerchantClerkRole: false,
|
||||
// 是否拥有超级管理员权限
|
||||
hasSuperAdminRole: false
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.reload();
|
||||
},
|
||||
methods: {
|
||||
async reload(e) {
|
||||
const app = this;
|
||||
// 获取系统信息
|
||||
uni.getSystemInfo({
|
||||
success(data) {
|
||||
if (data) {
|
||||
app.statusBarHeight = data.statusBarHeight + 50;
|
||||
}
|
||||
}
|
||||
});
|
||||
// 当前租户信息
|
||||
const tenantInfo = await tenantStore.fetchTenantInfo();
|
||||
app.logo = tenantInfo.websiteLogo;
|
||||
if (tenantInfo.fields) {
|
||||
tenantInfo.fields.map((d) => {
|
||||
const key = d.name;
|
||||
app.fields[key] = d.value;
|
||||
});
|
||||
}
|
||||
|
||||
// 当前登录用户信息
|
||||
const userInfo = await userStore.fetchUserInfo();
|
||||
if (Object.keys(userInfo).length > 0) {
|
||||
app.isLogin = true;
|
||||
app.userInfo = userInfo;
|
||||
uni.setStorageSync('user_id', app.userInfo.userId);
|
||||
|
||||
// 判断用户角色
|
||||
app.hasMerchantRole = userInfo.roles.find((d) => d.roleCode === 'merchant');
|
||||
app.hasMerchantClerkRole = userInfo.roles.find((d) => d.roleCode === 'merchantClerk');
|
||||
app.hasSuperAdminRole = userInfo.roles.find((d) => d.roleCode === 'superAdmin');
|
||||
|
||||
// 获取用户副表信息
|
||||
UserApi.getByPhone({
|
||||
phone: userInfo.phone
|
||||
}).then((data) => {
|
||||
if (data) {
|
||||
app.hideUser = false;
|
||||
app.userInfo.ouid = data.uid;
|
||||
uni.setStorageSync('ouid',data.uid);
|
||||
app.userInfo = Object.assign({}, app.userInfo, data);
|
||||
}
|
||||
});
|
||||
|
||||
if(!uni.getStorageSync('openid')){
|
||||
// 更新openid
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.login({
|
||||
success: (res) => {
|
||||
getWxOpenId({
|
||||
code: res.code
|
||||
}).then((response) => {
|
||||
uni.setStorageSync('openid',response.openid);
|
||||
updateUsers({
|
||||
uid: app.userInfo.ouid,
|
||||
openid: response.openid,
|
||||
sessionKey: response.session_key,
|
||||
unionid: response.unionid
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
}
|
||||
|
||||
} else {
|
||||
app.isLogin = false;
|
||||
app.userInfo = {};
|
||||
}
|
||||
// 菜单数据
|
||||
MpMenuApi.pageMpMenu({ type: 0, limit: 100 })
|
||||
.then((res) => {
|
||||
app.order = res.list.filter((d) => d.rows == 0);
|
||||
app.server = res.list.filter((d) => d.rows == 1);
|
||||
// console.log('app.hasMerchantRole: ',app.hasMerchantRole);
|
||||
// console.log('app.hasMerchantClerkRole: ',app.hasMerchantClerkRole);
|
||||
// console.log('app.hasSuperAdminRole: ',app.hasSuperAdminRole);
|
||||
if(!app.hasMerchantRole && !app.hasMerchantClerkRole){
|
||||
// console.log('11111: ',11111);
|
||||
app.server = res.list.filter((d) => d.rows == 1 && d.adminShow == 0);
|
||||
}
|
||||
app.hideTools = false;
|
||||
})
|
||||
.catch(() => {
|
||||
uni.showToast({
|
||||
title: '请检查您的网络.',
|
||||
icon: 'none'
|
||||
});
|
||||
app.hideTools = false;
|
||||
});
|
||||
|
||||
UserCardApi.pageUserCard({payStatus:1, userId: uni.getStorageSync('user_id')}).then(res => {
|
||||
console.log('res8888889: ',res);
|
||||
app.userInfo.cards = res.count
|
||||
app.userInfo.coupon = 1;
|
||||
})
|
||||
},
|
||||
navTo(item) {
|
||||
if (!this.isLogin) {
|
||||
this.$refs.login.open('bottom');
|
||||
return false;
|
||||
} else {
|
||||
openUrl(item);
|
||||
}
|
||||
},
|
||||
// 弹出登录提示框
|
||||
openLogin() {
|
||||
if (!this.isLogin) {
|
||||
this.$refs.login.open('bottom');
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
page {
|
||||
background: url('https://oss.wsdns.cn/20240502/75fc744657544a38a32f83a825688286.png') no-repeat;
|
||||
background-size: 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-color: #f0f2f5;
|
||||
width: 750rpx;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss"></style>
|
||||
Reference in New Issue
Block a user