This commit is contained in:
yanran200730
2023-03-20 11:59:06 +08:00
4 changed files with 143 additions and 105 deletions

View File

@@ -1,32 +1,35 @@
<template>
<div class="page">
<u-navbar :is-back="false" title="首页" title-color="#000" title-width="300" title-size="32" :background="backgroundNavbar" :title-bold="true"></u-navbar>
<div class="swiper-content">
<u-swiper :list="swiperList" mode="none" height="240" bg-color="none" @click="handleBannerClick"/>
</div>
<div class="grid-content">
<u-grid :col="4" hover-class="text-hover" :border="false">
<u-grid-item v-for="(item, index) in grids" :key="index" :custom-style="{padding:'8px 0'}" bg-color="none"
class="grid-item" @click="handleClick(item)">
<img :src="item.pictureUrl" alt=""/>
<div class="grid-text">{{ item.name }}</div>
</u-grid-item>
</u-grid>
</div>
<div class="notice">
<img :src="`${cdn}/notice-new.png`" alt="">
<u-notice-bar mode="vertical" color="#4181FF" style="flex: 1;" :volume-icon="false" :is-circular="false"
duration="5000" speed="5000" :list="noticeList" @click="clickNotice"/>
</div>
<div class="container">
<div class="swiper-content">
<u-swiper :list="swiperList" mode="none" height="240" bg-color="none" @click="handleBannerClick"/>
</div>
<div class="grid-content">
<u-grid :col="4" hover-class="text-hover" :border="false">
<u-grid-item v-for="(item, index) in grids" :key="index" :custom-style="{padding:'8px 0'}" bg-color="none"
class="grid-item" @click="handleClick(item)">
<img :src="item.pictureUrl" alt=""/>
<div class="grid-text">{{ item.name }}</div>
</u-grid-item>
</u-grid>
</div>
<div class="notice">
<img :src="`${cdn}/notice-new.png`" alt="">
<u-notice-bar mode="vertical" color="#4181FF" style="flex: 1;" :volume-icon="false" :is-circular="false"
duration="5000" speed="5000" :list="noticeList" @click="clickNotice"/>
</div>
<div class="card">
<img class="card-left" src="https://cdn.cunwuyun.cn/fengdu/img-fengshouyinhang.png" @click="$linkTo('/mods/newFarmerBank/newFarmerBank')" alt="">
<div class="card-right">
<img src="https://cdn.cunwuyun.cn/fengdu/img-fengduxinnongren.png" alt="" @click="$linkTo('./mods/newFarmer/newFarmer')">
<img src="https://cdn.cunwuyun.cn/fengdu/ic-jiaoyuhuzhu.png" alt="" @click="$linkTo('./mods/helpEachOther/helpEachOther')">
<div class="card">
<img class="card-left" src="https://cdn.cunwuyun.cn/fengdu/img-fengshouyinhang.png" @click="$linkTo('/mods/newFarmerBank/newFarmerBank')" alt="">
<div class="card-right">
<img src="https://cdn.cunwuyun.cn/fengdu/img-fengduxinnongren.png" alt="" @click="$linkTo('./mods/newFarmer/newFarmer')">
<img src="https://cdn.cunwuyun.cn/fengdu/ic-jiaoyuhuzhu.png" alt="" @click="$linkTo('./mods/helpEachOther/helpEachOther')">
</div>
</div>
<AiLogin ref="login"/>
</div>
</div>
<AiLogin ref="login"/>
</div>
</template>
<script>
@@ -45,7 +48,8 @@ export default {
notices: [],
search: {areaId: ''},
backgroundNavbar: {
background: '#FFF'
background: 'url(https://cdn.cunwuyun.cn/fengdu/mdpi_img-bg1.png) no-repeat',
backgroundSize: '100% auto',
}
}
},
@@ -168,80 +172,85 @@ export default {
width: 100%;
min-height: 100%;
// background-color: #F3F6F9;
// background: url('./img/img-bg2.png') no-repeat;
// background: url('https://cdn.cunwuyun.cn/fengdu/mdpi_img-bg2.png') no-repeat;
position: relative;
.swiper-content {
width: 100%;
height: 292px;
padding: 20px 32px 32px;
box-sizing: border-box;
background: #FFF;
}
.grid-content {
box-sizing: border-box;
background: #FFF;
.grid-item {
img {
width: 108px;
height: 108px;
object-fit: fill;
}
.container{
background: url('https://cdn.cunwuyun.cn/fengdu/mdpi_img-bg2.png') no-repeat;
background: 100% auto;
.swiper-content {
width: 100%;
height: 292px;
padding: 20px 32px 32px;
box-sizing: border-box;
// background: 'url(https://cdn.cunwuyun.cn/fengdu/img-bg2) no-repeat',;
}
.grid-text {
font-size: 26px;
font-weight: 400;
color: #333333;
line-height: 36px;
.grid-content {
box-sizing: border-box;
background: #FFF;
.grid-item {
img {
width: 108px;
height: 108px;
object-fit: fill;
}
.grid-text {
font-size: 26px;
font-weight: 400;
color: #333333;
line-height: 36px;
}
}
}
}
::v-deep .notice {
width: 684px;
height: 88px;
box-sizing: border-box;
padding: 0 24px;
margin: 30px auto 30px;
background: #FFFFFF;
box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.02);
border-radius: 16px;
display: flex;
align-items: center;
justify-content: center;
::v-deep .notice {
width: 684px;
height: 88px;
box-sizing: border-box;
padding: 0 24px;
margin: 30px auto 30px;
background: #FFFFFF;
box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.02);
border-radius: 16px;
display: flex;
align-items: center;
justify-content: center;
& > img {
width: 128px;
height: 52px;
& > img {
width: 128px;
height: 52px;
}
.u-news-item {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
}
.u-news-item {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
}
.card {
background: #FFF;
padding: 32px;
box-sizing: border-box;
display: flex;
justify-content: space-between;
width: 100%;
.card-left {
width: 322px;
height: 462px;
}
.card-right {
width: 334px;
height: 462px;
img {
.card {
background: #FFF;
padding: 32px;
box-sizing: border-box;
display: flex;
justify-content: space-between;
width: 100%;
.card-left {
width: 322px;
height: 462px;
}
.card-right {
width: 334px;
height: 216px;
}
img:last-child {
margin-top: 24px;
height: 462px;
img {
width: 334px;
height: 216px;
}
img:last-child {
margin-top: 24px;
}
}
}
}

View File

@@ -1,24 +1,39 @@
<template>
<div class="openPage">
<img class="images" src="./img/kaiping3.png" alt="">
<img class="images" :src="picUrl" alt="">
</div>
</template>
<script>
export default {
name: "openPage",
appName: "openPage",
customNavigation: true,
data() {
return {
picUrl: '',
}
},
methods: {
getList() {
this.$instance.post('/app/appwechatguidepage/listForXCX',null, {
params: {
current: 1,
size: 100,
}
}).then(res=> {
if(res?.data) {
this.picUrl = res.data.records[0].picUrl
}
})
}
},
onShow() {
onLoad() {
this.getList()
setTimeout(()=> {
uni.switchTab({
url: '/pages/AppHome/AppHome'
})
}, 2000)
},
}
</script>

View File

@@ -4,14 +4,15 @@
:background="backgroundNavbar" :title-bold="true"></u-navbar>
<div class="card">
<div class="myself">
<img class="avatar" src="https://cdn.cunwuyun.cn/dvcp/myFamily/tx.png" alt="">
<img class="avatar" :src="user.avatarUrl" alt="" v-if="user.avatarUrl">
<img class="avatar" src="https://cdn.cunwuyun.cn/dvcp/myFamily/tx.png" alt="" v-else>
<div class="info">
<div class="name">百里守约</div>
<div class="area">百地社区</div>
<div class="name">{{ user.nickName }}</div>
<div class="area">{{ user.areaName }}</div>
</div>
</div>
<div class="qr">
<img src="https://cdn.cunwuyun.cn/dvcp/myFamily/tx.png" alt="">
<img :src="qrCode" alt="">
</div>
<div class="my-qr">我的丰收码</div>
@@ -24,6 +25,7 @@
</template>
<script>
import { mapState } from 'vuex'
export default {
name: "AppHarvestQR",
appName: '丰收码',
@@ -32,14 +34,25 @@ export default {
return {
backgroundNavbar: {
background: '#FFF'
}
},
qrCode: '',
}
},
methods: {
getQrCode() {
this.$instance.post('/app/appwechatuserqujing/queryMyQrCode').then(res=> {
if(res?.data) {
this.qrCode = res.data
}
})
}
},
onShow() {
computed: {
...mapState(['user'])
},
onLoad() {
this.getQrCode()
}
}
</script>
@@ -51,7 +64,6 @@ export default {
width: 100%;
height: 100%;
box-sizing: border-box;
background: #FFF;
border-radius: 16px;
.myself {

View File

@@ -7,7 +7,8 @@
<u-icon name="arrow-down" color="#666" size="24" style="margin-left: 4px"></u-icon>
</AiSelect>
<div v-if="user.areaId" class="qrcode-content">
<img :src="picUrl" class="qrcode-img" v-if="picUrl"/>
<cell :url='picUrl' v-if="picUrl" class="qrcode-img"/>
<!-- <img :src="picUrl" class="qrcode-img" v-if="picUrl"/> -->
<div v-else class="tips">
<u-icon name="error-circle" color="#909399" size="34" style="display: inline"></u-icon>
<div class="col-666">请选择居民群</div>
@@ -19,6 +20,7 @@
</div>
<div class="jionGroup">
<div>加入群聊</div>
</div>