edit.php 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243
  1. <div class="row-content am-cf">
  2. <div class="row">
  3. <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
  4. <div class="widget am-cf">
  5. <form id="my-form" class="am-form tpl-form-line-form" enctype="multipart/form-data" method="post">
  6. <div class="widget-body">
  7. <fieldset>
  8. <div class="widget-head am-cf">
  9. <div class="widget-title am-fl">编辑优惠券</div>
  10. </div>
  11. <div class="am-form-group">
  12. <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">优惠券名称 </label>
  13. <div class="am-u-sm-9 am-u-end">
  14. <input type="text" class="tpl-form-input" name="coupon[name]"
  15. value="<?= $model['name'] ?>" placeholder="请输入优惠券名称" required>
  16. <small>例如:满100减10</small>
  17. </div>
  18. </div>
  19. <div class="am-form-group">
  20. <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">优惠券颜色 </label>
  21. <div class="am-u-sm-9 am-u-end">
  22. <label class="am-radio-inline">
  23. <input type="radio" name="coupon[color]"
  24. value="10" <?= $model['color']['value'] == 10 ? 'checked' : '' ?>
  25. data-am-ucheck>
  26. 蓝色
  27. </label>
  28. <label class="am-radio-inline">
  29. <input type="radio" name="coupon[color]" value="20"
  30. <?= $model['color']['value'] == 20 ? 'checked' : '' ?>
  31. data-am-ucheck>
  32. 红色
  33. </label>
  34. <label class="am-radio-inline">
  35. <input type="radio" name="coupon[color]" value="30"
  36. <?= $model['color']['value'] == 30 ? 'checked' : '' ?>
  37. data-am-ucheck>
  38. 紫色
  39. </label>
  40. <label class="am-radio-inline">
  41. <input type="radio" name="coupon[color]" value="40"
  42. <?= $model['color']['value'] == 40 ? 'checked' : '' ?>
  43. data-am-ucheck>
  44. 黄色
  45. </label>
  46. </div>
  47. </div>
  48. <div class="am-form-group" data-x-switch>
  49. <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">优惠券类型 </label>
  50. <div class="am-u-sm-9 am-u-end">
  51. <label class="am-radio-inline">
  52. <input type="radio" name="coupon[coupon_type]" value="10"
  53. data-am-ucheck
  54. data-switch-box="switch-coupon_type"
  55. data-switch-item="coupon_type__10"
  56. <?= $model['coupon_type']['value'] == 10 ? 'checked' : '' ?>>
  57. 满减券
  58. </label>
  59. <label class="am-radio-inline">
  60. <input type="radio" name="coupon[coupon_type]" value="20"
  61. data-am-ucheck
  62. data-switch-box="switch-coupon_type"
  63. data-switch-item="coupon_type__20"
  64. <?= $model['coupon_type']['value'] == 20 ? 'checked' : '' ?>>
  65. 折扣券
  66. </label>
  67. </div>
  68. </div>
  69. <div class="am-form-group switch-coupon_type coupon_type__10 <?= $model['coupon_type']['value'] == 10 ? '' : 'hide' ?>">
  70. <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">减免金额 </label>
  71. <div class="am-u-sm-9 am-u-end">
  72. <input type="number" min="0.01" class="tpl-form-input" name="coupon[reduce_price]"
  73. value="<?= $model['reduce_price'] ?>" placeholder="请输入减免金额" required>
  74. </div>
  75. </div>
  76. <div class="am-form-group switch-coupon_type coupon_type__20 <?= $model['coupon_type']['value'] == 20 ? '' : 'hide' ?>">
  77. <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">折扣率 </label>
  78. <div class="am-u-sm-9 am-u-end">
  79. <input type="number" min="0" max="10" class="tpl-form-input"
  80. name="coupon[discount]"
  81. value="<?= $model['discount'] ?>" placeholder="请输入折扣率" required>
  82. <small>折扣率范围0-10,9.5代表9.5折,0代表不折扣</small>
  83. </div>
  84. </div>
  85. <div class="am-form-group">
  86. <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">最低消费金额 </label>
  87. <div class="am-u-sm-9 am-u-end">
  88. <input type="number" min="1" class="tpl-form-input" name="coupon[min_price]"
  89. value="<?= $model['min_price'] ?>" placeholder="请输入最低消费金额" required>
  90. </div>
  91. </div>
  92. <div class="am-form-group" data-x-switch>
  93. <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">到期类型 </label>
  94. <div class="am-u-sm-9 am-u-end">
  95. <label class="am-radio-inline">
  96. <input type="radio" name="coupon[expire_type]" value="10"
  97. data-am-ucheck
  98. data-switch-box="switch-expire_type"
  99. data-switch-item="expire_type__10"
  100. <?= $model['expire_type'] == 10 ? 'checked' : '' ?>>
  101. 领取后生效
  102. </label>
  103. <label class="am-radio-inline">
  104. <input type="radio" name="coupon[expire_type]" value="20"
  105. data-am-ucheck
  106. data-switch-box="switch-expire_type"
  107. data-switch-item="expire_type__20"
  108. <?= $model['expire_type'] == 20 ? 'checked' : '' ?>>
  109. 固定时间
  110. </label>
  111. </div>
  112. </div>
  113. <div class="am-form-group switch-expire_type expire_type__10 <?= $model['expire_type'] == 10 ? '' : 'hide' ?>">
  114. <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">有效天数 </label>
  115. <div class="am-u-sm-9 am-u-end">
  116. <input type="number" min="1" class="tpl-form-input" name="coupon[expire_day]"
  117. value="<?= $model['expire_day'] ?>" placeholder="请输入有效天数" required>
  118. </div>
  119. </div>
  120. <div class="am-form-group switch-expire_type expire_type__20 <?= $model['expire_type'] == 20 ? '' : 'hide' ?>">
  121. <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">时间范围 </label>
  122. <div class="am-u-sm-9 am-u-end">
  123. <input type="text" class="j-startTime am-form-field am-margin-bottom-sm"
  124. name="coupon[start_time]"
  125. value="<?= $model['start_time']['value'] > 1 ? $model['start_time']['text'] : '' ?>"
  126. placeholder="请选择开始日期"
  127. required>
  128. <input type="text" class="j-endTime am-form-field"
  129. name="coupon[end_time]"
  130. value="<?= $model['end_time']['value'] > 1 ? $model['end_time']['text'] : '' ?>"
  131. placeholder="请选择结束日期" required>
  132. </div>
  133. </div>
  134. <div class="am-form-group">
  135. <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">发放总数量 </label>
  136. <div class="am-u-sm-9 am-u-end">
  137. <input type="number" min="-1" class="tpl-form-input" name="coupon[total_num]"
  138. value="<?= $model['total_num'] ?>" required>
  139. <small>限制领取的优惠券数量,-1为不限制</small>
  140. </div>
  141. </div>
  142. <div class="am-form-group">
  143. <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">排序 </label>
  144. <div class="am-u-sm-9 am-u-end">
  145. <input type="number" min="0" class="tpl-form-input" name="coupon[sort]"
  146. value="<?= $model['sort'] ?>" required>
  147. </div>
  148. </div>
  149. <div class="am-form-group">
  150. <div class="am-u-sm-9 am-u-sm-push-3 am-margin-top-lg">
  151. <button type="submit" class="j-submit am-btn am-btn-secondary">提交
  152. </button>
  153. </div>
  154. </div>
  155. </fieldset>
  156. </div>
  157. </form>
  158. </div>
  159. </div>
  160. </div>
  161. </div>
  162. <script>
  163. /**
  164. * 时间选择
  165. */
  166. $(function () {
  167. var nowTemp = new Date();
  168. var nowDay = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0).valueOf();
  169. var nowMoth = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), 1, 0, 0, 0, 0).valueOf();
  170. var nowYear = new Date(nowTemp.getFullYear(), 0, 1, 0, 0, 0, 0).valueOf();
  171. var $startTime = $('.j-startTime');
  172. var $endTime = $('.j-endTime');
  173. var checkin = $startTime.datepicker({
  174. onRender: function (date, viewMode) {
  175. // 默认 days 视图,与当前日期比较
  176. var viewDate = nowDay;
  177. switch (viewMode) {
  178. // moths 视图,与当前月份比较
  179. case 1:
  180. viewDate = nowMoth;
  181. break;
  182. // years 视图,与当前年份比较
  183. case 2:
  184. viewDate = nowYear;
  185. break;
  186. }
  187. return date.valueOf() < viewDate ? 'am-disabled' : '';
  188. }
  189. }).on('changeDate.datepicker.amui', function (ev) {
  190. if (ev.date.valueOf() > checkout.date.valueOf()) {
  191. var newDate = new Date(ev.date)
  192. newDate.setDate(newDate.getDate() + 1);
  193. checkout.setValue(newDate);
  194. }
  195. checkin.close();
  196. $endTime[0].focus();
  197. }).data('amui.datepicker');
  198. var checkout = $endTime.datepicker({
  199. onRender: function (date, viewMode) {
  200. var inTime = checkin.date;
  201. var inDay = inTime.valueOf();
  202. var inMoth = new Date(inTime.getFullYear(), inTime.getMonth(), 1, 0, 0, 0, 0).valueOf();
  203. var inYear = new Date(inTime.getFullYear(), 0, 1, 0, 0, 0, 0).valueOf();
  204. // 默认 days 视图,与当前日期比较
  205. var viewDate = inDay;
  206. switch (viewMode) {
  207. // moths 视图,与当前月份比较
  208. case 1:
  209. viewDate = inMoth;
  210. break;
  211. // years 视图,与当前年份比较
  212. case 2:
  213. viewDate = inYear;
  214. break;
  215. }
  216. return date.valueOf() <= viewDate ? 'am-disabled' : '';
  217. }
  218. }).on('changeDate.datepicker.amui', function (ev) {
  219. checkout.close();
  220. }).data('amui.datepicker');
  221. });
  222. </script>
  223. <script>
  224. $(function () {
  225. // swith切换
  226. var $mySwitch = $('[data-x-switch]');
  227. $mySwitch.find('[data-switch-item]').click(function () {
  228. var $mySwitchBox = $('.' + $(this).data('switch-box'));
  229. $mySwitchBox.hide().filter('.' + $(this).data('switch-item')).show();
  230. });
  231. /**
  232. * 表单验证提交
  233. * @type {*}
  234. */
  235. $('#my-form').superForm();
  236. });
  237. </script>