<!DOCTYPE html>
|
<html xmlns:th="http://www.thymeleaf.org" xmlns:matrix="http://www.w3.org/1999/xhtml">
|
<head>
|
<meta charset="utf-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="renderer" content="webkit">
|
<meta http-equiv="Cache-Control" content="no-siteapp" />
|
<title>主页</title>
|
<link rel="shortcut icon" th:href="@{/images/favicon.ico}">
|
<!--[if lt IE 8]>
|
<meta http-equiv="refresh" content="0;ie.html" />
|
<![endif]-->
|
<link th:href="@{/plugin/bootstrap-fileinput/css/fileinput.css}"
|
media="all" rel="stylesheet" type="text/css"/>
|
<!-- 本框架基本脚本和样式 -->
|
<script type="text/javascript"
|
th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script>
|
<script type="text/javascript"
|
th:src="@{/js/systools/MBase.js}"></script>
|
<!-- 界面单独引入的其他样式和脚本 -->
|
<link rel="stylesheet"
|
th:href="@{/plugin/zTree/zTreeStyle/zTreeStyle.css}"
|
type="text/css">
|
<script type="text/javascript"
|
th:src="@{/plugin/zTree/jquery.ztree.core-3.5.min.js}"></script>
|
<script type="text/javascript"
|
th:src="@{/plugin/bootstrap-3.3.5/js/bootstrapSwitch.js}"></script>
|
<link rel="stylesheet" th:href="@{/plugin/bootstrap-3.3.5/css/bootstrapSwitch.css}">
|
<script type="text/javascript"
|
th:src="@{/js/function/public.js}"></script>
|
<script th:src="@{/plugin/bootstrap-fileinput/js/fileinput.js}"
|
type="text/javascript"></script>
|
<script th:src="@{/plugin/bootstrap-fileinput/js/locales/zh.js}"
|
type="text/javascript"></script>
|
<style type="text/css">
|
table tr td {
|
border: none !important;
|
}
|
|
table tr th {
|
border: none !important;
|
}
|
|
.inline{
|
display: INLINE;
|
width: 50%;
|
}
|
</style>
|
</head>
|
<body class="gray-bg">
|
<div class="wrapper wrapper-content ">
|
<div class="row">
|
<div class="col-sm-3">
|
<div class="ibox float-e-margins">
|
<div class="ibox-title">
|
<h5>属性列表</h5>
|
<div class="pull-right ">
|
<a class="f-r text-success " onclick="openForm()" matrix:btn="shopProductAttribute-addAttr"><i
|
class="fa fa-plus c-success"></i> 添加属性</a>
|
</div>
|
</div>
|
<div id="treeDemo" class="ibox-content ztree"
|
style="min-height: 400px"></div>
|
</div>
|
</div>
|
<div class="col-sm-9">
|
<div class="ibox float-e-margins">
|
<div class="ibox-title">
|
<h5>编辑属性</h5>
|
<div class="ibox-tools"></div>
|
</div>
|
<div class="ibox-content" style="min-height: 400px">
|
<form class="form-horizontal dataform " style="display: none"
|
id="dataform">
|
<input autocomplete="off" type="hidden" name="attrId" id="attrId">
|
<div class="form-group">
|
<label class="col-sm-2 control-label">父级属性</label>
|
<div class="col-sm-10">
|
<select class="form-control select2" size="1" name="parentId" style="width: 100%"
|
id="parentId">
|
</select>
|
</div>
|
</div>
|
|
<div class="form-group">
|
<label class="col-sm-2 control-label">属性名称
|
<span class="text-danger">*</span>
|
</label>
|
<div class="col-sm-10">
|
<input autocomplete="off" name="attrName" id="attrName" type="text"
|
dataType="*" class="form-control" value="" nullmsg="属性名称不能为空">
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-2 control-label">编码属性
|
<span class="text-danger">*</span>
|
</label>
|
<div class="col-sm-10">
|
<input autocomplete="off" id="attrCode" type="text" name="attrCode" class="form-control "
|
datatype="/^[0-9a-zA-Z_]{1,50}$/" errormsg="仅支持数字、字母及'_'" nullmsg="属性编码不能为空">
|
<div class="Validform_checktip"></div>
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-2 control-label">编码排序</label>
|
<div class="col-sm-10">
|
<input autocomplete="off" id="sort" type="number" name="sort" class="form-control "
|
>
|
<div class="Validform_checktip"></div>
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-2 control-label">备注</label>
|
<div class="col-sm-10">
|
<textarea id="attrMark" name="attrMark" class="form-control "></textarea>
|
<div class="Validform_checktip"></div>
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-2 control-label">图片
|
|
</label>
|
<div class="col-sm-10">
|
<input autocomplete="off" name="attrUrl" id="attrUrl"
|
class="form-control upload-input" type="text" /> <a style="width: 10%"
|
class="btn btn-primary radius upload-a">选择图片
|
</a>
|
</div>
|
<!--<div class="col-sm-5">
|
<input autocomplete="off" type="text" id="attrUrl" readonly="true" class="form-control" name="attrUrl"
|
multiple data-min-file-count="1" maxLength="250"
|
>
|
<form enctype="multipart/form-data">
|
<input autocomplete="off" id="file-zh" name="file-zh" type="file">
|
</form>
|
</div>
|
<div class="col-sm-5">
|
<img id="imageUrl" style="width: 80%"/>
|
</div>-->
|
</div>
|
<div class="form-group" id="showImgUrl">
|
<label class="col-sm-2 control-label">
|
|
</label>
|
<div class="col-sm-10">
|
<img id="imageUrl" style="width: 50%;height: 40%"/>
|
</div>
|
</div>
|
<div id="updateBtn" class="form-group" style="display: none">
|
<div class="col-sm-12 text-center">
|
<a class="btn btn-success radius" onclick="updateFunction()" matrix:btn="shopProductAttribute-save"><i class="fa fa-check"></i> 保存</a>
|
<a class="btn btn-danger radius" onclick="delFunction()" matrix:btn="shopProductAttribute-del"><i class="fa fa-close"></i> 删除</a>
|
</div>
|
</div>
|
</form>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<script type="text/javascript"
|
th:src="@{/js/systools/MJsBase.js}"></script>
|
<script type="text/javascript">
|
|
var invokeUrl = basePath + "/admin/multipleUploadFile/doUpload";
|
MUI.initImgUpload(".upload-input");
|
$(".select2").select2();
|
/*$('#file-zh').fileinput({
|
language: 'zh',
|
uploadUrl: invokeUrl,
|
allowedFileExtensions: ['jpg', 'png', 'gif'],
|
maxFileCount: 1,
|
}).on("fileuploaded", function (event, data, previewId, index) {
|
$('input[name=attrUrl]').val(data.response.path)
|
});*/
|
var dataForm = null;
|
$(function() {
|
initFunctionList();
|
dataForm = MValidform.validform("#dataform");
|
});
|
|
|
//更新功能
|
function updateFunction() {
|
var myForm = MForm.initForm({
|
invokeUrl : basePath+"/admin/shopProductAttribute/modifyShopProductAttribute",
|
afterSubmit : function() {
|
initFunctionList();
|
},
|
|
});
|
myForm.submit();
|
}
|
|
|
// 点击加载节点信息
|
function zTreeOnClick(event, treeId, treeNode) {
|
//initSeclect("#parentId");
|
$("#dataform").show();
|
$("#updateBtn").show();
|
dataForm.resetForm();
|
$.AjaxProxy({
|
p : {
|
attrId : treeNode.id
|
},
|
a : false,
|
c : true
|
})
|
.invoke(
|
basePath+"/admin/shopProductAttribute/findById",
|
function(loj) {
|
// 初始化功能基本信息1
|
initSeclect("#parentId",loj.getString(0, "parentId"));
|
$("#parentId").val(loj.getString(0, "parentId"));
|
$("#attrId").val(loj.getString(0, "attrId"));
|
$("#attrName").val(loj.getString(0, "attrName"));
|
$("#attrUrl").val(loj.getString(0, "attrUrl"));
|
$("#attrCode").val(loj.getString(0, "attrCode"));
|
$("#attrMark").val(loj.getString(0, "attrMark"));
|
$("#sort").val(loj.getString(0, "sort"));
|
if(loj.getString(0, "attrUrl") != ''){
|
$("#imageUrl").attr("src",loj.getString(0, "attrUrl"));
|
$("#showImgUrl").show();
|
}else{
|
$("#showImgUrl").hide();
|
}
|
$(".loadingbig").remove();
|
});
|
};
|
|
|
|
|
|
function initFunctionList() {
|
var zNodes = new Array();
|
$.AjaxProxy().invoke(
|
basePath+"/admin/shopProductAttribute/all",
|
function(loj) {
|
for (var i = 0; i < loj.getRowCount(); i++) {
|
zNodes[i] = createNode(loj.getString(i, "attrId"), loj.getString(i, "parentId"), loj.getString(
|
i, "attrName"));
|
}
|
initTree(zNodes);
|
});
|
}
|
|
//初始化树型控件
|
function initTree(zNodes) {
|
var setting = {
|
view : {
|
dblClickExpand : false,
|
showLine : false,
|
selectedMulti : false
|
},
|
data : {
|
simpleData : {
|
enable : true,
|
idKey : "id",
|
pIdKey : "pId",
|
rootPId : ""
|
}
|
},
|
callback : {
|
onClick : zTreeOnClick
|
}
|
};
|
$.fn.zTree.init($("#treeDemo"), setting, zNodes);
|
}
|
|
|
|
function createNode(id, parentId, name) {
|
var o = new Object();
|
o.id = id;
|
o.pId = parentId;
|
o.name = name;
|
o.open=true;
|
|
return o;
|
}
|
|
|
function delFunction() {
|
var id = $("#attrId").val();
|
if (id != null && id != '') {
|
layer.confirm('删除属性时会删除该属性的所有子属性！', {
|
icon : 3,
|
title : '提示'
|
}, function(index) {
|
layer.close(index);
|
var id = $("#attrId").val();
|
$.AjaxProxy({
|
p : {
|
attrId : id
|
}
|
}).invoke(basePath+"/admin/shopProductAttribute/del", function(loj) {
|
layer.msg('删除成功！', {
|
icon : 1,time:1000
|
}, function(index) {
|
$("#dataform").hide();
|
$("#updateBtn").hide();
|
layer.close(index);
|
initFunctionList();
|
});
|
return false;
|
});
|
});
|
} else {
|
layer.msg("请先选中要删除的属性!");
|
}
|
}
|
|
function openForm() {
|
|
layer.open({
|
type : 2,
|
title : "添加属性",
|
anim:1,
|
maxmin : true,
|
area : [ MUI.SIZE_L, '450px' ],
|
content : [ basePath+'/admin/shopProductAttribute/editForm' ]
|
});
|
}
|
|
function initSeclect(seler,def){
|
$.AjaxProxy().invoke(basePath+"/admin/shopProductAttribute/all",
|
function(loj) {
|
$(seler).createSelectTree(
|
loj.attr("result").rows,
|
{ id : "attrId",
|
parent : "parentId",
|
value : "attrName",
|
append : false,
|
defaultValue : def,
|
defaultHtml : '<option value="0" selected="selected">一级属性</option>'
|
});
|
});
|
}
|
|
|
</script>
|
|
</body>
|
</html>
|
</html>
|
