ccy_DIB/pages/userCenter/userCenter.vue
2025-08-20 11:48:20 +08:00

763 lines
20 KiB
Vue

<template>
<view class="main" style="padding-bottom: env(safe-area-inset-bottom)">
<view class="userBg">
<div class="headerTop" :style="{ height: menu.bottom + 5 + 'px' }">
<view class="news" :style="{
top: menu.top + 16 + 'px',
lineHeight: menu.bottom - menu.top + 'px',
}">
<view class="box">
<!-- @click="handleNews"-->
<image class="img" src="https://eshangtech.com/ShopICO/ahyd-BID/index/news.svg" @click="handleNews"></image>
<view class="red"></view>
</view>
</view>
<view class="userTitle" :style="{
top: menu.top + 'px',
lineHeight: menu.bottom - menu.top + 'px',
}">我的</view>
</div>
<div class="userBox" :style="{ top: menu.bottom + 18 + 'px' }">
<!-- <image class="userBgImg" src="https://eshangtech.com/ShopICO/ahyd-BID/user/userBg.png"></image> -->
<view class="box" v-if="user.Membership_Id">
<view class="headImg">
<image :src="user.Membership_Headimage"></image>
</view>
<view class="message">
<view class="people">
<p class="name">{{ user.Membership_Name || user.WeChat_UserName }}</p>
<!-- <view class="person"> <view class="personName">{{user.DepartmentName}}</view> </view>-->
<view class="person" v-if="user.DepartmentName">{{ user.DepartmentName }}</view>
</view>
<p class="phone">{{ handleGetPhone(user.Membership_Phone) }}</p>
<p class="address">{{ user.OwnerUnitName || "" }}</p>
</view>
</view>
<view v-else>
<p @click="handleGoEmpower">去授权</p>
</view>
<!-- <view class="other">
<view v-for="(item, index) in userLists" :key="index" class="item">
<image class="icon" :src="item.url"></image>
<span class="name">{{ item.name }}</span>
</view>
</view> -->
</div>
</view>
<view class="menu" :style="{ top: -(117 - menu.bottom) + 'px' }">
<userList v-for="(item, index) in dataList" :key="index" :item="item" :lastDay="lastDay" :isReturn="isReturn">
</userList>
</view>
<Tabbar ref="tabbar" :page="page"></Tabbar>
</view>
</template>
<script>
import request from "@/util/index.js";
import { mapActions, mapState } from "vuex";
import userList from "./components/userList.vue";
import Tabbar from "../../components/tabbar/tabbar.vue";
export default {
data() {
const lastDay = this.$util.cutDate(new Date(), "YYYY-MM-DD", -1);
return {
page: "/pages/userCenter/userCenter",
statusBarHeight: "",
menu: "",
lastDay: lastDay,
userLists: [
// {
// url: "https://eshangtech.com/ShopICO/ahyd-BID/user/position.svg",
// name: "我的服务区",
// value: 1,
// },
// {
// url: "https://eshangtech.com/ShopICO/ahyd-BID/user/limit.svg",
// name: "我的权限",
// value: 2,
// },
],
dataList: [
// {
// name: "商业经营",
// value: 1,
// list: [
// {
// id: "74934d31-385a-4eed-80bb-9c9ed7da29b5",
// name: "每日营收",
// homeUrl: "/pages/everdayRenven/index",
// imagePath:
// "https://eshangtech.com/ShopICO/ahyd-BID/user/dailyRevenue.svg",
// bgUrl:
// "https://eshangtech.com/ShopICO/ahyd-BID/user/firstBg_1.png",
// isNotice: true,
// value: 1,
// },
// {
// id: "",
// name: "节日特刊",
// homeUrl: `/pages/nationalPage/index?time=${lastDay}&type=true`,
// imagePath:
// "https://eshangtech.com/ShopICO/ahyd-BID/user/festival.svg",
// bgUrl:
// "https://eshangtech.com/ShopICO/ahyd-BID/user/firstBg_2.png",
// isNotice: true,
// value: 1,
// },
// {
// id: "4a34e1d4-47c9-4c06-8e8e-f38c6bd9450b",
// name: "经营报表",
// homeUrl: "/pages/operatingStatements/index",
// imagePath:
// "https://eshangtech.com/ShopICO/ahyd-BID/user/reportForms.svg",
// bgUrl:
// "https://eshangtech.com/ShopICO/ahyd-BID/user/firstBg_3.png",
// isNotice: true,
// value: 1,
// },
// ],
// },
// {
// name: "商业画像",
// value: 2,
// list: [
// {
// id: "",
// name: "客群",
// homeUrl: "/pages/commercialBI/guestPortrait",
// imagePath:
// "https://eshangtech.com/ShopICO/ahyd-BID/user/customerGroup.svg",
// isNotice: "",
// type: 2,
// value: 2,
// },
// {
// id: "",
// name: "经营",
// homeUrl: "/pages/commercialBI/managePortrait",
// imagePath:
// "https://eshangtech.com/ShopICO/ahyd-BID/user/manage.svg",
// isNotice: "",
// type: 3,
// value: 2,
// },
// {
// id: "",
// name: "交易",
// homeUrl: "/pages/commercialBI/businessPortrait",
// imagePath:
// "https://eshangtech.com/ShopICO/ahyd-BID/user/business.svg",
// isNotice: "",
// type: 4,
// value: 2,
// },
// {
// id: "",
// name: "品牌",
// homeUrl: "/pages/commercialBI/formatPortrait",
// imagePath:
// "https://eshangtech.com/ShopICO/ahyd-BID/user/brand.svg",
// isNotice: "",
// type: 5,
// value: 2,
// },
// ],
// },
{
name: "现场管理",
value: 4,
list: [
{
id: "",
name: "基础信息",
// homeUrl: "/pages/map/detail?come=user",
homeUrl: "/pages/summaryOfPortraits/index?index=0",
imagePath:
"https://eshangtech.com/ShopICO/ahyd-BID/user/basicInformation.svg",
isNotice: true,
notice: 0,
type: 0,
summaryOfPortraits: true,
value: 4,
},
],
},
],
isTrue: false, //最外面一层判断是否能跳转的依据
special: false,
isReturn: true,
};
},
components: {
userList,
Tabbar,
},
computed: {
...mapState({
toDoMsg: (state) => {
return state.toDoMsg;
},
user: (state) => {
return state.userData;
},
phone: (state) => {
let phoneStr = state.userData.Membership_Phone;
if (phoneStr) {
return (
phoneStr.substr(0, 3) +
" **** " +
phoneStr.substr(phoneStr.length - 2, phoneStr.length - 1)
);
} else {
return "";
}
},
}),
},
onLoad() {
// 获取手机参数 对页面进行自适应
let systemInfo = uni.getSystemInfoSync();
this.statusBarHeight = Number(systemInfo.statusBarHeight);
//拿到登录用户有权限的内容
this.menu = uni.getMenuButtonBoundingClientRect();
this.handleGetWarningList();
this.dataList[2].list.forEach((item) => {
for (let key in this.user.AuthorityInfo) {
if (key === item.id) {
if (this.user.AuthorityInfo[key] === 1) {
item.isNotice = true;
}
}
}
if (item.id === "a927bf4d-f924-4034-b964-d1a8bd401d09") {
item.isNotice = true;
}
});
//拿到登录用户有权限的内容 判断是否有角标
this.dataList[3].list.forEach((item) => {
for (let key in this.user.AuthorityInfo) {
if (key === item.id) {
if (this.user.AuthorityInfo[key] === 1) {
item.isNotice = true;
}
}
}
});
//拿到登录用户有权限的内容 判断是否有角标
this.dataList[2].list.forEach((item) => {
for (let key in this.toDoMsg) {
if (key === item.id) {
item.notice = this.toDoMsg[key];
}
}
});
this.dataList[3].list.forEach((item) => {
for (let key in this.toDoMsg) {
if (key === item.id) {
item.notice = this.toDoMsg[key];
}
}
});
//通过权限来判断是否可以点击跳转
let userInfo = uni.getStorageSync("vuex");
if (userInfo && userInfo.WeChat_UserId && userInfo.AuthorityInfo["89a1f248-2113-4d57-84b1-c2e6edb9e8ee"] === 1) {
this.isReturn = false;
} else if (userInfo && userInfo.WeChat_UserId && userInfo.AuthorityInfo["89a1f248-2113-4d57-84b1-c2e6edb9e8ee"] !== 1) {
uni.redirectTo({
url: `/pages/commercialBI/noData?type=homeIndex`,
});
}
if (
userInfo.userData.AuthorityInfo[
"89a1f248-2113-4d57-84b1-c2e6edb9e8ee"
] === 1
) {
this.isTrue = true;
} else {
this.isTrue = false;
uni.navigateTo({
url: `/pages/commercialBI/noData?type=index`,
});
}
},
onShow() {
uni.hideTabBar();
},
onUnload() {
this.$util.addUserBehavior();
},
methods: {
...mapActions(["getTodoList"]),
toPage(url) {
if (this.isTrue === true) {
this.$util.toNextRoute("navigateTo", url);
} else {
uni.showToast({
title: "暂无权限请联系管理员",
icon: "none",
});
}
},
//格式化电话的方法
handleGetPhone(value) {
return value.substring(0, 3) + "****" + value.substring(7);
},
handleGoEmpower() {
this.$util.toNextRoute("navigateTo", "/pages/register/register");
},
handleNews() {
if (this.special) {
this.$util.toNextRoute("navigateTo", "/pages/commercialBI/specialCase");
}
},
handleGetWarningList() {
const date = new Date();
// 拿到当前小时的前一小时
let h = date.getHours() - 1;
const req = {
// this.single
StatisticsDate: this.lastDay,
StatisticsHour: h,
StatisticsType: 1,
ShowCount: 20,
};
request
.$webGet("CommercialApi/BigData/GetBayonetWarning", req)
.then((res) => {
if (res.Result_Data.List.length > 0) {
this.special = true;
}
});
},
},
};
</script>
<style scoped lang="scss">
.main {
height: 100vh;
width: 100%;
box-sizing: border-box;
.userBg {
width: 100%;
height: 250px;
// background: linear-gradient(315deg, #ff8d95 0%, #ffdca8 100%);
background-image: url("https://eshangtech.com/minTestImg/pageBg.png");
background-size: 100vw 100vh;
background-repeat: no-repeat;
position: relative;
.headerTop {
width: 100%;
background-image: url("https://eshangtech.com/minTestImg/pageBg.png");
background-size: 100vw 100vh;
background-repeat: no-repeat;
position: fixed;
top: 0;
left: 0;
box-sizing: border-box;
padding: 0 15px;
z-index: 9999999;
}
.news {
width: 24px;
height: 24px;
position: absolute;
left: 16px;
transform: translateY(-50%);
display: flex;
justify-content: center;
align-items: center;
.box {
width: 100%;
height: 100%;
position: relative;
.img {
width: 100%;
height: 100%;
}
.red {
position: absolute;
width: 8px;
height: 8px;
background: #d7000f;
border-radius: 50%;
right: 0;
top: 4px;
}
}
}
.userTitle {
position: absolute;
left: 50%;
transform: translateX(-50%);
font-size: 34rpx;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #091732;
line-height: 48rpx;
}
.userBox {
width: calc(100% - 32px);
// height: 147px;
box-sizing: border-box;
margin: 0 32rpx;
background-size: cover;
padding: 40rpx 32rpx;
position: relative;
background: linear-gradient(270deg, #27B25F 0%, #4CCC7F 100%);
border-radius: 16rpx;
.userBgImg {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.box {
position: relative;
z-index: 7;
display: flex;
align-items: center;
// margin-bottom: 24px;
.headImg {
width: 52px;
height: 52px;
border-radius: 50%;
margin-right: 20px;
overflow: hidden;
image {
width: 100%;
height: 100%;
}
}
.message {
flex: 1;
.people {
display: flex;
align-items: center;
.name {
font-size: 36rpx;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #fff;
line-height: 52rpx;
margin-right: 8px;
}
.person {
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
padding: 0 5px;
background-color: #fff;
border-radius: 32rpx;
color: #716F69;
font-size: 24rpx;
font-family: 'PingFangSC-Regular';
font-weight: 400;
// border: 1px solid #fea001;
//background: linear-gradient(134deg, rgba(255, 165, 0, 1), rgba(220, 55, 7, 1));
.personName {
display: flex;
align-items: center;
justify-content: center;
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
border-radius: 5px;
}
}
}
.phone {
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #fff;
line-height: 36rpx;
}
.address {
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #fff;
line-height: 36rpx;
width: 100%;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
}
}
.other {
width: 100%;
height: 40px;
background: linear-gradient(315deg,
rgba(255, 141, 149, 0.2),
rgba(255, 220, 168, 0.2));
display: flex;
align-items: center;
justify-content: space-between;
position: absolute;
left: 0;
bottom: 0;
.item {
width: 49%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
position: relative;
.icon {
width: 28px;
height: 20px;
}
.name {
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #782717;
line-height: 40rpx;
}
}
.item:first-child:after {
content: "";
width: 1px;
height: 24px;
background: #782717;
opacity: 0.08;
position: absolute;
right: 0;
top: 20%;
}
}
}
}
.menu {
width: 100%;
// background: #fff;
box-sizing: border-box;
padding: 24px 16px calc(env(safe-area-inset-bottom) + 82px) 16px;
position: relative;
border-radius: 32rpx 32rpx 2rpx 2rpx;
.main {
.title {
font-size: 34rpx;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #160002;
line-height: 48rpx;
margin-bottom: 12px;
}
.first {
width: 100%;
display: flex;
justify-content: space-between;
margin-bottom: 28px;
.useListItem {
width: 30%;
height: 72px;
position: relative;
box-sizing: border-box;
padding: 8px 11px;
border-radius: 4px;
.name {
font-size: 28rpx;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #55277d;
line-height: 40rpx;
}
.img {
width: 30px;
height: 30px;
position: absolute;
bottom: 9px;
right: 14px;
}
}
.firstBg_1 {
background: url("https://eshangtech.com/ShopICO/ahyd-BID/index/firstBg_1.png");
}
.firstBg_2 {
background: url("https://eshangtech.com/ShopICO/ahyd-BID/index/firstBg_2.png");
}
.firstBg_3 {
background: url("https://eshangtech.com/ShopICO/ahyd-BID/index/firstBg_3.png");
}
}
.second {
width: 100%;
display: flex;
justify-content: space-between;
margin-bottom: 28px;
.useListItem {
display: flex;
flex-direction: column;
align-items: center;
.img {
width: 48px;
height: 48px;
border-radius: 50%;
background: #ffffff;
box-shadow: 0rpx 0rpx 18rpx 0rpx rgba(22, 0, 2, 0.05);
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 8px;
image {
width: 30px;
height: 30px;
}
}
.name {
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #160002;
line-height: 40rpx;
}
}
}
.third {
width: 100%;
display: flex;
flex-wrap: wrap;
.useListItem {
width: 25%;
position: relative;
margin-bottom: 16px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.img {
width: 30px;
height: 30px;
margin-bottom: 6px;
}
.name {
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #160002;
line-height: 40rpx;
}
.notice {
width: 16px;
height: 16px;
border-radius: 50%;
position: absolute;
right: 4px;
top: 0;
color: #fff;
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
line-height: 32rpx;
display: flex;
justify-content: center;
align-items: center;
}
}
}
.fourth {
width: 100%;
display: flex;
.useListItem {
width: 25%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
.img {
width: 30px;
height: 30px;
margin-bottom: 8px;
}
.name {
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #091732;
line-height: 40rpx;
}
.notice {
width: 16px;
height: 16px;
border-radius: 50%;
background: red;
position: absolute;
right: 8px;
top: -4px;
color: #fff;
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
line-height: 32rpx;
display: flex;
justify-content: center;
align-items: center;
}
}
}
}
}
}
</style>