You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
653 lines
14 KiB
653 lines
14 KiB
<template>
|
|
<view class="container">
|
|
<!-- 头部 -->
|
|
<view class="headzone">
|
|
<!-- 头像 -->
|
|
<view class="avtarzone">
|
|
<view class="avatar-bg">
|
|
<image class="avatar" mode="aspectFit" src="../static/tx.svg"></image>
|
|
</view>
|
|
</view>
|
|
<!-- 用户信息 -->
|
|
<view class="ubinfo">
|
|
<view class="ubi-uname">用户名</view>
|
|
<view class="ubi-verify">
|
|
<view class="mbtxt">手机号：{{userInfo.mobile}}</view>
|
|
<view class="mbstatus verify" v-if="hasverify">认证</view>
|
|
<view class="mbstatus unverfiy" v-else>未认证</view>
|
|
</view>
|
|
</view>
|
|
<!-- 服务状态 -->
|
|
<view class="devinfo">
|
|
<view class="dev-txt" :class="hasverify?'verify':'unverfiy'">有效期： 1个月</view>
|
|
<view class="dev-txt" :class="hasverify?'verify':'unverfiy'">设备数： 1台</view>
|
|
</view>
|
|
</view>
|
|
<!-- 交易中心的快速连接 -->
|
|
<view class="gtcenter">
|
|
<view class="gttxt">全国文化大数据交易中心</view>
|
|
<view class="gtlinks" @click="gotozw()">快速跳转</view>
|
|
</view>
|
|
|
|
<!-- 提醒认证 -->
|
|
<view class="verify_notice" v-if="!hasverify">
|
|
<image class="vn-img" src="../static/error.svg"/>
|
|
<view class="vn-txt">
|
|
根据国家法律法规，已经注册成功的用户，需要先上传登记实名信息认证后，方可使用服务中心相关功能
|
|
</view>
|
|
<view class="vn-btn" @click="gotoverfiy()">前往认证</view>
|
|
</view>
|
|
<!-- 期待 -->
|
|
<view class="fwnr" v-else="hasverify" >
|
|
<view style="text-align: center;font-size: 46rpx;margin-top: 386rpx;">更多功能，敬请期待</view>
|
|
</view>
|
|
<!-- 服务内容 -->
|
|
<view class="fwnr" v-else="hasverify" style="display: none;">
|
|
<!-- // first -->
|
|
<view class="fw-one">
|
|
<view class="fwo-item">
|
|
<view class="fwulb">
|
|
<text class="fwname">订购服务</text>
|
|
<text class="fwnote">服务开通/续费</text>
|
|
</view>
|
|
<image class="fwubg" src="../static/dgfw.svg"></image>
|
|
</view>
|
|
<view class="fwo-item">
|
|
<view class="fwulb">
|
|
<text class="fwname">入网信息</text>
|
|
<text class="fwnote">信息登记/修改</text>
|
|
</view>
|
|
<image class="fwubg" src="../static/rwxx.svg"></image>
|
|
</view>
|
|
</view>
|
|
<!-- 我的订单 -->
|
|
<view class="my-service">
|
|
<view class="service-title">我的订单</view>
|
|
<view class="service-content clearfix">
|
|
<block>
|
|
<view class="service-item">
|
|
<view class="item-icon">
|
|
<image class="icon-img" src="../static/m_dzf.svg"></image>
|
|
</view>
|
|
<view class="item-name">待支付</view>
|
|
</view>
|
|
</block>
|
|
<block>
|
|
<view class="service-item">
|
|
<view class="item-icon">
|
|
<image class="icon-img" src="../static/m_dsh.svg"></image>
|
|
</view>
|
|
<view class="item-name">待审核</view>
|
|
</view>
|
|
</block>
|
|
<block>
|
|
<view class="service-item">
|
|
<view class="item-icon">
|
|
<image class="icon-img" src="../static/m_ywc.svg"></image>
|
|
</view>
|
|
<view class="item-name">已完成</view>
|
|
</view>
|
|
</block>
|
|
<block>
|
|
<view class="service-item">
|
|
<view class="item-icon">
|
|
<image class="icon-img" src="../static/m_qbdd.svg"></image>
|
|
</view>
|
|
<view class="item-name">全部订单</view>
|
|
</view>
|
|
</block>
|
|
</view>
|
|
</view>
|
|
<!-- 其他工具 -->
|
|
<view class="othtools">
|
|
<view class="service-title">其他工具</view>
|
|
<view class="service-content clearfix">
|
|
<!-- 生效记录 -->
|
|
<block>
|
|
<view class="service-item">
|
|
<view class="item-icon">
|
|
<image class="icon-img" src="../static/t_sxjl.svg"></image>
|
|
</view>
|
|
<view class="item-name">生效记录</view>
|
|
</view>
|
|
</block>
|
|
<!-- 我的发票 -->
|
|
<block>
|
|
<view class="service-item">
|
|
<view class="item-icon">
|
|
<image class="icon-img" src="../static/t_wdfp.svg"></image>
|
|
</view>
|
|
<view class="item-name">我的发票</view>
|
|
</view>
|
|
</block>
|
|
<!-- 我的设备 -->
|
|
<block>
|
|
<view class="service-item">
|
|
<view class="item-icon">
|
|
<image class="icon-img" src="../static/t_wdsb.svg"></image>
|
|
</view>
|
|
<view class="item-name">我的设备</view>
|
|
</view>
|
|
</block>
|
|
<!-- 检查开关 -->
|
|
<block>
|
|
<view class="service-item">
|
|
<view class="item-icon">
|
|
<image class="icon-img" src="../static/t_jckg.svg"></image>
|
|
</view>
|
|
<view class="item-name">检查开关</view>
|
|
</view>
|
|
</block>
|
|
<!-- 设置密码 -->
|
|
<block>
|
|
<view class="service-item">
|
|
<view class="item-icon">
|
|
<image class="icon-img" src="../static/t_szmm.svg"></image>
|
|
</view>
|
|
<view class="item-name">设置密码</view>
|
|
</view>
|
|
</block>
|
|
<!-- 系统帮助 -->
|
|
<block>
|
|
<view class="service-item">
|
|
<view class="item-icon">
|
|
<image class="icon-img" src="../static/t_xtbz.svg"></image>
|
|
</view>
|
|
<view class="item-name">系统帮助</view>
|
|
</view>
|
|
</block>
|
|
<!-- 系统信息 -->
|
|
<block>
|
|
<view class="service-item">
|
|
<view class="item-icon">
|
|
<image class="icon-img" src="../static/t_xtxx.svg"></image>
|
|
</view>
|
|
<view class="item-name">系统信息</view>
|
|
</view>
|
|
</block>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
<!-- LOGOUT -->
|
|
<!-- 退出登录 -->
|
|
<view v-if="isLogin" class="my-logout">
|
|
<view class="logout-btn" @click="handleLogout()">
|
|
<text>退出登录</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import store from '@/store'
|
|
// 校验登录
|
|
import { checkLogin, showError } from '@/core/app'
|
|
import * as UserApi from '@/api/user'
|
|
// import { userInfo } from 'os'
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
//认证标识
|
|
hasverify: false,
|
|
//
|
|
isLogin: true,
|
|
//用户信息
|
|
userInfo:[]
|
|
}
|
|
},
|
|
mounted() {
|
|
this.init()
|
|
this.getUserInfo()
|
|
},
|
|
methods: {
|
|
|
|
// 系统初始化
|
|
init(){
|
|
if(checkLogin()==true){
|
|
this.isLogin = true
|
|
// 如果用户等级大于0
|
|
//this.hasverify = this.userInfo.grade_id>0?true:false;
|
|
this.getUserInfo()
|
|
}else{
|
|
this.isLogin= false
|
|
setTimeout("",1200)
|
|
showError("请登录后再操作",this.gotologin())
|
|
}
|
|
},
|
|
|
|
gotologin(){
|
|
|
|
this.$navTo("pages/login/index")
|
|
},
|
|
|
|
// 获取当前用户信息
|
|
getUserInfo() {
|
|
const app = this
|
|
return new Promise((resolve, reject) => {
|
|
!app.isLogin ? resolve(null) : UserApi.info({}, { load: app.isFirstload })
|
|
.then(result => {
|
|
app.userInfo = result.data.userInfo
|
|
// 处理用户认证的问题
|
|
this.checkverify()
|
|
//this.hasverify = app.userInfo.grade_id>0?true:false
|
|
resolve(app.userInfo)
|
|
})
|
|
.catch(err => {
|
|
if (err.result && err.result.status == 401) {
|
|
app.isLogin = false
|
|
resolve(null)
|
|
} else {
|
|
reject(err)
|
|
}
|
|
})
|
|
})
|
|
},
|
|
|
|
// 检查实名等级的情况
|
|
checkverify(){
|
|
const app = this
|
|
let uinfo = app.userInfo
|
|
if(uinfo.real_name!="" || uinfo.id_no!=""){
|
|
app.hasverify = true
|
|
}else{
|
|
app.hasverify = false
|
|
}
|
|
},
|
|
|
|
// go to zw
|
|
gotozw(){
|
|
//this.$navTo("http://10.24.4.14")
|
|
const zwurl ="http://10.24.4.14"
|
|
//this.$navTo("pages/webview/wv?url="+ zwurl)
|
|
window.location.href=zwurl
|
|
},
|
|
|
|
// goto verfiy
|
|
gotoverfiy(){
|
|
this.$navTo("pages/verfiy/index")
|
|
},
|
|
|
|
// 退出登录
|
|
handleLogout() {
|
|
const app = this
|
|
uni.showModal({
|
|
title: '友情提示',
|
|
content: '您确定要退出登录吗?',
|
|
success(res) {
|
|
if (res.confirm) {
|
|
store.dispatch('Logout', {})
|
|
.then(result => app.init())
|
|
}
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.container {
|
|
position: relative;
|
|
background-color: #F4F4F4;
|
|
}
|
|
|
|
.headzone {
|
|
background-color: #0F476E;
|
|
// height: 460rpx;
|
|
height: 28vh;
|
|
width: 100%;
|
|
padding: 10% 10% 12%;
|
|
// margin-bottom: 22rpx;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
|
|
// 黄色的圆
|
|
.avtarzone {
|
|
background-color: #FEBD45;
|
|
width: 200rpx;
|
|
height: 200rpx;
|
|
border-radius: 50%;
|
|
text-align: center;
|
|
float: left;
|
|
margin: 0 auto;
|
|
|
|
|
|
//白色的圆
|
|
.avatar-bg {
|
|
float: left;
|
|
background-color: #fff;
|
|
width: 160rpx;
|
|
height: 160rpx;
|
|
border-radius: 50%;
|
|
margin: 20rpx;
|
|
}
|
|
|
|
.avatar {
|
|
display: inline-block;
|
|
margin: 13rpx;
|
|
width: 140rpx;
|
|
height: 140rpx;
|
|
}
|
|
}
|
|
|
|
.ubinfo {
|
|
color: #fff;
|
|
width: 64% !important;
|
|
float: left;
|
|
margin-left: 16rpx;
|
|
|
|
.ubi-uname {
|
|
font-size: 36rpx;
|
|
font-weight: 600;
|
|
}
|
|
|
|
//用户认证状态
|
|
.ubi-verify {
|
|
margin-top: 20rpx;
|
|
height: 36rpx;
|
|
line-height: 36rpx;
|
|
|
|
.mbtxt {
|
|
display: block;
|
|
float: left;
|
|
width: 74%;
|
|
}
|
|
|
|
.mbstatus {
|
|
display: block;
|
|
float: left;
|
|
width: 26%;
|
|
text-align: center;
|
|
padding: 0 5rpx 0;
|
|
height: 100%;
|
|
line-height: 100%;
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
.devinfo {
|
|
display: flex;
|
|
flex-direction: row;
|
|
width: 100%;
|
|
margin-top: 26rpx;
|
|
height: 48rpx;
|
|
line-height: 42rpx;
|
|
text-align: center;
|
|
color: #efefef;
|
|
|
|
.dev-txt {
|
|
margin-left: 22rpx;
|
|
width: 42%;
|
|
float: left;
|
|
padding-left: 10rpx;
|
|
padding-right: 10rpx;
|
|
}
|
|
|
|
}
|
|
|
|
// 状态类
|
|
.unverfiy {
|
|
background-color: #CECECE;
|
|
border: 1rpx solid #CECECE;
|
|
}
|
|
|
|
.verify {
|
|
background-color: #C6A94D;
|
|
border: 1rpx solid #C6A94D;
|
|
}
|
|
}
|
|
|
|
// 快速连接
|
|
.gtcenter {
|
|
position: absolute;
|
|
top: 360rpx;
|
|
left: 5%;
|
|
z-index: 90;
|
|
width: 90%;
|
|
height: 88rpx;
|
|
background-color: #FEBD45;
|
|
// margin: 0 auto;
|
|
border-radius: 44rpx;
|
|
padding: 0 10rpx 0;
|
|
display: flex;
|
|
flex-direction: row;
|
|
border: #034373;
|
|
box-shadow: 1rpx soild #0F476E;
|
|
|
|
.gttxt {
|
|
color: #034373;
|
|
font-size: 40rpx;
|
|
font-weight: 800;
|
|
line-height: 88rpx;
|
|
padding-left: 26rpx;
|
|
}
|
|
|
|
.gtlinks {
|
|
background-color: #F9DE8F;
|
|
height: 48rpx;
|
|
line-height: 46rpx;
|
|
margin-top: 20rpx;
|
|
margin-left: 16rpx;
|
|
padding: 0 20rpx 0 20rpx;
|
|
border-radius: 12%;
|
|
box-shadow: 1rpx 2rpx 3rpx #C6A94D;
|
|
border: #F9DE8F;
|
|
}
|
|
}
|
|
|
|
//提醒
|
|
.verify_notice{
|
|
background: rgba(0,0,0,0.8);
|
|
width: 100%;
|
|
height: 66vh;
|
|
max-height: 72vh;
|
|
padding-top: 100rpx;
|
|
text-align: center;
|
|
z-index: 90;
|
|
background-image: url("../static/vn_bg.png");
|
|
background-repeat: repeat-x;
|
|
background-position: bottom;
|
|
|
|
.vn-img{
|
|
text-align: center;
|
|
margin-top: 130rpx;
|
|
width: 260rpx;
|
|
height: 260rpx;
|
|
}
|
|
|
|
.vn-txt{
|
|
margin-top: 30rpx;
|
|
color: #F4F4F4;
|
|
font-size: 32rpx;
|
|
text-align: center;
|
|
line-height: 1.6;
|
|
padding-left: 20rpx;
|
|
padding-right: 20px;
|
|
}
|
|
|
|
.vn-btn{
|
|
background-color: #F4F4F4;
|
|
height: 56rpx;
|
|
line-height: 56rpx;
|
|
width: 420rpx;
|
|
margin: 30rpx auto;
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
// 服务内容
|
|
.fwnr {
|
|
margin-top: 60rpx;
|
|
background-color: #f4f4f4;
|
|
height: 82vh;
|
|
|
|
//
|
|
.fw-one {
|
|
// height: 96rpx;
|
|
display: flex;
|
|
flex-direction: row;
|
|
margin: 10rpx auto;
|
|
|
|
.fwo-item {
|
|
width: 42%;
|
|
height: 206rpx;
|
|
border-radius: 12%;
|
|
margin-left: 5%;
|
|
background-color: #fff;
|
|
|
|
.fwulb {
|
|
margin-top: 60rpx;
|
|
margin-left: 20rpx;
|
|
height: 60rpx;
|
|
display: block;
|
|
float: left;
|
|
width: 60%;
|
|
|
|
.fwname {
|
|
display: flex;
|
|
font-size: 32rpx;
|
|
color: #034373;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.fwnote {
|
|
font-size: 22rpx;
|
|
}
|
|
}
|
|
|
|
// background image
|
|
.fwubg {
|
|
margin-top: 60rpx;
|
|
width: 102rpx;
|
|
height: 102rpx;
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// 我的服务
|
|
.my-service {
|
|
margin: 22rpx auto 22rpx auto;
|
|
padding: 22rpx 0;
|
|
width: 94%;
|
|
box-shadow: 0 1rpx 5rpx 0px rgba(0, 0, 0, 0.05);
|
|
border-radius: 20rpx;
|
|
background: #fff;
|
|
|
|
.service-title {
|
|
padding-left: 24rpx;
|
|
margin-bottom: 20rpx;
|
|
font-size: 30rpx;
|
|
}
|
|
|
|
.service-content {
|
|
margin-bottom: -20rpx;
|
|
|
|
.service-item {
|
|
position: relative;
|
|
width: 25%;
|
|
float: left;
|
|
margin-bottom: 30rpx;
|
|
|
|
.item-icon {
|
|
text-align: center;
|
|
margin: 0 auto;
|
|
padding: 14rpx 0;
|
|
color: #ff3800;
|
|
font-size: 44rpx;
|
|
}
|
|
|
|
.icon-img {
|
|
width: 62rpx;
|
|
height: 62rpx;
|
|
}
|
|
|
|
.item-name {
|
|
font-size: 28rpx;
|
|
color: #545454;
|
|
text-align: center;
|
|
margin-right: 10rpx;
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
|
|
//
|
|
.othtools {
|
|
margin: 22rpx auto 22rpx auto;
|
|
padding: 22rpx 0;
|
|
width: 94%;
|
|
box-shadow: 0 1rpx 5rpx 0px rgba(0, 0, 0, 0.05);
|
|
border-radius: 20rpx;
|
|
background: #fff;
|
|
|
|
.service-title {
|
|
padding-left: 24rpx;
|
|
margin-bottom: 20rpx;
|
|
font-size: 30rpx;
|
|
}
|
|
|
|
.service-content {
|
|
margin-bottom: -20rpx;
|
|
|
|
.service-item {
|
|
position: relative;
|
|
width: 25%;
|
|
float: left;
|
|
margin-bottom: 30rpx;
|
|
|
|
.item-icon {
|
|
text-align: center;
|
|
margin: 0 auto;
|
|
padding: 14rpx 0;
|
|
color: #ff3800;
|
|
font-size: 44rpx;
|
|
}
|
|
|
|
.icon-img {
|
|
width: 62rpx;
|
|
height: 62rpx;
|
|
}
|
|
|
|
.item-name {
|
|
font-size: 28rpx;
|
|
color: #545454;
|
|
text-align: center;
|
|
margin-right: 10rpx;
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// 退出登录
|
|
.my-logout {
|
|
// display: flex;
|
|
// justify-content: center;
|
|
margin-top: 50rpx;
|
|
position: fixed;
|
|
bottom: 10rpx;
|
|
z-index: 100;
|
|
width: 100%;
|
|
|
|
.logout-btn {
|
|
width: 100%;
|
|
margin: 0 auto;
|
|
font-size: 28rpx;
|
|
color: #fff;
|
|
background-color: #0F476E;
|
|
// border-radius: 20rpx;
|
|
// border: 1px solid #dcdcdc;
|
|
padding: 24rpx 0;
|
|
text-align: center;
|
|
}
|
|
}
|
|
</style>
|