|
|
|
@ -37,11 +37,11 @@ |
|
|
|
<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==0" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/common-cpt.png"> |
|
|
|
<img v-if="item.functionId==1" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt1.png"> |
|
|
|
<img v-if="item.functionId==2" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt2.png"> |
|
|
|
<img v-if="item.functionId==3" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt3.png"> |
|
|
|
<img v-if="item.functionId==4" class="d-ico" src="@/assets/img/modules/wx-mini/index-set/function-cpt4.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-else class="d-ico" src="@/assets/img/modules/wx-mini/index-set/common-cpt.png"> |
|
|
|
|
|
|
|
<span class="d-name">{{ item.functionName }}</span> |
|
|
|
|
|
|
|
@ -68,6 +68,8 @@ |
|
|
|
@click="isInPreview = false" icon="el-icon-close" circle></el-button> |
|
|
|
</div> |
|
|
|
<div class="mw-phone"> |
|
|
|
<img class="mw-phone-topbar" v-show="isInPreview" src="@/assets/img/modules/wx-mini/index-set/page/wx-top.png"> |
|
|
|
|
|
|
|
<div class="mw-phone-top" v-show="!isInPreview || topCptList.length>0" :class="{'z-none': !isInPreview}"> |
|
|
|
<div class="mw-phone-hint" v-show="!isInPreview" :class="{'z-out-left': topCptList.length>0}">（{{ getCptRegionName('top') }}）</div> |
|
|
|
<div class="mw-cpt" |
|
|
|
@ -76,9 +78,12 @@ |
|
|
|
v-for="item in topCptList"> |
|
|
|
<div class="mw-cpt-top_title" v-if="item.componentFrontId==='resi-titleList-home-gridNameTitle'"> |
|
|
|
<div class="d-cpt-wrap"> |
|
|
|
<img v-if="item.demoData.ico" :src="item.demoData.ico"> |
|
|
|
<img v-else src="@/assets/img/modules/wx-mini/index-set/page/dang.png"> |
|
|
|
<img class="d-cpt-ico" v-if="item.demoData.ico" :src="item.demoData.ico"> |
|
|
|
<img class="d-cpt-ico" v-else src="@/assets/img/modules/wx-mini/index-set/page/dang.png"> |
|
|
|
<span>{{ item.demoData.title }}</span> |
|
|
|
|
|
|
|
<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" |
|
|
|
@ -193,7 +198,8 @@ |
|
|
|
<div class="item" :key="subindex" v-for="(subitem, subindex) in item.demoData.list"> |
|
|
|
<div class="d-group-no"> |
|
|
|
<img v-if="subitem.ico" :src="subitem.ico"> |
|
|
|
<img v-else src="@/assets/img/modules/wx-mini/index-set/page/qi.png"> |
|
|
|
<img v-else-if="subindex === 0" src="@/assets/img/modules/wx-mini/index-set/page/qi.png"> |
|
|
|
<img v-else src="@/assets/img/modules/wx-mini/index-set/page/qi2.png"> |
|
|
|
<span>{{ subitem.no }}</span> |
|
|
|
</div> |
|
|
|
<div class="d-group-avatar"> |
|
|
|
@ -289,7 +295,7 @@ import getRandomString from 'dai-js/tools/getRandomString' |
|
|
|
import cloneDeep from 'lodash/cloneDeep' |
|
|
|
|
|
|
|
const getMockFilterUrl = (url) => { |
|
|
|
const usedMockTest = true |
|
|
|
const usedMockTest = false |
|
|
|
const mockBaseUrl = 'https://nei.netease.com/api/apimock/30f0251f1b7dc90a8c38e3c634ef2a8b/api' |
|
|
|
if (usedMockTest) { |
|
|
|
return mockBaseUrl + url |
|
|
|
@ -348,6 +354,7 @@ export default { |
|
|
|
}, |
|
|
|
demoData: { |
|
|
|
ico: '', |
|
|
|
avatar: '', |
|
|
|
title: '青岛市市北区大港路第二网格' |
|
|
|
}, |
|
|
|
configurationDescription: '请配置具体内容' |
|
|
|
@ -436,7 +443,7 @@ export default { |
|
|
|
}, |
|
|
|
{ |
|
|
|
ico: '', |
|
|
|
no: '1', |
|
|
|
no: '2', |
|
|
|
avatar: '', |
|
|
|
title: '群名称', |
|
|
|
info1: '山东路45号-张三', |
|
|
|
@ -445,7 +452,7 @@ export default { |
|
|
|
}, |
|
|
|
{ |
|
|
|
ico: '', |
|
|
|
no: '1', |
|
|
|
no: '3', |
|
|
|
avatar: '', |
|
|
|
title: '群名称', |
|
|
|
info1: '山东路45号-张三', |
|
|
|
@ -467,7 +474,7 @@ export default { |
|
|
|
list: [ |
|
|
|
{ |
|
|
|
pic: '', |
|
|
|
title: '我是新闻标题', |
|
|
|
title: '我是新闻标题，我是新闻标题，我是新闻标题，我是新闻标题，我是新闻标题', |
|
|
|
author: '大港路党支部', |
|
|
|
date: '2020-01-02' |
|
|
|
}, |
|
|
|
@ -507,6 +514,7 @@ export default { |
|
|
|
// region: 1 // 区域 1top 2ban 3fixed 4cnt |
|
|
|
// } |
|
|
|
], |
|
|
|
lastSavedCptList: [], |
|
|
|
focusedCpt: { |
|
|
|
tempOnlyId: '' |
|
|
|
} |
|
|
|
@ -621,6 +629,7 @@ export default { |
|
|
|
...res.data.floatingList |
|
|
|
] |
|
|
|
// this.cptList = list.map(this.processBackendCptData) |
|
|
|
this.lastSavedCptList = cloneDeep(this.cptList) |
|
|
|
console.log('用户储存组件列表', list) |
|
|
|
} |
|
|
|
}).catch(() => { |
|
|
|
@ -650,6 +659,7 @@ export default { |
|
|
|
return this.$message.error(res.msg) |
|
|
|
} else { |
|
|
|
console.log(res) |
|
|
|
this.lastSavedCptList = cloneDeep(this.cptList) |
|
|
|
return this.$message.success('保存成功') |
|
|
|
} |
|
|
|
}).catch(() => { |
|
|
|
@ -686,6 +696,7 @@ export default { |
|
|
|
return this.$message.error(res.msg) |
|
|
|
} else { |
|
|
|
console.log(res) |
|
|
|
this.lastSavedCptList = cloneDeep(this.cptList) |
|
|
|
return this.$message.success('发布成功') |
|
|
|
} |
|
|
|
}).catch(() => { |
|
|
|
@ -784,6 +795,9 @@ export default { |
|
|
|
// 删除组件 |
|
|
|
delCpt (item) { |
|
|
|
this.cptList = this.cptList.filter(cptItem => item.tempOnlyId !== cptItem.tempOnlyId) |
|
|
|
if (this.focusedCpt.tempOnlyId === item.tempOnlyId) { |
|
|
|
this.focusedCpt = { tempOnlyId: '' } |
|
|
|
} |
|
|
|
}, |
|
|
|
// 检测实例中是否存在某种类型组件 |
|
|
|
checkExistCpt (item) { |
|
|
|
@ -816,15 +830,26 @@ export default { |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 重置聚焦组件数据 |
|
|
|
// 重置聚焦组件数据，重置为上次整体保存时的数据 |
|
|
|
resetFocusedCptData () { |
|
|
|
const { focusedCpt } = this |
|
|
|
this.cptList.forEach(item => { |
|
|
|
const fun = item => { |
|
|
|
if (item.tempOnlyId === focusedCpt.tempOnlyId) { |
|
|
|
focusedCpt.demoData = JSON.stringify(item.demoData) |
|
|
|
focusedCpt.configuration = JSON.stringify(item.configuration) |
|
|
|
return true |
|
|
|
} else { |
|
|
|
return false |
|
|
|
} |
|
|
|
}) |
|
|
|
} |
|
|
|
if (!this.lastSavedCptList.some(fun)) { |
|
|
|
this.cptTypeListTiled.forEach(item => { |
|
|
|
if (item.componentFrontId === focusedCpt.componentFrontId) { |
|
|
|
focusedCpt.demoData = JSON.stringify(item.demoData) |
|
|
|
focusedCpt.configuration = JSON.stringify(item.configuration) |
|
|
|
} |
|
|
|
}) |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
// 改变可用列表组件展开与收起 |
|
|
|
|
dai_siki
6 years ago
