<!-- 我的-->
|
<template>
|
<view class="myself">
|
<view class="m-top">
|
<view class="my-user-info">
|
<view class="user-name-id">
|
<view class="user-name">{{name}}</view>
|
<view class="user-id">ID: {{id}}</view>
|
</view>
|
<view class="userImg">
|
<img class="img" :src="useimg" @click="ChooseImage">
|
</view>
|
</view>
|
<view class="my-dept-info">
|
<view class="dept-info">
|
<view class="dept-name">所属部门: {{deptName}}</view>
|
</view>
|
</view>
|
</view>
|
<view class="bomBut">
|
<!-- <view class="attendance-btn">
|
<view class="attendance-info" @click="goToAttendance()">
|
<image src="../../static/myself/clock01.png" class="attendance-image"/>
|
<view class="attendance-title">考勤打卡</view>
|
</view>
|
</view> -->
|
<view class="onceBut" v-for="(item, index) in inSide" :key="index" @click="openThere(item.open)">
|
<view class="buts">
|
<image :src="item.imgSrc" mode=""></image>
|
<view class="title">
|
{{item.title}}
|
</view>
|
</view>
|
<image src="../../static/workbench/bracket.png"></image>
|
</view>
|
</view>
|
<uniPopup :textmsg="textmsg" @cancel='operation(1)' @confirm='operation(2)' v-show="showTextmsg">
|
</uniPopup>
|
<u-toast ref="uToast" />
|
<!-- 底部导航条 -->
|
<u-tabbar :list="tabbar" :mid-button="false"></u-tabbar>
|
</view>
|
</template>
|
|
<script>
|
import uniPopup from '@/components/outAdmin/uni-Popup.vue'
|
export default {
|
data() {
|
return {
|
useimg: 'http://61.131.136.25:2082/img/bg/batx.png',
|
showTextmsg: false,
|
textmsg: {
|
title: '提示',
|
content: '您已登录，确认退出？',
|
contentTwo: '',
|
cancel: '取消',
|
confirm: '退出'
|
},
|
inSide: [
|
// {
|
// title: '账户信息',
|
// imgSrc: '../../static/myself/zhanhu.png',
|
// open: 'xinxi'
|
// },
|
// {
|
// title: '版本信息',
|
// imgSrc: '../../static/myself/gengxin.png',
|
// open: 'genxin'
|
// },
|
// {
|
// title: '意见反馈',
|
// imgSrc: '../../static/myself/yijian.png',
|
// open: 'yijian'
|
// },
|
{
|
title: '我的收藏',
|
imgSrc: '../../static/myself/souc.png',
|
open: 'collect'
|
},
|
// {
|
// title: '能量树',
|
// imgSrc: '../../static/myself/shu.png',
|
// open: 'chenzs'
|
// },
|
{
|
title: '关于我们',
|
imgSrc: '../../static/myself/us003.png',
|
// open: 'aboutUs'
|
open: 'genxin'
|
},
|
{
|
title: '隐私政策',
|
imgSrc: '../../static/myself/privacy01.png',
|
open: 'genxin'
|
},
|
{
|
title: '设置',
|
imgSrc: '../../static/myself/system02.png',
|
open: 'shezhi'
|
},
|
{
|
title: '退出',
|
imgSrc: '../../static/myself/logout002.png',
|
open: 'outIn',
|
},
|
|
],
|
tabbar: this.$store.state.tabbar,
|
name: '',
|
id: '',
|
deptName: ''
|
}
|
},
|
components: {
|
uniPopup
|
},
|
computed: {
|
userName() {
|
return this.$store.state.puserName;
|
},
|
butTitle() {
|
return this.$store.state.loging == true ? '退出' : '登录'
|
}
|
},
|
onLoad() {
|
if (this.$store.state.puserID) {
|
//获取个人信息
|
this.getOneselfInFo();
|
}
|
if (this.$store.state.avatar != null && this.$store.state.avatar != '') {
|
this.useimg = this.$store.state.avatar;
|
}
|
},
|
//子页面返回时执行
|
onShow() {
|
|
},
|
methods: {
|
goToAttendance() {
|
|
if (this.$store.state.UserData.stype != "1") {
|
this.$refs.uToast.show({
|
title: '功能暂未开放',
|
type: 'warning',
|
});
|
return;
|
}
|
|
uni.navigateTo({
|
url: '../clockSignIn/clockSignIn'
|
})
|
},
|
openThere(fn) {
|
this[fn]();
|
},
|
collect() {
|
uni.navigateTo({
|
url: './childen/collect',
|
})
|
},
|
chenzs() {
|
uni.navigateTo({
|
url: '../shengzs/index',
|
})
|
},
|
aboutUs() {
|
// console.log('aboutus')
|
uni.navigateTo({
|
url: './childen/aboutUs',
|
})
|
},
|
shezhi() {
|
uni.navigateTo({
|
url: './childen/shezhi',
|
})
|
},
|
yijian() {
|
uni.navigateTo({
|
url: './childen/yijian',
|
})
|
},
|
genxin() {
|
uni.navigateTo({
|
url: './childen/genxin',
|
})
|
},
|
xinxi() {
|
uni.navigateTo({
|
url: './childen/xinxi',
|
})
|
},
|
outIn() {
|
if (this.$store.state.loging == true) {
|
this.showTextmsg = true;
|
} else {
|
this.goToLoging();
|
}
|
},
|
goToLoging() {
|
this.$store.commit('loginReset'); //重置登录
|
uni.redirectTo({ //关闭并打开
|
url: '../loging/loging',
|
animationType: 'slide-in-top',
|
animationDuration: 20000
|
});
|
},
|
//登录成功后，获取个人信息
|
getOneselfInFo() {
|
var that = this;
|
//保安信息查询
|
uni.request({
|
url: that.$store.state.piAPI + '/blade-user/details?id=' + this.$store.state.puserID,
|
method: 'POST',
|
success(resdata) {
|
that.name = resdata.data.data.realName;
|
that.id = resdata.data.data.id;
|
var dept = resdata.data.data.deptName;
|
if (dept != null && dept != "") {
|
var name = dept.split(",");
|
that.deptName = name[name.length - 1];
|
}
|
}
|
})
|
},
|
operation(e) {
|
let that = this;
|
let type = e;
|
// console.log(type);
|
if (type == 1) {
|
//取消操作
|
that.showTextmsg = false;
|
} else {
|
//确定操作
|
this.goToLoging();
|
that.showTextmsg = false;
|
}
|
},
|
//头像查看，上传
|
ChooseImage() {
|
var that = this;
|
uni.showActionSheet({
|
// itemList按钮的文字接受的是数组
|
itemList: ["查看头像", "拍摄", "从相册选择"],
|
success(e) {
|
var index = e.tapIndex;
|
if (index == 0) {
|
// 用户点击了预览当前图片
|
// 可以自己实现当前头像链接的读取
|
let url = that.useimg;
|
let arr = []
|
arr.push(url)
|
uni.previewImage({
|
// 预览功能图片也必须是数组的
|
urls: arr
|
})
|
}
|
if (index == 1 || index == 2) {
|
//拍照或从图库上传
|
that.uploadPictrue(index);
|
}
|
}
|
});
|
},
|
//图片上传
|
uploadPictrue(e) {
|
var that = this;
|
var sourceTypeArr = [];
|
e == 1 ? sourceTypeArr.push("camera") : sourceTypeArr.push("album")
|
uni.chooseImage({
|
count: 1, //可选择数量，默认9
|
sizeType: ['compressed', 'original'], //上传压缩图,原图
|
sourceType: sourceTypeArr, //从相册选择
|
success: async (res) => {
|
if (res.tempFiles[0].size > 10 * 1024 * 1000) { //上传图片大小限制
|
uni.showToast({
|
title: "照片大小不能10MB",
|
icon: "none"
|
})
|
return
|
}
|
var tempFilePath = res.tempFilePaths;
|
try {
|
uni.showLoading({
|
title: "上传中...",
|
mask: true
|
})
|
// 文件上传
|
uni.uploadFile({
|
// url: 'https://web.byisf.com/api/depl/put-depl', //仅为示例，非真实的接口地址
|
url: that.$store.state.piAPI + '/depl/put-depl',
|
filePath: tempFilePath[0],
|
name: 'file',
|
formData: {
|
'user': 'test' // 上传附带参数
|
},
|
success: (data) => {
|
that.useimg = JSON.parse(data.data).data;
|
that.$store.state.avatar = that.useimg;
|
//修改用户头像信息
|
uni.request({
|
url: that.$store.state.piAPI +
|
"/blade-user/updateUserInfo",
|
method: "POST",
|
data: {
|
id: that.$store.state.puserID,
|
avatar: that.useimg
|
},
|
success: (res) => {
|
if (res.data.code == 200) {
|
uni.showToast({
|
title: '上传成功!',
|
duration: 2000
|
});
|
}
|
}
|
})
|
}
|
});
|
} catch (e) {
|
console.log(e);
|
} finally {
|
uni.hideLoading();
|
}
|
}
|
})
|
}
|
},
|
}
|
</script>
|
<style>
|
page {
|
width: 100%;
|
height: 100%;
|
background-color: #F7F7F7;
|
}
|
</style>
|
<style lang="scss" scoped>
|
$imgSize: 1.2rem;
|
|
.m-top,
|
.my-user-info,
|
.user-name-id {
|
display: flex;
|
}
|
|
.myself {
|
width: 100%;
|
height: 100%;
|
|
.m-top {
|
width: 100%;
|
height: 12rem;
|
border-radius: 0rpx 0rpx 60rpx 60rpx;
|
background-image: linear-gradient(to bottom, #103289, #174cd1);
|
color: #fff;
|
flex-direction: column;
|
|
.my-user-info {
|
width: 88%;
|
margin: 0 auto;
|
height: 6rem;
|
align-items: center;
|
// border: 1px solid #007AFF;
|
|
|
.user-name-id {
|
flex-direction: column;
|
justify-content: center;
|
|
.user-name {
|
font-size: 1.5rem;
|
letter-spacing: 1rpx;
|
}
|
|
.user-id {
|
font-size: 0.6rem;
|
color: #fff;
|
margin-top: 0.3rem;
|
}
|
}
|
|
.userImg {
|
flex: 1;
|
text-align: right;
|
|
.img {
|
width: 3.5rem;
|
height: 3.5rem;
|
border-radius: 100rpx;
|
}
|
}
|
|
}
|
|
.my-dept-info {
|
width: 88%;
|
margin: 0 auto;
|
height: 2.4rem;
|
background-image: linear-gradient(to bottom, #103289, #174cd1);
|
box-shadow: 0 0 0.1px 0.1px #0BB9C8;
|
// border: 1px solid #00ff00;
|
|
.dept-info {
|
width: 92%;
|
height: 1.8rem;
|
line-height: 1.8rem;
|
margin-left: 0.6rem;
|
margin-top: 0.3rem;
|
background-image: linear-gradient(to bottom, #103289, #174cd1);
|
|
.dept-name {
|
margin-left: 0.3rem;
|
}
|
}
|
}
|
}
|
|
.bomBut {
|
width: 88%;
|
margin: 0 auto;
|
height: 15rem;
|
z-index: 999;
|
border-radius: 2px;
|
margin-top: -2.5rem;
|
background-color: #fff;
|
|
.attendance-btn {
|
width: 100%;
|
height: 6.1rem;
|
border-bottom: 2px solid rgba($color: #F7F7F7, $alpha:0.8);
|
|
.attendance-info {
|
width: 7rem;
|
height: 100%;
|
// background-color: #007AFF;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
flex-direction: column;
|
|
image {
|
width: 3.5rem;
|
height: 3.2rem;
|
}
|
|
.attendance-title {
|
margin-top: 0.3rem;
|
font-weight: 550;
|
}
|
}
|
}
|
|
|
.onceBut {
|
width: 100%;
|
height: 3rem;
|
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
// border-bottom: 1px solid rgba($color: #000000, $alpha: 0.05);
|
border-bottom: 2px solid rgba($color: #F7F7F7, $alpha:0.8);
|
|
&:hover {
|
background-color: rgba($color: #F7F7F7, $alpha:0.8);
|
}
|
|
.buts {
|
padding-left: 1rem;
|
height: 2.5rem;
|
display: flex;
|
align-items: center;
|
|
.title {
|
padding-left: 1rem;
|
font-size: 0.9rem;
|
}
|
}
|
|
image {
|
margin-right: 1rem;
|
}
|
}
|
}
|
}
|
|
image {
|
width: $imgSize;
|
height: $imgSize;
|
}
|
</style>
|
