浅念
358 lines
8.8 KiB
Vue
358 lines
8.8 KiB
Vue
<template>
|
||
<view class="contents">
|
||
<!-- <uni-nav-bar leftText=" " :fixed="true" :border="false" @clickLeft="leftClick" color="#fff" backgroundColor="#4579ff" :statusBar="true" :title="$t('mine.title')"></uni-nav-bar> -->
|
||
|
||
<!-- <view class="navbar">{{$t('mine.title')}}</view> -->
|
||
<view class="navbar"></view>
|
||
<view class="content">
|
||
<view class="contop">
|
||
<view class="">
|
||
<image class="userimg" :src="userinfo.avatar==''||userinfo.avatar==null||userinfo.avatar=='null'?'/static/image/mine/user.png':userinfo.avatar" mode=""></image>
|
||
<!-- <image class="userimg" src="/static/image/mine/user.png" mode=""></image> -->
|
||
</view>
|
||
<view class="right">
|
||
<!-- <view class="right"> -->
|
||
<view class="" @click="changinfo">
|
||
<text>{{userinfo.name}}</text>
|
||
<image src="/static/image/mine/edit.png" mode=""></image>
|
||
</view>
|
||
<view class="minemp">
|
||
<view class="mineid">ID：{{userinfo.sn}}</view>
|
||
<!-- <view class="mp" @click="gomymp">{{$t('auth')}}</view> -->
|
||
<!-- <view v-if="!isopenid" class="mp" @click="gomyauth">{{$t('auth')}}</view> -->
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="bottomCon">
|
||
<!-- <view class="sonContent" @click="navTo('/pages/mine/massege')">
|
||
<image class="son-img-bg" src="/static/image/mine/icon1.png"></image>
|
||
<span>{{$t('mine.msg')}}</span>
|
||
<view class="">
|
||
<view class="badge">
|
||
0
|
||
</view>
|
||
<uni-icons type="right" class="icon" size="18"></uni-icons>
|
||
</view>
|
||
</view> -->
|
||
<view class="sonContent" @click="navTo('/pages/mine/resetPwd')">
|
||
<image class="son-img-bg" src="/static/image/mine/icon2.png"></image>
|
||
<span>{{$t('mine.cpassword')}}</span>
|
||
<uni-icons type="right" class="icon" size="18"></uni-icons>
|
||
</view>
|
||
<view class="sonContent" @click="show=true">
|
||
<image class="son-img-bg" src="/static/image/mine/icon3.png"></image>
|
||
<span>{{$t('mine.contact')}}</span>
|
||
<uni-icons type="right" size="18" class="icon"></uni-icons>
|
||
</view>
|
||
<!-- <view class="sonContent" @click="navTo('/pages/mine/feedback')">
|
||
<image class="son-img-bg" src="/static/image/mine/icon4.png"></image>
|
||
<span>{{$t('mine.feedback')}}</span>
|
||
<uni-icons type="right" class="icon" size="18"></uni-icons>
|
||
</view> -->
|
||
<view class="sonContent" v-if="!isopenid" @click="gomyauth">
|
||
<image class="son-img-bg" style="width: 30px; height: 30px;" src="/static/image/login/fenshu.png"></image>
|
||
<span>{{$t('auth')}}</span>
|
||
<uni-icons type="right" class="icon" size="18"></uni-icons>
|
||
</view>
|
||
<view class="sonContent" @click="navTo('/pages/mine/about')">
|
||
<image class="son-img-bg" src="/static/image/mine/icon5.png"></image>
|
||
<span>{{$t('mine.about')}}</span>
|
||
<uni-icons type="right" class="icon" size="18"></uni-icons>
|
||
</view>
|
||
<!-- <view class="sonContent" @click="navTo('/pages/mine/logoff')">
|
||
<image class="son-img-bg" src="/static/image/mine/icon6.png"></image>
|
||
<span>{{$t('mine.logoff')}}</span>
|
||
<uni-icons type="right" class="icon" size="18"></uni-icons>
|
||
</view> -->
|
||
<!-- <view class="sonContent" @click="navTo('/pages/mine/recyclebin')">
|
||
<image class="son-img-bg" src="/static/image/mine/icon8.png"></image>
|
||
<span>{{$t('mine.recyclebin')}}</span>
|
||
<uni-icons type="right" class="icon" size="18"></uni-icons>
|
||
</view> -->
|
||
|
||
<view class="sonContent" @click="logout">
|
||
<image class="son-img-bg" src="/static/image/mine/icon7.png"></image>
|
||
<span>{{$t('mine.logout')}}</span>
|
||
<uni-icons type="right" class="icon" size="18"></uni-icons>
|
||
</view>
|
||
|
||
</view>
|
||
|
||
</view>
|
||
<!-- 联系客服弹框 -->
|
||
<u-popup :show="show" :round="20" mode="center" @close="close">
|
||
<view class="popupcontent">
|
||
<image class="log1" src="/static/image/mine/kefu.png"></image>
|
||
<view class="title">{{$t('mine.kfphone')}}</view>
|
||
<view class="calls">18137110386</view>
|
||
<button class="btn" @click="callPhone('18137110386')">{{$t('call')}}</button>
|
||
</view>
|
||
<view class="upopupqx" @click="close">
|
||
<image src="/static/image/mine/chaprop.png" mode=""></image>
|
||
</view>
|
||
</u-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { request,showToast } from '@/api/apiT.js'
|
||
export default {
|
||
data() {
|
||
return {
|
||
userinfo:'',
|
||
show: false,
|
||
isopenid:false,
|
||
}
|
||
},
|
||
onLoad() {
|
||
// this.userinfo =JSON.parse(uni.getStorageSync('userinfo'))
|
||
|
||
},
|
||
onShow() {
|
||
this.getuserinfo()
|
||
},
|
||
methods: {
|
||
getuserinfo(){
|
||
|
||
request({
|
||
url:'user/getInfo',
|
||
method:'get',
|
||
}).then(res => {
|
||
this.userinfo = res.data.data;
|
||
if(this.userinfo.feishu_openid&&this.userinfo.feishu_openid!=null&&this.userinfo.feishu_openid!='null'&&this.userinfo.feishu_openid!=''){
|
||
this.isopenid=true
|
||
}
|
||
|
||
})
|
||
},
|
||
gomymp(){
|
||
uni.navigateTo({
|
||
url: '/pages/mine/webview'
|
||
})
|
||
},
|
||
gomyauth(){
|
||
uni.navigateTo({
|
||
url: '/pages/index/webview'
|
||
})
|
||
},
|
||
changinfo(){
|
||
uni.navigateTo({
|
||
url: '/pages/mine/changinfo'
|
||
});
|
||
},
|
||
navTo(url) {
|
||
uni.navigateTo({
|
||
url: url
|
||
});
|
||
},
|
||
close() {
|
||
this.show = false
|
||
},
|
||
// 拨打电话
|
||
callPhone(phoneNumber) {
|
||
this.show = false;
|
||
if (!phoneNumber) {
|
||
uni.showToast({
|
||
title: '请输入电话号码',
|
||
icon: 'none',
|
||
});
|
||
return;
|
||
}
|
||
uni.makePhoneCall({
|
||
phoneNumber: phoneNumber,
|
||
success: () => {
|
||
console.log('拨打电话成功');
|
||
},
|
||
fail: (err) => {
|
||
console.log('拨打电话失败', err);
|
||
},
|
||
});
|
||
},
|
||
//退出登录
|
||
logout(){
|
||
uni.clearStorageSync();
|
||
uni.reLaunch({
|
||
url: '/pages/login/index',// 替换为你要跳转的页面路径
|
||
});
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
::v-deep .u-popup__content{
|
||
background-color: transparent !important;
|
||
}
|
||
.upopupqx{
|
||
margin-top: 20px;
|
||
text-align: center;
|
||
image{
|
||
width: 80rpx;
|
||
height: 80rpx;
|
||
}
|
||
}
|
||
uni-page-body {
|
||
background-color: #F6F6F6 !important;
|
||
}
|
||
.badge{
|
||
padding: 0px 7px;
|
||
/* #ifdef APP-PLUS */
|
||
padding: 2px 8px;
|
||
margin-right: 30px;
|
||
/* #endif */
|
||
display: inline-block;
|
||
text-align: center;
|
||
background-color: #ff3d40;
|
||
color: white;
|
||
border-radius: 50%;
|
||
}
|
||
.contents{
|
||
background-image: url("/static/image/mine/bg.png");
|
||
background-size: 100%;
|
||
background-repeat: no-repeat;
|
||
}
|
||
.navbar{
|
||
/* #ifdef APP-PLUS */
|
||
height:44px;
|
||
/* #endif */
|
||
height:30px;
|
||
}
|
||
.content{
|
||
padding:10px 15px 15px;
|
||
.contop{
|
||
display: flex;
|
||
align-items: center;
|
||
margin: 0px 0px 30px;
|
||
font-size: 34rpx;
|
||
color: white;
|
||
.right{
|
||
flex: 2;
|
||
margin-left: 15px;
|
||
image{
|
||
width: 32rpx;
|
||
height:32rpx;
|
||
margin-left: 10px;
|
||
}
|
||
view{
|
||
line-height: 30px;
|
||
}
|
||
.minemp{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.mp{
|
||
font-size: 28rpx;
|
||
background: #fff;
|
||
color: #3471FF;
|
||
padding: 1px 15px;
|
||
border-radius: 5px 15px 15px 15px;
|
||
}
|
||
}
|
||
.mineid{
|
||
font-size: 24rpx;
|
||
}
|
||
|
||
}
|
||
}
|
||
}
|
||
.slot-image {
|
||
/* #ifndef APP-NVUE */
|
||
display: block;
|
||
/* #endif */
|
||
margin-right: 10px;
|
||
width: 20px;
|
||
height: 20px;
|
||
}
|
||
|
||
.userimg{
|
||
width: 60px;
|
||
height: 60px;
|
||
border-radius: 50%;
|
||
}
|
||
.timg{
|
||
width: 100%;
|
||
height: 220rpx;
|
||
}
|
||
.bottomCon {
|
||
color: #000;
|
||
font-weight: 400;
|
||
// padding: 0 24rpx 20rpx;
|
||
box-sizing: border-box;
|
||
// border-radius: 22rpx;
|
||
// background: #FFFFFF;
|
||
display: flex;
|
||
box-sizing: border-box;
|
||
flex-direction: column;
|
||
|
||
.sonTitle {
|
||
height: 80rpx;
|
||
line-height: 80rpx;
|
||
font-size: 36rpx;
|
||
border-bottom: 2rpx solid #F3F3F3;
|
||
}
|
||
.sonContent {
|
||
background: #FFFFFF;
|
||
border-radius: 22rpx;
|
||
position: relative;
|
||
flex: 1;
|
||
// border-bottom: 2rpx solid #F3F3F3;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
font-size: 28rpx;
|
||
font-weight: 500;
|
||
padding: 32rpx 28rpx;
|
||
color: #000;
|
||
margin-bottom: 10px;
|
||
position: relative;
|
||
/* #ifdef APP-PLUS */
|
||
.icon{
|
||
position: absolute;
|
||
right: -15px;
|
||
top: 32%;
|
||
}
|
||
/* #endif */
|
||
.son-img-bg {
|
||
width: 20px;
|
||
height: 20px;
|
||
position: absolute;
|
||
top: 45%;
|
||
margin-top: -20rpx;
|
||
left: 12px;
|
||
}
|
||
span {
|
||
margin-left: 68rpx;
|
||
font-size: 28rpx;
|
||
}
|
||
}
|
||
}
|
||
.popupcontent{
|
||
padding: 20px 30px;
|
||
background: linear-gradient(to bottom, #B1C8FF, #ffffff);
|
||
border-radius: 10px;
|
||
text-align: center;
|
||
color: #333333;
|
||
.title{
|
||
font-size: 32rpx;
|
||
}
|
||
.calls{
|
||
color: #3471FF;
|
||
font-size: 40rpx;
|
||
margin: 10px 0px;
|
||
}
|
||
image{
|
||
width: 360rpx;
|
||
height:360rpx;
|
||
}
|
||
.btn{
|
||
background: linear-gradient(to right, #3471FF, #6776FF);
|
||
color: white;
|
||
border-radius: 50px;
|
||
width: 100%;
|
||
margin-top: 30px;
|
||
height: 80rpx;
|
||
line-height: 80rpx;
|
||
font-size: 30rpx;
|
||
}
|
||
}
|
||
</style> |