factory_mp_old/pages/my/my.vue

419 lines
9.7 KiB
Vue

<template>
<view class="profile">
<view class="nav-bar" style="position: relative;">
<image style="position: absolute;left: 0;top: 0;display: block;width: 100%;height: 100%;z-index: 1;"
:src="myTopBgSrc" mode=""></image>
</view>
<view class="num-info" style="position: relative;z-index: 3;">
<view class="user-info" style="z-index: 2;">
<view class="user-head">
<!-- #ifdef MP-WEIXIN -->
<view class="avatarImg">
<open-data type="userAvatarUrl" default-avatar="/static/other/timg.jpg"></open-data>
</view>
<!-- #endif -->
<!-- #ifndef MP-WEIXIN -->
<u-avatar :src="vuex_user.avatar" size="124"></u-avatar>
<!-- #endif -->
</view>
<view>
<view style="font-weight: bold;" class="user-name">{{vuex_user.name}}</view>
<view class="user-phone">
<u-tag text="企业员工" v-if="vuex_user.type === 'employee'"/>
<u-tag text="相关方" v-if="vuex_user.type === 'remployee'"/>
<u-tag text="访客" v-if="vuex_user.type === 'visitor'"/>
</view>
</view>
<button type="default" class="modify-info" @click="goInto('myData')">完善资料</button>
</view>
</view>
<view class="enter-list">
<view class="enter-item" @click="goInto('myApply')">
<image class="left-icon" src="../../static/my/wodeshenqing.png" mode=""></image>
<text class="title-text">我的申请</text>
<uni-icons size="13" color="#b9b9b9" class="right-icon" type="right"></uni-icons>
</view>
<view class="enter-item" @click="goInto('daiban')">
<image class="left-icon" src="../../static/my/wodeshenpi.png" mode=""></image>
<text class="title-text">我的审批</text>
<uni-icons size="13" color="#b9b9b9" class="right-icon" type="right"></uni-icons>
</view>
<view class="enter-item" @click="goInto('myData')">
<image style="width: 34rpx;height: 30rpx;" class="left-icon" src="../../static/my/wodeziliao.png"
mode=""></image>
<text class="title-text">我的资料</text>
<uni-icons size="13" color="#b9b9b9" class="right-icon" type="right"></uni-icons>
</view>
</view>
<view class="sign-out">
<button type="default" @click="signoutFn" class="sign-out-btn">退出</button>
</view>
</view>
</template>
<script>
export default {
data() {
return {
username: '用户名',
mobile: '1478585',
head: '',
userName: '',
userId: '',
getBusinessTripDayTimeCon: '',
getLeaveTimePaidLeaveCon: '',
getLeaveTimeCon: '',
myTopBgSrc: require("../../static/my/my-bg.jpg"),
imageUrl: '',
isHaveLookApply: false,
annualLeaveDay: 0.00, //年假剩余天数
}
},
onShow() {
// this.getUserInfo();
//获取当前用户累计出差天数
// this.getBusinessTripDayTimeFn();
//获取当前用户累计调休天数
// this.getLeaveTimeFn();
// 获取当前用户累计请假天数(不包括调休的记录)
// this.getLeaveTimePaidLeaveFn();
//查询年假剩余天数
// this._getSystemHomePageTabChart();
},
methods: {
/* 查询年假剩余天数 */
_getSystemHomePageTabChart() {
systemHomePageTabChart().then((res) => {
if (res.statusCode === 200) {
if (res.data.data !== undefined && res.data.data !== null && res.data.data !== "") {
this.annualLeaveDay = res.data.data.annualLeaveDay || 0.00;
} else {
this.annualLeaveDay = 0.00;
}
} else {
this.annualLeaveDay = 0.00;
uni.showToast({
title: res.data.message,
icon: 'none'
})
}
}).catch(() => {
this.annualLeaveDay = 0.00
uni.showToast({
title: '网络异常, 请求失败',
icon: 'none'
})
})
},
getLeaveTimePaidLeaveFn() {
getLeaveTimePaidLeave().then(res => {
if (res.statusCode === 200) {
this.getLeaveTimePaidLeaveCon = res.data.data.b_leave_days;
} else {
uni.showToast({
title: '获取用户累计请假天数失败',
icon: 'none'
})
}
}).catch(err => {
uni.showToast({
title: '请求失败',
icon: 'none'
})
})
},
getLeaveTimeFn() {
getLeaveTime().then(res => {
if (res.statusCode === 200) {
this.getLeaveTimeCon = res.data.data.b_leave_days;
} else {
uni.showToast({
title: '获取用户累计调休天数失败',
icon: 'none'
})
}
}).catch(err => {
uni.showToast({
title: '请求失败',
icon: 'none'
})
})
},
getBusinessTripDayTimeFn() {
getBusinessTripDayTime().then(res => {
if (res.statusCode === 200) {
this.getBusinessTripDayTimeCon = res.data.data.b_leave_days;
} else {
uni.showToast({
title: '获取用户累计出差天数失败',
icon: 'none'
})
}
}).catch(err => {
uni.showToast({
title: '请求失败',
icon: 'none'
})
})
},
goInto(type) {
if (type == "myApply") {
uni.navigateTo({
url: '/pages/profile/my_apply/my_apply'
})
}
if (type == "daiban") {
uni.navigateTo({
url: '/pages/index/daiban_management/daiban_management'
})
}
if (type == "myData") {
uni.navigateTo({
url: '/pages/my/myInfo'
})
}
if (type == "problem") {
uni.navigateTo({
url: '/pages/profile/common_problem/common_problem'
})
}
},
getUserInfo() {
var promise;
var that = this;
promise = new Promise(function(resolve, reject) {
authUser().then(res => {
if (res.statusCode === 200) {
const principal = res.data.principal;
that.username = principal.realname;
that.mobile = principal.mobile || '';
that.userName = principal.username;
that.userId = principal.userId;
that.$store.commit("SET_AUTHORITIES", res.data.authorities);
//获取微信头像
// this.wxUserImg(principal.username);
resolve()
} else {
uni.showToast({
title: '获取用户信息失败',
icon: 'none'
})
}
}).catch(err => {
uni.showToast({
title: 'user请求失败',
icon: 'none'
})
})
})
promise.then(function() {
userConnection(that.userName).then(res => {
that.imageUrl = res.data.data.imageUrl;
}).catch(err => {
uni.showToast({
title: '微信头像请求失败',
icon: 'none'
})
})
//查看当前用户路由
getCurrentUserRoute(that.userName).then(res => {
if (res.statusCode === 200) {
const routes = res.data.data.routes;
const obj = routes.find(item => {
return item.path === '/new_apply_approval'
})
if (obj) {
that.isHaveLookApply = Boolean(obj.children.find(item => {
return item.path === 'look_apply'; //查看是否有我的审批
}))
}
} else {
uni.showToast({
title: '获取当前用户路由失败',
icon: 'none'
})
}
}).catch(err => {
uni.showToast({
title: '获取路由失败',
icon: 'none'
})
})
})
},
signoutFn() {
var that = this;
this.$u.api.loginOut().then(()=>{
that.$u.vuex('vuex_token', null);
uni.reLaunch({
url:'/pages/login/login_'
})
})
}
}
}
</script>
<style>
page {
background-color: #f3fbff;
}
</style>
<style scoped>
.profile {
position: relative;
background-color: #f3fbff;
padding-bottom: 70rpx;
}
.nav-bar {
height: 210rpx;
background-color: #2cade8;
color: #FFFFFF;
display: flex;
align-items: center;
}
.user-info {
width: 680rpx;
height: 122rpx;
display: flex;
align-items: center;
margin: 0 auto;
}
.user-head {
width: 114rpx;
height: 114rpx;
border-radius: 50%;
overflow: hidden;
margin-right: 30rpx;
}
.user-head image {
width: 114rpx;
height: 114rpx;
}
.user-name {
font-family: PingFang-SC-Bold;
font-size: 34rpx;
color: #666666;
}
.user-phone {
font-family: AdobeHeitiStd-Regular;
font-size: 22rpx;
color: #b7d3fa;
}
.modify-info {
width: 136rpx;
height: 50rpx;
background-image: linear-gradient(253deg, #febe3d 0%, #ff890a 100%);
border-radius: 25rpx;
font-family: PingFang-SC-Medium;
font-size: 24rpx !important;
line-height: 50rpx;
padding-right: 0rpx;
padding-left: 0rpx;
color: #ffffff;
margin-right: 0rpx;
}
.num-info {
display: flex;
justify-content: space-around;
align-items: center;
width: 720rpx;
height: 199rpx;
background-color: #ffffff;
box-shadow: 0rpx 0rpx 24rpx 0rpx rgba(101, 176, 249, 0.41);
border-radius: 10rpx;
margin: 0 auto;
margin-top: -130rpx;
text-align: center;
}
.num-content {
font-size: 40rpx;
color: #2c6fd9;
font-weight: bold;
}
.text-content {
font-family: PingFang-SC-Medium;
font-size: 26rpx;
color: #333333;
}
.enter-list {
padding: 0 11rpx;
box-sizing: border-box;
width: 720rpx;
/* height: 405rpx; */
background-color: #ffffff;
border-radius: 10rpx;
margin: 0 auto;
margin-top: 28rpx;
}
.enter-item {
position: relative;
border-bottom: 1rpx solid #f8f8f8;
}
.title-text {
margin-left: 78rpx;
line-height: 102rpx;
font-family: PingFang-SC-Medium;
font-size: 28rpx;
color: #666666;
}
.enter-item .left-icon {
width: 29rpx;
height: 32rpx;
position: absolute;
top: 50%;
left: 26rpx;
transform: translateY(-50%);
}
.enter-item .right-icon {
position: absolute;
top: 50%;
right: 20rpx;
transform: translateY(-50%);
font-size: 36rpx !important;
}
.sign-out-btn {
width: 711rpx;
height: 90rpx;
background-color: #ffffff;
border-radius: 10rpx;
margin: 0 auto;
margin-top: 28rpx;
font-family: PingFang-SC-Medium;
font-size: 28rpx;
line-height: 90rpx;
color: #d30101;
}
.sign-out-btn:after {
border: none !important;
}
</style>