初始上传
This commit is contained in:
274
app/shop/view/promotion/index.html
Executable file
274
app/shop/view/promotion/index.html
Executable file
@@ -0,0 +1,274 @@
|
||||
<style>
|
||||
.layui-layout-admin .layui-body .body-content {background: #EFF0F4;padding: 0}
|
||||
.summary-wrap {background: #fff;padding: 15px; margin: 0;}
|
||||
.summary-wrap .layui-card-body{display: flex;padding: 10px!important;flex-wrap: wrap;}
|
||||
.summary-wrap .layui-card-body .content{width: 33.3%;display: flex;flex-direction: column;justify-content: center;}
|
||||
.summary-wrap .layui-card-body .num{font-size: 26px;color: #666;margin-top: 10px;max-width: 250px;}
|
||||
.summary-wrap .layui-card-body .title{color: #909399; font-size: 14px; margin-top: 5px;}
|
||||
|
||||
.empty {text-align: center;padding: 200px 0}
|
||||
.loading {background: rgba(255,255,255,.5);position: absolute;left: 0; top: 0;text-align: center;width: 100%;height: 100%;box-sizing: border-box;padding-top: 300px;display: none}
|
||||
.loading i {font-size: 25px}
|
||||
|
||||
.layui-layer-content .layui-form-label {width: 100px}
|
||||
/* 营销日历 */
|
||||
.promotion-calendar {background: #fff;padding: 15px;margin-top: 15px;position: relative; min-height: 400px}
|
||||
.promotion-calendar .head {font-size: 16px;font-weight: bolder;text-align: center;line-height: 40px}
|
||||
.promotion-calendar .head .month {width: 150px;text-align: center;display: inline-block}
|
||||
.promotion-calendar .head .iconfont {cursor: pointer;}
|
||||
.promotion-calendar .head .iconfont:hover {color: var(--base-color)}
|
||||
.promotion-calendar .body .group {border-bottom: 1px solid #eee}
|
||||
.promotion-calendar .body .list {display: flex;line-height: 40px;height: 40px;}
|
||||
.promotion-calendar .body .promotion {width: 180px;border-right: 1px solid #eee;padding-right: 10px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
|
||||
.promotion-calendar .body .days {width: 0;flex: 1;display: flex}
|
||||
.promotion-calendar .days div {flex: 1;text-align: center;display: flex;align-items: center;justify-content: center;}
|
||||
.promotion-calendar .body .top-wrap {background: #F2F3F5;margin-top: 15px;line-height: 36px;height: 36px;}
|
||||
.promotion-calendar .promotion-tag {color: #fff;font-size: 12px;background: var(--base-color);padding: 2px 5px;line-height: 1;border-radius: 3px}
|
||||
.promotion-calendar .progress {width: 100%;height: 15px;background: var(--base-color);}
|
||||
.promotion-calendar .progress.start {border-bottom-left-radius: 15px;border-top-left-radius: 15px;}
|
||||
.promotion-calendar .progress.end {border-bottom-right-radius: 15px;border-top-right-radius: 15px;}
|
||||
|
||||
.promotion-list {background: #fff;padding: 15px;margin-top: 15px; margin-left: 0; margin-right: 0;}
|
||||
.promotion-list .head a{margin-left: auto;}
|
||||
.promotion-list .body {display: flex;flex-wrap: wrap;}
|
||||
.promotion-list .body .promotion-item {width: 25%;margin-top: 15px}
|
||||
.promotion-list .promotion-item .box {border: 1px solid #eee;margin-right: 15px;}
|
||||
.promotion-list .promotion-item .info-wrap {display: flex;padding: 10px}
|
||||
.promotion-list .info-wrap .info {cursor:pointer;flex: 1;width: 0;display: flex;flex-direction: column;justify-content: space-between;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
|
||||
.promotion-list .info-wrap .icon {cursor:pointer;width: 40px;height: 40px;margin-right: 10px}
|
||||
.promotion-list .info-wrap .desc {color: #999;font-size: 12px;}
|
||||
.promotion-list .layui-form-switch {margin-top: 0;cursor: pointer!important;}
|
||||
.promotion-list .promotion-item .detail {cursor: pointer;border-top: 1px solid #eee;padding: 10px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;line-height: 1}
|
||||
</style>
|
||||
|
||||
<div class="common-wrap summary-wrap">
|
||||
<div class="head">
|
||||
<span class="title">营销数据</span>
|
||||
<span class="sub-title">{:date('Y-m-d')}</span>
|
||||
</div>
|
||||
<div class="layui-card-body">
|
||||
<div class="content">
|
||||
<p class="title">进行中活动数（个）</p>
|
||||
<p class="num">0</p>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p class="title">订单数量（笔）</p>
|
||||
<p class="num">0</p>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p class="title">当前营销工具数（个）</p>
|
||||
<p class="num">0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="promotion-list common-wrap">
|
||||
<div class="head">
|
||||
<span class="title">营销配置</span>
|
||||
</div>
|
||||
<div class="body layui-form">
|
||||
{foreach name="$promotion_config" item="promotion"}
|
||||
<div class="promotion-item">
|
||||
<div class="box">
|
||||
<div class="info-wrap">
|
||||
<img src="{:img($promotion.icon)}" alt="" class="icon" onclick="location.hash = ns.hash('{$promotion.url}')">
|
||||
<div class="info" onclick="location.hash = ns.hash('{$promotion.url}')">
|
||||
<div>{$promotion.title}</div>
|
||||
<div class="desc">{$promotion.description}</div>
|
||||
</div>
|
||||
{if $promotion.switch_type == 'switch'}
|
||||
<input type="checkbox" lay-skin="switch" data-keyword="{$promotion.config_key}" {if $promotion.status}checked{/if} lay-filter="promotion">
|
||||
{else/}
|
||||
<a href="{:href_url($promotion.url)}" target="_blank">
|
||||
<input type="checkbox" lay-skin="switch" {if $promotion.status}checked{/if} disabled>
|
||||
</a>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="detail" title="{$promotion.detail}" onclick="location.hash = ns.hash('{$promotion.url}')">{$promotion.detail}</div>
|
||||
</div>
|
||||
</div>
|
||||
{/foreach}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="promotion-list common-wrap">
|
||||
<div class="head">
|
||||
<span class="title">营销活动</span>
|
||||
<a href="{:href_url('shop/promotion/market')}" class="text-color">更多</a>
|
||||
</div>
|
||||
<div class="body layui-form">
|
||||
{foreach name="all_promotion" item="promotion" index="index"}
|
||||
{if $index < 9}
|
||||
<div class="promotion-item">
|
||||
<a href="{:href_url($promotion.url)}">
|
||||
<div class="box">
|
||||
<div class="info-wrap">
|
||||
<img src="{:img($promotion.icon)}" alt="" class="icon">
|
||||
<div class="info">
|
||||
<div>{$promotion.title}</div>
|
||||
<div class="desc">{$promotion.description}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
{/if}
|
||||
{/foreach}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="promotion-calendar">
|
||||
<div class="head">
|
||||
<i class="iconfont iconback_light" onclick="getPromotion(-1)"></i>
|
||||
<span class="month">{$month}</span>
|
||||
<i class="iconfont iconyoujiantou" onclick="getPromotion(1)"></i>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/html" id="promotionStat">
|
||||
<div class="content">
|
||||
<p class="title">进行中活动数（个）</p>
|
||||
<p class="num">{{ d.in_progress_num }}</p>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p class="title">订单数量（笔）</p>
|
||||
<p class="num">{{ d.order_num }}</p>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p class="title">当前营销工具数（个）</p>
|
||||
<p class="num">{{ d.promotion_num }}</p>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="promotionData">
|
||||
<div class="head">
|
||||
<i class="iconfont iconback_light" onclick="getPromotion(-1)"></i>
|
||||
<span class="month">{{ d.month }}</span>
|
||||
<i class="iconfont iconyoujiantou" onclick="getPromotion(1)"></i>
|
||||
</div>
|
||||
<div class="body">
|
||||
<div class="list top-wrap">
|
||||
<div class="promotion"></div>
|
||||
<div class="days">
|
||||
{{# for (var i = 1; i < d.days + 1; i++) { }}
|
||||
<div>{{ i }}</div>
|
||||
{{# } }}
|
||||
</div>
|
||||
</div>
|
||||
{{# if (d.data.time_limit.length){ }}
|
||||
{{# d.data.time_limit.forEach(function(promotion){ }}
|
||||
<div class="group">
|
||||
{{# promotion.detail.forEach(function(item){ }}
|
||||
<div class="list">
|
||||
<div class="promotion">
|
||||
<span class="promotion-tag" style="{{ promotion.color ? 'background: ' + promotion.color : '' }}">{{ promotion.title }}</span>
|
||||
<span><a href="{{ ns.href(promotion.url) }}" target="_blank">{{ item.promotion_name }}</a></span>
|
||||
</div>
|
||||
<div class="days">
|
||||
{{# for (var i = 0; i < d.days; i++) { }}
|
||||
<div>
|
||||
{{# var curr_time = d.start_time + (i + 1) * 86400;}}
|
||||
{{# if (curr_time > item.start_time && (curr_time - 86399) <= item.end_time){ }}
|
||||
<div class="progress {{# if (item.start_time >= (curr_time - 86400) ){ }} start{{# } }}{{# if (item.end_time <= curr_time){ }} end{{# } }}" style="{{ promotion.color ? 'background: ' + promotion.color : '' }}"></div>
|
||||
{{# } }}
|
||||
</div>
|
||||
{{# } }}
|
||||
</div>
|
||||
</div>
|
||||
{{# }) }}
|
||||
</div>
|
||||
{{# }) }}
|
||||
{{# } else { }}
|
||||
<div class="empty">
|
||||
暂无相关活动数据，<a href="{:href_url('shop/promotion/market')}" class="text-color">去创建</a>
|
||||
</div>
|
||||
{{# } }}
|
||||
<div class="loading">
|
||||
<i class="common-loading-layer layui-icon layui-icon-loading layui-anim layui-anim-rotate layui-anim-loop"></i>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="custom-box">
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-inline">
|
||||
<label class="layui-form-label">选择时间：</label>
|
||||
|
||||
<div class="layui-inline layui-inline-margin" id="time_fission">
|
||||
<div class="layui-input-inline">
|
||||
<input type="text" id="date" name="date" autocomplete="off" class="layui-input" placeholder="请选择日期">
|
||||
<i class="iconfont iconriqi"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script>
|
||||
var form,laydate, laytpl, repeat = false;
|
||||
layui.use(['laydate','laytpl', 'form'], function(){
|
||||
laydate = layui.laydate;
|
||||
laytpl = layui.laytpl;
|
||||
form = layui.form;
|
||||
form.render()
|
||||
getPromotionStat(0)
|
||||
getPromotion(0)
|
||||
form.on('switch(promotion)', function (data) {
|
||||
$.ajax({
|
||||
dataType: "JSON",
|
||||
type: "POST",
|
||||
data: {
|
||||
is_use: $(data.elem).is(':checked') ? 1 : 0,
|
||||
config_key: $(data.elem).attr('data-keyword')
|
||||
},
|
||||
url: ns.url("shop/config/modifyconfigisuse"),
|
||||
success: function(res){
|
||||
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
var length = 0;
|
||||
function getPromotion(value) {
|
||||
$('.loading').show();
|
||||
length += value;
|
||||
$.ajax({
|
||||
dataType: "JSON",
|
||||
type: "POST",
|
||||
data: {
|
||||
length: length
|
||||
},
|
||||
url: ns.url("shop/promotion/getPromotion"),
|
||||
success: function(res){
|
||||
$('.loading').hide();
|
||||
if (res.code == 0) {
|
||||
if($('#promotionData').length) {
|
||||
laytpl($('#promotionData').html()).render(res.data, function (string) {
|
||||
$('.promotion-calendar').html(string);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function getPromotionStat(value){
|
||||
$.ajax({
|
||||
dataType: "JSON",
|
||||
type: "POST",
|
||||
data: {
|
||||
length: value
|
||||
},
|
||||
url: ns.url("shop/promotion/getPromotionStat"),
|
||||
success: function(res){
|
||||
if (res.code == 0) {
|
||||
if($('#promotionStat').length) {
|
||||
laytpl($('#promotionStat').html()).render(res.data, function (string) {
|
||||
$('.layui-card-body').html(string);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
257
app/shop/view/promotion/market.html
Executable file
257
app/shop/view/promotion/market.html
Executable file
@@ -0,0 +1,257 @@
|
||||
<style>
|
||||
.card-common:first-child{margin-top: 0;}
|
||||
.item-block-parent .item-poa-pic{background-image: linear-gradient(to right, var(--base-color), var(--base-color));text-align: center;color: #FFFFFF;width: 70px;height: 28px;line-height: 28px;border-bottom-left-radius: 3px;}
|
||||
.layui-card-body{padding: 0 !important;}
|
||||
.item-block .item-hide{position: absolute;top: 0;right: -1px}
|
||||
.layui-card-header .layui-form .layui-input-inline {display: flex}
|
||||
.empty-promotion {text-align: center;padding: 100px 0;flex: 1}
|
||||
.item-block-parent .item-block {background: #fff;border: 1px solid #eee;border-radius: 2px;}
|
||||
.item-block-parent .item-block:hover {background: #fff}
|
||||
.common-addon {position: absolute;right: 10px;top: 10px;font-size: 16px;cursor: pointer;display: none;font-weight: bold;}
|
||||
.item-block-parent .item-block:hover .common-addon {display: block;}
|
||||
</style>
|
||||
|
||||
<div class="layui-card card-common card-brief" id="promotion">
|
||||
<div class="layui-card-header ">
|
||||
<span class="card-title">商品营销</span>
|
||||
|
||||
<div class="layui-form">
|
||||
<div class="layui-input-inline">
|
||||
<input type="text" id="search_text" name="search_text" placeholder="请输入活动名称" autocomplete="off" class="layui-input">
|
||||
<button type="button" class="layui-btn layui-btn-primary" lay-filter="search" lay-submit="">
|
||||
<i class="layui-icon"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="layui-card-body">
|
||||
<div class="item-block-parent item-five goods-promotion">
|
||||
{foreach $promotion as $list_k => $list_v}
|
||||
|
||||
{if condition="$list_v['show_type'] eq 'shop'"}
|
||||
{empty name="$list_v['is_developing']"}
|
||||
<a class="item-block item-block-hover-a" href="javascript:;" onclick="location.hash = ns.hash('{$list_v[\'url\']}')">
|
||||
<div class="item-block-wrap">
|
||||
<div class="item-pic">
|
||||
<img src="{:img($list_v.icon)}" />
|
||||
</div>
|
||||
<div class="item-con">
|
||||
<div class="item-content-title">{$list_v.title}</div>
|
||||
<p class="item-content-desc line-hiding" title="{$list_v.description}">{$list_v.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
{if in_array($list_v.name, $common_addon)}
|
||||
<span class="iconfont iconshixian common-addon" data-addon="{$list_v.name}" title="取消快捷方式"></span>
|
||||
{else/}
|
||||
<span class="iconfont iconadd_light common-addon" data-addon="{$list_v.name}" title="添加快捷方式"></span>
|
||||
{/if}
|
||||
</a>
|
||||
{else/}
|
||||
<a class="item-block item-block-hover-a" href="javascript:;">
|
||||
<div class="item-block-wrap">
|
||||
<div class="item-pic">
|
||||
<img src="{:img($list_v.icon)}" />
|
||||
</div>
|
||||
<div class="item-con">
|
||||
<div class="item-content-title">{$list_v.title}</div>
|
||||
<p class="item-content-desc line-hiding" title="{$list_v.description}">{$list_v.description}</p>
|
||||
</div>
|
||||
<div class="item-poa-pic">
|
||||
敬请期待
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
{/empty}
|
||||
{/if}
|
||||
{/foreach}
|
||||
{if condition="$user_info['is_admin'] eq '1'"}
|
||||
{foreach $shop_addon as $shop_addon_k => $shop_addon_v}
|
||||
<div class="item-block item-block-hover">
|
||||
<div class="item-block-wrap">
|
||||
<div class="item-pic">
|
||||
<img src="{$shop_addon_v.logo_img}" />
|
||||
</div>
|
||||
<div class="item-con">
|
||||
<div class="item-content-title">{$shop_addon_v.goods_name}</div>
|
||||
<p class="item-content-desc line-hiding" title="{$shop_addon_v.package_name}">{$shop_addon_v.package_name}</p>
|
||||
</div>
|
||||
<img class="item-hide" src="SHOP_IMG/recommend.png" alt="">
|
||||
</div>
|
||||
<div class="item-float-wrap">
|
||||
<div class="item-float">
|
||||
<div class="item-float-con"></div>
|
||||
<div class="item-float-con">
|
||||
<a onclick="alertAddon()" target="_blank">立即升级</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/foreach}
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="layui-card-header ">
|
||||
<span class="card-title">会员互动</span>
|
||||
</div>
|
||||
|
||||
<div class="layui-card-body">
|
||||
<div class="item-block-parent item-five member-promotion">
|
||||
{foreach $promotion as $list_k => $list_v}
|
||||
{if condition="$list_v['show_type'] eq 'member'"}
|
||||
{empty name="$list_v['is_developing']"}
|
||||
<a class="item-block item-block-hover-a" href="javascript:;" onclick="location.hash = ns.hash('{$list_v[\'url\']}')">
|
||||
<div class="item-block-wrap">
|
||||
<div class="item-pic">
|
||||
<img src="{:img($list_v.icon)}" />
|
||||
</div>
|
||||
<div class="item-con">
|
||||
<div class="item-content-title">{$list_v.title}</div>
|
||||
<p class="item-content-desc line-hiding" title="{$list_v.description}">{$list_v.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
{if in_array($list_v.name, $common_addon)}
|
||||
<span class="iconfont iconshixian common-addon" data-addon="{$list_v.name}" title="取消快捷方式"></span>
|
||||
{else/}
|
||||
<span class="iconfont iconadd_light common-addon" data-addon="{$list_v.name}" title="添加快捷方式"></span>
|
||||
{/if}
|
||||
</a>
|
||||
{else/}
|
||||
<a class="item-block item-block-hover-a" href="javascript:;">
|
||||
<div class="item-block-wrap">
|
||||
<div class="item-pic">
|
||||
<img src="{:img($list_v.icon)}" />
|
||||
</div>
|
||||
<div class="item-con">
|
||||
<div class="item-content-title">{$list_v.title}</div>
|
||||
<p class="item-content-desc line-hiding" title="{$list_v.description}">{$list_v.description}</p>
|
||||
</div>
|
||||
<div class="item-poa-pic">敬请期待</div>
|
||||
</div>
|
||||
</a>
|
||||
{/empty}
|
||||
{/if}
|
||||
{/foreach}
|
||||
{if condition="$user_info['is_admin'] eq '1'"}
|
||||
{foreach $member_addon as $member_addon_k => $member_addon_v}
|
||||
<div class="item-block item-block-hover">
|
||||
<div class="item-block-wrap">
|
||||
<div class="item-pic">
|
||||
<img src="{$member_addon_v.logo_img}" />
|
||||
</div>
|
||||
<div class="item-con">
|
||||
<div class="item-content-title">{$member_addon_v.goods_name}</div>
|
||||
<p class="item-content-desc line-hiding" title="{$member_addon_v.package_name}">{$member_addon_v.introduction}</p>
|
||||
</div>
|
||||
<img class="item-hide" src="SHOP_IMG/recommend.png" alt="">
|
||||
</div>
|
||||
<div class="item-float-wrap">
|
||||
<div class="item-float">
|
||||
<div class="item-float-con"></div>
|
||||
<div class="item-float-con now_btn" >
|
||||
<a onclick="alertAddon()" target="_blank">立即升级</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/foreach}
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/html" id="promotionData">
|
||||
{{# if (d.length){ }}
|
||||
{{# d.forEach(function(item){ }}
|
||||
<a class="item-block item-block-hover-a" href="{{ ns.href(item.url) }}">
|
||||
<div class="item-block-wrap">
|
||||
<div class="item-pic">
|
||||
<img src="{{ ns.img(item.icon) }}" />
|
||||
</div>
|
||||
<div class="item-con">
|
||||
<div class="item-content-title">{{ item.title }}</div>
|
||||
<p class="item-content-desc line-hiding" title="{{ item.description }}">{{ item.description }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
{{# }) }}
|
||||
{{# } else { }}
|
||||
<p class="empty-promotion">未搜索到任何活动</p>
|
||||
{{# } }}
|
||||
</script>
|
||||
|
||||
<script>
|
||||
var promotion_items = $("#promotion a").length,
|
||||
extend_items = $("#extend a").length,
|
||||
interaction_items = $("#interaction a").length,
|
||||
tool_items = $("#tool a").length,
|
||||
goodsPromotionHtml = $('.goods-promotion').html(),
|
||||
memberPromotionHtml = $('.member-promotion').html(),
|
||||
promotion = {:json_encode($promotion)};
|
||||
|
||||
if (promotion_items == 0) {
|
||||
$("#promotion").hide();
|
||||
}
|
||||
if (extend_items == 0) {
|
||||
$("#extend").hide();
|
||||
}
|
||||
if (interaction_items == 0) {
|
||||
$("#interaction").hide();
|
||||
}
|
||||
if (tool_items == 0) {
|
||||
$("#tool").hide();
|
||||
}
|
||||
|
||||
function alertAddon() {
|
||||
layer.msg('该插件为付费插件，请联系客服购买！');
|
||||
}
|
||||
|
||||
layui.use(['laydate','laytpl'], function(){
|
||||
var laytpl = layui.laytpl;
|
||||
|
||||
$('#search_text').on("input", function(e){
|
||||
var value = $(this).val().trim(), goods = [], member = [];
|
||||
|
||||
if (value.length) {
|
||||
if (!/[^\u4E00-\u9FA5]/.test(value)) {
|
||||
promotion.forEach(function (item) {
|
||||
if (item.title.indexOf(value) != -1) {
|
||||
if (item.show_type == 'shop') goods.push(item);
|
||||
if (item.show_type == 'member') goods.push(item);
|
||||
}
|
||||
})
|
||||
laytpl($('#promotionData').html()).render(goods, function(string){
|
||||
$('.goods-promotion').html(string)
|
||||
});
|
||||
laytpl($('#promotionData').html()).render(member, function(string){
|
||||
$('.member-promotion').html(string)
|
||||
});
|
||||
}
|
||||
} else {
|
||||
$('.goods-promotion').html(goodsPromotionHtml)
|
||||
$('.member-promotion').html(memberPromotionHtml)
|
||||
}
|
||||
});
|
||||
})
|
||||
|
||||
$('.common-addon').click(function (event) {
|
||||
event.stopPropagation();
|
||||
|
||||
$.ajax({
|
||||
dataType: 'JSON',
|
||||
type: 'POST',
|
||||
data: {
|
||||
addon: $(this).attr('data-addon'),
|
||||
type: 'promotion'
|
||||
},
|
||||
url: ns.url("shop/promotion/commonAddonSetting"),
|
||||
success: function(res) {
|
||||
if (res.code == 0) {
|
||||
layer.msg(res.message)
|
||||
listenerHash(); // 刷新页面
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
</script>
|
||||
87
app/shop/view/promotion/member.html
Executable file
87
app/shop/view/promotion/member.html
Executable file
@@ -0,0 +1,87 @@
|
||||
<style>
|
||||
.item-block-parent .item-poa-pic {
|
||||
background-image: linear-gradient(to right, var(--base-color), var(--base-color));
|
||||
text-align: center;
|
||||
color: #FFFFFF;
|
||||
width: 70px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
border-bottom-left-radius: 3px;
|
||||
}
|
||||
.item-block .item-hide{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: -1px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="layui-card card-common card-brief" id="promotion">
|
||||
<div class="layui-card-header ">
|
||||
<span class="card-title">会员互动</span>
|
||||
</div>
|
||||
|
||||
<div class="layui-card-body">
|
||||
<div class="item-block-parent item-five">
|
||||
{foreach $promotion as $list_k => $list_v}
|
||||
{if condition="$list_v['show_type'] eq 'member'"}
|
||||
{empty name="$list_v['is_developing']"}
|
||||
<a class="item-block item-block-hover-a" href="{:href_url($list_v['url'])}">
|
||||
<div class="item-block-wrap">
|
||||
<div class="item-pic">
|
||||
<img src="{:img($list_v.icon)}" />
|
||||
</div>
|
||||
<div class="item-con">
|
||||
<div class="item-content-title">{$list_v.title}</div>
|
||||
<p class="item-content-desc line-hiding" title="{$list_v.description}">{$list_v.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
{else/}
|
||||
<a class="item-block item-block-hover-a" href="javascript:;">
|
||||
<div class="item-block-wrap">
|
||||
<div class="item-pic">
|
||||
<img src="{:img($list_v.icon)}" />
|
||||
</div>
|
||||
<div class="item-con">
|
||||
<div class="item-content-title">{$list_v.title}</div>
|
||||
<p class="item-content-desc line-hiding" title="{$list_v.description}">{$list_v.description}</p>
|
||||
</div>
|
||||
<div class="item-poa-pic">敬请期待</div>
|
||||
</div>
|
||||
</a>
|
||||
{/empty}
|
||||
{/if}
|
||||
{/foreach}
|
||||
{if condition="$user_info['is_admin'] eq '1'"}
|
||||
{foreach $tool_addon as $tool_addon_k => $tool_addon_v}
|
||||
<div class="item-block item-block-hover">
|
||||
<div class="item-block-wrap">
|
||||
<div class="item-pic">
|
||||
<img src="{$tool_addon_v.logo_img}" />
|
||||
</div>
|
||||
<div class="item-con">
|
||||
<div class="item-content-title">{$tool_addon_v.goods_name}</div>
|
||||
<p class="item-content-desc line-hiding" title="{$tool_addon_v.package_name}">{$tool_addon_v.introduction}</p>
|
||||
</div>
|
||||
<img class="item-hide" src="SHOP_IMG/recommend.png" alt="">
|
||||
</div>
|
||||
<div class="item-float-wrap ">
|
||||
<div class="item-float">
|
||||
<div class="item-float-con"></div>
|
||||
<div class="item-float-con now_btn" >
|
||||
<a onclick="alertAddon()" target="_blank">立即升级</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/foreach}
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function alertAddon() {
|
||||
layer.msg('该插件为付费插件，请联系客服购买！');
|
||||
}
|
||||
</script>
|
||||
110
app/shop/view/promotion/tool.html
Executable file
110
app/shop/view/promotion/tool.html
Executable file
@@ -0,0 +1,110 @@
|
||||
<style>
|
||||
.item-block-parent .item-poa-pic {background-image:linear-gradient(to right,var(--base-color),var(--base-color));text-align:center;color:#FFFFFF;width:70px;height:30px;line-height:30px;border-bottom-left-radius:3px;}
|
||||
.item-block .item-hide {position:absolute;top:0;right:-1px;}
|
||||
.item-block-parent .item-block {background: #fff;border: 1px solid #eee;border-radius: 2px;}
|
||||
.item-block-parent .item-block:hover {background: #fff}
|
||||
.common-addon {position: absolute;right: 10px;top: 10px;font-size: 12px;cursor: pointer;display: none}
|
||||
.item-block-parent .item-block:hover .common-addon {display: block;}
|
||||
</style>
|
||||
|
||||
<div class="layui-card card-common card-brief" id="promotion">
|
||||
<div class="layui-card-header ">
|
||||
<span class="card-title">应用工具</span>
|
||||
</div>
|
||||
|
||||
<div class="layui-card-body">
|
||||
<div class="item-block-parent item-five">
|
||||
{foreach $promotion as $list_k => $list_v}
|
||||
{if condition="$list_v['show_type'] eq 'tool'"}
|
||||
{empty name="$list_v['is_developing']"}
|
||||
<a class="item-block item-block-hover-a" href="javascript:;" onclick="location.hash = ns.hash('{$list_v[\'url\']}')">
|
||||
<div class="item-block-wrap">
|
||||
<div class="item-pic">
|
||||
<img src="{:img($list_v.icon)}" />
|
||||
</div>
|
||||
<div class="item-con">
|
||||
<div class="item-content-title">{$list_v.title}</div>
|
||||
<p class="item-content-desc line-hiding" title="{$list_v.description}">{$list_v.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
{if in_array($list_v.name, $common_addon)}
|
||||
<span class="iconfont iconshixian common-addon" data-addon="{$list_v.name}" title="取消快捷方式"></span>
|
||||
{else/}
|
||||
<span class="iconfont iconadd_light common-addon" data-addon="{$list_v.name}" title="添加快捷方式"></span>
|
||||
{/if}
|
||||
</a>
|
||||
{else/}
|
||||
<a class="item-block item-block-hover-a" href="javascript:;">
|
||||
<div class="item-block-wrap">
|
||||
<div class="item-pic">
|
||||
<img src="{:img($list_v.icon)}" />
|
||||
</div>
|
||||
<div class="item-con">
|
||||
<div class="item-content-title">{$list_v.title}</div>
|
||||
<p class="item-content-desc line-hiding" title="{$list_v.description}">{$list_v.description}</p>
|
||||
</div>
|
||||
<div class="item-poa-pic">敬请期待</div>
|
||||
</div>
|
||||
</a>
|
||||
{/empty}
|
||||
{/if}
|
||||
{/foreach}
|
||||
{if condition="$user_info['is_admin'] eq '1'"}
|
||||
{foreach $tool_addon as $tool_addon_k => $tool_addon_v}
|
||||
|
||||
<div class="item-block item-block-hover">
|
||||
<div class="item-block-wrap">
|
||||
<div class="item-pic">
|
||||
<img src="{$tool_addon_v.logo_img}" />
|
||||
</div>
|
||||
<div class="item-con">
|
||||
<div class="item-content-title">{$tool_addon_v.goods_name}</div>
|
||||
<p class="item-content-desc line-hiding" title="{$tool_addon_v.package_name}">{$tool_addon_v.introduction}</p>
|
||||
</div>
|
||||
<img class="item-hide" src="SHOP_IMG/recommend.png" alt="">
|
||||
</div>
|
||||
<div class="item-float-wrap ">
|
||||
<div class="item-float">
|
||||
<div class="item-float-con"></div>
|
||||
<div class="item-float-con now_btn" >
|
||||
<a onclick="alertAddon()" target="_blank">立即升级</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/foreach}
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script >
|
||||
$('.now_btn').click(function() {
|
||||
layer.confirm('当前插件可在官网订购', {
|
||||
title: "插件提示",
|
||||
btn: ['去订购', '取消'] //按钮
|
||||
}, function () {
|
||||
window.location.href = 'https://www.niushop.com/web/addon/lists.html?product_key=B2C_V4'
|
||||
});
|
||||
})
|
||||
|
||||
$('.common-addon').click(function (event) {
|
||||
event.stopPropagation();
|
||||
|
||||
$.ajax({
|
||||
dataType: 'JSON',
|
||||
type: 'POST',
|
||||
data: {
|
||||
addon: $(this).attr('data-addon'),
|
||||
type: 'tool'
|
||||
},
|
||||
url: ns.url("shop/promotion/commonAddonSetting"),
|
||||
success: function(res) {
|
||||
if (res.code == 0) {
|
||||
layer.msg(res.message)
|
||||
listenerHash(); // 刷新页面
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
</script>
|
||||
163
app/shop/view/promotion/zone_config.html
Executable file
163
app/shop/view/promotion/zone_config.html
Executable file
@@ -0,0 +1,163 @@
|
||||
<link rel="stylesheet" href="STATIC_EXT/colorPicker/css/colorpicker.css"/>
|
||||
<link rel="stylesheet" href="SHOP_CSS/goods_detail_config.css"/>
|
||||
<style>
|
||||
.layui-layout-admin .layui-body .body-content{padding: 15px;margin: 15px;}
|
||||
.table-tab{margin-bottom: 20px; margin-top: 0;}
|
||||
#diyView{background: #fff;padding: 0;}
|
||||
.edit-attribute{padding: 0;border-top: none;}
|
||||
.edit-attribute .attr-wrap .attr-title{line-height: 40px;padding: 0 0 1px 10px;border-bottom: 1px solid #f1f1f1;}
|
||||
.preview-wrap{margin-right: 358px;}
|
||||
</style>
|
||||
|
||||
{notempty name="$promotion_zone_list"}
|
||||
<div id="diyView" class="layui-form">
|
||||
|
||||
<div class="layui-tab table-tab" lay-filter="promotion_tab">
|
||||
<ul class="layui-tab-title">
|
||||
{foreach name="$promotion_zone_list" key="k" item="vo"}
|
||||
<li {if $k==0}class="layui-this"{/if} lay-id="{$vo['name']}" data-preview="{$vo['preview']}" data-url="{$vo['url']}" data-bg-color="{$vo['value']['bg_color']}">{$vo['title']}</li>
|
||||
{/foreach}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="preview-wrap">
|
||||
|
||||
<div class='diy-view-wrap'>
|
||||
|
||||
<div class="preview-head">
|
||||
<span>专区</span>
|
||||
</div>
|
||||
|
||||
<div class="preview-block">
|
||||
<div class="preview-draggable">
|
||||
<img />
|
||||
</div>
|
||||
<div class="edit-attribute">
|
||||
<div class="attr-wrap">
|
||||
<div class="attr-title">
|
||||
<span class="title">专区</span>
|
||||
</div>
|
||||
<div class="edit-content-wrap">
|
||||
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label sm">广告图</label>
|
||||
<div class="layui-input-block">
|
||||
<a href="" target="_blank" class="text-color js-adv">管理广告</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="layui-form-item flex">
|
||||
<label class="layui-form-label sm">背景色</label>
|
||||
<div class="curr-color">
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="layui-input-block flex_fill">
|
||||
<div id="bgColor" class="picker colorSelector">
|
||||
<div></div>
|
||||
</div>
|
||||
<input type="hidden" name="bg_color">
|
||||
<span class="color-selector-reset text-color">重置</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="custom-save">
|
||||
<input type="hidden" name="name" value="" />
|
||||
<input type="hidden" name="title" value="" />
|
||||
<input type="hidden" name="bg_color" {notempty name='$config'}value="{$config['bg_color']}"{/notempty} />
|
||||
<button class="layui-btn" lay-submit lay-filter="save">保存</button>
|
||||
</div>
|
||||
</div>
|
||||
{else/}
|
||||
<div class="empty">暂无活动专区</div>
|
||||
{/notempty}
|
||||
|
||||
<script src="STATIC_EXT/colorPicker/js/colorpicker.js"></script>
|
||||
<script>
|
||||
var promotion_config_list = JSON.parse('{:json_encode($promotion_config_list)}');
|
||||
layui.use(['form', 'laydate', 'laytpl','element'], function () {
|
||||
var form = layui.form;
|
||||
var repeat_flag = false; //防重复标识
|
||||
var element = layui.element;
|
||||
form.render();
|
||||
|
||||
var size = 256; // 公式：二级面包屑layui-header-crumbs-second （55px）+ body-content（60px）+ .layui-tab table-tab（77px）+ .custom-save（64px）
|
||||
var commonHeight = $(window).height() - size;
|
||||
$('.preview-wrap').css("height", commonHeight + "px");
|
||||
$(".edit-attribute .attr-wrap").css("height", commonHeight + 64 + "px");
|
||||
$(".preview-block").css("min-height", (commonHeight - 84) + "px"); // 公式：高度 - 自定义模板区域下外编辑（20px）- 自定义模板头部（64px）
|
||||
setTimeout(function () {
|
||||
$('#diyView').css('visibility', 'visible');
|
||||
}, 50);
|
||||
|
||||
// Tab 切换，以改变地址 hash 值
|
||||
element.on('tab(promotion_tab)', function () {
|
||||
var name = $(this).attr('lay-id');
|
||||
var title = $(this).text();
|
||||
var preview = $(this).attr('data-preview');
|
||||
var url = $(this).attr('data-url');
|
||||
|
||||
$('.preview-wrap .diy-view-wrap .preview-head span').text(title + '专区');
|
||||
$('.edit-attribute .attr-wrap .attr-title .title').text(title + '专区');
|
||||
$('.preview-draggable img').attr('src', ns.img(preview));
|
||||
$('.js-adv').attr('href', ns.href(url));
|
||||
|
||||
$('input[name="name"]').val(name);
|
||||
$('input[name="bg_color"]').val(promotion_config_list[name].bg_color);
|
||||
$('input[name="title"]').val(title);
|
||||
|
||||
reset('#bgColor', promotion_config_list[name].bg_color);
|
||||
});
|
||||
|
||||
$('.table-tab .layui-tab-title li:eq(0)').click();
|
||||
|
||||
Colorpicker.create({
|
||||
el: 'bgColor',
|
||||
color: "{notempty name='$config'}{$config['bg_color']}{/notempty}",
|
||||
change: function (elem, hex) {
|
||||
$(elem).find("div").css('background', hex);
|
||||
$(elem).parent().parent().find('.curr-color span').text(hex);
|
||||
$('.preview-draggable').css('background',hex);
|
||||
$('input[name="bg_color"]').val(hex);
|
||||
}
|
||||
});
|
||||
|
||||
// 重置活动背景色
|
||||
$('.color-selector-reset').click(function () {
|
||||
var li = $('.table-tab .layui-tab-title li.layui-this');
|
||||
reset('#bgColor', li.attr('data-bg-color'));
|
||||
});
|
||||
|
||||
form.on('submit(save)', function (data) {
|
||||
if (repeat_flag) return;
|
||||
repeat_flag = true;
|
||||
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: ns.url("shop/promotion/zoneConfig"),
|
||||
data: data.field,
|
||||
dataType: 'JSON',
|
||||
success: function (res) {
|
||||
repeat_flag = false;
|
||||
layer.msg(res.message);
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
function reset(elem,color) {
|
||||
$(elem).children('div').css('background', color);
|
||||
$(elem).parent().parent().find('.curr-color span').text(color);
|
||||
$('input[name="bg_color"]').val(color);
|
||||
$('.preview-draggable').css('background',color);
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user