modifyspecial.html 9.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224
  1. <extend name="Public:base" />
  2. <block name="content">
  3. <link rel="stylesheet" href="__PUBLIC__/css/special.css" />
  4. <div class="page-header">
  5. <h1>
  6. {$breadcrumb2}
  7. <small>
  8. <i class="icon-double-angle-right"></i>
  9. {$crumbs}
  10. </small>
  11. </h1>
  12. </div>
  13. <div class="row">
  14. <div class="col-xs-12">
  15. <div class="alert alert-block alert-success">
  16. 1.点击右侧组件的<strong>“添加”</strong>按钮,增加对应类型版块到页面,其中<strong>“广告条版块”</strong>只能添加一个。<br/>
  17. 2. 鼠标触及左侧页面对应版块,出现操作类链接,可以对该区域块进行<strong>“移动”、“启用/禁用”、“编辑”、“删除”</strong>操作。<br/>
  18. 3.新增加的版块内容默认为<strong>“禁用”</strong>状态,编辑内容并<strong>“启用”</strong>该块后将在手机端即时显示。<br/>
  19. </div>
  20. </div>
  21. </div>
  22. <div class="row">
  23. <div class="page">
  24. <div class="fixed-empty"></div>
  25. <!-- 列表 -->
  26. <div class="mb-special-layout">
  27. <div class="mb-item-box">
  28. <div id="item_list" class="item-list">
  29. <?php if(!empty($list) && is_array($list)) {?>
  30. <?php foreach($list as $key => $value) {?>
  31. <div nctype="special_item" class="special-item <?php echo $value['item_type'];?> <?php echo $value['usable_class'];?>" data-item-id="<?php echo $value['item_id'];?>">
  32. <div class="item_type"><?php echo $module_list[$value['item_type']]['desc'];?></div>
  33. <?php $item_data = $value['item_data'];?>
  34. <?php $item_edit_flag = false;?>
  35. <div id="item_edit_content">
  36. <?php
  37. if($value['item_type'] == 'adv_list'){
  38. ?>
  39. <include file="Special:mb_special_item.module_adv_list" />
  40. <?php
  41. }else if($value['item_type'] == 'home1'){
  42. ?>
  43. <include file="Special:mb_special_item.module_home1" />
  44. <?php
  45. } else if($value['item_type'] == 'home2'){
  46. ?>
  47. <include file="Special:mb_special_item.module_home2" />
  48. <?php
  49. } else if($value['item_type'] == 'home3'){
  50. ?>
  51. <include file="Special:mb_special_item.module_home3" />
  52. <?php
  53. } else if($value['item_type'] == 'home4'){
  54. ?>
  55. <include file="Special:mb_special_item.module_home4" />
  56. <?php
  57. }else if($value['item_type'] == 'goods'){
  58. ?>
  59. <include file="Special:mb_special_item.module_goods" />
  60. <?php
  61. }
  62. ?>
  63. </div>
  64. <div class="handle"><a nctype="btn_move_up" href="javascript:;"><i class="icon-arrow-up"></i>上移</a> <a nctype="btn_move_down" href="javascript:;"><i class="icon-arrow-down"></i>下移</a> <a nctype="btn_usable" data-item-id="<?php echo $value['item_id'];?>" href="javascript:;"><i class="icon-off"></i><?php echo $value['usable_text'];?></a> <a nctype="btn_edit_item" data-item-id="<?php echo $value['item_id'];?>" href="javascript:;"><i class="icon-edit"></i>编辑</a> <a nctype="btn_del_item" data-item-id="<?php echo $value['item_id'];?>" href="javascript:;"><i class="icon-trash"></i>删除</a></div>
  65. </td>
  66. </div>
  67. <?php } ?>
  68. <?php } ?>
  69. </div>
  70. </div>
  71. <div class="module-list">
  72. <div class="module_adv_list"> <span>广告条版块</span> <a nctype="btn_add_item" class="add" href="javascript:;" data-module-type="adv_list">添加</a> </div>
  73. <div class="module_home1"> <span>模型版块布局A</span> <a nctype="btn_add_item" class="add" href="javascript:;" data-module-type="home1">添加</a> </div>
  74. <div class="module_home2"> <span>模型版块布局B</span> <a nctype="btn_add_item" class="add" href="javascript:;" data-module-type="home2">添加</a> </div>
  75. <div class="module_home3"> <span>模型版块布局C</span> <a nctype="btn_add_item" class="add" href="javascript:;" data-module-type="home3">添加</a> </div>
  76. <div class="module_home4"> <span>模型版块布局D</span> <a nctype="btn_add_item" class="add" href="javascript:;" data-module-type="home4">添加</a> </div>
  77. <div class="module_goods" style="display:none;"> <span>商品版块</span> <a nctype="btn_add_item" class="add" href="javascript:;" data-module-type="goods">添加</a> </div>
  78. </div>
  79. </div>
  80. </div>
  81. </div>
  82. </block>
  83. <block name="javascript">
  84. <script type="text/javascript" src="__PUBLIC__/js/jquery.ui.js"></script>
  85. <script>
  86. var special_id = {$special_id};
  87. var url_item_add = "{:U('Special/special_item_add')}";
  88. var url_item_del = "{:U('Special/special_item_del')}";
  89. var url_item_edit = "{:U('Special/special_item_edit')}";
  90. $(document).ready(function(){
  91. //添加模块
  92. $('[nctype="btn_add_item"]').on('click', function() {
  93. var data = {
  94. special_id: special_id,
  95. item_type: $(this).attr('data-module-type')
  96. };
  97. $.post(url_item_add, data, function(data) {
  98. if(typeof data.error === 'undefined') {
  99. location.reload();
  100. } else {
  101. alert(data.error);
  102. }
  103. }, "json");
  104. });
  105. //删除模块
  106. $('#item_list').on('click', '[nctype="btn_del_item"]', function() {
  107. if(!confirm('确认删除?')) {
  108. return false;
  109. }
  110. var $this = $(this);
  111. var item_id = $this.attr('data-item-id');
  112. $.post(url_item_del, {item_id: item_id, special_id: special_id} , function(data) {
  113. if(typeof data.error === 'undefined') {
  114. $this.parents('.special-item').remove();
  115. } else {
  116. alert(data.error);
  117. }
  118. }, "json");
  119. });
  120. //编辑模块
  121. $('#item_list').on('click', '[nctype="btn_edit_item"]', function() {
  122. var item_id = $(this).attr('data-item-id');
  123. location.href = (url_item_edit + '&item_id=' + item_id);
  124. return false;
  125. });
  126. //上移
  127. $('#item_list').on('click', '[nctype="btn_move_up"]', function() {
  128. var $current = $(this).parents('[nctype="special_item"]');
  129. $prev = $current.prev('[nctype="special_item"]');
  130. if($prev.length > 0) {
  131. $prev.before($current);
  132. update_item_sort();
  133. } else {
  134. alert('已经是第一个了');
  135. }
  136. });
  137. //下移
  138. $('#item_list').on('click', '[nctype="btn_move_down"]', function() {
  139. var $current = $(this).parents('[nctype="special_item"]');
  140. $next = $current.next('[nctype="special_item"]');
  141. if($next.length > 0) {
  142. $next.after($current);
  143. update_item_sort();
  144. } else {
  145. alert('已经是最后一个了');
  146. }
  147. });
  148. $('#btn_mb_special_goods_search').on('click', function() {
  149. var url = '{:U("Special/goods_list")}';
  150. var keyword = $('#txt_goods_name').val();
  151. if(keyword) {
  152. $('#mb_special_goods_list').load(url, {keyword: keyword});
  153. }
  154. });
  155. $('#mb_special_goods_list').on('click', '[nctype="btn_add_goods"]', function() {
  156. var item = {};
  157. item.goods_id = $(this).attr('data-goods-id');
  158. item.goods_name = $(this).attr('data-goods-name');
  159. item.goods_price = $(this).attr('data-goods-price');
  160. item.goods_image = $(this).attr('data-goods-image');
  161. var html = template.render('item_goods_template', item);
  162. $('[nctype="item_content"]').append(html);
  163. });
  164. var update_item_sort = function() {
  165. var item_id_string = '';
  166. $item_list = $('#item_list').find('[nctype="special_item"]');
  167. $item_list.each(function(index, item) {
  168. item_id_string += $(item).attr('data-item-id') + ',';
  169. });
  170. $.post("{:U('Special/update_item_sort')}", {special_id: special_id, item_id_string: item_id_string}, function(data) {
  171. if(typeof data.error != 'undefined') {
  172. alert(data.message);
  173. }
  174. }, 'json');
  175. };
  176. //启用/禁用控制
  177. $('#item_list').on('click', '[nctype="btn_usable"]', function() {
  178. var $current = $(this).parents('[nctype="special_item"]');
  179. var item_id = $current.attr('data-item-id');
  180. var usable = '';
  181. if($current.hasClass('usable')) {
  182. $current.removeClass('usable');
  183. $current.addClass('unusable');
  184. usable = 'unusable';
  185. $(this).html('<i class="icon-off"></i>启用');
  186. } else {
  187. $current.removeClass('unusable');
  188. $current.addClass('usable');
  189. usable = 'usable';
  190. $(this).html('<i class="icon-off"></i>禁用');
  191. }
  192. $.post("{:U('Special/update_item_usable')}", {item_id: item_id, usable: usable, special_id: special_id}, function(data) {
  193. if(typeof data.error != 'undefined') {
  194. alert(data.message);
  195. }
  196. }, 'json');
  197. });
  198. });
  199. </script>
  200. </block>