wurenji-xcx/pages/main/main.vue

<template>
	<view class="main">
		<view class="top">
			<view class="icon" @click='toset'>
				<u-icon name="setting" color="#fff" size="28"></u-icon>
			</view>
			<view class="user">
				<image v-if="userInfo.headUrl" :src="userInfo.headUrl" mode=""></image>
				<view v-else class="name">
					<span>
						{{userInfo.realName.slice(-2)}}
					</span>
				</view>
				<view class="txt">
					{{userInfo.realName}} <span v-if="userInfo.deptName">({{userInfo.deptName}})</span>
				</view>
			</view>
		</view>
		<view class="list">
			<!-- <view class="li">
				<view style="display: flex;">
					<u-icon name="bell-fill" color="#3DD4A7" size="20"></u-icon>
					<view class="txt">
						我的消息
					</view>
					
				</view>
				<u-icon name="arrow-right" size="20"></u-icon>
			</view>
			<view class="li">
				<view style="display: flex;">
					<u-icon name="star-fill" color="#FDDB79" size="20"></u-icon>
					<view class="txt">
						我的收藏
					</view>
					
				</view>
				<u-icon name="arrow-right" size="20"></u-icon>
			</view> -->

			<view class="li" @click='toset'>
				<view style="display: flex;">
					<u-icon name="heart-fill" color="#7C83F6" size="20"></u-icon>
					<view class="txt">
						设置
					</view>

				</view>
				<u-icon name="arrow-right" size="20"></u-icon>
			</view>
			<view class="li" @click="todetail('AboutUs')">
				<view style="display: flex;">
					<u-icon name="account-fill" color="#2360EE" size="20"></u-icon>
					<view class="txt">
						关于我们
					</view>

				</view>
				<u-icon name="arrow-right" size="20"></u-icon>
			</view>

			<!-- <view class="li">
				<view style="display: flex;">
					<u-icon name="coupon-fill" color="#FA746B" size="20"></u-icon>
					<view class="txt">
						用户数据
					</view>
				</view>
				<view class="" style="display: flex;">
					{{currentSize}}
					<u-icon name="arrow-right" size="20"></u-icon>
				</view>
			</view> -->
			<view class="li" @click="clearStroge" v-if="isApp">
				<view style="display: flex;">
					<u-icon name="error-circle-fill" color="#FA746B" size="20"></u-icon>
					<view class="txt">
						重启程序
					</view>

				</view>
				<view class="" style="display: flex;">
					<u-icon name="arrow-right" size="20"></u-icon>
				</view>
			</view>
			<u-toast ref="uToast"></u-toast>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo: {},
				isApp: false,
				currentSize: ""
			}
		},
		onShow() {
			this.userInfo = uni.getStorageSync('userInfo')
		},
		mounted() {},
		onLoad() {
			// APP：
			// #ifdef APP-PLUS
			this.getStorageSize()
			this.isApp = true
			// #endif
		},
		methods: {
			getaltitude() {
				// const key = "74d5aa7c4270effe9a18d9cfa6149abf";
				// const lat = 39.9; // 指定纬度
				// const lng = 116.4; // 指定经度

				// wx.request({
				//   url: `https://apis.map.qq.com/ws/elevation/v1/?locations=${lat},${lng}&key=${key}`,
				//   method: "GET",
				//   success: (res) => {
				//     if (res.data.status === 0) {
				//       console.log(`海拔：${res.data.result[0].elevation} 米`);
				//     } else {
				//       console.error("获取海拔失败", res.data);
				//     }
				//   },
				//   fail: (err) => {
				//     console.error("请求失败", err);
				//   }
				// });

				uni.getLocation({
					type: 'gcj02',
					altitude:true,
					success(res) {
						console.log(res);
					},
					fail(fail) {
						console.log(fail);
					}
				})

			},
			// 辅助函数，将字节数转换为更友好的格式
			formatFileSize(bytes) {
				if (bytes === 0) return '0 Bytes';
				const k = 1024;
				const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
				const i = Math.floor(Math.log(bytes) / Math.log(k));
				return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
			},
			// 获取本地缓存大小
			getStorageSize() {
				let that = this;
				plus.cache.calculate(function(size) {
					let sizeCache = parseInt(size);
					if (sizeCache == 0) {
						that.currentSize = "0B";
					} else if (sizeCache < 1024) {
						that.currentSize = sizeCache + "B";
					} else if (sizeCache < 1048576) {
						that.currentSize = (sizeCache / 1024).toFixed(2) + "KB";
					} else if (sizeCache < 1073741824) {
						that.currentSize = (sizeCache / 1048576).toFixed(2) + "MB";
					} else {
						that.currentSize = (sizeCache / 1073741824).toFixed(2) + "GB";
					}
				});
				// plus.io.resolveLocalFileSystemURL('_documents/', function(entry) {
				// 	entry.getMetadata(function(metadata) {
				// 		// metadata.size 表示文件大小，单位为字节
				// 		var fileSizeInBytes = metadata.size;

				// 		// 将字节数转换为更友好的格式（KB、MB、GB等）
				// 		var fileSizeFormatted = that.formatFileSize(fileSizeInBytes);

				// 		console.log('本地数据大小:', fileSizeFormatted);
				// 	}, function(error) {
				// 		console.error('获取文件信息失败：', error.message);
				// 	});
				// }, function(error) {
				// 	console.error('解析文件路径失败：', error.message);
				// });
			},

			clearStroge() {
				uni.showModal({
					title: '提示',
					content: '是否重启程序？',
					success: function(res) {
						if (res.confirm) {
							plus.android.importClass("android.app.ActivityManager");
							var Context = plus.android.importClass("android.content.Context");
							var am = plus.android.runtimeMainActivity().getSystemService(Context
								.ACTIVITY_SERVICE);
							am.clearApplicationUserData();
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},
			todetail(e) {
				uni.navigateTo({
					url: '/pages/main/set/aboutUs/aboutUs'
				})
			},
			toset() {
				uni.navigateTo({
					url: '/pages/main/set/setlist'
				})
			}

		}
	}
</script>
<style>
	.main .u-icon {
		/* justify-content: right; */
	}
</style>
<style lang="scss" scoped>
	.list {
		margin-top: 100rpx;
		padding: 0 35rpx;

		.li {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-bottom: 50rpx;

			.txt {
				margin-left: 10rpx;
			}
		}
	}

	.top {
		color: #fff;
		background-color: #39BDFD;
		padding: 60rpx 20rpx;
		font-size: 24rpx;

		.user {
			margin-top: 100rpx;

			.txt {
				margin-top: 20rpx;
			}

			text-align: center;

			.name {
				background: #39BDFD;
				color: #fff;

				span {
					height: 50px;
					width: 50px;
					line-height: 50px;
					display: inline-block;
					border-radius: 50%;
					background: #ccc;
					font-size: 16px;
				}
			}

			image {
				width: 100rpx;
				height: 100rpx;
				border-radius: 50%;
				background-size: 100% 100%;
			}
		}

		// .icon {
		// 	text-align: right;
		// }
	}
</style>