Skip to content

C
common-templete
Commit 31604c3b by 高淑倩
Options

modified:addstyle

parent c61f257f
Showing with 114 additions and 12 deletions
src/pages/addmarketing/components/StepInfo.vue
......@@ -10,14 +10,44 @@
<el-form-item label="选择推送素材" class="step-choose">
<span class="gray"><span class="star-red">*</span> 推送素材需前往<a href="#">微信公众平台</a>-管理-素材管理维护。</span>
<div class="add-material" @click="centerDialogVisible = true">
<div v-if="!currentImgUrl">
<div v-if="!chooseItem">
<el-button type="text" class="add-title">
<p><i class="el-icon-plus add-plus"></i></p>
添加微信素材
</el-button>
</div>
<div v-else>
<img :src="currentImgUrl" alt="">
<span v-if="item.content.news_item.length===1" v-for="(art,index) in item.content.news_item" :key="index">
<div>
<p style="white-space:normal;
word-break:break-all;
word-wrap:break-word;padding:15px 0 0 15px;height:30px">{{art.title}}</p>
<img :src="art.thumb_url" style="width:240px;height:125px;margin:5px 10px;border:1px solid #ccc">
<p v-html="art.content" style="padding-left:10px;
font-size: 8px;
line-height: 1.3em;
color: #a49d96;
word-wrap: break-word;"></p>
<span style="padding-left:10px;">查看全文</span>
</div>
</span>
<span v-if="item.content.news_item.length===2" v-for="(art,index) in item.content.news_item" :key="index" class="two-item">
<div style="border-top:1px solid #eee;height:60px;">
<p style="width:185px;
white-space:normal;
word-break:break-all;
word-wrap:break-word;padding: 5px 0 0 5px;display:inline-block;">{{art.title}}</p>
<img style="width:40px;heigth:40px; margin-top: 8px;" :src="art.thumb_url">
</div>
</span>
<span v-if="item.content.news_item.length>2" v-for="(art,index) in item.content.news_item" :key="index" class="three-item">
<div class="dv clear">
<p>{{art.title}}</p>
<img :src="art.thumb_url">
</div>
</span>
<div class="box-mask"><span>替换素材</span></div>
</div>
</div>
<el-dialog title="微信消息素材" :visible.sync="centerDialogVisible" width="1000px" center class="add-subtitle title">
......@@ -31,8 +61,36 @@
暂无素材
</el-col>
<el-col v-else :span="8" v-for="(item,index) in materList" :key="index">
<div class="add-content" v-for="(thumb,index) in item.content.news_item" :key="index" @click="handleImg(thumb.thumb_media_id,thumb.thumb_url)">
<img :src="thumb.thumb_url" :alt="thumb.title">
<div class="add-content" @click="handleChoose(item)">
<span v-if="item.content.news_item.length===1" v-for="(art,index) in item.content.news_item" :key="index">
<div>
<p style="white-space:normal;
word-break:break-all;
word-wrap:break-word;padding:15px 0 0 15px;height:30px">{{art.title}}</p>
<img :src="art.thumb_url" style="width:240px;height:125px;margin:5px 10px;border:1px solid #ccc">
<p v-html="art.content" style="padding-left:10px;
font-size: 8px;
line-height: 1.3em;
color: #a49d96;
word-wrap: break-word;"></p>
<span style="padding-left:10px;">查看全文</span>
</div>
</span>
<span v-if="item.content.news_item.length===2" v-for="(art,index) in item.content.news_item" :key="index" class="two-item">
<div style="border-top:1px solid #eee;height:60px;">
<p style="width:185px;
white-space:normal;
word-break:break-all;
word-wrap:break-word;padding: 5px 0 0 5px;display:inline-block;">{{art.title}}</p>
<img style="width:40px;heigth:40px; margin-top: 8px;" :src="art.thumb_url">
</div>
</span>
<span v-if="item.content.news_item.length>2" v-for="(art,index) in item.content.news_item" :key="index" class="three-item">
<div class="dv clear">
<p>{{art.title}}</p>
<img :src="art.thumb_url">
</div>
</span>
<div class="box-mask"><span>选择素材</span></div>
</div>
</el-col>
......@@ -98,6 +156,7 @@
</template>
<script>
import api from '@/tool/api'
import {mapMutations, mapState} from 'vuex';
export default {
data() {
......@@ -127,6 +186,7 @@ export default {
tagList: [],
tagIdsList: [],
chooseTag: [],
chooseItem: ''
}
},
created() {
......@@ -139,8 +199,19 @@ export default {
isBtnCheckd() {
return this.checked ? 'opacity: 1' : 'opacity: .65'
},
...mapState(['global']),
item() {
return this.global.chooseItem
}
},
methods: {
...mapMutations(['CHOOSE_ITEM']),
handleChoose(item) {
this.chooseItem = item
this.currentImgId = item.media_id
this.CHOOSE_ITEM(item)
this.centerDialogVisible = false
},
getAll() {
this.isCount = true
this.getTagCountAll()
......@@ -210,11 +281,6 @@ export default {
this.getTagCount()
this.getViewCount()
},
handleImg(id, url) {
this.currentImgUrl = url
this.currentImgId = id
this.centerDialogVisible = false
},
onSubmit() {
if (this.currentTagCount < 1) {
return this.$message({
......@@ -297,7 +363,7 @@ export default {
this.tagNum = tagNum
this.followNum = followNum
this.fourthNum = fourthNum
this.successNum = this.followNum - this.fourthNum
this.successNum = (this.followNum - this.fourthNum)-0
}
}
})
......@@ -306,18 +372,37 @@ export default {
}
</script>
<style lang="stylus" scoped>
.two-item:nth-child(1)
div
height 161px !important
margin-bottom 5px
p
width 254px !important
float left
position relative
top 123px
background-color rgba(0,0,0,0.2)
padding 0 5px !important
img
width 259px !important
height 161px !important
float left
margin-top -40px !important
.box-mask
position absolute
width 100%
height 100%
background-color rgba(0, 0, 0, 0.4)
text-align center
display flex
font-size 16px
color #fff
top 0
left 0
pointer-event none
opacity 0
justify-content center
align-items center
.box-mask:hover
opacity 1
.active
......@@ -378,6 +463,17 @@ export default {
cursor pointer
width 100%
height 100%
// .two-item:nth-child(1)
// div
// border 1px solid
// height 132px !important
// margin-bottom 5px
// p
// width 247px !important
// float left
// border 1px solid red
// img
// border 1px solid
.add-line
border-top 1px solid #e5e5e5
.form-tags
......
src/store/global/index.js
......@@ -25,6 +25,8 @@ const MENU_HISTORY_JSON = 'MENU_HISTORY_JSON'
const MEDIA_LIST = 'MEDIA_LIST'
const CHOOSE_ITEM = 'CHOOSE_ITEM'
const state = {
menus: [],
editMenus: false,
......@@ -36,7 +38,8 @@ const state = {
name: '',
value: []
},
mediaList: ''
mediaList: '',
chooseItem: ''
}
const actions = {
......@@ -90,11 +93,14 @@ const getters = {
return state.currentMenus
},
getCurrentPath (state) {
return state.currentPath
return state.curredsntPath
}
}
const mutations = {
[CHOOSE_ITEM](state, chooseItem) {
state.chooseItem = chooseItem
},
[MEDIA_LIST](state, mediaList) {
state.mediaList = mediaList
},
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment