index is complete about 50%
56
components/bannerlist.vue
Normal file
@@ -0,0 +1,56 @@
|
|||||||
|
<template>
|
||||||
|
<view class="bannerlist">
|
||||||
|
<view class="li" v-for="value in valuearray">
|
||||||
|
<image :src="value[1]"></image>
|
||||||
|
<text>{{value[0]}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
|
||||||
|
data() {
|
||||||
|
let valuearray = ["开门", "我的房屋", "我的车位", "物业缴费", "扫码取件", "社区公告", "社区电话", "投诉建议"]
|
||||||
|
.map((value, index) => [value,
|
||||||
|
`../../static/${["open-door.png","house.png","feedback-1.png","property-bill.png","qr-pick.png","note.png","property-tel.png","feedback.png"][index]}`
|
||||||
|
])
|
||||||
|
return {
|
||||||
|
valuearray
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
console.log(this.valuearray)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
* {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bannerlist {
|
||||||
|
width: 100%;
|
||||||
|
height: 20vh;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr 1fr 1fr 1fr;
|
||||||
|
justify-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.li {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.li image {
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -6,6 +6,15 @@
|
|||||||
"navigationBarTitleText": "uni-app"
|
"navigationBarTitleText": "uni-app"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
,{
|
||||||
|
"path" : "components/bannerlist",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
],
|
],
|
||||||
"globalStyle": {
|
"globalStyle": {
|
||||||
"navigationBarTextStyle": "black",
|
"navigationBarTextStyle": "black",
|
||||||
|
|||||||
@@ -1,14 +1,56 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<view class="begin">
|
||||||
|
<view class="title" v-if="notices">
|
||||||
|
{{notices[0][2]}}
|
||||||
|
</view>
|
||||||
|
<swiper class="first" :indicator-dots="false" :autoplay="true" :interval="3000" :duration="1000">
|
||||||
|
<swiper-item v-for="path in imagePath">
|
||||||
|
<view class="swiper-item">
|
||||||
|
<image :src="path"></image>
|
||||||
|
</view>
|
||||||
|
</swiper-item>
|
||||||
|
</swiper>
|
||||||
|
<swiper class="notice" :indicator-dots="false" :autoplay="false" :interval="3000" :duration="1000">
|
||||||
|
<swiper-item v-for="notice in notices">
|
||||||
|
<view class="swiper-item">
|
||||||
|
{{notice[0]}}
|
||||||
|
<image src="../../static/联合 10.png"></image>
|
||||||
|
</view>
|
||||||
|
</swiper-item>
|
||||||
|
</swiper>
|
||||||
|
<bannerlist></bannerlist>
|
||||||
|
<view class="active">
|
||||||
|
<view class="active-title">
|
||||||
|
<view>社会活动</view>
|
||||||
|
<view>查看更多<image src="../../static/联合 10.png"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="active-content">
|
||||||
|
<view v-for="content in active_content">
|
||||||
|
<image :src="content[0]"></image>
|
||||||
<view>
|
<view>
|
||||||
|
<p>{{content[1]}}</p>
|
||||||
|
<p>据您{{content[2]}}m</p>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import bannerlist from "../../components/bannerlist"
|
||||||
export default {
|
export default {
|
||||||
|
components: {
|
||||||
|
bannerlist
|
||||||
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
notice:null
|
notice: null,
|
||||||
|
imagePath: null,
|
||||||
|
notices: null,
|
||||||
|
active_content: null
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
@@ -22,8 +64,7 @@
|
|||||||
"Authorization": (await this.request("post", "/api/login")).token
|
"Authorization": (await this.request("post", "/api/login")).token
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
}
|
} else if (gest == "post") {
|
||||||
else if (gest=="post"){
|
|
||||||
text = await fetch(`http://124.93.196.45:10091/Neusoft/community${path}`, {
|
text = await fetch(`http://124.93.196.45:10091/Neusoft/community${path}`, {
|
||||||
method: "POST",
|
method: "POST",
|
||||||
headers: {
|
headers: {
|
||||||
@@ -41,13 +82,100 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
async mounted() {
|
async mounted() {
|
||||||
// await this.request("get","/api/notice/list")
|
this.imagePath = (await this.request("get", "/api/adv/list")).data.map(x =>
|
||||||
// await this.request("get","/api/cms/article/list")
|
`http://124.93.196.45:10091/Neusoft/community${x.image}`)
|
||||||
|
this.notices = (await this.request("get", "/api/notice/list")).rows.map(x => [x.noticeTitle, x
|
||||||
|
.noticeContent,
|
||||||
|
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
|
||||||
|
])
|
||||||
// await this.request("get","/api/visitor/list")
|
// await this.request("get","/api/visitor/list")
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
* {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 1.3rem;
|
||||||
|
font-weight: bold;
|
||||||
|
text-align: center;
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.first {
|
||||||
|
width: 100vw;
|
||||||
|
height: 23vh;
|
||||||
|
margin: 0px auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.first image {
|
||||||
|
display: block;
|
||||||
|
width: 70vw;
|
||||||
|
height: 23vh;
|
||||||
|
margin: 0px auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.notice {
|
||||||
|
width: 100vw;
|
||||||
|
height: 5vh;
|
||||||
|
background-color: #FEF5E6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.notice .swiper-item {
|
||||||
|
width: 90vw;
|
||||||
|
height: 5vh;
|
||||||
|
margin: 0 auto;
|
||||||
|
line-height: 5vh;
|
||||||
|
color: #EECA9C;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.notice .swiper-item image {
|
||||||
|
width: 3vw;
|
||||||
|
height: 3vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active {
|
||||||
|
margin: 10px;
|
||||||
|
border: 1px #999999 solid;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active-title {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
height: 3.5vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active-title view {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active-title view:nth-child(2) image {
|
||||||
|
width: 2vw;
|
||||||
|
height: 2vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active-content>view {
|
||||||
|
border: 1px #999999 solid;
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.active-content>view image {
|
||||||
|
width: 30vw;
|
||||||
|
height: 10vh;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
BIN
static/feedback-1.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
static/feedback.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
static/house.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
static/note.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
static/open-door.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
static/property-bill.png
Normal file
|
After Width: | Height: | Size: 16 KiB |
BIN
static/property-tel.png
Normal file
|
After Width: | Height: | Size: 16 KiB |
BIN
static/qr-pick.png
Normal file
|
After Width: | Height: | Size: 13 KiB |
BIN
static/联合 10.png
Normal file
|
After Width: | Height: | Size: 552 B |
@@ -1,22 +0,0 @@
|
|||||||
<template>
|
|
||||||
<view>
|
|
||||||
|
|
||||||
</view>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
|
|
||||||
}
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
|
|
||||||
</style>
|
|
||||||