490 lines
15 KiB
HTML
490 lines
15 KiB
HTML
{extend name="app/shop/view/base.html"/}
|
||
{block name="resources"}
|
||
<style>
|
||
.goods_num {padding-left: 20px;}
|
||
</style>
|
||
{/block}
|
||
{block name="main"}
|
||
<div class="layui-form">
|
||
<div class="layui-card card-common">
|
||
<div class="layui-card-body">
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="required">*</span>盲盒名称：</label>
|
||
<div class="layui-input-block">
|
||
<input type="text" name="blindbox_name" lay-verify="required" autocomplete="off" class="layui-input len-long" value="{$blindbox_info.category_name}" maxlength="40">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="required">*</span>活动开始时间：</label>
|
||
<div class="layui-input-block len-mid">
|
||
<input type="text" class="layui-input" name="start_time" lay-verify="required" id="start_time" autocomplete="off" readonly value="{:date('Y-m-d H:i:s',$blindbox_info.start_time)}" {if $blindbox_info.blindbox_status == 1}disabled {/if}>
|
||
<i class="iconrili iconfont calendar"></i>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="required">*</span>活动结束时间：</label>
|
||
<div class="layui-input-block len-mid end_time">
|
||
<input type="text" class="layui-input" name="end_time" lay-verify="required|time" id="end_time" autocomplete="off" readonly value="{:date('Y-m-d H:i:s',$blindbox_info.end_time)}">
|
||
<i class="iconrili iconfont calendar"></i>
|
||
</div>
|
||
<div class="word-aux">
|
||
<p>结束时间不能小于开始时间，也不能小于当前时间</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="required">*</span>盲盒分类：</label>
|
||
<div class="layui-input-inline len-mid">
|
||
<select class="category_id" name="category_id" lay-verify="required">
|
||
<option value="">请选择</option>
|
||
{foreach $category_data as $k=>$v}
|
||
<option value="{$k}" {if $blindbox_info['category_id']== $k }selected{/if}> {$v}</option>
|
||
{/foreach}
|
||
</select>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">排序：</label>
|
||
<div class="layui-input-block">
|
||
<input type="number" min="0" name="sort" lay-verify='sort' onchange="detectionNumType(this,'integral')" autocomplete="off" class="layui-input len-short" value="{$blindbox_info.sort}">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">预警库存：</label>
|
||
<div class="layui-input-block">
|
||
<input type="number" min="0" name="early_inventory" lay-verify='sort' onchange="detectionNumType(this,'integral')" autocomplete="off" class="layui-input len-short" value="{$blindbox_info.early_inventory}">
|
||
</div>
|
||
<div class="word-aux">
|
||
<p>商品少于预警库存数量，商品列表库存数量标红显示，0为不预警</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">盲盒封面：</label>
|
||
<div class="layui-input-block">
|
||
<div class="upload-img-block square">
|
||
<div class="upload-img-box {notempty name="$blindbox_info['blindbox_images']"}hover{/notempty}">
|
||
<div class="upload-default" id="blindbox_images" >
|
||
{if condition="$blindbox_info['blindbox_images']"}
|
||
<div class="preview_img" id="preview_blindbox_images">
|
||
<img src="{:img($blindbox_info['blindbox_images'])}" class="img_prev" data-id="blindbox_images" layer-src/>
|
||
</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"></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="blindbox_images" lay-verify="blindbox_images" value="{$blindbox_info['blindbox_images']}"/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="required">*</span>拆盒价格：</label>
|
||
<div class="layui-input-block">
|
||
<input type="text" min="0" name="price" onchange="detectionNumType(this,'positiveNumber')" lay-verify="required|price" class="layui-input len-short" autocomplete="off" placeholder="0.00" value="{$blindbox_info.price}">
|
||
</div>
|
||
<div class="word-aux">
|
||
<p>拆盒价格指第一次参与该盲盒外的正常支付价格，如果未设置新人价那么拆盒价格等于新人价</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">新人拆盒价：</label>
|
||
<div class="layui-input-block">
|
||
<input type="text" min="0" name="new_price" onchange="detectionNumType(this,'positiveNumber')" class="layui-input len-short" autocomplete="off" placeholder="0.00" value="{$blindbox_info.new_price}">
|
||
</div>
|
||
<div class="word-aux">
|
||
<p>没有参与该盲盒的首次价格</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="required">*</span>是否允许余额支付：</label>
|
||
<div class="layui-input-block">
|
||
<input type="radio" name="is_balance" value="1" title="是" {if $blindbox_info.is_balance==1} checked {/if}>
|
||
<input type="radio" name="is_balance" value="0" title="否" {if $blindbox_info.is_balance==0} checked {/if}>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="required">*</span>空盒是否显示：</label>
|
||
<div class="layui-input-block">
|
||
<input type="radio" name="is_emptybox" value="1" title="是" {if $blindbox_info.is_emptybox==1} checked {/if}>
|
||
<input type="radio" name="is_emptybox" value="2" title="否" {if $blindbox_info.is_emptybox==2} checked {/if}>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="required">*</span>商品：</label>
|
||
<div class="layui-input-block">
|
||
<table class="layui-table" id="goods" lay-skin="line" lay-size="lg">
|
||
<colgroup>
|
||
<col width="45%">
|
||
<col width="15%">
|
||
<col width="15%">
|
||
<col width="10%">
|
||
<col width="15%">
|
||
</colgroup>
|
||
<thead>
|
||
<tr>
|
||
<th>商品名称</th>
|
||
<th>价格</th>
|
||
<th>库存</th>
|
||
<th>数量</th>
|
||
<th class="operation">操作</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
{foreach name=$blindbox_info.goods_list as $k => $v}
|
||
<tr data-sku_id="{$v.sku_id}">
|
||
<td>
|
||
<div class="goods-title">
|
||
<div class="goods-img">
|
||
{if condition="$v.sku_image"}
|
||
<img layer-src src="{:img($v.sku_image)}" alt="">
|
||
{else/}
|
||
<img layer-src src="" alt="">
|
||
{/if}
|
||
</div>
|
||
<p class="multi-line-hiding goods-name">{$v.sku_name}</p>
|
||
</div>
|
||
</td>
|
||
<td class="price-one">{$v.price}</td>
|
||
<td>{$v.stock}</td>
|
||
<td><input type="number" name="goods_num" min="1" lay-verify="required|number" class="layui-input" value="{$v.num}"></td>
|
||
<td class="operation">
|
||
<div class="table-btn">
|
||
<a href="javascript:;" class="layui-btn" onclick="deleteGoods(this)">删除商品</a>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
{/foreach}
|
||
</tbody>
|
||
</table>
|
||
<button class="layui-btn" onclick="addGoods()">添加商品</button><span class="goods_num">已选商品（<span id="goods_num" class="text-color">{$blindbox_info.goods_list_count}</span>）</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item layui-form-text">
|
||
<label class="layui-form-label">活动规则说明：</label>
|
||
<div class="layui-input-inline">
|
||
<textarea name="remark" class="layui-textarea len-long" maxlength="150">{$blindbox_info.remark}</textarea>
|
||
</div>
|
||
</div>
|
||
<div class="word-aux">
|
||
<p>说明：盲盒不和其他优惠活动一起参与,比如：满减、积分抵扣、会员价、优惠券</p>
|
||
</div>
|
||
<input type="hidden" name="blindbox_id" value="{$blindbox_info.blindbox_id}">
|
||
<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="blindboxImagesId"></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{/block}
|
||
{block name="script"}
|
||
<script>
|
||
var form, laytpl, tableData = [],
|
||
repeat_flag = false,
|
||
awardId = 0,
|
||
selectGoodsSkuId = [],
|
||
num_list = [],
|
||
goods = [],
|
||
currentDate = new Date(),
|
||
minDate = "",
|
||
upload;
|
||
var saveData = null;
|
||
var totalUploadNum = 0;
|
||
var completeUploadNum = 0;
|
||
|
||
$("#goods").find("tbody tr").each(function (i) {
|
||
var id = $(this).attr("data-sku_id");
|
||
selectGoodsSkuId.push(id);
|
||
});
|
||
|
||
layui.use(['form', 'laytpl','laydate'], function () {
|
||
var laydate = layui.laydate;
|
||
form = layui.form;
|
||
laytpl = layui.laytpl;
|
||
|
||
currentDate.setDate(currentDate.getDate() + 30);
|
||
form.render();
|
||
|
||
var now_time = (new Date()).getTime();
|
||
var start_time = (new Date($("#start_time").val())).getTime();
|
||
var end_time = (new Date($("#end_time").val())).getTime();
|
||
|
||
if(start_time > now_time){
|
||
// 开始时间
|
||
laydate.render({
|
||
elem: '#start_time',//指定元素
|
||
type: 'datetime',
|
||
});
|
||
}
|
||
if( now_time < end_time){
|
||
//结束时间
|
||
laydate.render({
|
||
elem: '#end_time',//指定元素
|
||
type: 'datetime',
|
||
});
|
||
}
|
||
|
||
// 开始时间
|
||
laydate.render({
|
||
elem: '#start_time',//指定元素
|
||
type: 'datetime',
|
||
});
|
||
|
||
//结束时间
|
||
laydate.render({
|
||
elem: '#end_time',//指定元素
|
||
type: 'datetime',
|
||
});
|
||
|
||
//表单验证
|
||
form.verify({
|
||
number:function(value){
|
||
if( value <= 0 ){
|
||
return "数量不能小于或等于0"
|
||
}
|
||
},
|
||
sort:function(value){
|
||
if(value < 0 ){
|
||
return "排序不能小于0"
|
||
}
|
||
},
|
||
price:function(value){
|
||
if(value == 0){
|
||
return "价格不能为0"
|
||
}
|
||
},
|
||
time: function (value) {
|
||
var now_time = (new Date()).getTime();
|
||
var start_time = (new Date($("#start_time").val())).getTime();
|
||
var end_time = (new Date(value)).getTime();
|
||
if (now_time > end_time) {
|
||
return '结束时间不能小于当前时间!'
|
||
}
|
||
if (start_time > end_time) {
|
||
return '结束时间不能小于开始时间!';
|
||
}
|
||
},
|
||
time_day:function(value){
|
||
var time_type = $('[name="time_type"]:checked').val();
|
||
if(time_type == 3){
|
||
if (value <= 0)
|
||
{
|
||
return '有效期天数至少为一天!'
|
||
}
|
||
}
|
||
}
|
||
});
|
||
|
||
upload = new Upload({
|
||
elem: '#blindbox_images',
|
||
auto:false,
|
||
bindAction:'#blindboxImagesId',
|
||
callback: function(res) {
|
||
uploadComplete('blindbox_images', 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({
|
||
type: 'POST',
|
||
dataType: 'JSON',
|
||
url: ns.url("blindbox://shop/blindbox/edit"),
|
||
data: data.field,
|
||
async: false,
|
||
success: function (res) {
|
||
repeat_flag = false;
|
||
|
||
if (res.code >= 0) {
|
||
layer.confirm('编辑成功', {
|
||
title: '操作提示',
|
||
btn: ['返回列表', '继续操作'],
|
||
closeBtn: 0,
|
||
yes: function () {
|
||
location.href = ns.url("blindbox://shop/blindbox/lists");
|
||
},
|
||
btn2: function () {
|
||
location.href = ns.url("blindbox://shop/blindbox/edit");
|
||
}
|
||
});
|
||
} else {
|
||
layer.msg(res.message);
|
||
}
|
||
}
|
||
})
|
||
}
|
||
|
||
/**
|
||
* 表单提交
|
||
*/
|
||
form.on('submit(save)', function (data) {
|
||
// 删除图片
|
||
if(!data.field.blindbox_images) upload.delete();
|
||
if (repeat_flag) return;
|
||
repeat_flag = true;
|
||
|
||
var selectGoodsSkuId = []; //商品id
|
||
|
||
$("#goods").find("tbody tr").each(function (i) {
|
||
var id = $(this).attr("data-sku_id");
|
||
selectGoodsSkuId.push(id);
|
||
});
|
||
|
||
$("input[name='goods_num']").each(function(){
|
||
num_list.push($(this).val());
|
||
})
|
||
|
||
for(var i = 0 ; i < selectGoodsSkuId.length; i++){
|
||
var obj = {};
|
||
obj.sku_id = selectGoodsSkuId[i];
|
||
obj.num = num_list[i];
|
||
goods.push(obj)
|
||
}
|
||
|
||
data.field.goods = goods;
|
||
|
||
if(goods.length <= 0){
|
||
layer.msg('请选择盲盒内商品');
|
||
repeat_flag = false;
|
||
return false;
|
||
}
|
||
|
||
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();
|
||
}
|
||
});
|
||
});
|
||
|
||
//删除奖品
|
||
function delAward(data) {
|
||
for (var i = 0; i < tableData.length; i++) {
|
||
if (tableData[i].ident == data) {
|
||
tableData.splice(i, 1);
|
||
renderTable(tableData);
|
||
}
|
||
}
|
||
}
|
||
|
||
function back() {
|
||
location.href = ns.url("blindbox://shop/blindbox/lists");
|
||
}
|
||
|
||
//检测数据类型
|
||
function detectionNumType(el, type) {
|
||
var value = $(el).val();
|
||
//大于零 且 不是小数
|
||
if (value < 0 && type == 'integral')
|
||
$(el).val(0);
|
||
else if (type == 'integral')
|
||
$(el).val(Math.round(value));
|
||
|
||
//大于1 且 不是小数
|
||
if (value < 1 && type == 'positiveInteger')
|
||
$(el).val(1);
|
||
else if (type == 'positiveInteger')
|
||
$(el).val(Math.round(value));
|
||
//大于零可以是小数
|
||
if (type == 'positiveNumber') {
|
||
value = parseFloat(value).toFixed(2);
|
||
if (value < 0)
|
||
$(el).val(0);
|
||
else
|
||
$(el).val(value);
|
||
}
|
||
}
|
||
|
||
/**
|
||
* 添加商品
|
||
*/
|
||
function addGoods() {
|
||
goodsSelect(function (res) {
|
||
if (!res.length) return false;
|
||
var price = 0.00;
|
||
selectGoodsSkuId = [];
|
||
$("#goods tbody").html("");
|
||
var html = $("#goods tbody .goods-empty").length ? '' : $("#goods tbody").html();
|
||
for (var i = 0; i < res.length; i++) {
|
||
for (var k = 0; k < res[i].selected_sku_list.length; k++) {
|
||
var item = res[i].selected_sku_list[k];
|
||
html += `<tr data-sku_id="${item.sku_id}">`;
|
||
html += `
|
||
<td>
|
||
<div class="goods-title">
|
||
<div class="goods-img">
|
||
<img layer-src src="${item.sku_image ? ns.img(item.sku_image) : ''}" alt="">
|
||
</div>
|
||
<p class="multi-line-hiding goods-name">${item.sku_name}</p>
|
||
</div>
|
||
</td>
|
||
`;
|
||
html += `<td class='price-one'>${item.price }</td>`;
|
||
html += `<td>${item.stock}</td>`;
|
||
html += `<td><input type="number" name="goods_num" min="1" onchange="detectionNumType(this,'integral')" lay-verify="required|number" class="layui-input" value='1'></td>`;
|
||
html += `<td class='operation'> <div class='table-btn '><a href='javascript:;' class='layui-btn' onclick='deleteGoods(this)'>删除商品</a></div></td>`;
|
||
html += `</tr>`;
|
||
|
||
price += Number(item.price);
|
||
selectGoodsSkuId.push(item.sku_id);
|
||
}
|
||
}
|
||
$("#goods_num").html(selectGoodsSkuId.length);
|
||
$("#goods tbody").html(html);
|
||
|
||
}, selectGoodsSkuId, {mode: "sku"});
|
||
}
|
||
|
||
/**
|
||
* 删除商品
|
||
*/
|
||
function deleteGoods(data) {
|
||
var obj = $(data).parent().parent().parent();
|
||
$(obj).remove();
|
||
for (var i in selectGoodsSkuId) {
|
||
if (selectGoodsSkuId[i] == Number($(obj).attr("data-sku_id"))) {
|
||
selectGoodsSkuId.splice(i, 1);
|
||
num_list.splice(i, 1);
|
||
}
|
||
}
|
||
$("#goods_num").html(selectGoodsSkuId.length);
|
||
}
|
||
|
||
</script>
|
||
{/block} |