selecturl.html 9.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218
  1. <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
  2. <ul class="layui-tab-title">
  3. <li class="layui-this">商城</li>
  4. <li>商品</li>
  5. <li>文章</li>
  6. <li>主题活动</li>
  7. <li>分类</li>
  8. <li>群接龙</li>
  9. <li>拼团商品</li>
  10. </ul>
  11. <div class="layui-tab-content">
  12. <div class="tab-content " id="selectUrl">
  13. <div class="tab-pane active" id="sut_shop">
  14. <div class="input-group">
  15. <input type="text" placeholder="请输入链接名称进行搜索" id="select-url-kw" value="" class="form-control">
  16. <span class="input-group-addon btn btn-default select-btn" data-type="url">搜索</span>
  17. </div>
  18. <?php if( $platform){ ?>
  19. <div class="alert alert-primary" style="margin-bottom: 0;">
  20. <p>如果底部菜单中已经选择该链接,页面中选择后点击无效</p>
  21. <?php if( $platform=='wxapp_tabbar'){ ?>
  22. <p>底部菜单只可选择部分页面地址</p>
  23. <?php } ?>
  24. </div>
  25. <?php } ?>
  26. <div id="select-url-list" style="margin-top:20px;">
  27. <?php foreach( $allUrls as $item ){ ?>
  28. <div class="layui-form-item " style="margin-top:10px;"><h4><i class="fa fa-folder-open-o"></i> {$item['name']}</h4></div>
  29. <?php foreach( $item['list'] as $child ){ ?>
  30. <nav data-href="<?php echo $platform?$child['url_wxapp']:$child['url'];?>" class="choose_dan_link_url btn btn-default btn-sm" title="">{$child['name']}</nav>
  31. <?php } ?>
  32. <?php } ?>
  33. </div>
  34. </div>
  35. <div class="tab-pane" id="sut_good">
  36. <div class="input-group">
  37. <input type="text" placeholder="请输入商品名称进行搜索" id="select-good-kw" value="" class="form-control">
  38. <span class="input-group-addon btn btn-default select-btn" data-type="good">搜索</span>
  39. </div>
  40. <div id="select-good-list"></div>
  41. </div>
  42. <div class="tab-pane" id="sut_article">
  43. <div class="input-group">
  44. <input type="text" placeholder="请输入文章名称进行搜索" id="select-article-kw" value="" class="form-control">
  45. <span class="input-group-addon btn btn-default select-btn" data-type="article">搜索</span>
  46. </div>
  47. <div id="select-article-list"></div>
  48. </div>
  49. <div class="tab-pane" id="sut_cate">
  50. <?php foreach( $categorys as $category ){ ?>
  51. <?php if( empty($category['parentid'])){ ?>
  52. <div class="line">
  53. <div class="icon icon-1"></div>
  54. <nav title="选择" class="choose_dan_link_url btn btn-default btn-sm" data-href="/pages/goods/index/index?cate={$category['id']}">选择</nav>
  55. <div class="text">{$category['name']}</div>
  56. </div>
  57. <?php foreach( $categorys as $category2 ){ ?>
  58. <?php if( $category2['parentid']==$category['id']){ ?>
  59. <div class="line">
  60. <div class="icon icon-2"></div>
  61. <nav title="选择" class="btn btn-default btn-sm" data-href="/pages/goods/index/index?cate={$category2['id']}">选择</nav>
  62. <div class="text">{$category2['name']}</div>
  63. </div>
  64. <?php foreach( $categorys as $category3 ){ ?>
  65. <?php if( $category3['parentid']==$category2['id']){ ?>
  66. <div class="line">
  67. <div class="icon icon-3"></div>
  68. <nav title="选择" class="btn btn-default btn-sm" data-href="/pages/goods/index/index?cate={$category3['id']}">选择</nav>
  69. <div class="text">{$category3['name']}</div>
  70. </div>
  71. <?php } ?>
  72. <?php } ?>
  73. <?php } ?>
  74. <?php } ?>
  75. <?php } ?>
  76. <?php } ?>
  77. </div>
  78. <div class="tab-pane" id="sut_special">
  79. <div class="input-group">
  80. <input type="text" placeholder="请输入活动名称进行搜索" id="select-special-kw" value="" class="form-control">
  81. <span class="input-group-addon btn btn-default select-btn" data-type="special">搜索</span>
  82. </div>
  83. <div id="select-special-list"></div>
  84. </div>
  85. <!-- 分类页面 -->
  86. <div class="tab-pane" id="sut_category">
  87. <div class="input-group">
  88. <input type="text" placeholder="请输入分类名称进行搜索" id="select-category-kw" value="" class="form-control">
  89. <span class="input-group-addon btn btn-default select-btn" data-type="category">搜索</span>
  90. </div>
  91. <div id="select-category-list"></div>
  92. </div>
  93. <div class="tab-pane" id="sut_solitaire">
  94. <div class="input-group">
  95. <input type="text" placeholder="请输入群接龙名称进行搜索" id="select-solitaire-kw" value="" class="form-control">
  96. <span class="input-group-addon btn btn-default select-btn" data-type="solitaire">搜索</span>
  97. </div>
  98. <div id="select-solitaire-list"></div>
  99. </div>
  100. <div class="tab-pane" id="sut_coupon">
  101. <div class="input-group">
  102. <input type="text" placeholder="请输入优惠券名称进行搜索" id="select-coupon-kw" value="" class="form-control">
  103. <span class="input-group-addon btn btn-default select-btn" data-type="coupon">搜索</span>
  104. </div>
  105. <div id="select-coupon-list"></div>
  106. </div>
  107. <div class="tab-pane" id="sut_pintuan">
  108. <div class="input-group">
  109. <input type="text" placeholder="请输入拼团商品名称进行搜索" id="select-pintuan-kw" value="" class="form-control">
  110. <span class="input-group-addon btn btn-default select-btn" data-type="pintuan">搜索</span>
  111. </div>
  112. <div id="select-pintuan-list"></div>
  113. </div>
  114. </div>
  115. </div>
  116. </div>
  117. <script>
  118. layui.use('element', function(){
  119. var element = layui.element;
  120. //一些事件监听
  121. element.on('tab(docDemoTabBrief)', function(data){
  122. if(data.index == 0)
  123. {
  124. $('#sut_shop').addClass('active').siblings().removeClass('active');
  125. }else if(data.index == 1){
  126. $('#sut_good').addClass('active').siblings().removeClass('active');
  127. }else if(data.index == 2){
  128. $('#sut_article').addClass('active').siblings().removeClass('active');
  129. }else if(data.index == 3){
  130. $('#sut_special').addClass('active').siblings().removeClass('active');
  131. }else if(data.index == 4){
  132. $('#sut_category').addClass('active').siblings().removeClass('active');
  133. }else if(data.index == 5){
  134. $('#sut_solitaire').addClass('active').siblings().removeClass('active');
  135. }else if(data.index == 6){
  136. $('#sut_pintuan').addClass('active').siblings().removeClass('active');
  137. }
  138. });
  139. });
  140. </script>
  141. <style>
  142. #selectUrl .modal-body {padding: 10px 15px;}
  143. #selectUrl .tab-pane {margin-top: 5px; min-height: 400px; max-height: 400px; overflow-y: auto;}
  144. #selectUrl .layui-form-item {padding: 9px 0; margin-bottom: 8px;}
  145. #selectUrl .layui-form-item h4 {margin: 0;}
  146. #selectUrl .btn {margin-bottom: 3px;}
  147. #selectUrl .modal-dialog {width: 930px;}
  148. #selectUrl .line {border-bottom: 1px dashed #ddd; color: #999; height: 36px; line-height: 36px;}
  149. #selectUrl .line .icon {height: 35px; width: 30px; position: relative; float: left;}
  150. #selectUrl .line .icon.icon-1:before {content: ""; width: 10px; height: 10px; border: 1px dashed #ccc; position: absolute; top: 12px; left: 10px;}
  151. #selectUrl .line .icon.icon-2 {width: 50px;}
  152. #selectUrl .line .icon.icon-2:before {content: ""; width: 10px; height: 10px; border-left: 1px dashed #ccc; border-bottom: 1px dashed #ccc; position: absolute; top: 12px; left: 20px;}
  153. #selectUrl .line .icon.icon-3 {width: 60px;}
  154. #selectUrl .line .icon.icon-3:before {content: ""; width: 10px; height: 10px; border-left: 1px dashed #ccc; border-bottom: 1px dashed #ccc; position: absolute; top: 12px; left: 30px;}
  155. #selectUrl .line .btn-sm {float: right; margin-top: 5px; margin-right: 5px; height: 24px; line-height: 24px; padding: 0 10px;}
  156. #selectUrl .line .text {display: block;}
  157. #selectUrl .line .label-sm {padding: 2px 5px;}
  158. #selectUrl .line.good {height: 60px; padding: 4px 0;}
  159. #selectUrl .line.good .image {height: 50px; width: 50px; border: 1px solid #ccc; float: left;}
  160. #selectUrl .line.good .image img {height: 100%; width: 100%;}
  161. #selectUrl .line.good .text {padding-left: 60px; height: 52px;}
  162. #selectUrl .line.good .text p {padding: 0; margin: 0;}
  163. #selectUrl .line.good .text .name {font-size: 15px; line-height: 32px; height: 28px;}
  164. #selectUrl .line.good .text .price {font-size: 12px; line-height: 18px; height: 18px;}
  165. #selectUrl .line.good .btn-sm {height: 32px; padding: 5px 10px; line-height: 22px; margin-top: 9px;}
  166. #selectUrl .tip {line-height: 250px; text-align: center;}
  167. #selectUrl .nav-tabs > li > a {padding: 8px 20px;}
  168. </style>
  169. <script>
  170. $(function(){
  171. $("#selectUrl").find('#selectUrlTab a').click(function(e) {
  172. $('#tab').val($(this).attr('href'));
  173. e.preventDefault();
  174. $(this).tab('show');
  175. });
  176. $(document).delegate(".choose_dan_link_url","click",function(){
  177. $(cur_open_div).val( $(this).attr('data-href') );
  178. layer.close(layer.index);
  179. });
  180. $(".select-btn").click(function(){
  181. var type = $(this).data("type");
  182. var kw = $.trim($("#select-"+type+"-kw").val());
  183. if(!kw){
  184. }
  185. $("#select-"+type+"-list").html('<div class="tip">正在进行搜索...</div>');
  186. $.ajax("{:U('util/query', array('full'=>$full, 'platform'=>$platform, 'ok' => 1))}", {
  187. type: "get",
  188. dataType: "html",
  189. cache: false,
  190. data: {kw:kw, type:type}
  191. }).done(function (html) {
  192. $("#select-"+type+"-list").html(html);
  193. });
  194. });
  195. });
  196. </script>