complete index,contryside complete about 50%,addr is none
This commit is contained in:
13
pages/index/addr.vue
Normal file
13
pages/index/addr.vue
Normal file
@@ -0,0 +1,13 @@
|
||||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
177
pages/index/countryside.vue
Normal file
177
pages/index/countryside.vue
Normal file
@@ -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>
|
||||
@@ -30,12 +30,31 @@
|
||||
<image :src="content[0]"></image>
|
||||
<view>
|
||||
<p>{{content[1]}}</p>
|
||||
<p>据您{{content[2]}}m</p>
|
||||
<p>据您{{content[2]}}km</p>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="society" v-if="active_content">
|
||||
<view class="society-title">
|
||||
<view>社会动态</view>
|
||||
<view>查看更多<image src="../../static/联合 10.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="society-content">
|
||||
<view>
|
||||
<view>{{active_content[2][1]}}</view>
|
||||
<view>{{active_content[2][3]}}评论 {{active_content[2][4]}}</view>
|
||||
</view>
|
||||
<image :src="active_content[2][0]" mode=""></image>
|
||||
</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>
|
||||
|
||||
@@ -43,14 +62,18 @@
|
||||
import bannerlist from "../../components/bannerlist"
|
||||
export default {
|
||||
components: {
|
||||
bannerlist
|
||||
bannerlist,
|
||||
},
|
||||
data() {
|
||||
let list = ["首页", "友邻社区", "", "社区服务", "数据分析"].map((value, index) => [value,
|
||||
`../../static/${["首页.png","友邻社区.png","c1.png","社区服务.png","组 153.png"][index]}`
|
||||
])
|
||||
return {
|
||||
notice: null,
|
||||
imagePath: null,
|
||||
notices: null,
|
||||
active_content: null
|
||||
active_content: null,
|
||||
list
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@@ -89,12 +112,9 @@
|
||||
x.unit
|
||||
])
|
||||
this.active_content = (await this.request("get", "/api/cms/article/list")).rows.map(x => [
|
||||
`http://124.93.196.45:10091/Neusoft/community${x.cover}`, x.title,
|
||||
x.commentNum
|
||||
`http://124.93.196.45:10091/Neusoft/community${x.cover}`, x.title, parseFloat(x.location), x
|
||||
.commentNum, x.createTime
|
||||
])
|
||||
// await this.request("get","/api/visitor/list")
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -149,33 +169,147 @@
|
||||
|
||||
.active {
|
||||
margin: 10px;
|
||||
padding: 5px;
|
||||
border-radius: 10px;
|
||||
border: 1px #999999 solid;
|
||||
}
|
||||
|
||||
.active-title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 3.5vh;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.active-title view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
.active-title view:first-child {
|
||||
border-left: 5px solid black;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.active-title view:nth-child(2) image {
|
||||
width: 2vw;
|
||||
height: 2vh;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.active-content {
|
||||
display: flex;
|
||||
overflow: scroll;
|
||||
}
|
||||
|
||||
.active-content>view {
|
||||
flex-shrink: 0;
|
||||
width: 70vw;
|
||||
border: 1px #999999 solid;
|
||||
margin: 10px;
|
||||
display: flex;
|
||||
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.active-content>view image {
|
||||
width: 30vw;
|
||||
height: 10vh;
|
||||
flex-shrink: 0
|
||||
}
|
||||
</style>
|
||||
|
||||
.active-content>view view {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.society {
|
||||
margin: 10px;
|
||||
padding: 5px;
|
||||
border-radius: 10px;
|
||||
border: 1px #999999 solid;
|
||||
}
|
||||
|
||||
.society-title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 3.5vh;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.society-title view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
.society-title view:first-child {
|
||||
border-left: 5px solid black;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.society-title view:nth-child(2) image {
|
||||
width: 2vw;
|
||||
height: 2vh;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.society-content {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 10px;
|
||||
height: 12vh;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
|
||||
.society-content>view:first-child view:first-child {
|
||||
font-size: 1.1rem;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.society-content>view:first-child view:nth-child(2) {
|
||||
color: #dadada;
|
||||
}
|
||||
|
||||
.society-content image {
|
||||
width: 20vw;
|
||||
height: 8vh;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
display: flex;
|
||||
position: fixed;
|
||||
border: 1px solid black;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.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>
|
||||
Reference in New Issue
Block a user