elink-star
/
epmet-oper-pc-chengyang
12
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge branch 'dev' of http://git.elinkit.com.cn:7070/r/epmet-oper into resiguide

preview
hosinokamui 6 years ago
parent
f4e79e9526 24c151b695
commit
d9ea79204d
2 changed files with 321 additions and 28 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 219
      epmet-oper-web/src/assets/scss/modules/wx-mini/index-set.scss
  2. 130
      epmet-oper-web/src/views/modules/wx-mini/index-set.vue

219
epmet-oper-web/src/assets/scss/modules/wx-mini/index-set.scss
View File

@ -60,7 +60,8 @@
font-size: 12px; font-size: 12px;
line-height: 24px; line-height: 24px;
cursor: pointer; cursor: pointer;
user-select: none; user-select: none;
overflow: hidden;
&:hover { &:hover {
color: $c1; color: $c1;
} }
@ -135,7 +136,8 @@
bottom: 0; bottom: 0;
margin: auto; margin: auto;
text-align: center; text-align: center;
color: #aaaaaa; color: #aaaaaa;
width: 120px;
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
font-size: 12px; font-size: 12px;
@ -171,6 +173,7 @@
} }
.mw-cpt { .mw-cpt {
position: relative;
cursor: pointer; cursor: pointer;
&.z-focused { &.z-focused {
@ -239,10 +242,10 @@
} }
.mw-cpt-swiper { .mw-cpt-swiper {
position: relative; position: relative;
.d-cpt-wrap { .d-cpt-wrap {
padding: 10px 10px 15px 10px; padding: 1px 10px 15px 10px;
background-color: #fff; background-color: #fff;
.d-cpt-subwrap { .d-cpt-subwrap {
position: relative; position: relative;
@ -289,7 +292,7 @@
} }
.mw-cpt-new_msg { .mw-cpt-new_msg {
position: relative; position: relative;
.d-cpt-wrap { .d-cpt-wrap {
width: 136px; width: 136px;
@ -314,11 +317,207 @@
} }
.mw-cpt-cnt_news { .mw-cpt-cnt_news {
position: relative; position: relative;
margin-top: 10px;
.d-cpt-wrap { .d-cpt-wrap {
width: 355px;
margin: 0 auto;
border-radius: 5px;
overflow: hidden;
background: rgba(255, 255, 255, 1); background: rgba(255, 255, 255, 1);
border-radius: 10px; .list {
padding: 0 10px;
.item {
position: relative;
padding: 15px 0;
padding-left: 105px;
height: 100px;
border-bottom: 1px solid #eee;
&:last-child {
border-bottom: none;
}
> img {
position: absolute;
width: 95px;
height: 70px;
left: 0;
top: 15px;
border-radius: 5px;
}
.d-news-title {
height: 40px;
font-size: 17px;
font-family: PingFang SC;
font-weight: 500;
color: rgba(51, 51, 51, 1);
line-height: 20px;
}
.d-news-info {
margin-top: 17px;
font-size: 11px;
font-family: PingFang SC;
font-weight: 500;
color: rgba(153, 153, 153, 1);
overflow: hidden;
span {
}
}
}
}
}
}
.mw-cpt-cnt_menus {
position: relative;
margin-top: 10px;
.d-cpt-wrap {
width: 355px;
margin: 0 auto;
border-radius: 5px;
overflow: hidden;
background: rgba(255, 255, 255, 1);
.list {
padding: 15px 0 5px;
overflow: hidden;
.item {
position: relative;
float: left;
margin: 0 24px;
width: 40px;
> img {
display: block;
width: 40px;
height: 40px;
margin-bottom: 1px;
}
p {
width: 100px;
margin-left: -30px;
line-height: 15px;
font-size: 13px;
text-align: center;
font-family: PingFang SC;
font-weight: 500;
color: rgba(51, 51, 51, 1);
}
}
}
}
}
.mw-cpt-cnt_groups {
position: relative;
margin-top: 10px;
.d-cpt-wrap {
width: 100%;
// overflow-x: scroll;
overflow: hidden;
.list {
width: 1000px;
overflow: hidden;
.item {
position: relative;
float: left;
border-radius: 10px;
background-color: #ffffff;
margin-left: 10px;
width: 150px;
box-shadow: 0px 3px 24px 0px rgba(211, 211, 211, 0.26);
.d-group-no {
position: absolute;
left: 10px;
top: 0;
width: 25px;
height: 21px;
line-height: 21px;
text-align: center;
img {
position: absolute;
z-index: 10;
display: block;
left: 0;
top: 0;
width: 25px;
}
span {
position: relative;
z-index: 20;
font-size: 15px;
font-family: PingFang SC;
font-weight: bold;
font-style: italic;
color: rgba(255, 255, 255, 1);
}
}
.d-group-avatar {
position: relative;
margin: 30px auto 5px;
width: 60px;
height: 60px;
padding: 4px;
overflow: hidden;
border-radius: 100%;
box-shadow: 0px 3px 24px 0px rgba(211, 211, 211, 0.26);
img {
position: absolute;
display: block;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
width: 52px;
height: 52px;
border-radius: 100%;
}
}
.d-group-name {
@include toe;
width: 120px;
margin: 0 auto;
text-align: center;
font-size: 17px;
font-family: PingFang SC;
font-weight: 500;
color: rgba(51, 51, 51, 1);
line-height: 21px;
}
.d-group-info {
@include toe;
width: 140px;
margin: 0 auto;
text-align: center;
font-size: 13px;
font-family: PingFang SC;
font-weight: 500;
color: rgba(102, 102, 102, 1);
line-height: 21px;
}
.d-group-btn {
margin: 10px auto 20px;
width: 65px;
height: 25px;
line-height: 25px;
background: rgba(255, 76, 82, 1);
border-radius: 25px;
text-align: center;
font-size: 16px;
font-family: PingFang SC;
font-weight: 500;
color: rgba(255, 255, 255, 1);
}
}
}
} }
} }
} }
@ -327,7 +526,7 @@
// @include bs1; // @include bs1;
position: absolute; position: absolute;
z-index: 10; z-index: 10;
top: 300px; top: 360px;
right: 0; right: 0;
height: 50px; height: 50px;
width: 136px; width: 136px;
@ -345,6 +544,8 @@
.mw-phone-cnt { .mw-phone-cnt {
position: relative; position: relative;
min-height: 300px; min-height: 300px;
padding-top: 1px;
padding-bottom: 10px;
} }
} }
} }

130
epmet-oper-web/src/views/modules/wx-mini/index-set.vue
View File

@ -152,36 +152,128 @@
:key="index" :key="index"
v-for="(item, index) in cntCptList"> v-for="(item, index) in cntCptList">
<div class="mw-cpt-cnt_news" <div class="mw-cpt-cnt_news"
:style="{backgroundColor: item.configuration.bgc}"
v-if="item.componentFrontId==='hotSubjectList'"> v-if="item.componentFrontId==='hotSubjectList'">
<div class="d-cpt-wrap"> <div class="d-cpt-wrap">
<div class="list"> <div class="list">
<div class="item"> <div class="item">
<div class="d-news-title">{{ item.demoData.title }}</div> <img src="@/assets/img/modules/wx-mini/index-set/page/news-pic.png">
<div class="d-news-title" :style="{backgroundColor: item.configuration.bgc}">{{ item.demoData.title }}</div>
<div class="d-news-info"> <div class="d-news-info">
<span>{{ item.demoData.content }}</span> <span>来源：大港路党支部</span>
<span>2020-01-02</span> <span class="f-fr">2020-01-02</span>
</div>
</div>
<div class="item">
<img src="@/assets/img/modules/wx-mini/index-set/page/news-pic.png">
<div class="d-news-title" :style="{backgroundColor: item.configuration.bgc}">{{ item.demoData.title }}</div>
<div class="d-news-info">
<span>来源：大港路党支部</span>
<span class="f-fr">2020-01-02</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="d-cpt-operate" </div>
v-show="focusedCpt.tempOnlyId===item.tempOnlyId" <div class="mw-cpt-cnt_menus"
@click.stop> v-if="item.componentFrontId==='moreFunctionIcons'">
<div class="d-cpt-btn" @click="changeCptDisplayOrder(item, 'up')"> <div class="d-cpt-wrap">
<img src="@/assets/img/modules/wx-mini/index-set/up.png"> <div class="list">
<p>上移</p> <div class="item">
</div> <img src="@/assets/img/modules/wx-mini/index-set/page/menu-1.png">
<div class="d-cpt-btn" @click="delCpt(item)"> <p>议事厅</p>
<img src="@/assets/img/modules/wx-mini/index-set/del.png"> </div>
<p>删除</p> <div class="item">
<img src="@/assets/img/modules/wx-mini/index-set/page/menu-2.png">
<p>社群</p>
</div>
<div class="item">
<img src="@/assets/img/modules/wx-mini/index-set/page/menu-3.png">
<p>党建声音</p>
</div>
<div class="item">
<img src="@/assets/img/modules/wx-mini/index-set/page/menu-4.png">
<p>更多功能</p>
</div>
</div> </div>
<div class="d-cpt-btn" @click="changeCptDisplayOrder(item, 'down')"> </div>
<img src="@/assets/img/modules/wx-mini/index-set/down.png"> </div>
<p>下移</p> <div class="mw-cpt-cnt_groups"
v-if="item.componentFrontId==='recommendGroupSlider'">
<div class="d-cpt-wrap">
<div class="list">
<div class="item">
<div class="d-group-no">
<img src="@/assets/img/modules/wx-mini/index-set/page/qi.png">
<span>1</span>
</div>
<div class="d-group-avatar">
<img src="@/assets/img/modules/wx-mini/index-set/page/avatar.jpg">
</div>
<div class="d-group-name">{{ item.demoData.title }}</div>
<div class="d-group-info">
<span>山东路45号-张三</span>
</div>
<div class="d-group-info">
<span>共240人</span>
<span>党员11人</span>
</div>
<div class="d-group-btn">加入</div>
</div>
<div class="item">
<div class="d-group-no">
<img src="@/assets/img/modules/wx-mini/index-set/page/qi.png">
<span>1</span>
</div>
<div class="d-group-avatar">
<img src="@/assets/img/modules/wx-mini/index-set/page/avatar.jpg">
</div>
<div class="d-group-name">{{ item.demoData.title }}</div>
<div class="d-group-info">
<span>山东路45号-张三</span>
</div>
<div class="d-group-info">
<span>共240人</span>
<span>党员11人</span>
</div>
<div class="d-group-btn">加入</div>
</div>
<div class="item">
<div class="d-group-no">
<img src="@/assets/img/modules/wx-mini/index-set/page/qi.png">
<span>1</span>
</div>
<div class="d-group-avatar">
<img src="@/assets/img/modules/wx-mini/index-set/page/avatar.jpg">
</div>
<div class="d-group-name">{{ item.demoData.title }}</div>
<div class="d-group-info">
<span>山东路45号-张三</span>
</div>
<div class="d-group-info">
<span>共240人</span>
<span>党员11人</span>
</div>
<div class="d-group-btn">加入</div>
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="d-cpt-operate"
v-show="focusedCpt.tempOnlyId===item.tempOnlyId"
@click.stop>
<div class="d-cpt-btn" @click="changeCptDisplayOrder(item, 'up')">
<img src="@/assets/img/modules/wx-mini/index-set/up.png">
<p>上移</p>
</div>
<div class="d-cpt-btn" @click="delCpt(item)">
<img src="@/assets/img/modules/wx-mini/index-set/del.png">
<p>删除</p>
</div>
<div class="d-cpt-btn" @click="changeCptDisplayOrder(item, 'down')">
<img src="@/assets/img/modules/wx-mini/index-set/down.png">
<p>下移</p>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -341,7 +433,7 @@ export default {
componentName: '热门群', componentName: '热门群',
componentFrontId: 'recommendGroupSlider', componentFrontId: 'recommendGroupSlider',
configuration: { configuration: {
bgc: '#eee' bgc: '#fff'
}, },
demoData: { demoData: {
title: '我是标题', title: '我是标题',
@ -354,7 +446,7 @@ export default {
componentName: '新闻列表', componentName: '新闻列表',
componentFrontId: 'hotSubjectList', componentFrontId: 'hotSubjectList',
configuration: { configuration: {
bgc: '#eee' bgc: '#fff'
}, },
demoData: { demoData: {
title: '我是标题', title: '我是标题',

Write Preview
Loading…
Cancel
Save