You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
197 lines
6.7 KiB
197 lines
6.7 KiB
4 years ago
|
<template>
|
||
|
|
<div class="mw-cpt a-fade-in"
|
||
|
|
:ref="item.tempOnlyId"
|
||
|
|
:class="{'z-focused': isFocused}"
|
||
|
|
@click="focusCpt">
|
||
|
|
|
||
|
|
<!-- 积分银行-积分排行组件 -->
|
||
|
|
<div class="mw-cpt-score_rank"
|
||
|
|
v-if="item.componentFrontId==='resi-functionList-score-rank'">
|
||
|
|
<div class="d-cpt-wrap">
|
||
|
|
<div class="d-cpt-title">积分排行榜</div>
|
||
|
|
<div class="rank_title">
|
||
|
|
<span class="rank_title_total">总排名</span>
|
||
|
|
<span class="rank_title_week">本周排名</span>
|
||
|
|
<span class="rank_title_month">本月排名</span>
|
||
|
|
</div>
|
||
|
|
<div class="list">
|
||
|
|
<div class="item"
|
||
|
|
:key="subindex"
|
||
|
|
v-for="(subitem, subindex) in item.demoData.list">
|
||
|
|
<div class="logo">
|
||
|
|
<img v-if="subitem.ico"
|
||
|
|
:src="subitem.ico">
|
||
|
|
<img v-if="subindex === 0"
|
||
|
|
src="@/assets/img/modules/wx-mini/index-set/page/score_rank_1.png">
|
||
|
|
<img v-if="subindex === 1"
|
||
|
|
src="@/assets/img/modules/wx-mini/index-set/page/score_rank_2.png">
|
||
|
|
<img v-if="subindex === 2"
|
||
|
|
src="@/assets/img/modules/wx-mini/index-set/page/score_rank_3.png">
|
||
|
|
|
||
|
|
<span v-else>{{ subitem.subindex }}</span>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="name">{{ subitem.name }}</div>
|
||
|
|
<div class="score">{{ subitem.score }}</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- 党员积分排行组件 -->
|
||
|
|
<div class="mw-cpt-party"
|
||
|
|
v-else-if="item.componentFrontId==='resi-functionList-top-party'">
|
||
|
|
<div class="d-cpt-wrap">
|
||
|
|
<div class="d-cpt-title">党员积分排行榜</div>
|
||
|
|
<div class="m-box">
|
||
|
|
<div class="rank_title">
|
||
|
|
<p class="rank_title_left">身边党员</p>
|
||
|
|
<div class="red_line"></div>
|
||
|
|
<p class="rank_title_right">社区党员</p>
|
||
|
|
</div>
|
||
|
|
<div class="rank_img_score">
|
||
|
|
<div class="list">
|
||
|
|
<!--:key,列表循环的唯一标识符 -->
|
||
|
|
<div class="item"
|
||
|
|
:key="subindex"
|
||
|
|
v-for="(subitem, subindex) in item.demoData.list1">
|
||
|
|
<div class="d-group-logo">
|
||
|
|
<div v-if="subindex === 0"
|
||
|
|
class="logo1"></div>
|
||
|
|
<div v-if="subindex === 1"
|
||
|
|
class="logo2"></div>
|
||
|
|
<div v-if="subindex === 2"
|
||
|
|
class="logo3"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="d-group-rank">
|
||
|
|
<span v-if="subindex===0"
|
||
|
|
class="rank_1">2</span>
|
||
|
|
<span v-if="subindex===1"
|
||
|
|
class="rank_2">1</span>
|
||
|
|
<span v-if="subindex===2"
|
||
|
|
class="rank_3">3</span>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="d-group-imgback">
|
||
|
|
<div v-if="subindex === 0"
|
||
|
|
class="back_1"></div>
|
||
|
|
<div v-if="subindex === 1"
|
||
|
|
class="back_2"></div>
|
||
|
|
<div v-if="subindex === 2"
|
||
|
|
class="back_3"></div>
|
||
|
|
</div>
|
||
|
|
<div class="d-group-img">
|
||
|
|
<img v-if="subindex === 0"
|
||
|
|
class="img1"
|
||
|
|
src="../../assets/img/modules/wx-mini/index-set/page/girl.jpg">
|
||
|
|
<img v-if="subindex === 1"
|
||
|
|
class="img2"
|
||
|
|
src="../../assets/img/modules/wx-mini/index-set/page/duck.jpg">
|
||
|
|
<img v-if="subindex === 2"
|
||
|
|
class="img3"
|
||
|
|
src="../../assets/img/modules/wx-mini/index-set/page/girl.jpg">
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="d-group-score">
|
||
|
|
<span v-if="subindex===0"
|
||
|
|
class="score_1">{{subitem.title1}}</span>
|
||
|
|
<span v-if="subindex===1"
|
||
|
|
class="score_2">{{subitem.title2}}</span>
|
||
|
|
<span v-if="subindex===2"
|
||
|
|
class="score_3">{{subitem.title3}}</span>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="d-group-name">
|
||
|
|
|
||
|
|
<span v-if="subindex===0"
|
||
|
|
class="name_1">{{subitem.info1}}</span>
|
||
|
|
<span v-if="subindex===1"
|
||
|
|
class="name_2">{{subitem.info2}}</span>
|
||
|
|
<span v-if="subindex===2"
|
||
|
|
class="name_3">{{subitem.info3}}</span>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<!--更多-标题-->
|
||
|
|
<div class="list-more">
|
||
|
|
<ul class="list1">
|
||
|
|
<li class="list_1">排名</li>
|
||
|
|
<li class="list_1">头像</li>
|
||
|
|
<li class="list_1">姓名</li>
|
||
|
|
<li class="list_2">当月积分</li>
|
||
|
|
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!--更多排名-->
|
||
|
|
<div class="rank_more_score">
|
||
|
|
<div class="list">
|
||
|
|
<div class="item"
|
||
|
|
:key="subindex"
|
||
|
|
v-for="(subitem,subindex) in item.demoData.list2">
|
||
|
|
<div class="d-group-rank">
|
||
|
|
<span>{{subitem.rank}}</span>
|
||
|
|
</div>
|
||
|
|
<div class="d-group-img">
|
||
|
|
<img v-if="subindex===1"
|
||
|
|
src="../../assets/img/modules/wx-mini/index-set/page/good.jpg"
|
||
|
|
class="list3_img1">
|
||
|
|
<img v-if="subindex===2"
|
||
|
|
src="../../assets/img/modules/wx-mini/index-set/page/girl.jpg"
|
||
|
|
class="list3_img1">
|
||
|
|
<img v-if="subindex===3"
|
||
|
|
src="../../assets/img/modules/wx-mini/index-set/page/duck.jpg"
|
||
|
|
class="list3_img1">
|
||
|
|
<img v-if="subindex===4"
|
||
|
|
src="../../assets/img/modules/wx-mini/index-set/page/duck.jpg"
|
||
|
|
class="list3_img1">
|
||
|
|
</div>
|
||
|
|
<div class="d-group-name">
|
||
|
|
<span>{{subitem.name}}</span>
|
||
|
|
</div>
|
||
|
|
<div class="d-group-score">
|
||
|
|
<span>{{subitem.score}}</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="line"></div>
|
||
|
|
<span class="list6">查看更多</span>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: 'cptItem',
|
||
|
|
data () {
|
||
|
|
return {}
|
||
|
|
},
|
||
|
|
components: {
|
||
|
|
},
|
||
|
|
props: {
|
||
|
|
isFocused: Boolean,
|
||
|
|
item: Object
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
|
||
|
|
focusCpt () {
|
||
|
|
this.$emit('focusCpt', this.item)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
<style lang="scss" src="@/assets/scss/modules/wx-mini/index-set.scss"></style>
|