Commit e53f80dc8b165cf1d2ccf73fae0528b93a4a7669

Authored by panzh
1 parent 8e795cb2

update...

src/main/resources/static/pages/permission/resource/add.html
1 <div class="page-head"> 1 <div class="page-head">
2 - <div class="page-title">  
3 - <h1>添加资源</h1>  
4 - </div> 2 + <div class="page-title">
  3 + <h1>添加资源</h1>
  4 + </div>
5 </div> 5 </div>
6 6
7 <ul class="page-breadcrumb breadcrumb"> 7 <ul class="page-breadcrumb breadcrumb">
8 - <li><a href="/pages/home.html" data-pjax>首页</a> <i class="fa fa-circle"></i></li>  
9 - <li><span class="active">权限管理</span> <i class="fa fa-circle"></i></li>  
10 - <li><a href="list.html" data-pjax>资源管理</a> <i class="fa fa-circle"></i></li>  
11 - <li><span class="active">添加资源</span></li> 8 + <li><a href="/pages/home.html" data-pjax>首页</a> <i class="fa fa-circle"></i></li>
  9 + <li><span class="active">权限管理</span> <i class="fa fa-circle"></i></li>
  10 + <li><a href="list.html" data-pjax>资源管理</a> <i class="fa fa-circle"></i></li>
  11 + <li><span class="active">添加资源</span></li>
12 </ul> 12 </ul>
13 13
14 <div class="portlet light bordered"> 14 <div class="portlet light bordered">
15 - <div class="portlet-title">  
16 - <div class="caption">  
17 - <i class="icon-equalizer font-red-sunglo"></i> <span  
18 - class="caption-subject font-red-sunglo bold uppercase">表单</span>  
19 - </div>  
20 - </div>  
21 - <div class="portlet-body form">  
22 - <form action="/resource" class="form-horizontal" id="resource_add_form" >  
23 - <div class="alert alert-danger display-hide">  
24 - <button class="close" data-close="alert"></button>  
25 - 您的输入有误,请检查下面的输入项  
26 - </div>  
27 - <div class="form-body">  
28 - <div class="form-group">  
29 - <label class="col-md-3 control-label">所属模块</label>  
30 - <div class="col-md-4">  
31 - <div class="input-group">  
32 - <select class="form-control" name="module.id" id="moduleSelect">  
33 - </select>  
34 - </div>  
35 - </div>  
36 - </div>  
37 - <div class="form-group">  
38 - <label class="col-md-3 control-label">资源名称</label>  
39 - <div class="col-md-4">  
40 - <input type="text" class="form-control" name="name">  
41 - </div>  
42 - </div>  
43 - <div class="form-group">  
44 - <label class="col-md-3 control-label">映射地址</label>  
45 - <div class="col-md-4">  
46 - <input type="text" class="form-control" name="url">  
47 - <span class="help-block"> 例(新增资源):/resource/add</span>  
48 - </div>  
49 - </div>  
50 - <div class="form-group">  
51 - <label class="col-md-3 control-label">请求方式</label>  
52 - <div class="col-md-4">  
53 - <div class="input-group">  
54 - <select class="form-control" name="method" style="width: 160px;">  
55 - <option value="get">get</option>  
56 - <option value="post">post</option>  
57 - <option value="delete">delete</option>  
58 - </select>  
59 - </div>  
60 - </div>  
61 - </div>  
62 - <div class="form-group">  
63 - <label class="col-md-3 control-label">是否启用</label>  
64 - <div class="col-md-4">  
65 - <div class="input-group">  
66 - <select class="form-control" name="enable" style="width: 160px;">  
67 - <option value="1">可用</option>  
68 - <option value="0">禁用</option>  
69 - </select>  
70 - </div>  
71 - </div>  
72 - </div>  
73 - <div class="form-group">  
74 - <label class="col-md-3 control-label">备注/描述</label>  
75 - <div class="col-md-4">  
76 - <textarea class="form-control" rows="3" name="descriptions"></textarea>  
77 - </div>  
78 - </div>  
79 - </div>  
80 - <div class="form-actions">  
81 - <div class="row">  
82 - <div class="col-md-offset-3 col-md-4">  
83 - <button type="submit" class="btn green" ><i class="fa fa-check"></i> 提交</button>  
84 - <a type="button" class="btn default" href="list.html" data-pjax><i class="fa fa-times"></i> 取消</a>  
85 - </div>  
86 - </div>  
87 - </div>  
88 - </form>  
89 - <!-- END FORM-->  
90 - </div> 15 + <div class="portlet-title">
  16 + <div class="caption">
  17 + <i class="icon-equalizer font-red-sunglo"></i> <span
  18 + class="caption-subject font-red-sunglo bold uppercase">表单</span>
  19 + </div>
  20 + </div>
  21 + <div class="portlet-body form">
  22 + <form action="/resource" class="form-horizontal" id="resource_add_form">
  23 + <div class="alert alert-danger display-hide">
  24 + <button class="close" data-close="alert"></button>
  25 + 您的输入有误,请检查下面的输入项
  26 + </div>
  27 + <div class="form-body">
  28 + <div class="form-group">
  29 + <label class="col-md-3 control-label">所属模块</label>
  30 + <div class="col-md-4">
  31 + <div class="input-group">
  32 + <select class="form-control" name="module.id" id="moduleSelect">
  33 + </select>
  34 + </div>
  35 + </div>
  36 + </div>
  37 + <div class="form-group">
  38 + <label class="col-md-3 control-label">资源名称</label>
  39 + <div class="col-md-4">
  40 + <input type="text" class="form-control" name="name">
  41 + </div>
  42 + </div>
  43 + <div class="form-group">
  44 + <label class="col-md-3 control-label">映射地址</label>
  45 + <div class="col-md-4">
  46 + <input type="text" class="form-control" name="url">
  47 + <span class="help-block"> 例(新增资源):/resource/add</span>
  48 + </div>
  49 + </div>
  50 + <div class="form-group">
  51 + <label class="col-md-3 control-label">请求方式</label>
  52 + <div class="col-md-4">
  53 + <div class="input-group">
  54 + <select class="form-control" name="method" style="width: 160px;">
  55 + <option value="get">get</option>
  56 + <option value="post">post</option>
  57 + <option value="delete">delete</option>
  58 + </select>
  59 + </div>
  60 + </div>
  61 + </div>
  62 + <div class="form-group">
  63 + <label class="col-md-3 control-label">是否启用</label>
  64 + <div class="col-md-4">
  65 + <div class="input-group">
  66 + <select class="form-control" name="enable" style="width: 160px;">
  67 + <option value="1">可用</option>
  68 + <option value="0">禁用</option>
  69 + </select>
  70 + </div>
  71 + </div>
  72 + </div>
  73 + <div class="form-group">
  74 + <label class="col-md-3 control-label">备注/描述</label>
  75 + <div class="col-md-4">
  76 + <textarea class="form-control" rows="3" name="descriptions"></textarea>
  77 + </div>
  78 + </div>
  79 + </div>
  80 + <div class="form-actions">
  81 + <div class="row">
  82 + <div class="col-md-offset-3 col-md-4">
  83 + <button type="submit" class="btn green"><i class="fa fa-check"></i> 提交</button>
  84 + <a type="button" class="btn default" href="list.html" data-pjax><i class="fa fa-times"></i>
  85 + 取消</a>
  86 + </div>
  87 + </div>
  88 + </div>
  89 + </form>
  90 + <!-- END FORM-->
  91 + </div>
