|
@@ -1,18 +1,54 @@
|
|
|
<!--
|
|
<!--
|
|
|
个人首页
|
|
个人首页
|
|
|
- 已登录用户在这里管理花店,并在花店列表加载后接收尚未通知的红包到账提醒。
|
|
|
|
|
|
|
+ 未登录展示示意花店引导登录;已登录管理真实花店,并在列表加载后接收尚未通知的红包到账提醒。
|
|
|
-->
|
|
-->
|
|
|
<template>
|
|
<template>
|
|
|
<view class="page-container">
|
|
<view class="page-container">
|
|
|
- <!-- 未登录状态 -->
|
|
|
|
|
|
|
+ <!-- 未登录:展示示意花店,点击后引导去登录 -->
|
|
|
<block v-if="loginStyle == 0">
|
|
<block v-if="loginStyle == 0">
|
|
|
<!-- 无网络提示条 -->
|
|
<!-- 无网络提示条 -->
|
|
|
<no-network-bar></no-network-bar>
|
|
<no-network-bar></no-network-bar>
|
|
|
- <view class="login-container">
|
|
|
|
|
- <view class="login-content">
|
|
|
|
|
- <text class="login-title">欢迎使用</text>
|
|
|
|
|
- <text class="login-subtitle">登录查看您的花店</text>
|
|
|
|
|
- <button class="login-btn" @click="pageTo({ url: '/pages/login/index?needBack=1' })"> 立即登录 </button>
|
|
|
|
|
|
|
+ <view class="main-content">
|
|
|
|
|
+ <view class="shop-list">
|
|
|
|
|
+ <view
|
|
|
|
|
+ class="shop-card guest-shop-card"
|
|
|
|
|
+ v-for="item in guestShopList"
|
|
|
|
|
+ :key="item.id"
|
|
|
|
|
+ @click="goLoginFromGuestShop"
|
|
|
|
|
+ >
|
|
|
|
|
+ <view class="shop-header">
|
|
|
|
|
+ <view class="shop-avatar">
|
|
|
|
|
+ <image
|
|
|
|
|
+ class="shop-logo"
|
|
|
|
|
+ :src="item.smallAvatar"
|
|
|
|
|
+ mode="aspectFill"
|
|
|
|
|
+ />
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="shop-info">
|
|
|
|
|
+ <view class="shop-name-row">
|
|
|
|
|
+ <text class="shop-name">{{ item.name }}</text>
|
|
|
|
|
+ <view class="member-tag">
|
|
|
|
|
+ <sprite-icon name="huangguan" :size="21" custom-class="member-crown-icon" />
|
|
|
|
|
+ <text class="member-tag-text">{{ item.levelText }}</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <text class="shop-address">{{ item.address }}</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="shop-main-actions">
|
|
|
|
|
+ <view class="balance-btn">
|
|
|
|
|
+ <sprite-icon name="huashu" :size="40" custom-class="action-icon-slot" />
|
|
|
|
|
+ <view class="balance-btn-content">
|
|
|
|
|
+ <text class="balance-btn-label">余额</text>
|
|
|
|
|
+ <text class="balance-btn-value">{{ item.balanceText }}</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="enter-btn">
|
|
|
|
|
+ <sprite-icon name="hua" :size="40" custom-class="action-icon-slot" />
|
|
|
|
|
+ <text class="enter-btn-text">进入店铺</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
|
</block>
|
|
</block>
|
|
@@ -185,6 +221,36 @@ export default {
|
|
|
hbArrivalInfo: {},
|
|
hbArrivalInfo: {},
|
|
|
hbArrivalIds: [],
|
|
hbArrivalIds: [],
|
|
|
hbArrivalLoading: false,
|
|
hbArrivalLoading: false,
|
|
|
|
|
+ /**
|
|
|
|
|
+ * 未登录时展示的示意花店列表。
|
|
|
|
|
+ * 仅作界面引导,点击任意店铺都跳转登录页,不请求真实门店数据。
|
|
|
|
|
+ */
|
|
|
|
|
+ guestShopList: [
|
|
|
|
|
+ {
|
|
|
|
|
+ id: "guest-1",
|
|
|
|
|
+ name: "花语时光鲜花店",
|
|
|
|
|
+ address: "锦江区春熙路步行街 18 号",
|
|
|
|
|
+ levelText: "黄金会员",
|
|
|
|
|
+ balanceText: "1280.00",
|
|
|
|
|
+ smallAvatar: require("@/static/images/default-img.png"),
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ id: "guest-2",
|
|
|
|
|
+ name: "遇见花开",
|
|
|
|
|
+ address: "武侯区科华北路 88 号",
|
|
|
|
|
+ levelText: "白银会员",
|
|
|
|
|
+ balanceText: "560.50",
|
|
|
|
|
+ smallAvatar: require("@/static/images/default-img.png"),
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ id: "guest-3",
|
|
|
|
|
+ name: "绿野仙踪花坊",
|
|
|
|
|
+ address: "高新区天府大道中段 99 号",
|
|
|
|
|
+ levelText: "普通会员",
|
|
|
|
|
+ balanceText: "88.00",
|
|
|
|
|
+ smallAvatar: require("@/static/images/default-img.png"),
|
|
|
|
|
+ },
|
|
|
|
|
+ ],
|
|
|
};
|
|
};
|
|
|
},
|
|
},
|
|
|
computed: {
|
|
computed: {
|
|
@@ -233,6 +299,13 @@ export default {
|
|
|
this.toBottom();
|
|
this.toBottom();
|
|
|
},
|
|
},
|
|
|
methods: {
|
|
methods: {
|
|
|
|
|
+ /**
|
|
|
|
|
+ * 未登录示意花店点击:统一跳登录页。
|
|
|
|
|
+ * 登录成功后可按 needBack 返回本页查看真实花店。
|
|
|
|
|
+ */
|
|
|
|
|
+ goLoginFromGuestShop() {
|
|
|
|
|
+ this.pageTo({ url: "/pages/login/index?needBack=1" });
|
|
|
|
|
+ },
|
|
|
recharge(item) {
|
|
recharge(item) {
|
|
|
this.pageTo({
|
|
this.pageTo({
|
|
|
url:
|
|
url:
|
|
@@ -487,55 +560,16 @@ page {
|
|
|
padding-bottom: calc(20upx + env(safe-area-inset-bottom));
|
|
padding-bottom: calc(20upx + env(safe-area-inset-bottom));
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-// 登录页面样式
|
|
|
|
|
-.login-container {
|
|
|
|
|
- display: flex;
|
|
|
|
|
- align-items: center;
|
|
|
|
|
- justify-content: center;
|
|
|
|
|
- min-height: 70vh;
|
|
|
|
|
- padding: 0upx 40upx 40upx 40upx;
|
|
|
|
|
-
|
|
|
|
|
- .login-content {
|
|
|
|
|
- text-align: center;
|
|
|
|
|
-
|
|
|
|
|
- .login-title {
|
|
|
|
|
- display: block;
|
|
|
|
|
- font-size: 48upx;
|
|
|
|
|
- font-weight: 600;
|
|
|
|
|
- color: #333;
|
|
|
|
|
- margin-bottom: 16upx;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .login-subtitle {
|
|
|
|
|
- display: block;
|
|
|
|
|
- font-size: 34upx;
|
|
|
|
|
- color: #666;
|
|
|
|
|
- margin-top:50upx;
|
|
|
|
|
- margin-bottom: 60upx;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .login-btn {
|
|
|
|
|
- background: linear-gradient(135deg, #ff6b6b 0%, #ee5a24 100%);
|
|
|
|
|
- color: white;
|
|
|
|
|
- border: none;
|
|
|
|
|
- border-radius: 50upx;
|
|
|
|
|
- padding: 24upx 60upx;
|
|
|
|
|
- font-size: 32upx;
|
|
|
|
|
- font-weight: 500;
|
|
|
|
|
- box-shadow: 0 8upx 20upx rgba(255, 107, 107, 0.3);
|
|
|
|
|
-
|
|
|
|
|
- &:active {
|
|
|
|
|
- box-shadow: 0 4upx 12upx rgba(255, 107, 107, 0.4);
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
-}
|
|
|
|
|
-
|
|
|
|
|
// 主要内容区域
|
|
// 主要内容区域
|
|
|
.main-content {
|
|
.main-content {
|
|
|
width: 100%;
|
|
width: 100%;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+/* 未登录示意卡片:按下反馈,提示可点击去登录 */
|
|
|
|
|
+.guest-shop-card:active {
|
|
|
|
|
+ opacity: 0.92;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
// 花店列表
|
|
// 花店列表
|
|
|
.shop-list {
|
|
.shop-list {
|
|
|
padding: 20upx 24upx 40upx;
|
|
padding: 20upx 24upx 40upx;
|