store_watermark.html 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277
  1. {extend name="default/base/base_seller" /}
  2. {block name="seller_main"}
  3. <div class="dssc-form-default">
  4. <form method="post" enctype="multipart/form-data" action="" id="wm_form">
  5. <input type="hidden" name="swm_text_angle" value="0" />
  6. <dl>
  7. <dt>{$Think.lang.store_watermark_pic}</dt>
  8. <dd>
  9. {notempty name="$store_wm_info.swm_image_name"}
  10. <div class="dssc-upload-thumb watermark-pic">
  11. <p><img src="{:ds_get_pic('home/watermark',$store_wm_info.swm_image_name)}" id="imgView"/></p>
  12. <a href="javascript:void(0);" id="del_image" title="{$Think.lang.store_watermark_del_pic}">X</a>
  13. <input type="hidden" id="is_del_image" name="is_del_image" value=""/>
  14. </div>
  15. {else /}
  16. <div class="dssc-upload-thumb watermark-pic"><p><i class="iconfont">&#xe72a;</i></p></div>
  17. {/notempty}
  18. <div class="dssc-upload-btn">
  19. <a href="javascript:void(0);">
  20. <span>
  21. <input type="file" hidefocus="true" size="1" class="input-file" name="image" id="image" ds_type="logo"/>
  22. </span>
  23. <p><i class="iconfont">&#xe733;</i>{$Think.lang.store_image_upload}</p>
  24. </a>
  25. </div>
  26. <p class="hint">{$Think.lang.store_watermark_choose_pic}</p>
  27. </dd>
  28. </dl>
  29. <dl>
  30. <dt>{$Think.lang.swm_image_transition}</dt>
  31. <dd>
  32. <input id="swm_image_transition" class="text w40" type="text" name="swm_image_transition" value="{$store_wm_info.swm_image_transition}"/><em class="add-on">%</em>
  33. <p class="hint">{$Think.lang.swm_image_choose_transition}</p>
  34. </dd>
  35. </dl>
  36. <dl>
  37. <dt>{$Think.lang.store_watermark_pic_pos}</dt>
  38. <dd>
  39. <ul class="dssc-watermark-pos" id="wm_image_pos">
  40. <li>
  41. <input type="radio" name="swm_image_pos" value="1" {if $store_wm_info.swm_image_pos==1}checked{/if}/>
  42. <label>{$Think.lang.store_watermark_pic_pos1}</label>
  43. </li>
  44. <li>
  45. <input type="radio" name="swm_image_pos" value="2" {if $store_wm_info.swm_image_pos==2}checked{/if}/>
  46. <label>{$Think.lang.store_watermark_pic_pos2}</label>
  47. </li>
  48. <li>
  49. <input type="radio" name="swm_image_pos" value="3" {if $store_wm_info.swm_image_pos==3}checked{/if}/>
  50. <label>{$Think.lang.store_watermark_pic_pos3}</label>
  51. </li>
  52. <li>
  53. <input type="radio" name="swm_image_pos" value="4" {if $store_wm_info.swm_image_pos==4}checked{/if}/>
  54. <label>{$Think.lang.store_watermark_pic_pos4}</label>
  55. </li>
  56. <li>
  57. <input type="radio" name="swm_image_pos" value="5" {if $store_wm_info.swm_image_pos==5}checked{/if}/>
  58. <label>{$Think.lang.store_watermark_pic_pos5}</label>
  59. </li>
  60. <li>
  61. <input type="radio" name="swm_image_pos" value="6" {if $store_wm_info.swm_image_pos==6}checked{/if}/>
  62. <label>{$Think.lang.store_watermark_pic_pos6}</label>
  63. </li>
  64. <li>
  65. <input type="radio" name="swm_image_pos" value="7" {if $store_wm_info.swm_image_pos==7}checked{/if}/>
  66. <label>{$Think.lang.store_watermark_pic_pos7}</label>
  67. </li>
  68. <li>
  69. <input type="radio" name="swm_image_pos" value="8" {if $store_wm_info.swm_image_pos==8}checked{/if}/>
  70. <label>{$Think.lang.store_watermark_pic_pos8}</label>
  71. </li>
  72. <li>
  73. <input type="radio" name="swm_image_pos" value="9" {if $store_wm_info.swm_image_pos==9}checked{/if}/>
  74. <label>{$Think.lang.store_watermark_pic_pos9}</label>
  75. </li>
  76. </ul>
  77. <p class="hint">{$Think.lang.store_watermark_choose_pos}</p>
  78. </dd>
  79. </dl>
  80. <dl>
  81. <dt>{$Think.lang.store_watermark_pic_quality}</dt>
  82. <dd>
  83. <p>
  84. <input id="swm_quality" class="text w40" type="text" name="swm_quality" value="{$store_wm_info.swm_quality}"/><em class="add-on">%</em>
  85. </p>
  86. <p class="hint">{$Think.lang.store_watermark_pic_quality_max}</p>
  87. </dd>
  88. </dl>
  89. <dl>
  90. <dt>{$Think.lang.store_watermark_text}</dt>
  91. <dd>
  92. <p>
  93. <textarea name="swm_text" class="textarea w180" >{$store_wm_info.swm_text}</textarea>
  94. </p>
  95. <p class="hint">{$Think.lang.store_watermark_text_notice},{$Think.lang.store_letters_numbers_recommended}</p>
  96. </dd>
  97. </dl>
  98. <dl>
  99. <dt>{$Think.lang.store_watermark_text_size}</dt>
  100. <dd><input id="swm_text_size" class="text w40" type="text" name="swm_text_size" value="{$store_wm_info.swm_text_size}"/><em class="add-on">px</em>
  101. <p class="hint">{$Think.lang.store_watermark_text_size_notice}</p>
  102. </dd>
  103. </dl>
  104. <dl>
  105. <dt>{$Think.lang.store_watermark_text_color}</dt>
  106. <dd>
  107. <div class="w160 clearfix">
  108. <input id="swm_text_color" class="text w100" type="text" name="swm_text_color" value="{$store_wm_info.swm_text_color|default='#CCCCCC'}"/>
  109. </div>
  110. <div id="colorpanel"></div>
  111. <p class="hint">{$Think.lang.store_watermark_text_color_notice}</p>
  112. </dd>
  113. </dl>
  114. <dl>
  115. <dt>{$Think.lang.store_watermark_text_font}</dt>
  116. <dd>
  117. <p>
  118. <select name="swm_text_font" class="w80">
  119. {foreach name="file_list" item="value" key="key" }
  120. <option value="{$key}" {if $store_wm_info.swm_text_font == $key}selected="selected"{/if}>{$value}</option>
  121. {/foreach}
  122. </select>
  123. </p>
  124. <p class="hint">{$Think.lang.store_watermark_text_font_notice},{$Think.lang.store_installed_chinese_font}</p>
  125. </dd>
  126. </dl>
  127. <dl>
  128. <dt>{$Think.lang.store_watermark_text_pos}</dt>
  129. <dd>
  130. <ul class="dssc-watermark-pos" id="swm_text_pos">
  131. <li>
  132. <input type="radio" name="swm_text_pos" value="1" {if $store_wm_info.swm_text_pos==1}checked{/if}/>
  133. <label>{$Think.lang.store_watermark_text_pos1}</label>
  134. </li>
  135. <li>
  136. <input type="radio" name="swm_text_pos" value="2" {if $store_wm_info.swm_text_pos==2}checked{/if}/>
  137. <label>{$Think.lang.store_watermark_text_pos2}</label>
  138. </li>
  139. <li>
  140. <input type="radio" name="swm_text_pos" value="3" {if $store_wm_info.swm_text_pos==3}checked{/if}/>
  141. <label>{$Think.lang.store_watermark_text_pos3}</label>
  142. </li>
  143. <li>
  144. <input type="radio" name="swm_text_pos" value="4" {if $store_wm_info.swm_text_pos==4}checked{/if}/>
  145. <label>{$Think.lang.store_watermark_text_pos4}</label>
  146. </li>
  147. <li>
  148. <input type="radio" name="swm_text_pos" value="5" {if $store_wm_info.swm_text_pos==5}checked{/if}/>
  149. <label>{$Think.lang.store_watermark_text_pos5}</label>
  150. </li>
  151. <li>
  152. <input type="radio" name="swm_text_pos" value="6" {if $store_wm_info.swm_text_pos==6}checked{/if}/>
  153. <label>{$Think.lang.store_watermark_text_pos6}</label>
  154. </li>
  155. <li>
  156. <input type="radio" name="swm_text_pos" value="7" {if $store_wm_info.swm_text_pos==7}checked{/if}/>
  157. <label>{$Think.lang.store_watermark_text_pos7}</label>
  158. </li>
  159. <li>
  160. <input type="radio" name="swm_text_pos" value="8" {if $store_wm_info.swm_text_pos==8}checked{/if}/>
  161. <label>{$Think.lang.store_watermark_text_pos8}</label>
  162. </li>
  163. <li>
  164. <input type="radio" name="swm_text_pos" value="9" {if $store_wm_info.swm_text_pos==9}checked{/if}/>
  165. <label>{$Think.lang.store_watermark_text_pos9}</label>
  166. </li>
  167. </ul>
  168. </dd>
  169. </dl>
  170. <div class="bottom">
  171. <input type="submit" class="submit" value="{$Think.lang.store_watermark_submit}" />
  172. </div>
  173. </form>
  174. </div>
  175. <style type="text/css">
  176. .evo-color div { font-size: 12px; line-height: normal;}
  177. .evo-color span { font-size: 12px !important; line-height: normal !important;}
  178. </style>
  179. <link href="{$Think.PLUGINS_SITE_ROOT}/colorpicker/evol.colorpicker.css" rel="stylesheet" type="text/css">
  180. <script src="{$Think.PLUGINS_SITE_ROOT}/colorpicker/evol.colorpicker.min.js"></script>
  181. <script>
  182. $(function () {
  183. $("div").cssRadio();
  184. $('#swm_text_color').colorpicker({showOn: 'both'});
  185. $('#swm_text_color').parent().css("width", '');
  186. $('#swm_text_color').parent().addClass("color");
  187. $('#del_image').click(function () {
  188. var result = confirm('{$Think.lang.store_watermark_del_pic_confirm}');
  189. if (result)
  190. {
  191. $('#image').css('display', 'none');
  192. $('#del_image').css('display', 'none');
  193. $('#is_del_image').val('ok');
  194. $('#wm_form').submit();
  195. }
  196. });
  197. $('#wm_form').validate({
  198. errorPlacement: function(error, element){
  199. var error_td = element.parents('dd');
  200. error_td.append(error);
  201. },
  202. rules: {
  203. swm_image_transition: {
  204. required: true,
  205. min:0,
  206. max:100,
  207. number: true
  208. },
  209. swm_quality: {
  210. required: true,
  211. min:0,
  212. max:100,
  213. number: true
  214. },
  215. swm_text_size: {
  216. required: true,
  217. number: true
  218. },
  219. swm_text_color: {
  220. required: true,
  221. maxlength: 7
  222. }
  223. },
  224. messages: {
  225. swm_image_transition: {
  226. required: '{$Think.lang.store_watermark_transition_null}',
  227. min: '{$Think.lang.store_watermark_transition_min}',
  228. max: '{$Think.lang.store_watermark_transition_max}',
  229. number: '{$Think.lang.store_watermark_transition_number}',
  230. },
  231. swm_quality: {
  232. required: '{$Think.lang.store_watermark_pic_quality_null}',
  233. min: '{$Think.lang.store_watermark_pic_quality_min}',
  234. max: '{$Think.lang.store_watermark_pic_quality_max}',
  235. number: '{$Think.lang.store_watermark_pic_quality_number}',
  236. },
  237. swm_text_size: {
  238. required: '{$Think.lang.store_watermark_text_size_null}',
  239. number: '{$Think.lang.store_watermark_text_size_number}'
  240. },
  241. swm_text_color: {
  242. required: '{$Think.lang.store_watermark_text_color_null}',
  243. maxlength: '{$Think.lang.store_watermark_text_color_max}'
  244. }
  245. }
  246. });
  247. });
  248. jQuery.fn.cssRadio = function () {
  249. $(":input[type=radio] + label").each(function () {
  250. if ($(this).prev()[0].checked)
  251. $(this).addClass("checked");
  252. }).hover(
  253. function () {
  254. $(this).addClass("over");
  255. },
  256. function () {
  257. $(this).removeClass("over");
  258. }
  259. ).click(function () {
  260. var contents = $(this).parent().parent(); /*多组控制 关键*/
  261. $(":input[type=radio] + label", contents).each(function () {
  262. $(this).prev()[0].checked = false;
  263. $(this).removeClass("checked");
  264. });
  265. $(this).prev()[0].checked = true;
  266. $(this).addClass("checked");
  267. }).prev().hide();
  268. };
  269. </script>
  270. {/block}