91 </div> 92 </div>
92 <script> 93 <script>
93 -$(function(){  
94 -  
95 - var form = $('#resource_add_form');  
96 - var error = $('.alert-danger', form);  
97 -  
98 - //form validate  
99 - form.validate({  
100 - errorElement : 'span',  
101 - errorClass : 'help-block help-block-error',  
102 - focusInvalid : false,  
103 - rules : {  
104 - 'name' : {  
105 - required : true  
106 - },  
107 - 'url' : {  
108 - required : true  
109 - },  
110 - 'module.id': {  
111 - required : true  
112 - }  
113 - },  
114 - invalidHandler : function(event, validator) {  
115 - error.show();  
116 - App.scrollTo(error, -200);  
117 - },  
118 -  
119 - highlight : function(element) {  
120 - $(element).closest('.form-group').addClass('has-error');  
121 - },  
122 -  
123 - unhighlight : function(element) {  
124 - $(element).closest('.form-group').removeClass('has-error');  
125 - },  
126 -  
127 - success : function(label) {  
128 - label.closest('.form-group').removeClass('has-error');  
129 - },  
130 -  
131 - submitHandler : function(f) {  
132 - var params = form.serializeJSON();  
133 - error.hide();  
134 - console.log(params);  
135 -  
136 - $post('/resource', params, function(res){  
137 - layer.msg('添加资源成功.');  
138 - });  
139 - }  
140 - });  
141 -  
142 - //模块下拉框  
143 - getModuleTreeData(function(treeData){  
144 - var options = '<option value="">请选择...</option>';  
145 -  
146 - $.each(treeData, function(i, g){  
147 - var dArray = g.children;  
148 - for(var i = 0,d; d = dArray[i++];){  
149 - options += '<optgroup label="'+d.name+'">';  
150 - if(!d.children)  
151 - continue;  
152 -  
153 - $.each(d.children, function(i, m){  
154 - options += '<option value="'+m.id+'">'+m.name+'</option>'  
155 - });  
156 - options += '</optgroup>';  
157 - }  
158 - });  
159 -  
160 - console.log(options);  
161 -  
162 - $('#moduleSelect').html(options).select2();  
163 - });  
164 -  
165 - function getModuleTreeData(cb){  
166 - var treeData = [];  
167 - $get('/module/all',null, function(arr){  
168 - treeData = createTreeData(arr);  
169 - cb && cb(treeData)  
170 - });  
171 - }  
172 -  
173 - /**  
174 - * 将模块List 转换为树结构  
175 - * @param arr  
176 - * @returns {Array}  
177 - */  
178 - function createTreeData(arr){  
179 - var treeData = [];  
180 - var len = arr.length;  
181 - for(var i = 0; i < len; i ++){  
182 - var pId = arr[i].pId;  
183 - arr[i].text = arr[i].name;  
184 - if(!pId){  
185 - treeData.push(arr[i]);  
186 - }  
187 -  
188 - for(var j = 0; j < len; j ++){  
189 - if(pId == arr[j].id){  
190 - if(!arr[j].children)  
191 - arr[j].children = [];  
192 - arr[j].children.push(arr[i]);  
193 - break;  
194 - }  
195 - }  
196 - }  
197 - return treeData;  
198 - }  
199 -  
200 -}); 94 + $(function () {
  95 +
  96 + var form = $('#resource_add_form');
  97 + var error = $('.alert-danger', form);
  98 +
  99 + //form validate
  100 + form.validate({
  101 + errorElement: 'span',
  102 + errorClass: 'help-block help-block-error',
  103 + focusInvalid: false,
  104 + rules: {
  105 + 'name': {
  106 + required: true
  107 + },
  108 + 'url': {
  109 + required: true
  110 + },
  111 + 'module.id': {
  112 + required: true
  113 + }
  114 + },
  115 + invalidHandler: function (event, validator) {
  116 + error.show();
  117 + App.scrollTo(error, -200);
  118 + },
  119 +
  120 + highlight: function (element) {
  121 + $(element).closest('.form-group').addClass('has-error');
  122 + },
  123 +
  124 + unhighlight: function (element) {
  125 + $(element).closest('.form-group').removeClass('has-error');
  126 + },
  127 +
  128 + success: function (label) {
  129 + label.closest('.form-group').removeClass('has-error');
  130 + },
  131 +
  132 + submitHandler: function (f) {
  133 + var params = form.serializeJSON();
  134 + error.hide();
  135 + console.log(params);
  136 +
  137 + $post('/resource', params, function (res) {
  138 + layer.msg('添加资源成功.');
  139 + });
  140 + }
  141 + });
  142 +
  143 + //模块下拉框
  144 + getModuleTreeData(function (treeData) {
  145 + var options = '<option value="">请选择...</option>';
  146 +
  147 + $.each(treeData, function (i, g) {
  148 + var dArray = g.children;
  149 + if (!dArray)
  150 + return true;
  151 + for (var i = 0, d; d = dArray[i++];) {
  152 + options += '<optgroup label="' + d.name + '">';
  153 + if (!d.children)
  154 + continue;
  155 +
  156 + $.each(d.children, function (i, m) {
  157 + options += '<option value="' + m.id + '">' + m.name + '</option>'
  158 + });
  159 + options += '</optgroup>';
  160 + }
  161 + });
  162 +
  163 + console.log(options);
  164 +
  165 + $('#moduleSelect').html(options).select2();
  166 + });
  167 +
  168 + function getModuleTreeData(cb) {
  169 + var treeData = [];
  170 + $get('/module/all', null, function (arr) {
  171 + treeData = createTreeData(arr);
  172 + cb && cb(treeData)
  173 + });
  174 + }
  175 +
  176 + /**
  177 + * 将模块List 转换为树结构
  178 + * @param arr
  179 + * @returns {Array}
  180 + */
  181 + function createTreeData(arr) {
  182 + var treeData = [];
  183 + var len = arr.length;
  184 + for (var i = 0; i < len; i++) {
  185 + var pId = arr[i].pId;
  186 + arr[i].text = arr[i].name;
  187 + if (!pId) {
  188 + treeData.push(arr[i]);
  189 + }
  190 +
  191 + for (var j = 0; j < len; j++) {
  192 + if (pId == arr[j].id) {
  193 + if (!arr[j].children)
  194 + arr[j].children = [];
  195 + arr[j].children.push(arr[i]);
  196 + break;
  197 + }
  198 + }
  199 + }
  200 + return treeData;
  201 + }
  202 +
  203 + });
201 </script> 204 </script>
202 \ No newline at end of file 205 \ No newline at end of file