template.html 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915
  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="renderer" content="webkit|ie-comp|ie-stand">
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  7. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
  8. <meta http-equiv="Cache-Control" content="no-siteapp" />
  9. <!--[if lt IE 9]>
  10. <script type="text/javascript" src="${ctx}/assets/lib/html5.js"></script>
  11. <script type="text/javascript" src="${ctx}/assets/lib/respond.min.js"></script>
  12. <script type="text/javascript" src="${ctx}/assets/lib/PIE_IE678.js"></script>
  13. <![endif]-->
  14. <link rel="stylesheet" type="text/css" href="${ctx}/assets/static/h-ui/css/H-ui.min.css" />
  15. <link rel="stylesheet" type="text/css" href="${ctx}/assets/static/h-ui.admin/css/H-ui.admin.css" />
  16. <link rel="stylesheet" type="text/css" href="${ctx}/assets/lib/Hui-iconfont/1.0.7/iconfont.css" />
  17. <link rel="stylesheet" type="text/css" href="${ctx}/assets/lib/icheck/icheck.css" />
  18. <link rel="stylesheet" type="text/css" href="${ctx}/assets/static/h-ui.admin/skin/default/skin.css" id="skin" />
  19. <link rel="stylesheet" type="text/css" href="${ctx}/assets/static/h-ui.admin/css/style.css" />
  20. <script type="text/ecmascript" src="${ctx}/assets/lib/jquery/1.9.1/jquery.js"></script>
  21. <script type="text/javascript" src="${ctx}/assets/static/h-ui/js/H-ui.js"></script>
  22. <script type="text/javascript" src="${ctx}/assets/lib/layer/3.0.3/layer.js"></script>
  23. <link type="text/css" href="${ctx}/assets/lib/codemirror/lib/codemirror.css" rel="stylesheet" />
  24. <script type="text/javascript" src="${ctx}/assets/lib/codemirror/lib/codemirror.js"></script>
  25. <script src="${ctx}/assets/lib/codemirror/mode/xml/xml.js"></script>
  26. <link rel="stylesheet" type="text/css" href="${ctx}/assets/lib/webuploader/0.1.5/webuploader.css">
  27. <script type="text/javascript" src="${ctx}/assets/lib/webuploader/0.1.5/webuploader.js"></script>
  28. <link rel="stylesheet" type="text/css" media="screen" href="${ctx}/assets/lib/jqueryui/jquery-ui.css" />
  29. <link rel="stylesheet" type="text/css" media="screen" href="${ctx}/assets/lib/jqgrid/css/ui.jqgrid.css" />
  30. <script type="text/ecmascript" src="${ctx}/assets/lib/jqueryui/jquery-ui.js"></script>
  31. <script type="text/ecmascript" src="${ctx}/assets/lib/jqgrid/js/i18n/grid.locale-cn.js"></script>
  32. <script type="text/ecmascript" src="${ctx}/assets/lib/jqgrid/js/jquery.jqGrid.min.js"></script>
  33. <script type="text/javascript" src="${ctx}/assets/js/base.js"></script>
  34. <!--[if IE 6]>
  35. <script type="text/javascript" src="${ctx}/assets/lib/DD_belatedPNG_0.0.8a-min.js" ></script>
  36. <script>DD_belatedPNG.fix('*');</script>
  37. <![endif]-->
  38. <style type="text/css">
  39. .CodeMirror {
  40. border: 1px solid #eee;
  41. height: auto;
  42. }
  43. </style>
  44. <script type="text/javascript">
  45. $(function() {
  46. $(window).resize(function(){
  47. $("#jqGridGroup").setGridWidth($(window).width()-40); 
  48. $("#jqGrid").setGridWidth($(window).width()-40);
  49. $("#jqGridSkin").setGridWidth($(window).width()-40);
  50. $("#jqGridCss").setGridWidth($(window).width()-40);
  51. });
  52. $("#jqGridGroup").jqGrid({
  53. url : '${ctx}/myconsole/templategroup/getByPage',
  54. editurl:"${ctx}/myconsole/templategroup/saveOrUpdate2",
  55. mtype : "POST",
  56. datatype : "json",
  57. caption:'模板组管理',
  58. prmNames : {
  59. id: "keyid", 
  60. oper:"oper",    
  61. addoper:"add",
  62. editoper:"edit",
  63. deloper:"del" 
  64. },
  65. colModel : [ {
  66. label : '模板组编号',
  67. name : 'keyid',
  68. hidden : true,
  69. editable: false,
  70. key : true,
  71. width : 80
  72. },{
  73. label : '模板组编号',
  74. name : 'templategroupid',
  75. editable: false,
  76. width : 80
  77. }, {
  78. label : '模板组名称',
  79. name : 'templategroupname',
  80. editable: true,
  81. width : 80,
  82. formoptions:{
  83. elmsuffix:'*'
  84. },
  85. editoptions: {
  86. maxlength: 15
  87. },
  88. editrules:{required:true}
  89. }, {
  90. label : '模板组描述',
  91. name : 'templategroupdesc',
  92. editable: true,
  93. width : 80,
  94. edittype : "textarea",
  95. editoptions: {
  96. size:50,
  97. maxlength: 500,
  98. rows:"5",
  99. cols:"40"
  100. }
  101. }, {
  102. label : '更新时间',
  103. name : 'updatetime',
  104. editable: false,
  105. width : 80
  106. },{
  107. label : '操作',
  108. name:'operMod',
  109. index:'operMod',
  110. align:"center",
  111. width:"40",
  112. formatter: function (cellvalue, options, rowdata) {
  113. var html = '<div><div class="filePicker">上传</div></div>';
  114. return html;
  115. }
  116. }],
  117. rownumbers : true,//添加左侧行号
  118. viewrecords : true,//是否在浏览导航栏显示记录总数
  119. rowNum : 10,//每页显示记录数
  120. rowList : [10,15,20,30,40,50 ],//用于改变显示行数的下拉列表框的元素数组。
  121. autowidth : true,
  122. height : 'auto',
  123. onSelectRow : function( rowid ) {
  124. if(rowid.length>10){
  125. var row = $(this).getRowData(rowid);
  126. $("#jqGrid").setColProp('templategroupkeyid',{editoptions:{value:row.templategroupid+":a"}});
  127. $("#jqGridSkin").setColProp('templategroupkeyid',{editoptions:{value:row.templategroupid+":a"}});
  128. $("#jqGridCss").setColProp('templategroupkeyid',{editoptions:{value:row.templategroupid+":a"}});
  129. $("#jqGrid").setCaption("模板管理--"+row.templategroupname);
  130. $("#jqGrid").jqGrid('setGridParam',{url: "${ctx}/myconsole/template/getByPage?templateGroupKeyID="+row.templategroupid});
  131. $("#jqGrid").trigger("reloadGrid");
  132. $("#jqGridSkin").jqGrid('setGridParam',{url: "${ctx}/myconsole/skin/getByPage?templateGroupKeyID="+row.templategroupid});
  133. $("#jqGridSkin").trigger("reloadGrid");
  134. $("#jqGridCss").jqGrid('setGridParam',{url: "${ctx}/myconsole/skin/getByPageCss?templateGroupKeyID="+row.templategroupid});
  135. $("#jqGridCss").trigger("reloadGrid");
  136. uploader.options.formData.templateGroupKeyID= row.templategroupid;
  137. }
  138. },
  139. loadComplete: function(){
  140. uploader = WebUploader.create({
  141. // 选完文件后,是否自动上传。
  142. auto: true,
  143. // swf文件路径
  144. swf: '${ctx}/assets/lib/webuploader/0.1.5/Uploader.swf',
  145. // 文件接收服务端。
  146. server: '${ctx}/myconsole/template/upload',
  147. // 选择文件的按钮。可选。
  148. // 内部根据当前运行是创建,可能是input元素,也可能是flash.
  149. pick: '.filePicker',
  150. duplicate: true,//可重复上传
  151. // 只允许选择图片文件。
  152. accept: {
  153. title: 'zips',
  154. extensions: 'zip',
  155. mimeTypes: '.zip'
  156. }
  157. });
  158. uploader.on('uploadSuccess', function( file ) {
  159. alert("上传成功");
  160. $("#jqGrid").trigger('reloadGrid');
  161. $("#jqGridSkin").trigger('reloadGrid');
  162. $("#jqGridCss").trigger('reloadGrid');
  163. });
  164. uploader.on('uploadError', function( file ) {
  165. alert("上传失败");
  166. });
  167. },
  168. pager : "#jqGridPagerGroup"
  169. });
  170. $('#jqGridGroup').navGrid('#jqGridPagerGroup',
  171. // the buttons to appear on the toolbar of the grid
  172. {
  173. edit : true,
  174. add : true,
  175. del : true,
  176. search : true,
  177. refresh : true,
  178. view : false,
  179. position : "left",
  180. cloneToTop : true
  181. },
  182. // options for the Edit Dialog
  183. {
  184. recreateForm : true,
  185. checkOnUpdate : true,
  186. checkOnSubmit : true,
  187. closeAfterEdit : true,
  188. onInitializeForm:function(formid) {
  189. },
  190. serializeEditData: function(postdata) {
  191. //myconsole.log(postdata);
  192. $.each(postdata,function (index, value) {
  193. //myconsole.log(index);
  194. if(index!="jqGrid_id" && index!="oper" && index!="id"){
  195. modifyJosnKey(postdata,index,"templateGroup."+index);
  196. }
  197. if(index=="id"){
  198. postdata["templateGroup."+index]=value;
  199. }
  200. })
  201. //myconsole.log(postdata);
  202. return postdata;
  203. },
  204. afterSubmit: function(r, data) {
  205. var messageString = r.responseText;
  206. var mesObj = eval('(' + messageString + ')');
  207. return [mesObj.state, mesObj.msg];
  208. },
  209. errorTextFormat : function(data) {
  210. return 'Error: ' + data.responseText;
  211. }
  212. },
  213. // options for the Add Dialog
  214. {
  215. closeAfterAdd : true,
  216. recreateForm : true,
  217. beforeSubmit: function(postdata, formid){
  218. $.each(postdata,function (index, value) {
  219. if(index!="jqGrid_id" && index!="oper"){
  220. modifyJosnKey(postdata,index,"templateGroup."+index);
  221. }
  222. })
  223. return[true,''];
  224. },
  225. afterSubmit: function(r, data) {
  226. var messageString = r.responseText;
  227. var mesObj = eval('(' + messageString + ')');
  228. return [mesObj.state, mesObj.msg];
  229. },
  230. errorTextFormat : function(data) {
  231. return 'Error: ' + data.responseText;
  232. }
  233. },
  234. // options for the Delete Dailog
  235. {
  236. errorTextFormat : function(data) {
  237. return 'Error: ' + data.responseText;
  238. }
  239. },{
  240. // search options 这里支持多条件查询
  241. multipleSearch: true,
  242. sopt:['eq','ne','cn','nc','lt','le','gt','ge'],
  243. afterSubmit: function(r, data) {
  244. var messageString = r.responseText;
  245. var mesObj = eval('(' + messageString + ')');
  246. return [mesObj.state, mesObj.message];
  247. }
  248. }
  249. );
  250. ///////////////////////////////////////////
  251. $("#jqGrid").jqGrid({
  252. url : '${ctx}/myconsole/template/getByPage',
  253. editurl:"${ctx}/myconsole/template/saveOrUpdate",
  254. mtype : "POST",
  255. datatype : "json",
  256. caption:'模板管理',
  257. prmNames : {
  258. id: "keyid", 
  259. oper:"oper",    
  260. addoper:"add",
  261. editoper:"edit",
  262. deloper:"del" 
  263. },
  264. colModel : [ {
  265. label : '模板编号',
  266. name : 'keyid',
  267. hidden : true,
  268. key : true,
  269. width : 50
  270. }, {
  271. label : '模板组编号',
  272. name : 'templategroupkeyid',
  273. hidden : true,
  274. editable : true,
  275. edittype :"select",
  276. editoptions:{value:"a:a"}
  277. }, {
  278. label : '文件名称',
  279. name : 'filename',
  280. editable: true,
  281. width : 80,
  282. formoptions:{
  283. elmsuffix:'* 必须以.html结尾'
  284. },
  285. editoptions: {
  286. maxlength: 15
  287. },
  288. editrules:{
  289. custom:true,
  290. custom_func:function (value, colname) {
  291. var strEnglishOrNum = /^([0-9a-zA-Z.-_]+)?$/;
  292. if(!strEnglishOrNum.test(value))
  293. return [false, colname+"应该为英文字母或者数字"];
  294.   else if (value=='')
  295. return [false,colname+" 不允许为空"];
  296. else if(!value.endsWith(".html"))
  297. return [false,colname+" 必须以.html结尾"];
  298. else
  299. return [true,""];
  300. }
  301. }
  302. }, {
  303. label : '模板名称',
  304. name : 'templatename',
  305. editable: true,
  306. width : 80,
  307. formoptions:{
  308. elmsuffix:'*'
  309. },
  310. editoptions: {
  311. maxlength: 15
  312. },
  313. editrules:{required:true}
  314. }, {
  315. label : '模板类型',
  316. name : 'templatetype',
  317. editable: true,
  318. formatter:"select",
  319. edittype: "select",
  320. editoptions: {
  321. value: "首页:首页;列表:列表;内容:内容"
  322. },
  323. stype:"select",
  324. searchoptions:{
  325. value: "首页:首页;列表:列表;内容:内容"
  326. },
  327. width : 80,
  328. }, {
  329. label : '内容区域宽度',
  330. name : 'contentwidth',
  331. editable: true,
  332. width : 80,
  333. formoptions:{
  334. elmsuffix:'像素整数'
  335. },
  336. editrules:{
  337. integer:true
  338. }
  339. }, {
  340. label : '更新时间',
  341. name : 'updatetime',
  342. editable: false,
  343. width : 80
  344. },{
  345. label : '操作',
  346. name:'operMod',
  347. index:'operMod',
  348. align:"center",
  349. width:"80",
  350. formatter: function (cellvalue, options, rowdata) {
  351. var html = "<button class='btn btn-success radius size-S' onclick=edit('"+rowdata.keyid+"')>编辑</button>";
  352. html += "&nbsp;<button class='btn btn-success radius size-S' onclick=dynamic('"+rowdata.keyid+"')>动态化</button>";
  353. //html += "&nbsp;<button class='btn btn-success radius size-S' onclick=design('"+rowdata.filename+"')>设计</button>";
  354. return html;
  355. }
  356. }],
  357. rownumbers : true,//添加左侧行号
  358. viewrecords : true,//是否在浏览导航栏显示记录总数
  359. rowNum : 10,//每页显示记录数
  360. rowList : [10,15,20,30,40,50 ],//用于改变显示行数的下拉列表框的元素数组。
  361. autowidth : true,
  362. height : 'auto',
  363. pager : "#jqGridPager"
  364. });
  365. $('#jqGrid').navGrid('#jqGridPager',
  366. //the buttons to appear on the toolbar of the grid
  367. {
  368. edit : true,
  369. add : true,
  370. del : true,
  371. search : true,
  372. refresh : true,
  373. view : false,
  374. position : "left",
  375. cloneToTop : true
  376. },
  377. //options for the Edit Dialog
  378. {
  379. recreateForm : true,
  380. checkOnUpdate : true,
  381. checkOnSubmit : true,
  382. closeAfterEdit : true,
  383. onInitializeForm:function(formid) {
  384. },
  385. serializeEditData: function(postdata) {
  386. //myconsole.log(postdata);
  387. $.each(postdata,function (index, value) {
  388. //myconsole.log(index);
  389. if(index!="jqGrid_id" && index!="oper" && index!="id"){
  390. modifyJosnKey(postdata,index,"template."+index);
  391. }
  392. if(index=="id"){
  393. postdata["template."+index]=value;
  394. }
  395. })
  396. //myconsole.log(postdata);
  397. return postdata;
  398. },
  399. afterSubmit: function(r, data) {
  400. var messageString = r.responseText;
  401. var mesObj = eval('(' + messageString + ')');
  402. return [mesObj.state, mesObj.msg];
  403. },
  404. errorTextFormat : function(data) {
  405. return 'Error: ' + data.responseText;
  406. }
  407. },
  408. //options for the Add Dialog
  409. {
  410. closeAfterAdd : true,
  411. recreateForm : true,
  412. beforeSubmit: function(postdata, formid){
  413. $.each(postdata,function (index, value) {
  414. if(index!="jqGrid_id" && index!="oper"){
  415. modifyJosnKey(postdata,index,"template."+index);
  416. }
  417. })
  418. return[true,''];
  419. },
  420. afterSubmit: function(r, data) {
  421. var messageString = r.responseText;
  422. var mesObj = eval('(' + messageString + ')');
  423. return [mesObj.state, mesObj.msg];
  424. },
  425. errorTextFormat : function(data) {
  426. return 'Error: ' + data.responseText;
  427. }
  428. },
  429. //options for the Delete Dailog
  430. {
  431. errorTextFormat : function(data) {
  432. return 'Error: ' + data.responseText;
  433. }
  434. },{
  435. // search options 这里支持多条件查询
  436. multipleSearch: true,
  437. sopt:['eq','ne','cn','nc','lt','le','gt','ge'],
  438. afterSubmit: function(r, data) {
  439. var messageString = r.responseText;
  440. var mesObj = eval('(' + messageString + ')');
  441. return [mesObj.state, mesObj.message];
  442. }
  443. }
  444. );
  445. ///////////////////////////////////////////
  446. $("#jqGridCss").jqGrid({
  447. url : '${ctx}/myconsole/skin/getByPageCss',
  448. editurl:"${ctx}/myconsole/skin/saveOrUpdate",
  449. mtype : "POST",
  450. datatype : "json",
  451. caption:'样式管理',
  452. prmNames : {
  453. id: "keyid", 
  454. oper:"oper",    
  455. addoper:"add",
  456. editoper:"edit",
  457. deloper:"del" 
  458. },
  459. colModel : [ {
  460. label : '模板编号',
  461. name : 'keyid',
  462. hidden : true,
  463. key : true,
  464. width : 50
  465. }, {
  466. label : '模板组编号',
  467. name : 'templategroupkeyid',
  468. hidden : true,
  469. editable : true,
  470. edittype :"select" ,
  471. editoptions:{value:"a:a"}
  472. }, {
  473. label : '文件名称',
  474. name : 'filename',
  475. editable: true,
  476. width : 80,
  477. formoptions:{
  478. elmsuffix:'* 必须以.css结尾'
  479. },
  480. editoptions: {
  481. maxlength: 15
  482. },
  483. editrules:{
  484. custom:true,
  485. custom_func:function (value, colname) {
  486. var strEnglishOrNum = /^([0-9a-zA-Z.]+)?$/;
  487. if(!strEnglishOrNum.test(value))
  488. return [false, colname+"应该为英文字母或者数字"];
  489.   else if (value=='')
  490. return [false,colname+" 不允许为空"];
  491. else if(!value.endsWith(".css"))
  492. return [false,colname+" 必须以.css结尾"];
  493. else
  494. return [true,""];
  495. }
  496. }
  497. }, {
  498. label : '样式名称',
  499. name : 'templatename',
  500. editable: true,
  501. width : 80,
  502. formoptions:{
  503. elmsuffix:'*'
  504. },
  505. editoptions: {
  506. maxlength: 15
  507. },
  508. editrules:{required:true}
  509. }, {
  510. label : '说明 ',
  511. name : 'readme',
  512. editable: true,
  513. width : 180,
  514. edittype : "textarea",
  515. editoptions: {
  516. maxlength: 1000
  517. }
  518. } , {
  519. label : '更新时间',
  520. name : 'updatetime',
  521. editable: false,
  522. width : 80
  523. } ,{
  524. label : '操作',
  525. name:'operMod',
  526. index:'operMod',
  527. align:"center",
  528. width:"80",
  529. formatter: function (cellvalue, options, rowdata) {
  530. var html = "<button class='btn btn-success radius size-S' onclick=editCss('"+rowdata.keyid+"','css')>编辑</button>";
  531. return html;
  532. }
  533. }],
  534. rownumbers : true,//添加左侧行号
  535. viewrecords : true,//是否在浏览导航栏显示记录总数
  536. rowNum : 10,//每页显示记录数
  537. rowList : [10,15,20,30,40,50 ],//用于改变显示行数的下拉列表框的元素数组。
  538. autowidth : true,
  539. height : 'auto',
  540. pager : "#jqGridPagerCss"
  541. });
  542. $('#jqGridCss').navGrid('#jqGridPagerCss',
  543. // the buttons to appear on the toolbar of the grid
  544. {
  545. edit : true,
  546. add : true,
  547. del : true,
  548. search : true,
  549. refresh : true,
  550. view : true,
  551. position : "left",
  552. cloneToTop : true
  553. },
  554. // options for the Edit Dialog
  555. {
  556. recreateForm : true,
  557. checkOnUpdate : true,
  558. checkOnSubmit : true,
  559. closeAfterEdit : true,
  560. onInitializeForm:function(formid) {
  561. },
  562. serializeEditData: function(postdata) {
  563. //myconsole.log(postdata);
  564. $.each(postdata,function (index, value) {
  565. //myconsole.log(index);
  566. if(index!="jqGrid_id" && index!="oper" && index!="keyid"){
  567. modifyJosnKey(postdata,index,"skin."+index);
  568. }
  569. if(index=="keyid"){
  570. postdata["skin."+index]=value
  571. }
  572. })
  573. //myconsole.log(postdata);
  574. return postdata;
  575. },
  576. afterSubmit: function (response, postdata) {
  577. // console.log(response);
  578. var res=eval('(' + response.responseText + ')');
  579. //layer.msg(res.msg);
  580. return [res.state,res.msg,''];
  581. },
  582. errorTextFormat : function(data) {
  583. return 'Error: ' + data.responseText
  584. }
  585. },
  586. // options for the Add Dialog
  587. {
  588. closeAfterAdd : true,
  589. recreateForm : true,
  590. beforeSubmit: function(postdata, formid){
  591. $.each(postdata,function (index, value) {
  592. if(index!="jqGrid_id" && index!="oper"){
  593. modifyJosnKey(postdata,index,"skin."+index);
  594. }
  595. })
  596. return[true,''];
  597. },
  598. afterSubmit: function (response, postdata) {
  599. // console.log(response);
  600. var res=eval('(' + response.responseText + ')');
  601. return [res.state,res.msg,''];
  602. },
  603. errorTextFormat : function(data) {
  604. return 'Error: ' + data.responseText
  605. }
  606. },
  607. // options for the Delete Dailog
  608. {
  609. errorTextFormat : function(data) {
  610. return 'Error: ' + data.responseText
  611. }
  612. },{
  613. // search options 这里支持多条件查询
  614. multipleSearch: true,
  615. sopt:['eq','ne','cn','nc','lt','le','gt','ge'],
  616. afterSubmit: function(r, data) {
  617. var messageString = r.responseText;
  618. var mesObj = eval('(' + messageString + ')');
  619. return [mesObj.state, mesObj.message];
  620. }
  621. }
  622. );
  623. ///////////////////////////////////////////
  624. $("#jqGridSkin").jqGrid({
  625. url : '${ctx}/myconsole/skin/getByPage',
  626. editurl:"${ctx}/myconsole/skin/saveOrUpdate",
  627. mtype : "POST",
  628. datatype : "json",
  629. caption:'换肤样式管理',
  630. prmNames : {
  631. id: "keyid", 
  632. oper:"oper",    
  633. addoper:"add",
  634. editoper:"edit",
  635. deloper:"del" 
  636. },
  637. colModel : [ {
  638. label : '模板编号',
  639. name : 'keyid',
  640. hidden : true,
  641. key : true,
  642. width : 50
  643. }, {
  644. label : '模板组编号',
  645. name : 'templategroupkeyid',
  646. hidden : true,
  647. editable : true,
  648. edittype :"select" ,
  649. editoptions:{value:"a:a"}
  650. }, {
  651. label : '文件名称',
  652. name : 'filename',
  653. editable: true,
  654. width : 80,
  655. formoptions:{
  656. elmsuffix:'* 必须以.css结尾'
  657. },
  658. editoptions: {
  659. maxlength: 15
  660. },
  661. editrules:{
  662. custom:true,
  663. custom_func:function (value, colname) {
  664. var strEnglishOrNum = /^([0-9a-zA-Z.]+)?$/;
  665. if(!strEnglishOrNum.test(value))
  666. return [false, colname+"应该为英文字母或者数字"];
  667.   else if (value=='')
  668. return [false,colname+" 不允许为空"];
  669. else if(!value.endsWith(".css"))
  670. return [false,colname+" 必须以.css结尾"];
  671. else
  672. return [true,""];
  673. }
  674. }
  675. }, {
  676. label : '样式名称',
  677. name : 'templatename',
  678. editable: true,
  679. width : 80,
  680. formoptions:{
  681. elmsuffix:'*'
  682. },
  683. editoptions: {
  684. maxlength: 15
  685. },
  686. editrules:{required:true}
  687. }, {
  688. label : '说明 ',
  689. name : 'readme',
  690. editable: true,
  691. width : 180,
  692. edittype : "textarea",
  693. editoptions: {
  694. maxlength: 1000
  695. }
  696. } , {
  697. label : '更新时间',
  698. name : 'updatetime',
  699. editable: false,
  700. width : 80
  701. } ,{
  702. label : '操作',
  703. name:'operMod',
  704. index:'operMod',
  705. align:"center",
  706. width:"80",
  707. formatter: function (cellvalue, options, rowdata) {
  708. var html = "<button class='btn btn-success radius size-S' onclick=editCss('"+rowdata.keyid+"','skin')>编辑</button>";
  709. return html;
  710. }
  711. }],
  712. rownumbers : true,//添加左侧行号
  713. viewrecords : true,//是否在浏览导航栏显示记录总数
  714. rowNum : 10,//每页显示记录数
  715. rowList : [10,15,20,30,40,50 ],//用于改变显示行数的下拉列表框的元素数组。
  716. autowidth : true,
  717. height : 'auto',
  718. pager : "#jqGridPagerSkin"
  719. });
  720. $('#jqGridSkin').navGrid('#jqGridPagerSkin',
  721. // the buttons to appear on the toolbar of the grid
  722. {
  723. edit : true,
  724. add : true,
  725. del : true,
  726. search : true,
  727. refresh : true,
  728. view : true,
  729. position : "left",
  730. cloneToTop : true
  731. },
  732. // options for the Edit Dialog
  733. {
  734. recreateForm : true,
  735. checkOnUpdate : true,
  736. checkOnSubmit : true,
  737. closeAfterEdit : true,
  738. onInitializeForm:function(formid) {
  739. },
  740. serializeEditData: function(postdata) {
  741. //myconsole.log(postdata);
  742. $.each(postdata,function (index, value) {
  743. //myconsole.log(index);
  744. if(index!="jqGrid_id" && index!="oper" && index!="keyid"){
  745. modifyJosnKey(postdata,index,"skin."+index);
  746. }
  747. if(index=="keyid"){
  748. postdata["skin."+index]=value
  749. }
  750. })
  751. //myconsole.log(postdata);
  752. return postdata;
  753. },
  754. afterSubmit: function (response, postdata) {
  755. // console.log(response);
  756. var res=eval('(' + response.responseText + ')');
  757. //layer.msg(res.msg);
  758. return [res.state,res.msg,''];
  759. },
  760. errorTextFormat : function(data) {
  761. return 'Error: ' + data.responseText
  762. }
  763. },
  764. // options for the Add Dialog
  765. {
  766. closeAfterAdd : true,
  767. recreateForm : true,
  768. beforeSubmit: function(postdata, formid){
  769. $.each(postdata,function (index, value) {
  770. if(index!="jqGrid_id" && index!="oper"){
  771. modifyJosnKey(postdata,index,"skin."+index);
  772. }
  773. })
  774. return[true,''];
  775. },
  776. afterSubmit: function (response, postdata) {
  777. // console.log(response);
  778. var res=eval('(' + response.responseText + ')');
  779. return [res.state,res.msg,''];
  780. },
  781. errorTextFormat : function(data) {
  782. return 'Error: ' + data.responseText
  783. }
  784. },
  785. // options for the Delete Dailog
  786. {
  787. errorTextFormat : function(data) {
  788. return 'Error: ' + data.responseText
  789. }
  790. },{
  791. // search options 这里支持多条件查询
  792. multipleSearch: true,
  793. sopt:['eq','ne','cn','nc','lt','le','gt','ge'],
  794. afterSubmit: function(r, data) {
  795. var messageString = r.responseText;
  796. var mesObj = eval('(' + messageString + ')');
  797. return [mesObj.state, mesObj.message];
  798. }
  799. }
  800. );
  801. })
  802. function edit(tempID){
  803. $.post("${ctx}/myconsole/template/edit",{"tempID":tempID},function(data){
  804. var index=layer.open({
  805. type: 1,
  806. title: '编辑模板',
  807. btn: ['保存','取消'],
  808. yes:function(index, layero){
  809. $.post("${ctx}/myconsole/template/save",{"tempID":tempID,"tempContent":editor.getValue()},function(data){
  810. layer.close(index);
  811. layer.msg(data);
  812. })
  813. },
  814. // skin: 'layui-layer-rim', //加上边框
  815. area: ['90%', '90%'], //宽高
  816. content: '<textarea id="code">'+data+'</textarea>',
  817. success:function(layero, index){
  818. window.editor = CodeMirror.fromTextArea(document.getElementById('code'), {
  819. mode: "text/html",
  820. styleActiveLine: true, //line选择是是否加亮
  821. lineNumbers: true, //是否显示行数
  822. lineWrapping: true //是否自动换行
  823. });
  824. $(".CodeMirror-gutter-wrapper").css("left","-35px");
  825. }
  826. });
  827. })
  828. }
  829. function editCss(skinID,type){
  830. $.post("${ctx}/myconsole/skin/edit",{"skinID":skinID,"type":type},function(data){
  831. var index=layer.open({
  832. type: 1,
  833. title: '编辑模板',
  834. btn: ['保存','取消'],
  835. yes:function(index, layero){
  836. $.post("${ctx}/myconsole/skin/save",{"skinID":skinID,"type":type,"tempContent":editor.getValue()},function(data){
  837. layer.close(index);
  838. layer.msg(data);
  839. })
  840. },
  841. // skin: 'layui-layer-rim', //加上边框
  842. area: ['90%', '90%'], //宽高
  843. content: '<textarea id="code">'+data+'</textarea>',
  844. success:function(layero, index){
  845. window.editor = CodeMirror.fromTextArea(document.getElementById('code'), {
  846. mode: "text/html",
  847. styleActiveLine: true, //line选择是是否加亮
  848. lineNumbers: true, //是否显示行数
  849. lineWrapping: true //是否自动换行
  850. });
  851. $(".CodeMirror-gutter-wrapper").css("left","-35px");
  852. }
  853. });
  854. })
  855. }
  856. function dynamic(tempID){
  857. $.post("${ctx}/myconsole/template/query",{"tempID":tempID},function(data){
  858. if(data=="NO"){
  859. alert("请设置模板类型");
  860. }else{
  861. window.open("${ctx}/myconsole/dynamic?tempID="+tempID);
  862. }
  863. })
  864. }
  865. function design(tmpFile){
  866. window.open("${ctx}/myconsole/design?tmpFile="+tmpFile);
  867. }
  868. </script>
  869. <title>我的桌面</title>
  870. </head>
  871. <body>
  872. <div class="page-container">
  873. <table id="jqGridGroup"></table>
  874. <div id="jqGridPagerGroup"></div>
  875. <div>&nbsp;</div>
  876. <table id="jqGrid"></table>
  877. <div id="jqGridPager"></div>
  878. <div>&nbsp;</div>
  879. <table id="jqGridCss"></table>
  880. <div id="jqGridPagerCss"></div>
  881. <div>&nbsp;</div>
  882. <table id="jqGridSkin"></table>
  883. <div id="jqGridPagerSkin"></div>
  884. </div>
  885. <footer class="footer mt-20">
  886. <div class="container">
  887. <p></p>
  888. </div>
  889. </footer>
  890. </body>
  891. </html>