kubbo/dvcp_v2_wechat_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

巫溪小程序

Browse Source
This commit is contained in:
liuye
2023-08-11 10:12:53 +08:00
parent efc13f3ef7
commit 34f318d3f8
4 changed files with 496 additions and 124 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
src/project/wuxi/AppCircle/AppCircle.vue
View File

@@ -8,8 +8,8 @@
<span @click="changeTab(1)" :class="{active:currIndex === 1}">社区</span>
</div>
<div class="right" @click="$linkTo('./MyPostList')" hover-class="text-hover">
<span>我的贴子</span>
<i v-if="total > 0">{{ total }}</i>
<span>我的贴子<img src="https://cdn.cunwuyun.cn/wechat/wuxi/circle-top-icon.png" alt=""></span>
<i></i>
</div>
</div>
</div>
@@ -37,30 +37,31 @@
<image :src="item.createUserAvatar || 'https://cdn.cunwuyun.cn/wxmp/fengdu/avatar.png'"/>
<div class="right">
<h3>{{ item.createUserName }}</h3>
<span v-if="item.publishDepartName">{{ item.publishDepartName }}</span>
<!-- <span v-if="item.publishDepartName">{{ item.publishDepartName }}</span> -->
<span>{{ item.createTime }}</span>
</div>
</div>
<div class="item-content">
<span hover-stop-propagation v-if="item.topicName"
@click.stop="$linkTo('./TopicDetail?themeId=' + item.themeId + '&name=' + item.topicName)">#【{{ item.topicName }}】</span>
@click.stop="$linkTo('./TopicDetail?themeId=' + item.themeId + '&name=' + item.topicName)">#{{ item.topicName }}</span>
<text>{{ item.content }}</text>
</div>
<div class="item-imgs" v-if="item.files.length">
<image mode="aspectFill" @click.stop="previewImage(e.url, item.files)" v-for="(e, i) in item.files" :key="i" :src="e.url"/>
</div>
<p>{{ item.createTime }}</p>
<p v-if="item.publishDepartName">{{ item.publishDepartName }}</p>
<div class="item-bottom">
<button hover-stop-propagation @click.stop="onBtnClick" open-type="share" :data-content="item.content" :data-themeid="item.themeId" :data-id="item.id"
:data-name="item.topicName">
<image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-zhuanfa.png"/>
<image src="https://cdn.cunwuyun.cn/wechat/wuxi/circle-zf-icon.png"/>
<i>{{ item.sharedCount }}</i>
</button>
<div hover-stop-propagation @click.stop="reciate(item.id, item.appreciateStatus)">
<image :src="item.appreciateStatus ? 'https://cdn.cunwuyun.cn/wxmp/fengdu/zan-active.png' : 'https://cdn.cunwuyun.cn/wxmp/fengdu/zan.png'"/>
<image :src="item.appreciateStatus ? 'https://cdn.cunwuyun.cn/wechat/wuxi/circle-dz-icon.png' : 'https://cdn.cunwuyun.cn/wechat/wuxi/circle-dz-select-icon.png'"/>
<i>{{ item.appreciateCount }}</i>
</div>
<div>
<image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-pinglun.png"/>
<image src="https://cdn.cunwuyun.cn/wechat/wuxi/circle-pl-icon.png"/>
<i>{{ item.commentCount }}</i>
</div>
</div>
@@ -68,7 +69,7 @@
<AiEmpty v-if="!list.length"/>
</div>
<div class="add" hover-class="text-hover" @click="toAdd">
<image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-fatie.png" mode="aspectFill" />
<image src="https://cdn.cunwuyun.cn/wechat/wuxi/circle-add.png" mode="aspectFill" />
</div>
<AiLogin ref="login"/>
</div>
@@ -405,8 +406,10 @@
& > p {
margin: 12px 0;
font-size: 28px;
color: #333333;
font-family: PingFangSC-Regular;
font-size: 26px;
color: #999;
line-height: 36px;
}
.item-bottom {
@@ -480,7 +483,7 @@
position: relative;
height: 100px;
line-height: 100px;
color: #fff;
color: #222;
font-size: 30px;
&:first-child {
@@ -496,9 +499,9 @@
bottom: 12px;
left: 50%;
width: 40px;
height: 6px;
border-radius: 3px;
background: #fff;
height: 8px;
background: #026AF2;
border-radius: 4px;
transform: translateX(-50%);
content: ' ';
}
@@ -514,28 +517,39 @@
top: -6px;
right: 0;
z-index: 11;
height: 24px;
line-height: 24px;
padding: 0 10px;
font-size: 16px;
color: #4181FF;
width: 16px;
height: 16px;
border-radius: 50%;
border: 2px solid #4181FF;
background: #fff;
box-sizing: border-box;
transform: translateX(50%);
background: #FF4747;
// height: 24px;
// line-height: 24px;
// padding: 0 10px;
// font-size: 16px;
// color: #4181FF;
// border-radius: 50%;
// border: 2px solid #4181FF;
// background: #fff;
// box-sizing: border-box;
// transform: translateX(50%);
}
span {
display: block;
width: 120px;
height: 60px;
line-height: 60px;
text-align: center;
color: #fff;
font-family: PingFangSC-Regular;
font-size: 24px;
border-radius: 10px;
border: 1px solid #fff;
color: #333;
line-height: 54px;
text-align: center;
width: 164px;
height: 56px;
border: 1px solid #8A929F;
border-radius: 28px;
img {
display: inline-block;
width: 24px;
height: 24px;
vertical-align: middle;
}
}
}
}

