v2.1 2022-10-22

1.添加自动登录逻辑
2.各个界面微调美化

components/image-card.vue

@@ -0,0 +1,108 @@
+<template>
+	<!-- 主页展示卡片 -->
+	<view class="ic-container">
+		<image class="ic-image" mode="widthFix" :src="url" lazy-load="true"/>
+		<text class="ic-source" :class="'level-'+Math.ceil(Math.random()*9)">{{id}}</text>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: "image-card",
+		props: {
+			url: {
+				type: String,
+				value: ""
+			},
+			id: {
+				type: String,
+				value: ""
+			},
+			source: {
+				type: String,
+				value: ""
+			}
+		},
+		data() {
+			return {
+				isShow: false
+			};
+		},
+		methods: {
+			showImage() {
+				this.isShow = true;
+			},
+			closeImage() {
+				this.isShow = false;
+			}
+		}
+	}
+</script>
+
+<style>
+	.ic-container {
+		position: relative;
+	}
+
+	.ic-image {
+		min-height: 200px;
+		width: 100%;
+		border-radius: 20px;
+		margin-top: 10px;
+		background-color: #f6f7f9;
+	}
+
+
+	.ic-source {
+		min-height: 15px;
+		min-width: 15px;
+		line-height: 15px;
+		padding: 3px 7px;
+		border-radius: 7px;
+		font-size: 12px;
+		position: absolute;
+		top: 20px;
+		left: 15px;
+		opacity: 0.5;
+	}
+
+	.level-1 {
+		background-color: #c8d6e5;
+	}
+
+	.level-2 {
+		background-color: #576574;
+		color: white;
+	}
+
+	.level-3 {
+		background-color: #222f3e;
+		color: white;
+	}
+
+	.level-4 {
+		background-color: #48dbfb;
+	}
+
+	.level-5 {
+		background-color: #54a0ff;
+	}
+
+	.level-6 {
+		background-color: #5f27cd;
+		color: white;
+	}
+
+	.level-7 {
+		background-color: #feca57;
+	}
+
+	.level-8 {
+		background-color: #ff9ff3;
+	}
+
+	.level-9 {
+		background-color: #ff6b6b;
+		clear: white;
+	}
+</style>

components/tool-card.vue

@@ -0,0 +1,127 @@
+<template>
+	<view class="tc-container" @tap="turn2Url(url)">
+		<view class="tc-text">
+			<text class="tc-title">{{title}}</text>
+			<text class="tc-detail">{{detail}}</text>
+		</view>
+		<view class="tc-img">
+			<text class="tc-bg" :style="{'backgroundColor':color}"></text>
+			<image class="tc-icon" :src="icon" mode="scaleToFill"></image>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: "tool-card",
+		props: {
+			title: {
+				type: String,
+				value: ""
+			},
+			detail: {
+				type: String,
+				value: ""
+			},
+			icon: {
+				type: String,
+				value: ""
+			},
+			color: {
+				type: String,
+				value: ""
+			},
+			url: {
+				type: String,
+				value: ""
+			}
+		},
+		data() {
+			return {
+
+			};
+		},
+		methods: {
+			turn2Url(iurl) {
+				uni.navigateTo({
+					url: iurl,
+					success() {
+						uni.showToast({
+							title: "正在加载",
+							icon: "loading",
+							duration: 500
+						});
+					},
+					fail() {
+						uni.showToast({
+							title: "开发中...",
+							icon: "error"
+						});
+					}
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+	.tc-container {
+		width: 100%;
+		height: 90px;
+		background-color: #f8f8f8;
+		border-radius: 20px;
+	}
+
+	.tc-text {
+		width: 70%;
+		float: left;
+	}
+
+	.tc-title {
+		margin: 15px 15px 2px 15px;
+		height: 20px;
+		line-height: 20px;
+		display: inline-block;
+		font-size: 18px;
+		overflow: hidden;
+	}
+
+	.tc-detail {
+		margin: 0 0 0 15px;
+		height: 15px;
+		line-height: 15px;
+		display: inline-block;
+		font-size: 12px;
+		color: #888888;
+		overflow: hidden;
+	}
+
+	.tc-img {
+		width: 30%;
+		float: left;
+		text-align: center;
+		position: relative;
+	}
+
+	.tc-bg {
+		display: block;
+		height: 36px;
+		width: 36px;
+		margin: 12px;
+		border-radius: 18px;
+		background-color: pink;
+		position: absolute;
+		right: 0;
+		top: 0;
+	}
+
+	.tc-icon {
+		height: 24px;
+		width: 24px;
+		margin: 12px;
+		border-radius: 18px;
+		position: absolute;
+		right: 6px;
+		top: 6px;
+	}
+</style>