sisMobilePhone/pages/mine/Mine.vue

<template>
	<view class="content">
		<cu-custom bgColor="bg-blacks" :isBack="false">
		    <block slot="right">
				<image src="../../static/picture/fourLine.png" style="width: 30px;height: 30px;margin-left: 2%;" @tap="openDrawer"></image>
			</block>
			<block slot="right">	
					<view class="icon cuIcon-notice text-white" v-if="badge != 0" style="margin-left: -70%;">
						<view class="cu-tag looknumber" style="margin-top: -2%;">
							<block v-if="badge != 1">{{ badge > 99 ? '99+' : badge }}</block>
						</view>
					</view>
			</block>
			<block slot="right">
					
			</block>
		    <block slot="content">{{address}}</block>
			<block slot="right">
				<view class="plus" @tap="showModal" data-target="viewModal">+</view>
			</block>
		</cu-custom>
		<!-- 抽屉组件 -->
		<div>
			<drawer ref="drawer"></drawer>
		</div>
		<div class="plusDrawer" @tap="hideModal">
			<plusDrawer ref="plusDrawer"></plusDrawer>
		</div>
<!-- 		<view>
			<button class="cu-btn bg-red lg" @tap="falseLogin" type="" :style="{ 'height': buttonHeight}">注销账号</button>
		</view> -->
		
		<view v-if="toggleid==12">
			<mine ref="r1"></mine>
		</view>
		
		<view v-if="toggleid==13">
			<chatindex ref="r1"></chatindex>
		</view>
		
	</view>
	
	
	
	
</template>

<script>
	import res from '../../common/data.json';
	import drawer from '../../components/drawer/threeLineDrawer.vue'
	import plusDrawer from '../../components/drawer/plusDrawer.vue';
	
	import mine from '../../components/mine/Mine.vue';
	import chatindex from '../../components/mine/chat/Chatindex.vue';
	
	export default {
		components: {
			drawer: drawer,
			plusDrawer: plusDrawer,
			mine:mine,
			chatindex:chatindex
		},
		data:function(){
			return{
				toggleid:12,//12我的主页，13聊天通讯，默认12
				badge: 22,
				inconList:["form","favor","question","edit"],
				modalName:null,
				leftNavigationtitle:'我的功能分组',
				buttonHeight:'',
				address: '',
				drawerList: [
					{"name":"聊天通讯"},
				],
				plusDrawerList: [],
				
			}
		},created: function() {
			this.viewUserid();
			this.monitoringAuthority();
			this.address = this.dataprocessing.getWindPowerStationName();
			this.FDC=this.dataprocessing.getWindPowerStationId();
			this.windPowerStationId =this.dataprocessing.getWindPowerStationId();
			this.plusDrawerList=uni.getStorageSync('plusList');
			this.drawerList=uni.getStorageSync('leftlist5');
			console.log(this.drawerList);
		},
		onHide() {
			this.$refs.drawer.closeDrawer();
			this.hideModal();
		},
		onShow(){
			this.viewUserid();
			this.monitoringAuthority();
			this.address = this.dataprocessing.getWindPowerStationName();
			this.FDC=this.dataprocessing.getWindPowerStationId();
			this.windPowerStationId =this.dataprocessing.getWindPowerStationId();
		},
		methods:{
			openDrawer: function() {

				if(this.$refs.drawer != undefined){
					this.$refs.drawer.openDrawer(250, this.drawerList, this.inconList,this.leftNavigationtitle);
				}else{
			
				}
			},
			closeDrawer: function() {				
				this.drawerIsShow = false;
				
			},viewUserid: function() {
				this.plusDrawerList=uni.getStorageSync('plusList');
			},
			monitoringAuthority: function() {
				this.drawerList=uni.getStorageSync('leftlist5');
			},
			pushWindPowerStationNameToSessionStorage(windpowerstationName) {
				uni.setStorageSync('windpowerstationName', windpowerstationName);
				//sessionStorage.setItem('windpowerstationName', windpowerstationName);
				//alert("v"+ sessionStorage.getItem("windpowerstationName"));
				//this.common.goback('/pages/index/Index');
			},
			getWindPowerStationNameToSessionStorage() {
				uni.getStorageSync('windpowerstationName');
				return uni.getStorageSync('windpowerstationName');
			},
			showModal(e) {
				this.modalName = e.currentTarget.dataset.target;
				this.$refs.plusDrawer.showModal(this.plusDrawerList, this.modalName);
			},
			hideModal() {
				this.modalName = null;
				this.$refs.plusDrawer.hideModal(this.modalName);
			},
			falseLogin: function() {
				this.removeUsernamePassword();
				uni.navigateTo({
				    url: '/components/login/Login'
				});
			},
			removeUsernamePassword: function() {
				uni.removeStorageSync('gyeeusername');
				uni.removeStorageSync('gyeepassword');
			},
		}
	};
</script>

<style>
	body {
		font-family: '方正兰亭细黑_GBK';
		font-size: 20px;
		color: silver;
		background: #000;
	}
	
	@font-face {
		font-family: '方正兰亭细黑_GBK';
		src: url(../../static/fzltxh.TTF);
	}
	
	page {
		background-color: #1f1f1f;
		font-family: '方正兰亭细黑_GBK';
		overflow-x: hidden;
	}

	.top {
		width: 100%;
		height: 130upx;
		padding-top: 5upx;
		background-color: #1f1f1f;
		position: fixed;
		top: 0px;
		left: 0px;
		z-index: 100;
	}

	.threeLine {
		width: 50px;
		height: 45px;
		float: left;
	}

	.text {
		width: calc(100% - 100px);
		height: 45px;
		float: left;
		user-select: text;
		-webkit-user-select: text;
		-moz-user-select: text;
		-ms-user-select: text;
		color: silver;
		line-height: 45px;
		margin-top: 11px;
		font-size: 18px;
	}

	.notice {
		width: 50px;
		height: 45px;
		float: left;
	}

	.plus {
		width: 30px;
		height: 45px;
		float: right;
		color: white;
		font-size: 35px;
		line-height: 45px;
		text-align: right;
		margin-right: 2.5%;
	}
	
	.textWindpowerstation{
		width: 180px;
		height: 45px;
		float: left;
		text-align: center;
		margin-left: 18px;
	}
	.cu-btn {
		width: 80%;
		height: 40px;
		margin-left: 10%;
		margin-top: 25px;
	}
</style>