是小王呀\24601
1 year ago
17 changed files with 473 additions and 4 deletions
@ -0,0 +1,28 @@ |
|||
{ |
|||
"appid": "wxaf87b420b87e2d79", |
|||
"compileType": "miniprogram", |
|||
"libVersion": "3.4.6", |
|||
"packOptions": { |
|||
"ignore": [], |
|||
"include": [] |
|||
}, |
|||
"setting": { |
|||
"coverView": true, |
|||
"es6": true, |
|||
"postcss": true, |
|||
"minified": true, |
|||
"enhance": true, |
|||
"showShadowRootInWxmlPanel": true, |
|||
"packNpmRelationList": [], |
|||
"babelSetting": { |
|||
"ignore": [], |
|||
"disablePlugins": [], |
|||
"outputPath": "" |
|||
} |
|||
}, |
|||
"condition": {}, |
|||
"editorSetting": { |
|||
"tabIndent": "insertSpaces", |
|||
"tabSize": 2 |
|||
} |
|||
} |
|||
@ -0,0 +1,7 @@ |
|||
{ |
|||
"description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html", |
|||
"projectname": "epmet-wx-pa", |
|||
"setting": { |
|||
"compileHotReLoad": true |
|||
} |
|||
} |
|||
|
After Width: | Height: | Size: 63 KiB |
|
After Width: | Height: | Size: 57 KiB |
|
After Width: | Height: | Size: 63 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 349 B |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 951 B |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 348 B |
@ -0,0 +1,221 @@ |
|||
<template> |
|||
<div class='container'> |
|||
<div class="card flex flex-y "> |
|||
<div class="m-bottom5">{{ substance }}</div> |
|||
<div class="font-size13 gray">{{ datetime }}</div> |
|||
<div class="image-grid"> |
|||
<div class="grid-item "> |
|||
<img src="@/assets/images/discusion/1.png" style="width: 105px; height: 75px;"> |
|||
</div> |
|||
<div class="grid-item"><img src="@/assets/images/discusion/2.png" style="width: 105px; height: 75px;"> |
|||
</div> |
|||
<div class="grid-item"><img src="@/assets/images/discusion/3.png" style="width: 105px; height: 75px;"> |
|||
</div> |
|||
<div class="grid-item"><img src="@/assets/images/discusion/3.png" style="width: 105px; height: 75px;"> |
|||
</div> |
|||
</div> |
|||
<div class="flex flex-y flex-center1 flex-center2 gray back_color m-top15"> |
|||
<div class="flex flex-x m-top16 flex-center1 flex-center2"> |
|||
<div class="rectangle-container flex flex-x" > |
|||
<div class="flex flex-x" > <div class=" header_img_left"> </div> |
|||
<div class="image-with-text "> |
|||
<img class="support_img1" :style="{ width: support1Width }" |
|||
src="@/assets/images/discusion/c-l.png" /> |
|||
<div class="text-overlay">支持 {{ this.supportNum }}</div> |
|||
</div> |
|||
<div class="header_img_right"> |
|||
</div></div> |
|||
<div class="image-with-text z "> |
|||
<img src="@/assets/images/discusion/VS.png" class="img_33 m-left012 " alt="Your Image" /> |
|||
|
|||
</div> |
|||
<div class="flex flex-x"> <div class="footer_img_left z_img m-left012"> |
|||
</div> |
|||
<div class="image-with-text "> |
|||
<img class="support_img2" :style="{ width: oppose1Width }" |
|||
src="@/assets/images/discusion/z-y.png" /> |
|||
<div class="text-overlay1"> {{ this.opposeNum }} 反对</div> |
|||
</div> |
|||
<div class="z_img"> |
|||
|
|||
</div></div> |
|||
|
|||
</div> |
|||
</div> |
|||
<div class="gray font-size13 p-12">{{ this.dataValue }}人参与</div> |
|||
|
|||
</div> |
|||
</div> |
|||
<div class="bot_btn flex flex-x flex-mean m-bot50 back_color"> |
|||
<van-button :disabled="disableAllButtons" round :class="supportNum ? 'support' : ''" :icon="require('@/assets/images/icons/support.png')" |
|||
type="info" @click="Onsupport"> |
|||
支持 |
|||
</van-button> |
|||
|
|||
<van-button :disabled="disableAllButtons" round class="support" :icon="require('@/assets/images/icons/oppose.png')" |
|||
type="info" @click="Onoppose"> |
|||
反对 |
|||
</van-button> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
substance: '最近重庆南路60号院改造，很多居民反应希望 政府给楼外加保护层，冬天温度太低。', |
|||
datetime: '2002-01-05 12:00:00', |
|||
signUp: [ |
|||
{ name: "", mobile: "", remark: "" }, |
|||
|
|||
], |
|||
detimgs: [ |
|||
{ url: '@/assets/images/icons/resi.png' } |
|||
], |
|||
dataValue: 100, |
|||
support: false, |
|||
oppose: false, |
|||
supportNum: 40, |
|||
opposeNum: 60, |
|||
disableAllButtons: false |
|||
|
|||
}; |
|||
|
|||
}, |
|||
computed: { |
|||
support1() { |
|||
return this.supportNum / this.dataValue; |
|||
}, |
|||
oppose1() { |
|||
return this.opposeNum / this.dataValue; |
|||
}, |
|||
support1Width() { |
|||
return this.support1 * 225 + 'px'; |
|||
}, |
|||
oppose1Width() { |
|||
return this.oppose1 * 225 + 'px'; |
|||
} |
|||
}, |
|||
created() { |
|||
|
|||
}, |
|||
methods: { |
|||
handsupport() { |
|||
this.support = true; |
|||
}, |
|||
Onsupport(){ |
|||
console.log("1111") |
|||
this.supportNum++; |
|||
this.dataValue++; |
|||
this.disableAllButtons = true; // 点击后禁用所有按钮 |
|||
console.log(this.supportNum) |
|||
|
|||
}, |
|||
Onoppose(){ |
|||
console.log("1111") |
|||
this.opposeNum++; |
|||
this.dataValue++; |
|||
this.disableAllButtons = true; // 点击后禁用所有按钮 |
|||
console.log(this.supportNum) |
|||
|
|||
} |
|||
|
|||
}, |
|||
|
|||
} |
|||
</script> |
|||
|
|||
<style lang='less' scoped> |
|||
.image-container { |
|||
position: relative; |
|||
display: inline-block; |
|||
} |
|||
|
|||
.image-grid { |
|||
margin-top: 20px; |
|||
display: grid; |
|||
grid-template-columns: repeat(3, 1fr); |
|||
grid-auto-flow: row; |
|||
/* 自动换行 */ |
|||
} |
|||
|
|||
.z_img { |
|||
width: 10px; |
|||
height: 35px; |
|||
background: url('@/assets/images/discusion/f-y.png'); |
|||
background-size: cover; |
|||
} |
|||
|
|||
.image-with-text { |
|||
position: relative; |
|||
display: inline-block; |
|||
} |
|||
|
|||
.grid-item { |
|||
text-align: center; |
|||
} |
|||
|
|||
.support { |
|||
background-color: #ffffff; |
|||
color: black; |
|||
} |
|||
|
|||
.t_sup { |
|||
display: inline-flex; |
|||
position: absolute; |
|||
} |
|||
|
|||
.support_img1 { |
|||
height: 35px; |
|||
} |
|||
|
|||
.support_img2 { |
|||
height: 35px; |
|||
} |
|||
|
|||
.header_img_left { |
|||
// background:"@/assets/images/discusion/1.png"; |
|||
background: url('@/assets/images/discusion/h-l.png'); |
|||
width: 10px; |
|||
height: 35px; |
|||
background-size: cover; |
|||
/* 使背景图片覆盖整个元素 */ |
|||
} |
|||
|
|||
.header_img_right { |
|||
background: url('@/assets/images/discusion/f-l.png'); |
|||
width: 10px; |
|||
height: 35px; |
|||
background-size: cover; |
|||
/* 使背景图片覆盖整个元素 */ |
|||
} |
|||
.text-overlay { |
|||
position: absolute; |
|||
bottom: 10px; /* 文字距离图片底部的距离 */ |
|||
color: white; /* 文字颜色，可以根据需要调整 */ |
|||
padding: 5px; |
|||
border-radius: 3px; /* 可选，圆角 */ |
|||
font-size: 13px; |
|||
text-align: center; |
|||
|
|||
} |
|||
.text-overlay1 { |
|||
position: absolute; |
|||
bottom: 10px; /* 文字距离图片底部的距离 */ |
|||
color: white; /* 文字颜色，可以根据需要调整 */ |
|||
padding: 5px; |
|||
border-radius: 3px; /* 可选，圆角 */ |
|||
font-size: 13px; |
|||
text-align: center; |
|||
right: 0px; |
|||
|
|||
} |
|||
.footer_img_left{ |
|||
background: url('@/assets/images/discusion/h-y.png'); |
|||
width: 10px; |
|||
height: 35px; |
|||
background-size: cover; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,179 @@ |
|||
<template> |
|||
<div> |
|||
<div class="flex flex-mean" style="background-color: #FFFFFF;"> |
|||
<van-search class=".flex flex-1" v-model="searchValue" left-icon="" shape="round" placeholder="请输入搜索关键词" /> |
|||
<van-button round type="info" class="custom-button font-size13 m-top10 m-right12 ">查询</van-button> |
|||
</div> |
|||
<div class='container'> |
|||
<van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="communityActivity" |
|||
class="card" :offset="50"> |
|||
<div class="activity_content " v-for="(item, index) in discussionList" :key="index" |
|||
@click="$router.push({ path: `/discusionDetail` })"> |
|||
<div class="van-multi-ellipsis--l2 m-bottom10"> |
|||
{{ item.title }} |
|||
</div> |
|||
<div class=" flex flex-end"> |
|||
<div class=""><img src="@/assets/images/icons/resi.png" class="img_17"> 参加{{ item.content }} |
|||
</div> |
|||
<div><img src="@/assets/images/icons/support.png" class="img_17">支持{{ item.time }}</div> |
|||
<div><img src="@/assets/images/icons/oppose.png" class="img_17">反对{{ item.content }}</div> |
|||
</div> |
|||
</div> |
|||
</van-list> |
|||
<register-dialog v-if="showRegister" @close="showRegister = false"></register-dialog> |
|||
|
|||
</div> |
|||
</div> |
|||
|
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import { communityActivity } from '@/api/home'; |
|||
import registerDialog from '@/components/registerDialog'; |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
discussionList: [ |
|||
{ title: '最近重庆南路60号院改造，很多居民反应希望 政府给楼外加保护层，冬天温度太低。', content: '111', time: '1111', address: '1111', people: '报名人数', state: '报名状态' }, |
|||
{ title: '嘉定山社区路段维修时间比较长，耽误居民生 活，出行不便，望尽快维修。活动名称 gj gj fg gfj gf', content: '222', time: '2222', address: '222', people: '报名人数', state: '报名状态' }, |
|||
{ title: '嘉定山社区路段维修时间比较长，耽误居民生 活，出行不便，望尽快维修。活动名称 dfsg dg fg dfh fh fdj ', content: '333', time: '333', address: '333', people: '报名人数', state: '报名状态' }, |
|||
], |
|||
pageSize: 5, |
|||
pageNo: 1, |
|||
agencyId: null, |
|||
finished: false, |
|||
loading: true, |
|||
showRegister: false, |
|||
searchValue: "" |
|||
}; |
|||
}, |
|||
created() { |
|||
this.agencyId = this.$store.state.app.agencyId; |
|||
this.communityActivity(); |
|||
}, |
|||
methods: { |
|||
async communityActivity() { |
|||
let parm = { |
|||
pageSize: this.pageSize, |
|||
pageNo: this.pageNo++, |
|||
agencyId: this.agencyId, |
|||
activityName: "", |
|||
status: "", |
|||
typeId: "", |
|||
startTime: "", |
|||
endTime: "", |
|||
address: "", |
|||
assistingParty: "" |
|||
} |
|||
let res = await communityActivity(parm) |
|||
if (res) { |
|||
this.loading = false; |
|||
if (res.list.length < this.pageSize) { |
|||
this.finished = true; |
|||
} |
|||
this.activityList = this.activityList.concat(res.list); |
|||
} |
|||
}, |
|||
handelClickJump(path) { |
|||
if (path === 'activityDetail') { |
|||
if (this.$store.state.app.userInfo.mobile) { |
|||
this.$router.push({ path: `/${path}` }); |
|||
} else { |
|||
this.showRegister = true; |
|||
} |
|||
} |
|||
|
|||
} |
|||
}, |
|||
components: { registerDialog }, |
|||
computed: {}, |
|||
watch: {}, |
|||
} |
|||
</script> |
|||
|
|||
<style lang='less' scoped> |
|||
.custom-button { |
|||
width: 60px; |
|||
height: 33px; |
|||
} |
|||
|
|||
.activity_content { |
|||
padding-bottom: 10px; |
|||
box-sizing: border-box; |
|||
width: 100%; |
|||
border-bottom: 1px solid #EAEAEA; |
|||
margin-top: 14px; |
|||
min-height: 50px; |
|||
|
|||
.img { |
|||
width: 231px; |
|||
height: 33px; |
|||
margin: 5px 3px 0 3px; |
|||
} |
|||
|
|||
&:last-child { |
|||
border-bottom: none; |
|||
} |
|||
|
|||
|
|||
.content { |
|||
|
|||
width: 325px; |
|||
height: 40px; |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
font-size: 16px; |
|||
color: #333333; |
|||
line-height: 23px; |
|||
} |
|||
|
|||
.dianzan { |
|||
width: 325px; |
|||
height: 20px; |
|||
display: flex; |
|||
font-size: 13px; |
|||
color: #AAAAAA; |
|||
flex-direction: row; |
|||
justify-content: space-evenly; |
|||
align-items: center; |
|||
|
|||
.img { |
|||
width: 14.5px; |
|||
height: 15px; |
|||
} |
|||
} |
|||
|
|||
|
|||
} |
|||
|
|||
.header {} |
|||
|
|||
.header .input_search { |
|||
width: 279px; |
|||
height: 33px; |
|||
background: rgba(193, 193, 193, 0.16); |
|||
border-radius: 17px; |
|||
// flex: 1; |
|||
color: #333333; |
|||
border: none; |
|||
/* 取消边框 */ |
|||
margin-left: 10px; |
|||
} |
|||
|
|||
.header .btn_search { |
|||
width: 60px; |
|||
height: 33px; |
|||
background: #3974F6; |
|||
border-radius: 17px; |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
font-size: 14px; |
|||
color: #FFFFFF; |
|||
line-height: 23px; |
|||
border: none; |
|||
/* 取消边框 */ |
|||
margin-right: 10px; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue