home_new_edit.html 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255
  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <include file="./Application/Admin/View/head.html"/>
  5. <link rel="stylesheet" type="text/css" href="/Public/lib/bootstrap-Switch/bootstrapSwitch.css"/>
  6. <link rel="stylesheet" type="text/css" href="/Public/plugins/uploadify/uploadify.css">
  7. <link rel="stylesheet" type="text/css" href="/Public/plugins/css/tinyselect.css">
  8. <style type="text/css">
  9. form .row input {
  10. width: 250px;
  11. }
  12. * {
  13. margin: 0;
  14. padding: 0;
  15. }
  16. .citys {
  17. margin-bottom: 10px;
  18. }
  19. .citys p {
  20. line-height: 28px;
  21. }
  22. .warning {
  23. color: #c00;
  24. }
  25. table a {
  26. margin-right: 8px;
  27. color: #369;
  28. }
  29. .c_img {
  30. width: 240px;
  31. height: auto;
  32. }
  33. </style>
  34. </head>
  35. <body>
  36. <article class="page-container">
  37. <form action="" method="post" class="form form-horizontal" id="edit">
  38. <div class="row cl">
  39. <label class="form-label col-xs-2 col-sm-2">类型:</label>
  40. <div class="formControls col-xs-10 col-sm-10">
  41. <select id="type" name="type" class="select" style="width:250px;">
  42. <option value="0">请选择类型</option>
  43. <foreach name="type" item="v" key="k">
  44. <option value="{$k}"
  45. <if condition="$k eq $data['type']">selected="selected"</if>
  46. style="margin-left:55px;">{$v}</option>
  47. </foreach>
  48. </select>
  49. </div>
  50. </div>
  51. <div class="row cl">
  52. <label class="form-label col-xs-2 col-sm-2"><span class="c-red">*</span>标题:</label>
  53. <div class="formControls col-xs-10 col-sm-10">
  54. <input type="text" class="input-text" placeholder="请输入标题" id="title" name="title" value="{$data['title']}"/>
  55. </div>
  56. </div>
  57. <div class="row cl">
  58. <label class="form-label col-xs-2 col-sm-2">作者:</label>
  59. <div class="formControls col-xs-10 col-sm-10">
  60. <input type="text" class="input-text" placeholder="请输入作者" id="author" name="author" value="{$data['author']}"/>
  61. </div>
  62. </div>
  63. <div class="row cl">
  64. <label class="form-label col-xs-2 col-sm-2">来源:</label>
  65. <div class="formControls col-xs-10 col-sm-10">
  66. <input type="text" class="input-text" placeholder="请输入来源" id="source" name="source" value="{$data['source']}"/>
  67. </div>
  68. </div>
  69. <div class="row cl">
  70. <label class="form-label col-xs-2 col-sm-2">相关门店:</label>
  71. <div class="formControls col-xs-10 col-sm-10">
  72. <select id="store_id" name="store_id" class="select" style="width:250px;">
  73. <option value="0">请选择门店</option>
  74. <foreach name="store" item="v" key="k">
  75. <option value="{$v['id']}"
  76. <if condition="$v['id'] eq $data['store_id']">selected="selected"</if>
  77. style="margin-left:55px;">{$v['name']}</option>
  78. </foreach>
  79. </select>
  80. </div>
  81. </div>
  82. <div class="row cl">
  83. <label class="form-label col-xs-2 col-sm-2">首页推荐:</label>
  84. <div class="formControls col-xs-10 col-sm-10">
  85. <select id="is_recommend" name="is_recommend" class="select" style="width:250px;">
  86. <foreach name="recommend" item="v" key="k">
  87. <option value="{$k}"
  88. <if condition="$k eq $data['is_recommend']">selected="selected"</if>
  89. style="margin-left:55px;">{$v}</option>
  90. </foreach>
  91. </select>
  92. </div>
  93. </div>
  94. <div class="row cl">
  95. <label class="form-label col-xs-2 col-sm-2"><span class="c-red">*</span>封面图片:</label>
  96. <div class="formControls col-xs-10 col-sm-10">
  97. <div><span class="c-red">尺寸:360×200</span></div>
  98. <input id="img" type="hidden" class="imgInput" value="{$data.img}" name="img" />
  99. <input type="button" class="imgUpload btn btn-danger radius" value="上传" style="width: 50px;"/>
  100. <input type="file" style="display: none;" class="imgFile">
  101. <div class="imgView" style="margin-top: 10px;">
  102. <if condition="$data['img'] neq ''">
  103. <img class="c_img" src="{$data.img}">
  104. </if>
  105. </div>
  106. </div>
  107. </div>
  108. <div class="row cl">
  109. <label class="form-label col-xs-2 col-sm-2">官网banner图:</label>
  110. <div class="formControls col-xs-10 col-sm-10">
  111. <div><span class="c-red">尺寸:1920×605</span></div>
  112. <input id="home_img" type="hidden" class="imgInput" value="{$data.home_img}" name="home_img" />
  113. <input type="button" class="imgUpload btn btn-danger radius" value="上传" style="width: 50px;"/>
  114. <input type="file" style="display: none;" class="imgFile">
  115. <div class="imgView" style="margin-top: 10px;">
  116. <if condition="$data['home_img'] neq ''">
  117. <img class="c_img" src="{$data.home_img}">
  118. </if>
  119. </div>
  120. </div>
  121. </div>
  122. <div class="row cl">
  123. <label class="form-label col-xs-2 col-sm-2"><span class="c-red">*</span>简介说明:</label>
  124. <div class="formControls col-xs-10 col-sm-10">
  125. <textarea class="textarea" id="desc" name="desc">{$data.desc}</textarea>
  126. </div>
  127. </div>
  128. <div class="row cl">
  129. <label class="form-label col-xs-2 col-sm-2"><span class="c-red">*</span>内容:</label>
  130. <div class="formControls col-xs-10 col-sm-10">
  131. <!-- 加载编辑器的容器 -->
  132. <script id="content" name="content" type="text/plain">{:htmlspecialchars_decode($data['content'])}</script>
  133. </div>
  134. </div>
  135. <div class="row cl">
  136. <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
  137. <input type="hidden" class="input-text" value="{$data.id}" placeholder="" id="id" name="id"/>
  138. <button type="submit" class="btn btn-success radius" id="save" name="save"><i class="icon-ok"></i> 确定</button>
  139. </div>
  140. </div>
  141. </form>
  142. </article>
  143. <!--_footer 作为公共模版分离出去-->
  144. <include file="./Application/Admin/View/foot.html"/>
  145. <!--/_footer /作为公共模版分离出去-->
  146. <script>
  147. //下面js课用于多个图片异步上传,无需重复
  148. $(document).on('click','.imgUpload',function(){
  149. $(this).siblings('.imgFile').trigger('click');
  150. });
  151. $(document).on('change','.imgFile',function(e){
  152. var imgFile = $(this);
  153. var reader = new FileReader();
  154. reader.onload = (function (file) {
  155. return function (e) {
  156. var imgBase64 = this.result;
  157. $.ajax({
  158. type: "post",
  159. url: "/Admin/common/upload_upyun",
  160. dataType:'json',
  161. data: {
  162. img: imgBase64
  163. },
  164. success: function(data) {
  165. if (data.status == '1') {
  166. $(imgFile).siblings('.imgInput').val(data.info);
  167. var html = '<img src="' + data.info + '" style="width:240px;height:auto;" >';
  168. $(imgFile).siblings('.imgView').html(html);
  169. }
  170. }
  171. });
  172. };
  173. })(e.target.files[0]);
  174. reader.readAsDataURL(e.target.files[0]);
  175. });
  176. </script>
  177. <!-- 配置文件 -->
  178. <script type="text/javascript" src="/Public/ueditor/ueditor.config.js"></script>
  179. <!-- 编辑器源码文件 -->
  180. <script type="text/javascript" src="/Public/ueditor/ueditor.all.js"></script>
  181. <!-- 实例化编辑器 -->
  182. <script>
  183. var ue = UE.getEditor('content', {
  184. enterTag: 'Br',
  185. autoHeightEnabled: true,
  186. initialFrameWidth: 700, //初始化编辑器宽度,默认1000
  187. initialFrameHeight: 200 //初始化编辑器高度,默认320
  188. });
  189. $().ready(function () {
  190. $("#edit").validate({
  191. rules: {
  192. title: {required: true},
  193. type: {required: true},
  194. desc: {required: true},
  195. img: {required: true},
  196. content: {required: true}
  197. },
  198. success: "valid",
  199. submitHandler: function () {
  200. $("#save").attr('disabled', true);
  201. var data = {
  202. id: $('#id').val(),
  203. title: $('#title').val(),
  204. img: $('#img').val(),
  205. home_img: $('#home_img').val(),
  206. desc: $('#desc').val(),
  207. content: UE.getEditor('content').getContent(),
  208. is_recommend: $('#is_recommend').val(),
  209. type: $('#type').val(),
  210. store_id: $('#store_id').val(),
  211. source: $('#source').val(),
  212. author: $('#author').val()
  213. };
  214. $.ajax({
  215. type: "post",
  216. url: "{:U(CONTROLLER_NAME . '/' . ACTION_NAME)}",
  217. data: {data: data},
  218. success: function (data) {
  219. if (data.status == '1') {
  220. //加载层-风格3
  221. parent.layer.load(2);
  222. parent.layer.msg(data.info, {icon: 1});
  223. parent.location.reload();
  224. var index = parent.layer.getFrameIndex(window.name);
  225. parent.layer.close(index);
  226. } else if (data.status == '0') {
  227. parent.layer.msg(data.info, {icon: 2});
  228. }
  229. $("#save").removeAttr('disabled');
  230. }
  231. });
  232. }
  233. });
  234. });
  235. </script>
  236. </body>
  237. </html>