58 lines
2.0 KiB
HTML
58 lines
2.0 KiB
HTML
<nc-component :data="data[index]" class="hot-area">
|
|
|
|
<!-- 预览 -->
|
|
<template slot="preview">
|
|
|
|
<template v-if="nc.lazyLoad">
|
|
<hot-area-carouse></hot-area-carouse>
|
|
<div class="hot-area-warp" :style="{
|
|
backgroundColor: nc.componentBgColor,
|
|
borderTopLeftRadius: (nc.componentAngle == 'round' ? nc.topAroundRadius + 'px' : 0),
|
|
borderTopRightRadius: (nc.componentAngle == 'round' ? nc.topAroundRadius + 'px' : 0),
|
|
borderBottomLeftRadius: (nc.componentAngle == 'round' ? nc.bottomAroundRadius + 'px' : 0),
|
|
borderBottomRightRadius: (nc.componentAngle == 'round' ? nc.bottomAroundRadius + 'px' : 0)
|
|
}">
|
|
<div class="hot-area-content">
|
|
<div v-if="nc.imageUrl" :style="{backgroundImage: 'url('+ changeImgUrl(nc.imageUrl) +')',height: nc.tempData.swiperHeight + 'px'}" class="hot-area-item"></div>
|
|
<div v-else :style="{backgroundImage: 'url(' + changeImgUrl('public/static/img/default_img/figure.png') + ')',height: nc.tempData.swiperHeight + 'px'}" class="hot-area-item"></div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
</template>
|
|
|
|
<!-- 内容编辑 -->
|
|
<template slot="edit-content">
|
|
<template v-if="nc.lazyLoad">
|
|
<hot-area-list></hot-area-list>
|
|
|
|
<div class="template-edit-title">
|
|
<h3>图片设置</h3>
|
|
<div class="hot-area-wrap">
|
|
<p class="word-aux">推荐尺寸750*350</p>
|
|
<img-upload :data="{ data: nc }" data-disabled="1"></img-upload>
|
|
<div class="selected-style" :class="{'text-color' : nc.heatMapData }" @click="nc.tempData.methods.setHeatMap()">
|
|
<span>热区设置</span>
|
|
<i class="layui-icon layui-icon-right"></i>
|
|
</div>
|
|
<div class="error-msg"></div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
<!-- 样式编辑 -->
|
|
<template slot="edit-style">
|
|
</template>
|
|
|
|
<!-- 资源 -->
|
|
<template slot="resource">
|
|
<js>
|
|
var hotAreaResourcePath = "{$resource_path}"; // http路径
|
|
var hotAreaRelativePath = "{$relative_path}"; // 相对路径
|
|
</js>
|
|
<css src="{$resource_path}/css/design.css"></css>
|
|
<js src="{$resource_path}/js/design.js"></js>
|
|
</template>
|
|
|
|
</nc-component> |