store_mobile.html 6.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151
  1. {extend name="default/base/base_seller" /}
  2. {block name="seller_main"}
  3. <div class="alert alert-block mt10">
  4. <ul>
  5. <li>{$Think.lang.store_mobile_instructions1}</li>
  6. <li>{$Think.lang.store_mobile_instructions2}</li>
  7. <li>{$Think.lang.store_mobile_instructions3}</li>
  8. <li>{$Think.lang.store_mobile_instructions4}</li>
  9. </ul>
  10. </div>
  11. <div class="dssc-form-default">
  12. <form method="post" enctype="multipart/form-data" id="my_store_form">
  13. <dl>
  14. <dt>{$Think.lang.header_background}{$Think.lang.ds_colon}</dt>
  15. <dd class="mb-sliders">
  16. {if $mb_title_img}
  17. <div class="img-wrapper"> <img alt="" src="{$mb_title_img}" /> </div>
  18. <p>
  19. <label>
  20. <input type="checkbox" name="mb_title_img_del" value="1" />
  21. {$Think.lang.marked_delete} </label>
  22. </p>
  23. {else /}
  24. <p>{$Think.lang.no_picture}</p>
  25. {/if}
  26. <p>
  27. <input type="file" name="mb_title_img" />
  28. </p>
  29. <p class="hint">{$Think.lang.page_header_background_picture}</p>
  30. </dd>
  31. </dl>
  32. <dl>
  33. <dt>{$Think.lang.rotation}{$Think.lang.ds_colon}</dt>
  34. <dd>
  35. <p class="hint">{$Think.lang.rotate_image_restrictions1}{$max_mb_sliders}{$Think.lang.rotate_image_restrictions2}</p>
  36. </dd>
  37. </dl>
  38. {if $mbSliderUrls}
  39. <div class="dssc-sellerslider">
  40. <ul class="bd">
  41. {foreach name="mbSliderUrls" item="v"}
  42. <li><a><img src="{$v}" /></a></li>
  43. {/foreach}
  44. </ul>
  45. <ul class="hd">
  46. {foreach name="mbSliderUrls" item="v"}
  47. <li></li>
  48. {/foreach}
  49. </ul>
  50. <a class="ctrl prev" href="javascript:void(0)">&lt;</a>
  51. <a class="ctrl next" href="javascript:void(0)">&gt;</a>
  52. </div>
  53. <script src="{$Think.PLUGINS_SITE_ROOT}/jquery.SuperSlide.2.1.1.js"></script>
  54. <script>
  55. //轮播
  56. jQuery(".dssc-sellerslider").slide({mainCell: "ul", autoPlay: true, delayTime: 500,interTime: 5000});
  57. </script>
  58. {/if}
  59. <ul class="dssc-store-slider sortable">
  60. {for start="1" end="$max_mb_sliders" name="k"}
  61. <li>
  62. <input type="hidden" name="mb_sliders_sort[]" value="{$k}" />
  63. <div class="picture" dstype="file_{$k}">
  64. {if $mbSliders[$k]['img']}
  65. <img dstype="file_{$k}" alt="" src="{:ds_get_pic(ATTACH_STORE.'/mobileslide',$mbSliders[$k]['img'])}" />
  66. {else /}
  67. <i class="iconfont">&#xe72a;</i>
  68. {/if}
  69. <a href="javascript:;" data-slider-drop="{$k}" class="del" title="{$Think.lang.remove}">&#215;</a> </div>
  70. <div class="url">
  71. <label>
  72. <input type="radio" name="mb_sliders_type[{$k}]" value="1" {if $mbSliders[$k]['type']=='1'}checked="checked"{/if} />{$Think.lang.jump_url}</label>
  73. <label>
  74. <input type="radio" name="mb_sliders_type[{$k}]" value="2" {if $mbSliders[$k]['type']=='2'}checked="checked"{/if} />{$Think.lang.product_id}</label>
  75. <input type="text" class="text w150" name="mb_sliders_links[{$k}]" value="{$mbSliders[$k]['link']}" />
  76. </div>
  77. <div class="dssc-upload-btn"> <a href="javascript:;"> <span>
  78. <input type="file" hidefocus="true" size="1" class="input-file" name="file_{$k}" id="file_{$k}" file_id="{$k}" />
  79. </span>
  80. <p> <i class="iconfont">&#xe733;</i> {$Think.lang.image_upload} </p>
  81. </a> </div>
  82. </li>
  83. {/for}
  84. </ul>
  85. <div class="bottom">
  86. <input type="submit" class="submit" value="{$Think.lang.save_change}" />
  87. </div>
  88. </form>
  89. </div>
  90. <style type="text/css">
  91. .mb-sliders li { width: 225px; height: 168px; display: inline-block; padding: 3px; margin: 3px; border: 1px solid #ccc; }
  92. .mb-sliders img { max-width: 100%; max-height: 100%; display: block; margin: 3px auto; }
  93. .img-wrapper { width: 320px; height: 80px; overflow: hidden; }
  94. </style>
  95. <script src="{$Think.PLUGINS_SITE_ROOT}/ajaxfileupload.js"></script>
  96. <script>
  97. $(function () {
  98. $(".sortable").sortable();
  99. var DEFAULT_GOODS_IMAGE = "{:ds_get_pic(ATTACH_COMMON,$Think.config.ds_config.default_goods_image)}";
  100. var LOADING_IMAGE = "{$Think.HOME_SITE_ROOT}/images/loading.gif";
  101. $('input.input-file').change(function () {
  102. //上传文件名
  103. var id = this.id;
  104. //文件ID
  105. var file_id = $(this).attr('file_id');
  106. $('div[dstype="' + id + '"]').find('i,img').remove().end()
  107. .prepend('<img dstype="' + id + '" src="' + LOADING_IMAGE + '">');
  108. //当前时间戳
  109. var timestamp = Date.parse(new Date())/1000;
  110. $.ajaxFileUpload({
  111. url: "{:url('Sellersetting/store_mb_sliders')}",
  112. secureuri: false,
  113. fileElementId: id,
  114. dataType: 'json',
  115. data: {id: id,file_id:file_id},
  116. success: function (data, status) {
  117. if (data.error) {
  118. alert(data.error);
  119. $('img[dstype="' + id + '"]').attr('src', DEFAULT_GOODS_IMAGE +'?'+ timestamp);
  120. return;
  121. }
  122. $('img[dstype="' + id + '"]').attr('src', data.uploadedUrl +'?'+timestamp);
  123. },
  124. error: function (data, status, e) {
  125. $('img[dstype="' + id + '"]').attr('src', data.uploadedUrl);
  126. }
  127. });
  128. });
  129. $("a[data-slider-drop]").click(function () {
  130. var id = $(this).attr('data-slider-drop');
  131. var $this = $(this);
  132. $.getJSON("{:url('Sellersetting/store_mb_sliders_drop')}", {id: id}, function (d) {
  133. if (!d.success) {
  134. alert(d.error);
  135. return;
  136. }
  137. $this.parents('div.picture').find('img,i').remove().end()
  138. .prepend('<i class="iconfont">&#xe72a;</i>');
  139. });
  140. });
  141. });
  142. </script>
  143. {/block}