|
|
|
<!DOCTYPE html>
|
|
|
|
|
|
|
|
<style>
|
|
|
|
.sale-category-detail-page .goods-image {
|
|
|
|
display: flex;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.sale-category-detail-page .goods-image .img {
|
|
|
|
width: 104px;
|
|
|
|
height: 104px;
|
|
|
|
margin-right: 10px;
|
|
|
|
background-size: cover;
|
|
|
|
background-repeat: no-repeat;
|
|
|
|
background-position: center;
|
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
|
|
|
|
.sale-category-detail-page .goods-image .img:hover:before {
|
|
|
|
content: "删除";
|
|
|
|
width: 100%;
|
|
|
|
display: block;
|
|
|
|
position: absolute;
|
|
|
|
top: 0;
|
|
|
|
background: #000;
|
|
|
|
opacity: 0.5;
|
|
|
|
color: #fff;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 104px;
|
|
|
|
}
|
|
|
|
</style>
|
|
|
|
<div class="sale-category-detail-page" style="overflow-y: scroll">
|
|
|
|
<form name="categoryEditForm" id="categoryEditForm" method="post" enctype="multipart/form-data">
|
|
|
|
<input type="hidden" name="id" />
|
|
|
|
<input type="hidden" name="parentId" id="parentId"/>
|
|
|
|
<input type="hidden" name="imageUrl" id="imageUrl"/>
|
|
|
|
<div style="margin-top: 5px;margin-left: 30px">
|
|
|
|
<table border="0" style="width:95%;margin-top:5px;line-height:30px;" id="tab">
|
|
|
|
<tr style="height: 60px">
|
|
|
|
<td width="20%"><span style="color:red">*</span><label>名称</label></td>
|
|
|
|
<td>
|
|
|
|
<div style="width:200px;">
|
|
|
|
<input class="easyui-textbox" id="categoryName" name="categoryName" data-options="validType:'length[1,30]'" />
|
|
|
|
</div>
|
|
|
|
</td>
|
|
|
|
</tr>
|
|
|
|
<tr style="height: 60px">
|
|
|
|
<td width="20%"><span style="color:red">*</span><label>排序值</label></td>
|
|
|
|
<td>
|
|
|
|
<input class="easyui-numberbox" id="orderBy" name="orderBy" data-options="validType:'length[1,10]'" />
|
|
|
|
</td>
|
|
|
|
</tr>
|
|
|
|
</table>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="goods-image" style="margin-top: 5px;margin-left: 30px">
|
|
|
|
<div style="width:20%;margin-top:5px;line-height:30px;" >
|
|
|
|
<span style="color:red">*</span><label>分类图标</label>
|
|
|
|
</div>
|
|
|
|
<div id="imageUpload"></div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div style="margin-top: 5px;margin-left: 30px">
|
|
|
|
<table border="0" style="width:95%;margin-top:5px;line-height:30px;" >
|
|
|
|
<tr style="height: 60px">
|
|
|
|
<td width="20%"><span style="color:red">*</span><label>跳转类型</label></td>
|
|
|
|
<td>
|
|
|
|
<div style="width:200px;">
|
|
|
|
<select name="linkType" class="easyui-combobox" style="width:200px;" panelHeight="auto" required="true">
|
|
|
|
<option value="series" selected>系列</option>
|
|
|
|
<option value="brand">品牌</option>
|
|
|
|
<option value="sort">品类</option>
|
|
|
|
<option value="productPool">商品池</option>
|
|
|
|
<option value="h5">h5</option>
|
|
|
|
</select>
|
|
|
|
</div>
|
|
|
|
</td>
|
|
|
|
</tr>
|
|
|
|
<tr style="height: 60px">
|
|
|
|
<td width="20%"><span style="color:red">*</span><label>跳转目的</label></td>
|
|
|
|
<td>
|
|
|
|
<input class="easyui-textbox" name="linkDetail" data-options="validType:'length[1,500]'" style="width:500px;" required="true"/>
|
|
|
|
</td>
|
|
|
|
</tr>
|
|
|
|
</table>
|
|
|
|
</div>
|
|
|
|
</form>
|
|
|
|
</div>
|
|
|
|
<script>
|
|
|
|
$(function () {
|
|
|
|
this.dom = {
|
|
|
|
imageUpload: $('#categoryEditForm #imageUpload')
|
|
|
|
};
|
|
|
|
|
|
|
|
$("#categoryEditForm #categoryName").textbox({
|
|
|
|
required: true,
|
|
|
|
missingMessage: "销售类目名称不能为空",
|
|
|
|
prompt: "请输入",
|
|
|
|
width: "200px"
|
|
|
|
});
|
|
|
|
|
|
|
|
$("#categoryEditForm #orderBy").numberbox({
|
|
|
|
required: true,
|
|
|
|
precision:0,
|
|
|
|
min:1,
|
|
|
|
missingMessage: "排序值不能为空",
|
|
|
|
prompt: "请输入",
|
|
|
|
width:"200px"
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
this.dom.imageUpload.imageUpload({
|
|
|
|
width: 104,
|
|
|
|
height: 104,
|
|
|
|
realInputName: "imageUrl",
|
|
|
|
url: contextPath + '/fileupload/upload',
|
|
|
|
queryParams: {
|
|
|
|
bucket: "salecategoryimg"
|
|
|
|
},
|
|
|
|
onBeforeSubmit: function () {
|
|
|
|
$.messager.progress({
|
|
|
|
title: "正在执行",
|
|
|
|
msg: "正在执行，请稍后...",
|
|
|
|
interval: 500,
|
|
|
|
text: ""
|
|
|
|
});
|
|
|
|
},
|
|
|
|
filterFileName: function (data) {
|
|
|
|
if (!data || data.code != 200) {
|
|
|
|
$.messager.progress("close");
|
|
|
|
$.messager.alert("错误", data.message);
|
|
|
|
return "";
|
|
|
|
}
|
|
|
|
return data.data.url;
|
|
|
|
},
|
|
|
|
onLoadSuccess: function (data) {
|
|
|
|
console.log(data.data );
|
|
|
|
$.messager.progress("close");
|
|
|
|
$(document).find('.file-close').click();
|
|
|
|
//只保留最佳的成功的
|
|
|
|
$(".sale-category-detail-page .goods-image .img").remove();
|
|
|
|
$('#categoryEditForm #imageUpload').before('<div class="img" data-url="' + data.data + '" style="background-image:url(' + data.data + ');">');
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
$(document).on('click', '.goods-image .img', function() {
|
|
|
|
$(this).remove();
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
$("#categoryEditForm #parentId").val(saleCategoryParentId);
|
|
|
|
|
|
|
|
if (saleCategoryId > 0) {
|
|
|
|
$.post(contextPath + "/saleCategory/getSaleCategoryById", {
|
|
|
|
id: saleCategoryId
|
|
|
|
}, function (data) {
|
|
|
|
$("#categoryEditForm").form("load", data.data);
|
|
|
|
|
|
|
|
if (data.data.imageUrl && data.data.imageUrl.length > 0) {
|
|
|
|
const item = data.data.imageUrl;
|
|
|
|
$('#categoryEditForm #imageUpload').before('<div class="img" data-url="' + item + '" style="background-image:url(' + item + ');">');
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
</script> |
|
|
\ No newline at end of file |
...
|
...
|
|
