|
|
@@ -5,28 +5,46 @@
|
|
|
<th:block th:include="include :: summernote-css" />
|
|
|
<th:block th:include="include :: datetimepicker-css" />
|
|
|
<th:block th:include="include :: jasny-bootstrap-css" />
|
|
|
+ <style type="text/css">
|
|
|
+ .slideshow_span{
|
|
|
+ max-width: 200px; max-height: 200px; float: left;margin-right: 10px;
|
|
|
+ }
|
|
|
+ </style>
|
|
|
+
|
|
|
</head>
|
|
|
<body class="white-bg">
|
|
|
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
|
|
|
<form class="form-horizontal m" id="form-info-add">
|
|
|
<div class="row">
|
|
|
- <div class="form-group">
|
|
|
- <label class="col-sm-1 control-label"><span style="color: red; ">*</span>商品名称:</label>
|
|
|
- <div class="col-sm-4">
|
|
|
- <input name="name" class="form-control" type="text" required>
|
|
|
+ <div class="col-sm-6">
|
|
|
+ <div class="form-group">
|
|
|
+ <label class="col-sm-2 control-label"><span style="color: red; ">*</span>商品名称:</label>
|
|
|
+ <div class="col-sm-8">
|
|
|
+ <input name="name" class="form-control required" type="text" required>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="col-sm-6">
|
|
|
+ <div class="form-group">
|
|
|
+ <label class="col-sm-2 control-label"><span style="color: red; ">*</span>一口价:</label>
|
|
|
+ <div class="col-sm-8">
|
|
|
+ <input name="price" class="form-control number" type="text" required>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <!--封面和轮播图-->
|
|
|
<div class="row">
|
|
|
+ <div class="col-sm-3">
|
|
|
<div class="form-group">
|
|
|
- <input id="fmzFile" name="fmzFile" type="hidden"/>
|
|
|
- <label class="col-sm-1 control-label"><span style="color: red; ">*</span>封面图:</label>
|
|
|
- <div class="col-sm-10">
|
|
|
+ <input id="input_cover" name="cover" type="hidden"/>
|
|
|
+ <label class="col-sm-4 control-label"><span style="color: red; ">*</span>封面图:</label>
|
|
|
+ <div class="col-sm-8">
|
|
|
<div class="fileinput fileinput-new" data-provides="fileinput">
|
|
|
<div class="fileinput-new thumbnail" style="width: 140px; height: 140px;">
|
|
|
- <img th:src="@{/img/profile.jpg}">
|
|
|
+ <!--<img th:src="@{/img/profile.jpg}">-->
|
|
|
</div>
|
|
|
- <div id="fmz" class="fileinput-preview fileinput-exists thumbnail" style="max-width: 200px; max-height: 150px;">
|
|
|
+ <div id="fmz" class="fileinput-preview fileinput-exists thumbnail" style="max-width: 400px; max-height: 300px;">
|
|
|
|
|
|
</div>
|
|
|
<div>
|
|
|
@@ -36,8 +54,23 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
+ <div class="col-sm-8">
|
|
|
+ <div class="form-group">
|
|
|
+ <input id="input_slideshow" name="slideshow" type="hidden"/>
|
|
|
+ <label class="col-sm-1 control-label">轮播图:</label>
|
|
|
+ <div class="col-sm-11">
|
|
|
+ <div id="div-slideshow-list">
|
|
|
|
|
|
+ </div>
|
|
|
+ <input type="file" id="input-slideshow-add" style="display: none;" onchange="upload_slideshow()"/>
|
|
|
+ <div class="thumbnail slideshow_span" style="width:70px; font-size: 40px;color: black; text-align: center" id="btn-slideshow-add" >
|
|
|
+ <i class="fa fa-plus"></i>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
<div class="row">
|
|
|
<div class="col-sm-6">
|
|
|
<div class="form-group">
|
|
|
@@ -45,8 +78,8 @@
|
|
|
<label class="col-sm-2 control-label"><span style="color: red; ">*</span>所属分类:</label>
|
|
|
<div class="col-sm-8">
|
|
|
<div class="input-group">
|
|
|
- <input name="typeName" onclick="selectTypeTree()" id="input_typeTreeName" type="text" placeholder="请选择所属分类" class="form-control"
|
|
|
- readonly="readonly" required>
|
|
|
+ <input name="typeName" onclick="selectTypeTree()" id="input_typeTreeName" type="text" placeholder="请选择所属分类"
|
|
|
+ class="form-control required" readonly="readonly" required>
|
|
|
<span class="input-group-addon"><i class="fa fa-search"></i></span>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -58,8 +91,8 @@
|
|
|
<label class="col-sm-2 control-label"><span style="color: red; ">*</span>所属公司:</label>
|
|
|
<div class="col-sm-8">
|
|
|
<div class="input-group">
|
|
|
- <input name="companyName" onclick="selectCompanyList()" id="input_companyTreeName" type="text" placeholder="请选择所属公司" class="form-control"
|
|
|
- readonly="readonly" required>
|
|
|
+ <input name="companyName" onclick="selectCompanyList()" id="input_companyTreeName" type="text" placeholder="请选择所属公司"
|
|
|
+ class="form-control required" readonly="readonly" required>
|
|
|
<span class="input-group-addon"><i class="fa fa-search"></i></span>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -71,7 +104,7 @@
|
|
|
<div class="form-group">
|
|
|
<label class="col-sm-2 control-label"><span style="color: red; ">*</span>生产地点:</label>
|
|
|
<div class="col-sm-8">
|
|
|
- <textarea name="producedAddress" class="form-control"></textarea>
|
|
|
+ <textarea name="producedAddress" class="form-control required" required></textarea>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -79,7 +112,7 @@
|
|
|
<div class="form-group">
|
|
|
<label class="col-sm-2 control-label"><span style="color: red; ">*</span>仓库地址:</label>
|
|
|
<div class="col-sm-8">
|
|
|
- <textarea name="warehouseAddress" class="form-control"></textarea>
|
|
|
+ <textarea name="warehouseAddress" class="form-control required" required></textarea>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -91,7 +124,7 @@
|
|
|
<div class="col-sm-8">
|
|
|
<div class="input-group date">
|
|
|
<span class="input-group-addon"><i class="fa fa-calendar"></i></span>
|
|
|
- <input name="producedTime" class="form-control" placeholder="yyyy-MM-dd" type="text">
|
|
|
+ <input name="producedTime" class="form-control required" placeholder="yyyy-MM-dd" type="text" required>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -100,7 +133,7 @@
|
|
|
<div class="form-group">
|
|
|
<label class="col-sm-2 control-label"><span style="color: red; ">*</span>配送方式:</label>
|
|
|
<div class="col-sm-8">
|
|
|
- <input name="delivery" class="form-control" placeholder="请输入配送方式" type="text">
|
|
|
+ <input name="delivery" class="form-control required" placeholder="请输入配送方式" type="text" required>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -110,7 +143,10 @@
|
|
|
<div class="form-group ">
|
|
|
<label class="col-sm-2 control-label"><span style="color: red; ">*</span>上架标志:</label>
|
|
|
<div class="col-sm-8">
|
|
|
- <input name="putawayFlag" class="form-control" type="text" required>
|
|
|
+ <div class="radio-box" th:each="dict : ${@dict.getType('goods_putaway')}">
|
|
|
+ <input type="radio" th:id="${dict.dictCode}" name="putawayFlag" th:value="${dict.dictValue}" th:checked="${dict.default}">
|
|
|
+ <label th:for="${dict.dictCode}" th:text="${dict.dictLabel}"></label>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -118,21 +154,84 @@
|
|
|
<div class="form-group">
|
|
|
<label class="col-sm-2 control-label"><span style="color: red; ">*</span>单重:</label>
|
|
|
<div class="col-sm-8">
|
|
|
- <input name="weight" class="form-control" type="text">
|
|
|
+ <input name="weight" class="form-control" type="text" required>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!--规格和颜色-->
|
|
|
+ <div class="row">
|
|
|
+ <div class="col-sm-6">
|
|
|
+ <div class="form-group ">
|
|
|
+ <label class="col-sm-2 control-label"></label>
|
|
|
+ <div class="col-sm-6">
|
|
|
+ <table class="table table-bordered table-striped">
|
|
|
+ <thead>
|
|
|
+ <tr style="background-color: #1ab394;color: white;">
|
|
|
+ <th >规格</th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody id="tbody-size">
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+ <div class="col-sm-2">
|
|
|
+ <a class="btn btn-white btn-bitbucket" id="btn-size-add">
|
|
|
+ <i class="fa fa-plus"></i>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="col-sm-6">
|
|
|
+ <div class="form-group">
|
|
|
+ <label class="col-sm-2 control-label"></label>
|
|
|
+ <div class="col-sm-6">
|
|
|
+ <table class="table table-bordered table-striped">
|
|
|
+ <thead>
|
|
|
+ <tr style="background-color: #1ab394;color: white;">
|
|
|
+ <th >颜色</th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody id="tbody-color">
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+ <div class="col-sm-2">
|
|
|
+ <a class="btn btn-white btn-bitbucket" id="btn-color-add">
|
|
|
+ <i class="fa fa-plus"></i>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!--动态属性-->
|
|
|
+ <div class="row" >
|
|
|
+ <div class="form-group">
|
|
|
+ <label class="col-sm-1 control-label"><span style="color: red; ">*</span>属性:</label>
|
|
|
+ <div class="col-sm-10">
|
|
|
+ <div class="panel panel-primary">
|
|
|
+ <div class="panel-heading">
|
|
|
+ <h5>动态属性列表(选择分类后加载)</h5>
|
|
|
+ </div>
|
|
|
+ <div class="panel-body">
|
|
|
+ <div class="row" id="div_area">
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <br/>
|
|
|
<div class="row">
|
|
|
<div class="form-group">
|
|
|
<label class="col-sm-1 control-label"><span style="color: red; ">*</span>描述:</label>
|
|
|
<div class="col-sm-10">
|
|
|
- <input id="input_describe" name="describe" type="hidden">
|
|
|
+ <input id="input_des" name="des" type="hidden" required>
|
|
|
<div class="summernote"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
-
|
|
|
</form>
|
|
|
</div>
|
|
|
<th:block th:include="include :: footer" />
|
|
|
@@ -141,7 +240,8 @@
|
|
|
<th:block th:include="include :: jasny-bootstrap-js" />
|
|
|
<script type="text/javascript">
|
|
|
var prefix = ctx + "goods/info"
|
|
|
-
|
|
|
+ var sizeIndex=0;
|
|
|
+ var colorIndex=0;
|
|
|
$('.summernote').summernote({
|
|
|
placeholder: '请输入内容',
|
|
|
height : 192,
|
|
|
@@ -171,7 +271,7 @@
|
|
|
dataType: 'json',
|
|
|
success: function(result) {
|
|
|
if (result.code == web_status.SUCCESS) {
|
|
|
- $(obj).summernote('editor.insertImage', result.url, result.fileName);
|
|
|
+ $(obj).summernote('editor.insertImage', result.data.url, result.data.fileName);
|
|
|
} else {
|
|
|
$.modal.alertError(result.msg);
|
|
|
}
|
|
|
@@ -181,10 +281,77 @@
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
+ /*****表单校验***********/
|
|
|
+ $("#form-user-edit").validate({
|
|
|
+ onkeyup: false,
|
|
|
+ rules:{
|
|
|
+
|
|
|
+ price:{
|
|
|
+ required:true,
|
|
|
+ isPhone:true,
|
|
|
+ remote: {
|
|
|
+ url: ctx + "system/user/checkPhoneUnique",
|
|
|
+ type: "post",
|
|
|
+ dataType: "json",
|
|
|
+ data: {
|
|
|
+ "userId": function() {
|
|
|
+ return $("#userId").val();
|
|
|
+ },
|
|
|
+ "phonenumber": function() {
|
|
|
+ return $.common.trim($("#phonenumber").val());
|
|
|
+ }
|
|
|
+ },
|
|
|
+ dataFilter: function (data, type) {
|
|
|
+ return $.validate.unique(data);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ messages: {
|
|
|
+ "userName": {
|
|
|
+ required: "请输入用户名称",
|
|
|
+ },
|
|
|
+ "email": {
|
|
|
+ required: "请输入邮箱",
|
|
|
+ remote: "Email已经存在"
|
|
|
+ },
|
|
|
+ "phonenumber":{
|
|
|
+ required: "请输入手机号码",
|
|
|
+ remote: "手机号码已经存在"
|
|
|
+ }
|
|
|
+ },
|
|
|
+ focusCleanup: true
|
|
|
+ });
|
|
|
/*********************提交*********************************/
|
|
|
function submitHandler() {
|
|
|
+
|
|
|
if ($.validate.form()) {
|
|
|
+ /*遍历轮播图*/
|
|
|
+ var obj = $("img[class='img-slideshow']")
|
|
|
+ var srcStr ='';
|
|
|
+ if(obj.length>0){
|
|
|
+ for(var i =0;i<obj.length;i++){
|
|
|
+ srcStr += $(obj[i]).attr('src');
|
|
|
+ srcStr += ',';
|
|
|
+ }
|
|
|
+ srcStr = srcStr.substr(0,srcStr.length-1)
|
|
|
+ $("#input_slideshow").val(srcStr);
|
|
|
+ }
|
|
|
+ var sHTML = $('.summernote').summernote('code');
|
|
|
+ $("#input_des").val(sHTML);
|
|
|
+ if(sHTML==undefined||sHTML==''){
|
|
|
+ $.modal.alertWarning("请添加商品描述");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ var file = $('#fmz').find('img').attr('src');
|
|
|
+ if(file == undefined){
|
|
|
+ $.modal.alertWarning("请上传图片");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ $('#input_cover').val(file);
|
|
|
$.operate.save(prefix + "/add", $('#form-info-add').serialize());
|
|
|
+ }else{
|
|
|
+ $.modal.alertError("表单填写有误,请重新填写后提交");
|
|
|
}
|
|
|
}
|
|
|
|
|
|
@@ -214,27 +381,47 @@
|
|
|
getTypyAttributu($("#input_typeId").val());
|
|
|
layer.close(index);
|
|
|
}
|
|
|
+ /**********************获取分类信息****************************/
|
|
|
function getTypyAttributu(id){
|
|
|
+ console.log(id)
|
|
|
$.ajax({
|
|
|
type: "POST",
|
|
|
- url: ctx + "common/upload",
|
|
|
- data: data,
|
|
|
- cache: false,
|
|
|
+ url: ctx + "goods/type/getInfo/"+id,
|
|
|
contentType: false,
|
|
|
- processData: false,
|
|
|
+ cache: false,
|
|
|
dataType: 'json',
|
|
|
success: function(result) {
|
|
|
if (result.code == web_status.SUCCESS) {
|
|
|
- $(obj).summernote('editor.insertImage', result.url, result.fileName);
|
|
|
+ resolverType(result.data)
|
|
|
} else {
|
|
|
$.modal.alertError(result.msg);
|
|
|
}
|
|
|
},
|
|
|
error: function(error) {
|
|
|
- $.modal.alertWarning("图片上传失败。");
|
|
|
+ $.modal.alertWarning("获取分类属性失败!");
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
+ /************************解析分类属性类表***************************/
|
|
|
+ function resolverType(goodsType){
|
|
|
+ $("#div_area").html("");
|
|
|
+ var objs = goodsType.goodsTypeAttributes;
|
|
|
+ var len= objs.length;
|
|
|
+ var str ="";
|
|
|
+ for (i = 0; i < len; i++) {
|
|
|
+ str += ' <div class="col-sm-6">' +
|
|
|
+ ' <div class="form-group">' +
|
|
|
+ ' <label class="col-sm-2 control-label"><span style="color: red; ">*</span>'+objs[i].attributeName+':</label>' +
|
|
|
+ ' <div class="col-sm-8">' +
|
|
|
+ ' <input name="goodsAttributes['+i+'].attributeId" class="form-control" type="hidden" value="'+objs[i].id+'" >' +
|
|
|
+ ' <input name="goodsAttributes['+i+'].attributeName" class="form-control" type="hidden" value="'+objs[i].attributeName+'" >' +
|
|
|
+ ' <input name="goodsAttributes['+i+'].value" class="form-control required" type="text" required>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>'
|
|
|
+ }
|
|
|
+ $("#div_area").html(str);
|
|
|
+ }
|
|
|
|
|
|
/******************选择公司列表**********************************/
|
|
|
function selectCompanyList() {
|
|
|
@@ -248,13 +435,73 @@
|
|
|
$.modal.openOptions(options2);
|
|
|
}
|
|
|
function selectCompany(index, layero){
|
|
|
- debugger
|
|
|
- var tree = layero.find("iframe")[0].contentWindow.$._tree;
|
|
|
var body = layer.getChildFrame('body', index);
|
|
|
$("#input_companyId").val(body.find('#treeId').val());
|
|
|
$("#input_companyTreeName").val(body.find('#treeName').val());
|
|
|
layer.close(index);
|
|
|
}
|
|
|
+
|
|
|
+ /*******************规格表格动态添加值*********************************************/
|
|
|
+ $("#btn-size-add").click(function(){
|
|
|
+ var htmlStr='';
|
|
|
+ htmlStr+='<tr><td class="input-group" style="padding: 0">';
|
|
|
+ htmlStr+=' <input name="goodsSizes['+sizeIndex+'].size" class="form-control required" type="text" required>'
|
|
|
+ htmlStr+='<span class="input-group-addon"><i class="fa fa-remove remove"></i></span>'
|
|
|
+ htmlStr+='</td></tr>';
|
|
|
+ sizeIndex++
|
|
|
+ $("#tbody-size").append(htmlStr)
|
|
|
+ $('.remove').on('click',function(){
|
|
|
+ $(this).parent().parent().parent('tr').remove();
|
|
|
+ });
|
|
|
+ })
|
|
|
+ /*******************颜色表格动态添加值*********************************************/
|
|
|
+ $("#btn-color-add").click(function(){
|
|
|
+ var htmlStr='';
|
|
|
+ htmlStr+='<tr><td class="input-group" style="padding: 0">';
|
|
|
+ htmlStr+=' <input name="goodsColors['+colorIndex+'].color" class="form-control required" type="text" required>'
|
|
|
+ htmlStr+=' <span class="input-group-addon"><i class="fa fa-remove remove"></i></span>'
|
|
|
+ htmlStr+='</td></tr>';
|
|
|
+ colorIndex++
|
|
|
+ $("#tbody-color").append(htmlStr);
|
|
|
+ $('.remove').on('click',function(){
|
|
|
+ $(this).parent().parent().parent('tr').remove();
|
|
|
+ });
|
|
|
+ })
|
|
|
+
|
|
|
+ /*******************轮播图添加图片************************/
|
|
|
+ $("#btn-slideshow-add").click(function(){
|
|
|
+
|
|
|
+ $("#input-slideshow-add").click();
|
|
|
+ })
|
|
|
+ function upload_slideshow(){
|
|
|
+ if ($("#input-slideshow-add").val() == '') {
|
|
|
+ return;
|
|
|
+ }var data = new FormData();
|
|
|
+ data.append('file', document.getElementById('input-slideshow-add').files[0]);
|
|
|
+ $.ajax({
|
|
|
+ url:ctx+"common/upload",
|
|
|
+ type:"post",
|
|
|
+ data: data,
|
|
|
+ cache: false,
|
|
|
+ contentType: false,
|
|
|
+ processData: false,
|
|
|
+ dataType: 'json',
|
|
|
+ success: function(result) {
|
|
|
+ if (result.code == web_status.SUCCESS) {
|
|
|
+ var htmlStr='';
|
|
|
+ htmlStr+='<div class="thumbnail slideshow_span" >'+
|
|
|
+ ' <img class="img-slideshow" src="'+result.data.fileName+'">' +
|
|
|
+ '</div>'
|
|
|
+ $("#div-slideshow-list").append(htmlStr);
|
|
|
+ } else {
|
|
|
+ $.modal.alertError(result.msg);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error:function(result) {
|
|
|
+ alert("上传失败")
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
</script>
|
|
|
</body>
|
|
|
</html>
|