431 lines
10 KiB
Vue
431 lines
10 KiB
Vue
<template>
|
|
<view class="homePage">
|
|
<view class="home-navbar">
|
|
<!-- <custom-navbar
|
|
title=""
|
|
:show-back="false"
|
|
title-color="#333333"
|
|
:backgroundColor="backgroundColor"
|
|
></custom-navbar> -->
|
|
<view class="home_info">
|
|
<view class="home_info_left">
|
|
<view class="home_info_left_text" v-if="userInfo.id_type == 1">
|
|
<view class="nameText line-1">{{ nameText }}</view>
|
|
<view class="set_btn" @click="goAcceptSet">营业设置</view>
|
|
</view>
|
|
<view class="home_info_left_text" v-else-if="userInfo.id_type == 2">
|
|
<view class="nameText line-1">{{ nameText }}</view>
|
|
<view class="set_btn" @click="goAcceptSet">营业设置</view>
|
|
</view>
|
|
<view class="home_info_left_text" v-else>{{ nameText }}</view>
|
|
<view class="home_info_left_tip">{{ tipText }}</view>
|
|
</view>
|
|
<view class="home_info_right">
|
|
|
|
<image
|
|
src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/616767e1-e935-4c9c-a8e1-a099b6db4084.png"
|
|
class="home_info_right_img"
|
|
></image>
|
|
</view>
|
|
</view>
|
|
<filters
|
|
:isLogin="isLogin"
|
|
:selfState="userInfo.self_state"
|
|
@secondClassLength="(e) => (secondLength = e)"
|
|
></filters>
|
|
</view>
|
|
<upload-app-vue></upload-app-vue>
|
|
<TabBar :selected="0"></TabBar>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import TabBar from "@/components/tabbar/tabbar.vue"
|
|
import projectTabs from "./components/project-tabs.vue";
|
|
import request from "@/utils/request";
|
|
|
|
import filters from "./components/filters.vue";
|
|
import CustomNavbar from "@/components/custom-navbar/custom-navbar.vue";
|
|
export default {
|
|
data() {
|
|
return {
|
|
secondLength: 2, //2级菜单所占排数
|
|
name: "",
|
|
statusBarHeight: 0,
|
|
listQuery: {},
|
|
latitude: "",
|
|
longitude: getApp().globalData.longitude,
|
|
latitude: getApp().globalData.latitude,
|
|
servers_region: getApp().globalData.servers_region,
|
|
address: getApp().globalData.address,
|
|
isLogin: false,
|
|
backgroundColor: "transparent",
|
|
syrId: null,
|
|
userInfo: {},
|
|
isShowCheckShop: false,
|
|
sjInfo: {},
|
|
sjList: [],
|
|
};
|
|
},
|
|
components: {
|
|
filters,
|
|
projectTabs,
|
|
CustomNavbar,
|
|
TabBar
|
|
},
|
|
computed: {
|
|
shopText() {
|
|
if (!this.isLogin) return "请选择门店";
|
|
if (this.sjInfo && this.sjInfo.id) return this.sjInfo.name;
|
|
return "全部门店";
|
|
},
|
|
tipText() {
|
|
if (!this.isLogin) return "登录后可体验更多服务";
|
|
if (this.userInfo.id_type == 1) return "欢迎登陆美融融商家！";
|
|
|
|
return "入驻后可体验更多服务";
|
|
},
|
|
nameText() {
|
|
if (!this.isLogin) return "欢迎登录美融融商家";
|
|
if (this.userInfo.id_type == 1){
|
|
return this.userInfo.name || this.userInfo.nick_name;
|
|
}
|
|
return "欢迎使用美融融商家";
|
|
},
|
|
// 判断是否账号已停止使用
|
|
isAccountDisabled() {
|
|
return this.userInfo?.is_ok === 2;
|
|
},
|
|
},
|
|
onShow() {
|
|
this.isLogin = uni.getStorageSync("accessToken") ? true : false;
|
|
if (this.isLogin) {
|
|
this.getUserInfo();
|
|
}
|
|
},
|
|
onLoad() {
|
|
uni.hideTabBar();
|
|
},
|
|
|
|
methods: {
|
|
// 显示账号停用提示
|
|
showStopUseModal() {
|
|
uni.showModal({
|
|
title: "提示",
|
|
content:
|
|
"您的账号已停止使用。若有疑问或恢复需求，请尽快联系平台工作人员核实处理。",
|
|
showCancel: false,
|
|
confirmText: "我知道了",
|
|
});
|
|
},
|
|
|
|
goAcceptSet() {
|
|
// 添加访问检查
|
|
if (this.isAccountDisabled) {
|
|
this.showStopUseModal();
|
|
return;
|
|
}
|
|
uni.navigateTo({
|
|
url: "/pages/shop/set",
|
|
});
|
|
},
|
|
getUserInfo() {
|
|
request.post("/sj/user/getUser").then((result) => {
|
|
this.userInfo = result.data;
|
|
//存储用户id
|
|
uni.setStorageSync("syrId", result.data.id);
|
|
this.syrId = result.data.id;
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
// background: linear-gradient(to bottom, #fafafa, #ffffff);
|
|
background: #f5f5f5;
|
|
}
|
|
|
|
.homePage {
|
|
background-image: url("https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/bf0dd63c-4205-4af5-a29f-8a9b4ee4188b.png");
|
|
background-position: 0 0;
|
|
background-size: 100%;
|
|
background-repeat: no-repeat;
|
|
|
|
.home-navbar {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
.home_info {
|
|
height: 238rpx;
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: flex-end;
|
|
padding: 0rpx 0rpx 0 30rpx;
|
|
.home_info_left {
|
|
padding-bottom: 30rpx;
|
|
.home_info_left_text {
|
|
font-family:
|
|
PingFangSC,
|
|
PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 32rpx;
|
|
color: #333333;
|
|
text-align: left;
|
|
font-style: normal;
|
|
display: flex;
|
|
align-items: center;
|
|
.set_btn {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 108rpx;
|
|
height: 34rpx;
|
|
background: linear-gradient(180deg, #eb6248 0%, #ea4e45 100%);
|
|
border-radius: 20rpx;
|
|
font-family:
|
|
PingFangSC,
|
|
PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 20rpx;
|
|
color: #ffffff;
|
|
line-height: 28rpx;
|
|
}
|
|
}
|
|
.home_info_left_tip {
|
|
margin-top: 5rpx;
|
|
font-family:
|
|
PingFangSC,
|
|
PingFang SC;
|
|
font-weight: 400;
|
|
font-size: 26rpx;
|
|
color: #979797;
|
|
line-height: 37rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
}
|
|
|
|
.home_info_right {
|
|
padding-right: 30rpx;
|
|
height: 181rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
.change_shop {
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 10rpx;
|
|
max-width: 270rpx;
|
|
height: 64rpx;
|
|
font-size: 28rpx;
|
|
background: rgba(255, 255, 255, 0.24);
|
|
border-radius: 33rpx;
|
|
border: 1rpx solid #bab8bf;
|
|
padding: 16rpx 13rpx 16rpx 20rpx;
|
|
.change_shop_logo {
|
|
width: 34rpx;
|
|
height: 32rpx;
|
|
flex-shrink: 0;
|
|
}
|
|
.change_down_logo {
|
|
flex-shrink: 0;
|
|
width: 16rpx;
|
|
height: 10rpx;
|
|
}
|
|
.line-1 {
|
|
font-size: 28rpx;
|
|
}
|
|
}
|
|
.home_info_right_img {
|
|
width: 367rpx;
|
|
height: 143rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
//搜索组件样式渗透
|
|
::v-deep .uni-input-placeholder {
|
|
font-weight: 400;
|
|
font-size: 28rpx;
|
|
color: #cccccc;
|
|
line-height: 34rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
|
|
::v-deep .uv-icon__img {
|
|
width: 34rpx !important;
|
|
height: 34rpx !important;
|
|
}
|
|
|
|
//列表样式
|
|
.list-item {
|
|
align-items: flex-start;
|
|
background: #ffffff;
|
|
border-radius: 20rpx;
|
|
margin-bottom: 20rpx;
|
|
|
|
.list-item-left {
|
|
.list-item-left-img {
|
|
width: 172rpx;
|
|
height: 172rpx;
|
|
margin-right: 30rpx;
|
|
}
|
|
}
|
|
|
|
.list-item-right {
|
|
height: 172rpx;
|
|
align-content: space-between;
|
|
flex-wrap: wrap;
|
|
display: flex;
|
|
flex: 1;
|
|
padding-bottom: 30rpx;
|
|
border: none;
|
|
|
|
.list-item-right-left {
|
|
font-weight: 500;
|
|
font-size: 30rpx;
|
|
color: #333333;
|
|
line-height: 34rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
|
|
.list-item-right-right {
|
|
font-weight: 500;
|
|
font-size: 34rpx;
|
|
color: #e8101e;
|
|
line-height: 34rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
width: 100%;
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
|
|
.list-item-right-right-img {
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #ffffff;
|
|
line-height: 33rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 94rpx;
|
|
height: 44rpx;
|
|
background: linear-gradient(122deg, #fe78b3 0%, #e8101e 100%);
|
|
border-radius: 22rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.list-container {
|
|
padding: 0rpx !important;
|
|
}
|
|
|
|
.list-scroll {
|
|
margin-top: 0rpx !important;
|
|
}
|
|
.line-1 {
|
|
white-space: nowrap; /* 防止文本换行 */
|
|
overflow: hidden; /* 隐藏溢出的内容 */
|
|
text-overflow: ellipsis; /* 显示省略号来代表被裁剪的文本 */
|
|
}
|
|
.nameText {
|
|
max-width: 233rpx;
|
|
margin-right: 12rpx;
|
|
}
|
|
.mask {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
height: 100vh;
|
|
width: 100vw;
|
|
background-color: rgba(0, 0, 0, 0.4);
|
|
z-index: 1000;
|
|
}
|
|
.change_shop {
|
|
position: relative;
|
|
.select_box {
|
|
box-sizing: border-box;
|
|
position: absolute;
|
|
top: 70rpx;
|
|
right: 0;
|
|
width: 471rpx;
|
|
background-color: #fff;
|
|
overflow-y: auto;
|
|
z-index: 10000;
|
|
border-radius: 32rpx;
|
|
padding: 30rpx 24rpx 20rpx 24rpx; /* 调整上下内边距 */
|
|
max-height: 60vh;
|
|
|
|
/* 添加滚动条样式 */
|
|
&::-webkit-scrollbar {
|
|
width: 8rpx;
|
|
}
|
|
|
|
&::-webkit-scrollbar-track {
|
|
background: #f1f1f1;
|
|
border-radius: 4rpx;
|
|
}
|
|
|
|
&::-webkit-scrollbar-thumb {
|
|
background: #c1c1c1;
|
|
border-radius: 4rpx;
|
|
}
|
|
|
|
&::-webkit-scrollbar-thumb:hover {
|
|
background: #a8a8a8;
|
|
}
|
|
|
|
.select_item {
|
|
margin-bottom: 20rpx;
|
|
padding-bottom: 20rpx;
|
|
border-bottom: 2rpx solid #f1f1f1;
|
|
display: flex;
|
|
gap: 10rpx;
|
|
align-items: center;
|
|
|
|
&:last-child {
|
|
margin-bottom: 0;
|
|
border-bottom: none;
|
|
}
|
|
|
|
.line-1 {
|
|
max-width: 311rpx;
|
|
flex: 1;
|
|
}
|
|
.tag {
|
|
width: 102rpx;
|
|
height: 40rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: #fff;
|
|
border-radius: 10rpx;
|
|
font-size: 26rpx;
|
|
flex-shrink: 0;
|
|
}
|
|
.red {
|
|
background-color: #fe5855;
|
|
}
|
|
.gray {
|
|
background: #999999;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|