Browse Source

Merge remote-tracking branch 'origin/dev' into dev

dev
wangchao 6 years ago
parent
commit
8e8bf0ba60
  1. 15
      epmet-oper-web/src/assets/scss/modules/wx-mini/index-set.scss
  2. 214
      epmet-oper-web/src/views/modules/wx-mini/index-set.vue

15
epmet-oper-web/src/assets/scss/modules/wx-mini/index-set.scss

@ -45,6 +45,7 @@
.d-item {
margin: 5px 0;
line-height: 24px;
overflow: hidden;
.d-item-region {
margin-right: 4px;
font-size: 10px;
@ -128,7 +129,7 @@
background-color: #f7f6f9;
box-shadow: 0 5px 15px 1px rgba(0, 0, 0, 0.2);
.mw-phone-topbar{
.mw-phone-topbar {
display: block;
width: 100%;
}
@ -182,7 +183,7 @@
cursor: pointer;
&.z-focused {
box-shadow: 0 0 12px 3px rgba(#67C23A, 0.5);
box-shadow: 0 0 12px 3px rgba(#67c23a, 0.5);
}
.d-cpt-operate {
@ -224,6 +225,16 @@
}
}
.mw-cpt-placeholder {
position: relative;
line-height: 40px;
text-align: center;
font-size: 17px;
font-family: PingFang SC;
font-weight: 500;
color: rgba(255, 76, 82, 1);
}
.mw-cpt-top_title {
position: relative;

214
epmet-oper-web/src/views/modules/wx-mini/index-set.vue

@ -12,9 +12,9 @@
<el-table-column label="小程序首页配置" fixed="right" header-align="center" align="center" width="150">
<template slot-scope="scope">
<el-button type="text" size="small"
@click="startSetWxIndex(scope.row.customerId, scope.row.customerName, 0)">政府</el-button>
@click="startSetWxIndex(scope.row.customerId, scope.row.customerName, 0)">居民</el-button>
<el-button type="text" size="small"
@click="startSetWxIndex(scope.row.customerId, scope.row.customerName, 1)">居民</el-button>
@click="startSetWxIndex(scope.row.customerId, scope.row.customerName, 1)">政府</el-button>
</template>
</el-table-column>
</el-table>
@ -29,7 +29,7 @@
@click="save">保存</el-button>
<el-button type="danger"
@click="publish">发布</el-button>
<span style="margin-left:20px; color:#aaa; font-size:13px">({{ wxIndex.customerName }} - {{ wxIndex.clientType===0 ? '政府端' : '居民端' }})</span>
<span style="margin-left:20px; color:#aaa; font-size:13px">({{ wxIndex.customerName }} - {{ wxIndex.clientType===1 ? '政府端' : '居民端' }})</span>
<el-row class="wrap" :gutter="20">
<el-col :span="5">
@ -37,10 +37,10 @@
<div class="mw-cpt_type">
<div class="d-function" v-show="item.componentList.length > 0" :key="item.functionId" v-for="item in cptTypeList">
<div class="d-info" @click="shiftCptTypeItemUnfold(item)">
<img v-if="item.functionId==1" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt1.png">
<img v-else-if="item.functionId==2" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt2.png">
<img v-else-if="item.functionId==3" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt3.png">
<img v-else-if="item.functionId==4" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt4.png">
<img v-if="item.functionName=='议事厅'" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt1.png">
<img v-else-if="item.functionName=='社群'" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt2.png">
<img v-else-if="item.functionName=='党建声音'" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt3.png">
<img v-else-if="item.functionName=='消息通知'" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt4.png">
<img v-else class="d-ico" src="@/assets/img/modules/wx-mini/index-set/common-cpt.png">
<span class="d-name">{{ item.functionName }}</span>
@ -85,14 +85,18 @@
<img class="d-cpt-avatar" v-if="item.demoData.avatar" :src="item.demoData.avatar">
<img class="d-cpt-avatar" v-else src="@/assets/img/modules/wx-mini/index-set/page/avatar-mini.png">
</div>
<div class="d-cpt-operate z-small"
v-show="focusedCpt.tempOnlyId===item.tempOnlyId"
@click.stop>
<div class="d-cpt-btn" @click="delCpt(item)">
<img src="@/assets/img/modules/wx-mini/index-set/del.png">
<p>删除</p>
</div>
</div>
<div class="mw-cpt-placeholder" v-else>
<div class="d-cpt-wrap">
{{ item.componentName }}
</div>
</div>
<div class="d-cpt-operate z-small"
v-show="focusedCpt.tempOnlyId===item.tempOnlyId"
@click.stop>
<div class="d-cpt-btn" @click="delCpt(item)">
<img src="@/assets/img/modules/wx-mini/index-set/del.png">
<p>删除</p>
</div>
</div>
</div>
@ -117,14 +121,18 @@
</div>
</div>
</div>
<div class="d-cpt-operate z-small"
v-show="focusedCpt.tempOnlyId===item.tempOnlyId"
@click.stop>
<div class="d-cpt-btn" @click="delCpt(item)">
<img src="@/assets/img/modules/wx-mini/index-set/del.png">
<p>删除</p>
</div>
</div>
<div class="mw-cpt-placeholder" v-else>
<div class="d-cpt-wrap">
{{ item.componentName }}
</div>
</div>
<div class="d-cpt-operate z-small"
v-show="focusedCpt.tempOnlyId===item.tempOnlyId"
@click.stop>
<div class="d-cpt-btn" @click="delCpt(item)">
<img src="@/assets/img/modules/wx-mini/index-set/del.png">
<p>删除</p>
</div>
</div>
</div>
@ -141,14 +149,18 @@
<img v-else src="@/assets/img/modules/wx-mini/index-set/page/msg.png">
<span>{{ item.demoData.text }}</span>
</div>
<div class="d-cpt-operate z-small"
v-show="focusedCpt.tempOnlyId===item.tempOnlyId"
@click.stop>
<div class="d-cpt-btn" @click="delCpt(item)">
<img src="@/assets/img/modules/wx-mini/index-set/del.png">
<p>删除</p>
</div>
</div>
<div class="mw-cpt-placeholder" v-else>
<div class="d-cpt-wrap">
{{ item.componentName }}
</div>
</div>
<div class="d-cpt-operate z-small"
v-show="focusedCpt.tempOnlyId===item.tempOnlyId"
@click.stop>
<div class="d-cpt-btn" @click="delCpt(item)">
<img src="@/assets/img/modules/wx-mini/index-set/del.png">
<p>删除</p>
</div>
</div>
</div>
@ -177,7 +189,7 @@
</div>
</div>
<div class="mw-cpt-cnt_menus"
v-if="item.componentFrontId==='resi-functionList-extend-moreFunctionIcons'">
v-else-if="item.componentFrontId==='resi-functionList-extend-moreFunctionIcons'">
<div class="d-cpt-wrap">
<div class="list">
<div class="item" :key="subindex" v-for="(subitem, subindex) in item.demoData.list">
@ -192,7 +204,7 @@
</div>
</div>
<div class="mw-cpt-cnt_groups"
v-if="item.componentFrontId==='resi-functionList-group-recommendGroupSlider'">
v-else-if="item.componentFrontId==='resi-functionList-group-recommendGroupSlider'">
<div class="d-cpt-wrap">
<div class="list">
<div class="item" :key="subindex" v-for="(subitem, subindex) in item.demoData.list">
@ -219,6 +231,11 @@
</div>
</div>
</div>
<div class="mw-cpt-placeholder" v-else>
<div class="d-cpt-wrap">
{{ item.componentName }}
</div>
</div>
<div class="d-cpt-operate"
v-show="focusedCpt.tempOnlyId===item.tempOnlyId"
@click.stop>
@ -316,6 +333,47 @@ export default {
functionName: '通用组件',
functionType: 1, // 1 2
isUnfold: true,
componentList: [
{
componentId: '7',
componentName: '新闻列表',
componentFrontId: 'resi-functionList-hall-hotSubjectList',
region: 'functionList',
configuration: {
// bgc: '#fff'
},
demoData: {
list: [
{
pic: '',
title: '我是新闻标题,我是新闻标题,我是新闻标题,我是新闻标题,我是新闻标题',
author: '大港路党支部',
date: '2020-01-02'
},
{
pic: '',
title: '我是新闻标题',
author: '大港路党支部',
date: '2020-01-02'
},
{
pic: '',
title: '我是新闻标题',
author: '大港路党支部',
date: '2020-01-02'
}
]
},
configurationDescription: ''
}
]
},
//
{
functionId: '1',
functionName: '议事厅',
functionType: 2, // 1 2
isUnfold: false,
componentList: [
{
componentId: '1',
@ -329,6 +387,7 @@ export default {
avatar: '',
title: '青岛市市北区大港路第二网格'
},
region: 'titleList',
configurationDescription: '请配置具体内容'
},
{
@ -342,6 +401,7 @@ export default {
pic: '',
title: '轮播图新闻标题'
},
region: 'topList',
configurationDescription: '请配置具体内容'
},
{
@ -355,21 +415,14 @@ export default {
ico: '',
text: '有新消息!'
},
region: 'floatingList',
configurationDescription: ''
}
]
},
//
{
functionId: '1',
functionName: '议事厅',
functionType: 2, // 1 2
isUnfold: false,
componentList: [
},
{
componentId: '5',
componentName: '功能菜单',
componentFrontId: 'resi-functionList-extend-moreFunctionIcons',
region: 'functionList',
configuration: {
// bgc: '#eee'
},
@ -399,6 +452,7 @@ export default {
componentId: '6',
componentName: '热门群',
componentFrontId: 'resi-functionList-group-recommendGroupSlider',
region: 'functionList',
configuration: {
// bgc: '#fff'
},
@ -434,37 +488,6 @@ export default {
]
},
configurationDescription: ''
},
{
componentId: '7',
componentName: '新闻列表',
componentFrontId: 'resi-functionList-hall-hotSubjectList',
configuration: {
// bgc: '#fff'
},
demoData: {
list: [
{
pic: '',
title: '我是新闻标题,我是新闻标题,我是新闻标题,我是新闻标题,我是新闻标题',
author: '大港路党支部',
date: '2020-01-02'
},
{
pic: '',
title: '我是新闻标题',
author: '大港路党支部',
date: '2020-01-02'
},
{
pic: '',
title: '我是新闻标题',
author: '大港路党支部',
date: '2020-01-02'
}
]
},
configurationDescription: ''
}
]
}
@ -568,6 +591,7 @@ export default {
await this.getCptTypeList()
await this.getCptList()
this.toStep(2)
this.cleanFocusCpt()
loadingInstance.close()
},
processBackendCptData (item) {
@ -710,15 +734,27 @@ export default {
},
//
checkCptRegion (item) {
const { componentFrontId } = item
const fun = name => name === componentFrontId
if (['resi-titleList-home-gridNameTitle'].findIndex(fun) !== -1) {
const { region } = item
// const { componentFrontId } = item
// const fun = name => name === componentFrontId
// if (['resi-titleList-home-gridNameTitle'].findIndex(fun) !== -1) {
// return 'top'
// } else if (['resi-topList-voice-hotNewsSwiper'].findIndex(fun) !== -1) {
// return 'ban'
// } else if (['resi-functionList-extend-moreFunctionIcons', 'resi-functionList-group-recommendGroupSlider', 'resi-functionList-hall-hotSubjectList'].findIndex(fun) !== -1) {
// return 'cnt'
// } else if (['resi-floatingList-mine-newMessageButton'].findIndex(fun) !== -1) {
// return 'fixed'
// } else {
// return 'none'
// }
if (region === 'titleList') {
return 'top'
} else if (['resi-topList-voice-hotNewsSwiper'].findIndex(fun) !== -1) {
} else if (region === 'topList') {
return 'ban'
} else if (['resi-functionList-extend-moreFunctionIcons', 'resi-functionList-group-recommendGroupSlider', 'resi-functionList-hall-hotSubjectList'].findIndex(fun) !== -1) {
} else if (region === 'functionList') {
return 'cnt'
} else if (['resi-floatingList-mine-newMessageButton'].findIndex(fun) !== -1) {
} else if (region === 'floatingList') {
return 'fixed'
} else {
return 'none'
@ -727,8 +763,10 @@ export default {
//
checkCptReuse (item) {
const { componentFrontId } = item
const reuseList = this.cptTypeList[0].componentList.map(v => v.componentFrontId)
const fun = name => name === componentFrontId
return ['resi-functionList-hall-hotSubjectList'].findIndex(fun) !== -1
// return ['resi-functionList-hall-hotSubjectList'].findIndex(fun) !== -1
return reuseList.findIndex(fun) !== -1
},
//
getCptRegionName (id) {
@ -747,19 +785,19 @@ export default {
const tempOnlyId = getRandomString(20)
if (regionType === 'top') {
if (this.topCptList.length > 0) {
this.$message('标题区已有组件,请删除后再添加')
} else {
this.addCpt(item, tempOnlyId, 1)
}
} else if (regionType === 'ban') {
if (this.banCptList.length > 0) {
this.$message('置顶区已有组件,请删除后再添加')
} else {
this.addCpt(item, tempOnlyId, 2)
}
} else if (regionType === 'fixed') {
if (this.fixedCptList.length > 0) {
this.$message('浮窗区已有组件,请删除后再添加')
} else {
this.addCpt(item, tempOnlyId, 3)
}
@ -781,7 +819,7 @@ export default {
console.log('添加组件到实例')
let trueItem = cloneDeep(item)
trueItem.tempOnlyId = tempOnlyId
trueItem.region = region
trueItem.localRegion = region
trueItem.displayOrder = displayOrder
this.cptList.push(trueItem)
},
@ -807,12 +845,16 @@ export default {
checkExistCpt (item) {
return this.cptList.some(cptItem => item.componentFrontId === cptItem.componentFrontId)
},
//
cleanFocusCpt () {
this.focusedCpt = { tempOnlyId: '' }
},
//
focusCpt (item) {
console.log('聚焦实例组件')
if (this.isInPreview) return
if (this.focusedCpt.tempOnlyId === item.tempOnlyId) {
this.focusedCpt = { tempOnlyId: '' }
this.cleanFocusCpt()
} else {
this.focusedCpt = { ...cloneDeep(item), demoData: JSON.stringify(item.demoData), configuration: JSON.stringify(item.configuration), demoIsUnfold: true, confIsUnfold: false }
}

Loading…
Cancel
Save