<template>
|
<div>
|
<p class="basicTip">
|
小贴士:为防止失真热区图片尺寸需与区域大小严格一致
|
</p>
|
<div>
|
<el-form-item label="热区图片:">
|
<custom-upload-img
|
@handle-success="handleSuccess"
|
@handle-remove="handleRemove"
|
:fileList="fileList"
|
:form="form"
|
:isHot="true"
|
>
|
</custom-upload-img>
|
</el-form-item>
|
<el-form-item label="活动详情:" :required="true">
|
<el-input class="diyInput" disabled v-model="form.content" :title="form.content" placeholder="请选择一个活动">
|
<el-button id="append" @click="selectedItem" slot="append">选择活动</el-button>
|
</el-input>
|
</el-form-item>
|
</div>
|
<pro-activity-selected :show.sync ='selectedDialog.show' @selected-coupon="selectedCoupon" :title="selectedDialog.title" :multipleSelected="false">
|
<el-table-column>
|
<template slot-scope="scope">
|
<el-button type="success" @click="choiceItem(scope.row)" size="mini">添加</el-button>
|
</template>
|
</el-table-column>
|
</pro-activity-selected>
|
</div>
|
</template>
|
|
<script>
|
import proActivitySelected from '@/views/diy-form/set-up/components/selectLists/proActivitySelected.vue'
|
import { mapMutations } from 'vuex'
|
export default {
|
props: ['form'],
|
components: { proActivitySelected },
|
data () {
|
return {
|
selectedDialog: {
|
show: false,
|
title: '选择活动'
|
}
|
}
|
},
|
computed: {
|
fileList () {
|
return this.form.fileUrl ? [{ url: this.form.fileUrl, id: this.form.fileId }] : []
|
}
|
},
|
methods: {
|
...mapMutations(['updateCurrent']),
|
/**
|
* 当活动选择优惠券时
|
*/
|
selectedCoupon (val) {
|
let str = null
|
switch (val) {
|
case '5':
|
str = '把用户引导到优惠券领取界面'
|
break
|
case '4':
|
str = '把用户引导到限时秒杀界面'
|
break
|
case '7':
|
str = '把用户引导到活动中心'
|
break
|
default:
|
break
|
}
|
this.updateCurrent({ content: str, promotionId: null, promotionType: val })
|
},
|
// 打开选择活动弹出框
|
selectedItem () {
|
this.selectedDialog.show = true
|
},
|
// 选择活动
|
choiceItem (row) {
|
this.selectedDialog.show = false
|
// 活动类型{1:满减2:满赠3:盲盒抽奖4:限时抢购5:优惠券,6:拼团活动,7:活动中心}
|
const promotionType = row.promotionType
|
this.updateCurrent({ content: row.promotionName, promotionId: row.promotionId, promotionType })
|
},
|
/**
|
* 获取上传成功的图片
|
*/
|
handleSuccess (data) {
|
this.updateCurrent({ fileUrl: data.url, fileId: data.id })
|
},
|
/**
|
* 移除图片
|
*/
|
handleRemove (data) {
|
this.updateCurrent({ fileUrl: null, fileId: null })
|
}
|
}
|
}
|
</script>
|
|
<style>
|
|
</style>
|