complete index,contryside complete about 50%,addr is none

pages/index/countryside.vue

@@ -0,0 +1,177 @@
+<template>
+	<view>
+		<view class="countryside_title">
+			<image src="/static/友邻社区.png"></image>
+			<text>友邻社区</text>
+		</view>
+		<view class="countryside_content">
+			<view v-for="value in valuearray">
+				<image :src="value[0]"></image>
+				<view>
+					<view>
+						<image src="/static/组 341.png"></image>
+						<view>{{value[1]}}</view>
+					</view>
+					<view>
+						<image src="/static/已收藏.png"></image>
+						<view>{{value[2]}}</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="bottom">
+			<view class="list-li" v-for="part in list">
+				<image :src="part[1]"></image>
+				<text>{{part[0]}}</text>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			let list = ["首页", "友邻社区", "", "社区服务", "数据分析"].map((value, index) => [value,
+				`../../static/${["首页.png","友邻社区.png","c1.png","社区服务.png","组 153.png"][index]}`
+			])
+			return {
+				valuearray: null,
+				list
+			}
+		},
+		methods: {
+			async request(gest, path) {
+				let text
+				if (gest == "get") {
+					text = await fetch(`http://124.93.196.45:10091/Neusoft/community${path}`, {
+						method: "GET",
+						headers: {
+							"Content-Type": "application/json",
+							"Authorization": (await this.request("post", "/api/login")).token
+						},
+					})
+				} else if (gest == "post") {
+					text = await fetch(`http://124.93.196.45:10091/Neusoft/community${path}`, {
+						method: "POST",
+						headers: {
+							"Content-Type": "application/json",
+						},
+						body: JSON.stringify({
+							"password": "0CYdq6Hn",
+							"username": "6dOMIgIU",
+						})
+					})
+				}
+				const data = await text.json()
+				console.log(data)
+				return data
+			}
+		},
+		async mounted() {
+			this.valuearray =
+				(await this.request(
+					"get", "/api/post/list"))
+				.rows.map(x => [`http://124.93.196.45:10091/Neusoft/community${x.cover}`,
+					x.userId,
+					x.likeNum,
+					x.title,
+					x.createTime,
+					x.content
+				])
+			// .filter(x => x[0] !== null)
+
+			console.log(this.valuearray)
+
+		}
+	}
+</script>
+
+<style>
+	.countryside_title {
+		height: 6vh;
+		display: flex;
+		align-items: center;
+	}
+
+	.countryside_title image {
+		width: 12vw;
+		height: 100%;
+	}
+
+	.countryside_content {
+		margin: 10px;
+		height: 88vh;
+		display: grid;
+		grid-template-columns: 1fr 1fr;
+		gap: 10px;
+		overflow: scroll;
+	}
+
+	.countryside_content>view {
+		display: flex;
+		flex-direction: column;
+	}
+
+	.countryside_content>view>image {
+		width: 100%;
+		height: 30vh;
+	}
+
+	.countryside_content>view>view {
+		display: flex;
+		height: 5vh;
+		justify-content: space-between;
+	}
+
+	.countryside_content>view>view>view:first-child {
+		display: flex;
+		align-items: center;
+	}
+
+	.countryside_content>view>view>view:first-child image {
+		width: 30px;
+		height: 30px;
+	}
+
+	.countryside_content>view>view>view:nth-child(2) {
+		display: flex;
+		align-items: center;
+	}
+
+	.countryside_content>view>view>view:nth-child(2) image {
+		width: 30px;
+		height: 30px;
+	}
+
+	.bottom {
+		display: flex;
+		position: fixed;
+		border: 1px solid black;
+		bottom: 0;
+		width: 100%;
+		background-color: aliceblue;
+	}
+
+	.list-li {
+		flex: 1;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+	}
+
+	.list-li image {
+		height: 20px;
+		width: 20px;
+	}
+
+	.list-li:nth-child(1) {
+		color: dodgerblue;
+	}
+
+	.list-li:nth-child(3) image {
+		width: 40px;
+		height: 40px;
+		border-radius: 50%;
+		border: 2px solid black;
+	}
+</style>