419
src/project/wuxi/AppHome/AppHome.vue
View File

@@ -1,17 +1,131 @@
<template>
<div class="page">
<div class="search-wrap">
<div class="search fill" @click="$linkTo('/mods/AppContent/contentManager?moduleId=' + search.moduleId)">
<u-icon name="search" color="#ffffff" size="40"></u-icon>
<span class="desc">请输入需要搜索的内容</span>
<div class="header-content">
<u-navbar :is-back="false" :is-fixed="false" title="数智巫溪" title-color="#000" title-width="300" title-size="32" :title-bold="true" :background="backgroundNavbar"></u-navbar>
<p class="weather-info">
<img :src="`${cdn}/border.png`" alt="">
今天：多云 26℃ ~ 34℃ 无持续风向＜4级
</p>
<div class="swiper-content">
<u-swiper :list="swiperList" mode="none" height="364" bg-color="none" @click="handleBannerClick"/>
</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>
<div class="header-bg"></div>
<img class="border" :src="`${cdn}/border.png`" alt="">
<div class="swiper-content">
<u-swiper :list="swiperList" mode="none" height="240" bg-color="none" @click="handleBannerClick"/>
<div class="title-content">
<h2>居民惠</h2>
<div>更多<img src="https://cdn.cunwuyun.cn/wechat/wuxi/right-icon-blue.png" alt=""></div>
</div>
<div class="grid-content">
<div class="banner-flex">
<div class="item-banner color-3872BC">
<img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-banner-zcjd.png" alt="">
<div class="banner-text">
<h2>政策解读</h2>
<p>社区情况介绍</p>
</div>
</div>
<div class="item-banner color-CE5A5A">
<img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-banner-dyzd.png" alt="">
<div class="banner-text">
<h2>党员阵地</h2>
<p>党员阵地</p>
</div>
</div>
</div>
<div class="app-content">
<div class="item-app">
<img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-app-shjf.png" alt="">
<p>生活缴费</p>
</div>
<div class="item-app">
<img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-app-tqyb.png" alt="">
<p>天气预报</p>
</div>
<div class="item-app">
<img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-app-wsbs.png" alt="">
<p>网上办事</p>
</div>
<div class="item-app">
<img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-app-zgjy.png" alt="">
<p>招工就业</p>
</div>
</div>
<div class="title-content">
<h2>便民利</h2>
<div>更多<img src="https://cdn.cunwuyun.cn/wechat/wuxi/right-icon-blue.png" alt=""></div>
</div>
<div class="banner-content">
<div class="banner-left color-4C3FCD">
<img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-banner-gdyh.png" alt="" class="banner-img">
<div class="banner-text">
<h2>功德银行</h2>
<p><img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-star-icon.png" alt="">行好事</p>
<p><img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-star-icon.png" alt="">得积分</p>
<p><img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-star-icon.png" alt="">去兑换</p>
</div>
</div>
<div class="banner-right">
<div class="item color-DF863E">
<img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-banner-xnr.png" alt="" class="banner-img">
<div class="banner-text">
<h2>新农人</h2>
<p>新农人新经济</p>
</div>
</div>
<div class="item color-D9606E">
<img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-banner-jtjy.png" alt="" class="banner-img">
<div class="banner-text">
<h2>家庭教育互助惠</h2>
<p>关注每一个留守儿童</p>
</div>
</div>
</div>
</div>
<div class="title-content">
<h2>城市智</h2>
<div>更多<img src="https://cdn.cunwuyun.cn/wechat/wuxi/right-icon-blue.png" alt=""></div>
</div>
<div class="banner-flex">
<div class="item-banner color-3872BC">
<img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-banner-zcjd.png" alt="">
<div class="banner-text">
<h2>居民议事</h2>
<p>社区情况介绍</p>
</div>
</div>
<div class="item-banner color-409681">
<img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-banner-sqgy.png" alt="">
<div class="banner-text">
<h2>社区公约</h2>
<p>社区情况介绍</p>
</div>
</div>
</div>
<div class="app-content">
<div class="item-app">
<img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-app-ssp.png" alt="">
<p>随手拍</p>
</div>
<div class="item-app">
<img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-app-sxw.png" alt="">
<p>随心问</p>
</div>
<div class="item-app">
<img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-app-rdht.png" alt="">
<p>热点话题</p>
</div>
<div class="item-app">
<img src="https://cdn.cunwuyun.cn/wechat/wuxi/home-app-bmtxl.png" alt="">
<p>便民通讯录</p>
</div>
</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)">
@@ -19,20 +133,15 @@
<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>
<template v-if="activeList.length>0">
</div> -->
<!-- <template v-if="activeList.length>0">
<header>推荐专题</header>
<scroll-view :scroll-x="true" style="width: 100%" class="scroll-wrap">
<div class="scroll-card"
:style="{background:'url(' + item.pictureUrl + ') no-repeat no-repeat;background-size:100% 100%;'}"
v-for="(item,index) in activeList" :key="index" @click="handleActive(item)"/>
</scroll-view>
</template>
</template> -->
<template v-if="categorys&&categorys.length>0">
<u-tabs :list="categorys.map(e=>({name:e.categoryName}))" font-size="40" bg-color="transparent"
inactive-color="#999999" :active-item-style="active"
@@ -73,12 +182,13 @@
import {mapActions, mapState} from 'vuex'
export default {
customNavigation: true,
name: 'AppHome',
appName: "首页",
data() {
return {
cdn: "https://cdn.cunwuyun.cn/wxmp",
swiperList: [],
swiperList: ['https://cdn.cunwuyun.cn/wechat/wuxi/home-swiper1.png'],
index: 0,
grids: [],
activeList: [],
@@ -102,11 +212,11 @@ export default {
}
},
onReady() {
uni.setNavigationBarTitle({title: "数智巫溪"})
// uni.setNavigationBarTitle({title: "数智巫溪"})
},
onLoad() {
this.autoLogin().then(() => {
this.getSwiperList();
// this.getSwiperList();
this.getName();
this.getGrids();
this.getActive();
@@ -252,72 +362,223 @@ export default {
.page {
width: 100%;
min-height: 100%;
background-color: #F3F6F9;
background-color: #fff;
position: relative;
.search-wrap {
width: 750px;
height: 112px;
box-sizing: border-box;
padding: 0 32px;
display: flex;
align-items: center;
justify-content: center;
background-color: #4181FF;
.search {
width: 100%;
height: 64px;
background: #000000;
border-radius: 32px;
opacity: 0.2;
.header-content {
background: url('https://cdn.cunwuyun.cn/wechat/wuxi/home-weather1.png') center;
background-size: 100% 100%;
// position: fixed;
// top: 0;
// left: 0;
// z-index: 99;
// width: 100%;
.weather-info {
font-family: PingFangSC-Regular;
font-weight: 400;
font-size: 28px;
color: #222;
padding: 12px 34px;
img {
width: 56px;
height: 52px;
margin-right: 12px;
vertical-align: middle;
}
}
.swiper-content {
width: 686px;
height: 364px;
margin: 20px auto 24px;
}
::v-deep .notice {
width: 686px;
height: 88px;
box-sizing: border-box;
padding: 0 32px;
padding: 0 24px;
margin: 0 auto;
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;
.desc {
font-size: 28px;
color: #FFFFFF;
margin-left: 16px;
& > img {
width: 128px;
height: 52px;
}
.u-news-item {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
}
}
.area-content {
height: 96px;
line-height: 96px;
background-color: #2d80fb;
.area-ai {
display: block;
width: 200px;
margin-left: 34px;
text-align: left;
.title-content {
display: flex;
justify-content: space-between;
padding: 32px;
line-height: 40px;
h2 {
font-family: PingFangSC-Medium;
font-weight: 500;
font-size: 34px;
color: #222;
}
.picker-location {
text-align: left;
div {
font-family: PingFangSC-Regular;
font-size: 28px;
color: #687DA6;
img {
width: 32px;
height: 32px;
margin-left: 6px;
vertical-align: middle;
}
}
}
.header-bg {
width: 100%;
height: 160px;
background-color: #4181FF;
.banner-flex {
display: flex;
justify-content: space-between;
padding: 0 32px;
.item-banner {
width: calc(50% - 16px);
height: 160px;
position: relative;
img {
width: 100%;
height: 100%;
}
.banner-text {
position: absolute;
top: 26px;
left: 28px;
}
h2 {
font-family: PingFangSC-Medium;
font-weight: 500;
font-size: 30px;
line-height: 48px;
}
p {
font-family: PingFangSC-Regular;
font-size: 22px;
line-height: 32px;
}
}
.color-3872BC {
color: #3872BC;
}
.color-CE5A5A {
color: #CE5A5A;
}
.color-409681 {
color: #409681;
}
}
.border {
width: 100%;
height: 40px;
.app-content {
padding: 48px 32px 32px;
display: flex;
.item-app {
// width: 104px;
text-align: center;
margin-right: 86px;
img {
width: 96px;
height: 96px;
}
p {
font-family: PingFangSC-Regular;
font-size: 26px;
color: #222;
text-align: center;
line-height: 36px;
margin-top: 16px;
}
}
.item-app:nth-of-type(4n) {
margin-right: 0;
}
}
.swiper-content {
width: 686px;
height: 240px;
margin: -176px auto 24px;
.banner-content {
display: flex;
padding: 0 32px;
.banner-left {
width: 322px;
height: 462px;
margin-right: 30px;
position: relative;
h2 {
font-family: PingFangSC-SNaNpxibold;
font-weight: 600;
font-size: 36px;
line-height: 48px;
margin-bottom: 4px;
}
p {
font-family: PingFangSC-Regular;
font-size: 22px;
line-height: 40px;
img {
width: 20px;
height: 20px;
margin-right: 8px;
}
}
}
.color-4C3FCD {
color: #4C3FCD;
}
.banner-right {
.item {
width: 334px;
height: 216px;
position: relative;
h2 {
font-family: PingFangSC-SNaNpxibold;
font-weight: 500;
font-size: 30px;
line-height: 48px;
margin-bottom: 4px;
}
p {
font-family: PingFangSC-Regular;
font-size: 22px;
line-height: 32px;
}
}
.item:nth-of-type(1) {
margin-bottom: 30px;
}
.color-DF863E {
color: #DF863E;
}
.color-D9606E {
color: #D9606E;
}
}
.banner-img {
width: 100%;
height: 100%;
}
.banner-text {
position: absolute;
top: 26px;
left: 28px;
}
}
.grid-content {
box-sizing: border-box;
@@ -336,32 +597,6 @@ export default {
}
}
}
::v-deep .notice {
width: 686px;
height: 88px;
box-sizing: border-box;
padding: 0 24px;
margin: 30px auto 48px;
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;
}
.u-news-item {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
}
.list-wrap {
box-sizing: border-box;
padding: 32px;

123
src/project/wuxi/AppHome/openPage.vue Normal file
View File

@@ -0,0 +1,123 @@
<template>
<div class="openPage">
<!-- <img class="images" :src="picUrl" alt=""> -->
<div class="uni-swiper-dot-box">
<swiper class="swiper-box" @change="change" :current="current">
<swiper-item v-for="(item, index) in imgList" :key="index">
<img :src="item" alt="" class="banner-img">
</swiper-item>
</swiper>
<div class="dot-list">
<span v-for="(item, index) in dotList" :key="index" :class="current == index ? 'active' : ''"></span>
</div>
</div>
</div>
</template>
<script>
export default {
name: "openPage",
customNavigation: true,
data() {
return {
picUrl: '',
status: '',
imgList: [
'https://cdn.cunwuyun.cn/wechat/wuxi/wuxi-page1.png',
'https://cdn.cunwuyun.cn/wechat/wuxi/wuxi-page2.png',
'https://cdn.cunwuyun.cn/wechat/wuxi/wuxi-page3.png',
],
current: 0,
dotList: [0, 1, 2]
}
},
methods: {
change(e) {
this.current = e.detail.current;
if(this.current == 2) {
setTimeout(() => {
// uni.switchTab({
// url: '/pages/AppHome/AppHome'
// })
console.log(123)
}, 2000)
}
},
getStatus() {
this.$instance.post('/app/appwechatguidepage/enableStatus',null, { withoutToken: true }).then(res=> {
if(res?.data) {
this.status = res.data
if(this.status==0) {
uni.switchTab({
url: '/pages/AppHome/AppHome'
})
} else {
this.getList()
setTimeout(() => {
uni.switchTab({
url: '/pages/AppHome/AppHome'
})
}, 3000)
}
}
})
},
getList() {
this.$instance.post('/app/appwechatguidepage/listForXCX',null, {
withoutToken: true,
params: {
current: 1,
size: 100,
}
}).then(res=> {
if(res?.data) {
let nums = res.data.records
let index = Math.floor(Math.random() * nums.length)
this.picUrl = nums[index].picUrl
}
})
}
},
onShow() {
// this.getStatus()
},
}
</script>
<style scoped lang="scss">
.openPage {
width: 100%;
height: 100vh;
box-sizing: border-box;
::v-deep .uni-swiper-dot-box {
width: 100%!important;
height: 100%!important;
}
::v-deep .swiper-box {
height: 100%!important;
}
.banner-img {
width: 100%;
height: 100%;
}
.dot-list {
position: fixed;
bottom: 118px;
width: 100%;
text-align: center;
span {
display: inline-block;
width: 12px;
height: 12px;
opacity: 0.3;
background: #026AF2;
border-radius: 6px;
margin-right: 8px;
}
.active {
width: 22px;
opacity: 1;
}
}
}
</style>

2
src/project/wuxi/AppMine/AppMine.vue
View File

@@ -378,7 +378,7 @@ export default {
border-radius: 16px;
font-size: 34px;
font-weight: 500;
color: #4181FF;
color: #2D7DFF;
}
}
}