jh-admin/app/shop/view/adv/edit_adv.html

266 lines
7.7 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{extend name="base"/}
{block name="resources"}
<style>
.adv-url-show{margin-right: 10px;}
.form-wrap {margin-top: 0;}
.layui-colorpicker-main-input div.layui-inline{margin-right: 0;}
.layui-colorpicker-main-input input.layui-input{width: 130px;height: 34px;}
</style>
{/block}
{block name="main"}
<div class="layui-form form-wrap">
<div class="layui-form-item">
<label class="layui-form-label"><span class="required">*</span>广告名称:</label>
<div class="layui-input-block">
<input name="adv_title" type="text" value="{$adv_info.adv_title}" lay-verify="required" class="layui-input len-long">
</div>
</div>
{notempty name="$adv_position_list"}
<div class="layui-form-item">
<label class="layui-form-label">所属广告位:</label>
<div class="layui-input-block len-mid">
<select name="ap_id" lay-filter="ap_id">
{foreach $adv_position_list as $adv_position_k => $adv_position_v}
<option value="{$adv_position_v.ap_id}" data-type="{$adv_position_v.type}" data-width="{$adv_position_v.ap_width}" data-height="{$adv_position_v.ap_height}" {if condition="$adv_position_v.ap_id == $adv_info.ap_id"}selected{/if} >{$adv_position_v.ap_name}</option>
{/foreach}
</select>
</div>
</div>
<div class="layui-form-item" data-type="2" {if $type == 1}style="display: none"{/if}>
<label class="layui-form-label">移动端广告链接:</label>
<div class="layui-input-block len-mid">
<span class="adv-url-show"></span>
<button class="layui-btn layui-btn-primary sm" onclick="selectedLink()">选择链接</button>
</div>
</div>
<input name="adv_url" type="hidden" value="{$adv_info.adv_url}" />
{/notempty}
<div class="layui-form-item">
<label class="layui-form-label">广告图片:</label>
<div class="layui-input-block">
<div class="upload-img-block img-upload">
<div class="upload-img-box {notempty name="$adv_info['adv_image']"}hover{/notempty}">
<div class="upload-default" id="adv_image">
{if condition="$adv_info.adv_image"}
<div id="preview_adv_image" class="preview_img">
<img layer-src src="{:img($adv_info.adv_image)}" class="img_prev"/>
</div>
{else/}
<div class="upload">
<i class="iconfont iconshangchuan"></i>
<p>点击上传</p>
</div>
{/if}
</div>
<div class="operation">
<div>
<i title="图片预览" class="iconfont iconreview js-preview" style="margin-right: 20px;"></i>
<i title="删除图片" class="layui-icon layui-icon-delete js-delete"></i>
</div>
<div class="replace_img js-replace">点击替换</div>
</div>
<input type="hidden" name="adv_image" value="{$adv_info.adv_image}">
</div>
<!-- <div class="upload-img-box icon">
{if condition="$adv_info.adv_image"}
<img layer-src src="{:img($adv_info.adv_image)}" />
{else/}
<div class="upload-default">
<i class="iconfont iconshangchuan"></i>
<p>点击上传</p>
</div>
{/if}
</div>
<p id="adv_image" class=" {if condition="$adv_info.adv_image"} replace {else/} no-replace{/if}">替换</p>
<input type="hidden" name="adv_image" value="{$adv_info.adv_image}">
<i class="del {if condition="$adv_info.adv_image"}show{/if}">x</i> -->
</div>
</div>
<div class="word-aux">建议宽度<span class="pic_width">750</span>px 建议高度<span class="pic_height">350</span>px</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">排序:</label>
<div class="layui-input-block">
<input name="slide_sort" value="{$adv_info.slide_sort}" type="number" placeholder="排序" lay-verify="num" class="layui-input len-short">
</div>
<div class="word-aux">排序值必须为整数</div>
</div>
<div class="layui-form-item" style="display: none">
<label class="layui-form-label">广告价格:</label>
<div class="layui-input-block">
<input name="price" value="{$adv_info.price}" type="number" placeholder="广告价格" lay-verify="flo" class="layui-input len-short">
</div>
<div class="word-aux">单位:元 &nbsp;&nbsp; 价格不能小于0可以保留两位小数</div>
</div>
<!--<div class="layui-form-item">
<label class="layui-form-label">背景色:</label>
<div class="layui-input-inline">
<div id="bg_color"></div>
</div>
</div>-->
<div class="form-row">
<button class="layui-btn" lay-submit lay-filter="save">保存</button>
<button class="layui-btn layui-btn-primary" onclick="back()">返回</button>
<a id="advImageId"></a>
</div>
<input type="hidden" name="background" id="background" value="{$adv_info.background}" />
<input type="hidden" name="adv_id" value="{$adv_info.adv_id}" />
</div>
{/block}
{block name="script"}
<script>
var color = $("#background").val();
var adv_url_json = $("input[name='adv_url']").val();
var saveData = null;
var totalUploadNum = 0;
var completeUploadNum = 0;
var ap_id = '{$ap_id}';
var logo_upload;
if(adv_url_json) adv_url_json = JSON.parse(adv_url_json);
$(".adv-url-show").text(adv_url_json.title);
layui.use(['form', 'colorpicker'], function () {
var form = layui.form,
colorpicker = layui.colorpicker,
repeat_flag = false; //防重复标识
form.render();
form.on('select(ap_id)', function(data){
var type = $(data.elem).find("option:selected").attr("data-type");
$("[data-type]").hide();
$("[data-type='"+ type+"']").show();
});
/**
* 颜色
*/
colorpicker.render({
elem: '#bg_color', //绑定元素
color: color,
done: function(color) {
$(".tdrag-name").css("color", color);
$("#background").val(color);
}
});
// 广告图片
logo_upload = new Upload({
elem: '#adv_image',
auto:false,
bindAction:'#advImageId',
callback: function(res) {
uploadComplete('adv_image', res.data.pic_path);
}
});
function uploadComplete(field, pic_path) {
saveData.field[field] = pic_path;
completeUploadNum += 1;
if(completeUploadNum == totalUploadNum){
saveFunc();
}
}
function saveFunc(){
var data = saveData;
$.ajax({
url: ns.url("shop/adv/editAdv"),
data: data.field,
dataType: 'JSON',
type: 'POST',
success: function(res) {
repeat_flag = false;
if (res.code == 0) {
layer.confirm('编辑成功', {
title:'操作提示',
btn: ['返回列表', '继续操作'],
yes: function() {
location.href = ns.url("shop/adv/lists", {ap_id:ap_id})
},
btn2: function() {
location.reload();
}
});
} else {
layer.msg(res.message);
}
}
});
}
/**
* 监听提交
*/
form.on('submit(save)', function(data) {
if (repeat_flag) return;
repeat_flag = true;
saveData = data;
var obj = $("img.img_prev[data-prev='1']");
totalUploadNum = obj.length;
if(totalUploadNum > 0){
obj.each(function(){
var actionId = $(this).attr('data-action-id');
$(actionId).click();
})
}else{
saveFunc();
}
});
/**
* 表单验证
*/
form.verify({
num: function (value) {
if (value == '') {
return;
}
if (value%1 != 0) {
return '排序数值必须为整数';
}
if (value < 0) {
return '排序数值必须为大于0';
}
},
flo: function (value) {
if (value == '') {
return;
}
var reg = /^(0|[1-9]\d*)(\s|$|\.\d{1,2}\b)/;
if (!reg.test(value)) {
return '价格不能小于0可保留两位小数'
}
}
});
});
function back() {
location.href = ns.url("shop/adv/lists", {ap_id:ap_id})
}
function selectedLink() {
if (adv_url_json == "") {
adv_url_json = {};
}
ns.select_link(adv_url_json, function (data) {
for (var o in data) {
if (data[o] == null) delete data[o];
}
$("input[name='adv_url']").val(JSON.stringify(data));
$(".adv-url-show").text(data.title);
});
}
</script>
{/block}