721 lines
21 KiB
Vue
721 lines
21 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">
|
|
<image class="img" src="/static/images/index/news.svg"></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}}</p>
|
|
<!-- <view class="person"> <view class="personName">{{user.DepartmentName}}</view> </view>-->
|
|
<view class="person">{{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" ></userList>
|
|
</view>
|
|
|
|
<Tabbar ref="tabbar" :page="page" ></Tabbar>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
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: '/static/images/user/position.svg', name: '我的服务区', value: 1 },
|
|
{ url: '/static/images/user/limit.svg', name: '我的权限', value: 2 },],
|
|
dataList :[
|
|
{
|
|
name: '商业经营',
|
|
value: 1,
|
|
list: [
|
|
{
|
|
id:'74934d31-385a-4eed-80bb-9c9ed7da29b5',
|
|
name: '每日营收',
|
|
homeUrl: '/pages/everdayRenven/index',
|
|
imagePath: '/static/images/user/dailyRevenue.svg',
|
|
bgUrl:'https://eshangtech.com/ShopICO/ahyd-BID/user/firstBg_1.png',
|
|
isNotice:true,
|
|
value: 1,
|
|
},
|
|
{
|
|
id:'',
|
|
name: '节日特刊',
|
|
homeUrl: '/commercialOperation/festival/index',
|
|
imagePath: '/static/images/user/festival.svg',
|
|
bgUrl:'https://eshangtech.com/ShopICO/ahyd-BID/user/firstBg_2.png',
|
|
isNotice:'',
|
|
value: 1,
|
|
},
|
|
{
|
|
id:'4a34e1d4-47c9-4c06-8e8e-f38c6bd9450b',
|
|
name: '经营报表',
|
|
homeUrl: '/pages/operatingStatements/index',
|
|
imagePath: '/static/images/user/reportForms.svg',
|
|
bgUrl:'https://eshangtech.com/ShopICO/ahyd-BID/user/firstBg_3.png',
|
|
isNotice:'',
|
|
value: 1,
|
|
},
|
|
],
|
|
},
|
|
{
|
|
name: '商业经营',
|
|
value: 2,
|
|
list: [
|
|
{
|
|
id:'',
|
|
name: '车流',
|
|
homeUrl: '/pages/commercialBI/carPortrait',
|
|
imagePath: '/static/images/user/traffic.svg',
|
|
isNotice:'',
|
|
value: 2,
|
|
},
|
|
{
|
|
id:'',
|
|
name: '客群',
|
|
homeUrl: '/pages/commercialBI/guestPortrait',
|
|
imagePath: '/static/images/user/customerGroup.svg',
|
|
isNotice:'',
|
|
value: 2,
|
|
},
|
|
{
|
|
id:'',
|
|
name: '经营',
|
|
homeUrl: '/pages/commercialBI/managePortrait',
|
|
imagePath: '/static/images/user/manage.svg',
|
|
isNotice:'',
|
|
value: 2,
|
|
},
|
|
{
|
|
id:'',
|
|
name: '交易',
|
|
homeUrl: '/pages/commercialBI/businessPortrait',
|
|
imagePath: '/static/images/user/business.svg',
|
|
isNotice:'',
|
|
value: 2,
|
|
},
|
|
{
|
|
id:'',
|
|
name: '品牌',
|
|
homeUrl: '/pages/commercialBI/formatPortrait',
|
|
imagePath: '/static/images/user/brand.svg',
|
|
isNotice:'',
|
|
value: 2,
|
|
},
|
|
],
|
|
},
|
|
{
|
|
name: '业务审批',
|
|
value: 3,
|
|
list: [
|
|
{
|
|
id:'1a2907bd-c2f5-4ef9-9ead-70496650ace6',
|
|
name: '财务审批',
|
|
homeUrl: '/pages/expenseApproval/expenseApproval',
|
|
imagePath: '/static/images/user/financialApproval.svg',
|
|
notice:0,
|
|
value: 3,
|
|
isNotice:false
|
|
},
|
|
{
|
|
id:'916cdbb5-f05b-4624-b6c4-9f111d4389fc',
|
|
name: '招标投标',
|
|
homeUrl: '/pages/tender/tender',
|
|
notice:0,
|
|
value: 3,
|
|
isNotice:false,
|
|
imagePath: '/static/images/user/bidding.svg',
|
|
},
|
|
{
|
|
id:'8fea5036-d67e-476e-9e56-5f379ba6ae18',
|
|
name: '服务区报销',
|
|
homeUrl: '/pages/serviceAreaReimbursement/serviceAreaReimbursement',
|
|
notice:0,
|
|
value: 3,
|
|
isNotice:false,
|
|
imagePath: '/static/images/user/serviceAreaReimbur.svg',
|
|
},
|
|
{
|
|
id:'ac661db4-1af1-4732-88db-76bc05eec335',
|
|
name: '合同审批',
|
|
homeUrl: '/pages/contract/contract',
|
|
notice:0,
|
|
value: 3,
|
|
isNotice:false,
|
|
imagePath: '/static/images/user/contractApproval.svg',
|
|
},
|
|
{
|
|
id:'056b29d7-4721-47ee-ad25-660814e1f3a9',
|
|
name: '商品审批',
|
|
homeUrl: '/pages/businessApproval/businessApproval',
|
|
notice:0,
|
|
value: 3,
|
|
isNotice:false,
|
|
imagePath: '/static/images/user/productApproval.svg',
|
|
},
|
|
{
|
|
id:'2290e96d-c6d7-4dde-b5b7-e699b615ff2f',
|
|
name: '招商审批',
|
|
homeUrl: '/pages/investment/investment',
|
|
notice:0,
|
|
value: 3,
|
|
isNotice:false,
|
|
imagePath: '/static/images/user/promotionApproval.svg',
|
|
},
|
|
{
|
|
id:'c802a38f-3bbd-4db0-89b6-34e404c8d8cc',
|
|
name: '权限审批',
|
|
homeUrl: '/pages/authorityApproval/index',
|
|
notice:0,
|
|
value: 3,
|
|
isNotice:false,
|
|
imagePath: '/static/images/user/authorityApproval.svg',
|
|
},
|
|
{
|
|
id:'b0b63a75-56c9-4f1d-aacb-a26e62b47e3e',
|
|
name: '数据校验',
|
|
homeUrl: '/pages/dataSummary/dataSummary',
|
|
notice:0,
|
|
value: 3,
|
|
isNotice:false,
|
|
imagePath: '/static/images/user/dataVerification.svg',
|
|
},
|
|
],
|
|
},
|
|
{
|
|
name: '现场管理',
|
|
value: 4,
|
|
list: [
|
|
{
|
|
id:'',
|
|
name: '基础信息',
|
|
homeUrl: '/pages/map/detail',
|
|
imagePath: '/static/images/user/basicInformation.svg',
|
|
isNotice:true,
|
|
notice:0,
|
|
value: 4,
|
|
},
|
|
{
|
|
id:'',
|
|
name: '考评考核',
|
|
homeUrl: '/siteManager/assessment/index',
|
|
imagePath: '/static/images/user/assessment.svg',
|
|
isNotice:false,
|
|
notice:0,
|
|
value: 4,
|
|
},
|
|
{
|
|
id:'d405ae13-3388-41c0-a5f6-d11194d0a943',
|
|
name: '投诉建议',
|
|
homeUrl: '/pages/suggestion/suggestion',
|
|
imagePath: '/static/images/user/complaintSuggest.svg',
|
|
isNotice:false,
|
|
notice:0,
|
|
value: 4,
|
|
},
|
|
{
|
|
id:'ebd8cae4-d36d-4ea0-a7e9-61e566bf9e24',
|
|
name: '收银稽查',
|
|
homeUrl: '/pages/cashAudit/list',
|
|
imagePath: '/static/images/user/cashierInspection.svg',
|
|
isNotice:false,
|
|
notice:0,
|
|
value: 4,
|
|
},
|
|
],
|
|
},
|
|
],
|
|
isTrue:false,//最外面一层判断是否能跳转的依据
|
|
};
|
|
},
|
|
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.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
|
|
}
|
|
}
|
|
}
|
|
})
|
|
//拿到登录用户有权限的内容 判断是否有角标
|
|
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.userData.AuthorityInfo['89a1f248-2113-4d57-84b1-c2e6edb9e8ee']===1){
|
|
this.isTrue = true
|
|
}else{
|
|
this.isTrue = false
|
|
uni.navigateTo({
|
|
url:`/pages/commercialBI/noData?type=index`
|
|
})
|
|
}
|
|
},
|
|
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')
|
|
}
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.main {
|
|
height: 100vh;
|
|
width: 100%;
|
|
|
|
.userBg {
|
|
width: 100%;
|
|
height: 280px;
|
|
background: linear-gradient(315deg, #ff8d95 0%, #ffdca8 100%);
|
|
position: relative;
|
|
.headerTop{
|
|
width: 100%;
|
|
background: linear-gradient(260deg, #FEA199 0%, #FFD6A7 100%);
|
|
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 16px;
|
|
background-size: cover;
|
|
padding: 16px 0 0 16px;
|
|
position: relative;
|
|
.userBgImg{
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.box {
|
|
position: relative;
|
|
z-index: 7;
|
|
display: flex;
|
|
margin-bottom: 24px;
|
|
.headImg {
|
|
width: 52px;
|
|
height: 52px;
|
|
border-radius: 50%;
|
|
margin-right: 8px;
|
|
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: #782717;
|
|
line-height: 52rpx;
|
|
margin-right: 8px;
|
|
}
|
|
.person {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border-radius: 5px;
|
|
overflow: hidden;
|
|
padding: 0 5px;
|
|
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;
|
|
color: #782717;
|
|
border-radius: 5px;
|
|
background: #ffede1;
|
|
}
|
|
}
|
|
}
|
|
.phone {
|
|
font-size: 24rpx;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #782717;
|
|
line-height: 36rpx;
|
|
}
|
|
.address {
|
|
font-size: 24rpx;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #782717;
|
|
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>
|