all completed,components/side is none commentpart

pages/index/addr.vue

@@ -1,13 +1,184 @@
 <template>
-	<view>
+	<view class="page">
+		<uni-segmented-control :current="current" styleType="text" activeColor="dodgerblue" :values="value"
+			@clickItem="toggole()"></uni-segmented-control>
+		<view class="content">
+			<view v-show="current === 0">
+				<view v-for="unit in array">
+					<view class="header">
+						<text>{{unit[0]}}</text>
+						<text>未读</text>
+					</view>
+					<view class="content_text" v-html="unit[1]"></view>
+					<view class="bottom_content">
+						<view>
+							<image src="../../static/组 155.png"></image>
+							<text>{{unit[2]}}</text>
+						</view>
+						<view @click="goto(unit)">查看详情</view>
+					</view>
+				</view>
+			</view>
+			<view v-show="current === 1">
+				选项卡2的内容
+			</view>
+			<view v-show="current === 2">
+				选项卡3的内容
+			</view>
+		</view>
 		
 	</view>
 </template>
 
-<script setup>
-	
+<script>
+	export default {
+		data() {
+			return {
+				current: 0,
+				value: ["全部", "未读", "已读"],
+				array: null,
+			}
+		},
+		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
+			},
+			goto(value){
+				const itemStr = encodeURIComponent(JSON.stringify(value))
+				uni.navigateTo({
+					url:`/pages/index/addr_more?id=${value[3]}&data=${itemStr}`
+				})
+				
+			}
+		},
+		async mounted() {
+			this.array = (await this.request("get", "/api/notice/list")).rows.map(x => [
+			x.noticeTitle,
+			 x.noticeContent, 
+			 x.createTime,
+			 x.noticeId
+			])
+			console.log(this.array)
+		}
+	}
 </script>
 
 <style>
-	       
+	* {
+		padding: 0;
+		margin: 0;
+	}
+
+	.page {
+		background-color: #ECF4FD;
+		height: 95.3vh;
+	}
+
+	.content {
+		margin: 10px;
+	}
+
+	.content view view {
+		background-color: white;
+		padding: 5px;
+	}
+
+	.content>view>view {
+		margin: 10px;
+		border-radius: 10px;
+		box-shadow: 10px 10px 20px #f7f7f7;
+	}
+
+	.header {
+		display: flex;
+		justify-content: space-between;
+	}
+	.header text:nth-child(2){
+		color:#55ff7f;
+	}
+	.content_text {
+		height: 13vh;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		padding: 8px 0px !important;
+		border-bottom: 1px solid black;
+		border-top: 1px solid black;
+	}
+
+	.bottom_content {
+		display: flex;
+		justify-content: space-between;
+
+	}
+
+	.bottom_content image {
+		height: 20px;
+		width: 20px;
+	}
+
+	.bottom_content>view:first-child {
+		color: #d0d0d0;
+	}
+
+	.bottom_content>view {
+		display: flex;
+		align-items: center;
+	}
+	.bottom_content>view:nth-child(2){
+	color: blue;
+	}
+	.bottom {
+		display: flex;
+		position: fixed;
+		border: 1px solid black;
+		bottom: 0;
+		width: 100%;
+		height: 5vh;
+	}
+
+	.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>