add.html 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624
  1. <form id="add-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
  2. <!-- 自定义标题样式 -->
  3. <style>
  4. .section-title {
  5. font-size: 16px;
  6. font-weight: bold;
  7. color: #333;
  8. margin-bottom: 20px;
  9. padding-left: 15px;
  10. border-left: 4px solid #18bc9c;
  11. line-height: 1.5;
  12. }
  13. .section-content {
  14. margin-bottom: 20px;
  15. padding: 20px 0;
  16. background-color: #fff;
  17. }
  18. /* 任务设置样式 */
  19. .task-checkboxes label.checkbox-inline {
  20. font-weight: normal;
  21. padding: 8px 15px;
  22. border: 1px solid #ddd;
  23. border-radius: 4px;
  24. background-color: #f9f9f9;
  25. cursor: pointer;
  26. transition: all 0.3s ease;
  27. display: inline-block;
  28. min-width: 120px;
  29. text-align: center;
  30. }
  31. .task-checkboxes label.checkbox-inline:hover {
  32. border-color: #18bc9c;
  33. background-color: #f0f9f7;
  34. }
  35. .task-checkboxes label.checkbox-inline input[type="checkbox"] {
  36. margin-right: 5px;
  37. }
  38. .task-checkboxes label.checkbox-inline:has(input[type="checkbox"]:checked) {
  39. border-color: #18bc9c;
  40. background-color: #e8f5f0;
  41. color: #18bc9c;
  42. font-weight: bold;
  43. }
  44. /* 兼容性:对于不支持:has的浏览器 */
  45. .task-checkboxes label.checkbox-inline.checked {
  46. border-color: #18bc9c;
  47. background-color: #e8f5f0;
  48. color: #18bc9c;
  49. font-weight: bold;
  50. }
  51. .task-setting-item {
  52. margin-bottom: 15px;
  53. }
  54. .task-setting-item .panel-heading {
  55. background-color: #f5f5f5;
  56. border-bottom: 1px solid #ddd;
  57. }
  58. .task-setting-item .panel-title {
  59. font-size: 14px;
  60. font-weight: bold;
  61. color: #333;
  62. }
  63. .task-setting-item .panel-body {
  64. padding: 15px;
  65. }
  66. #selected-goods {
  67. font-size: 12px;
  68. line-height: 1.4;
  69. }
  70. /* 商品选择区域样式 */
  71. .goods-select-container {
  72. padding: 0;
  73. }
  74. .goods-select-row {
  75. display: flex;
  76. align-items: center;
  77. margin-bottom: 15px;
  78. }
  79. .goods-label {
  80. display: inline-block;
  81. width: 100px;
  82. margin-right: 20px;
  83. font-weight: normal;
  84. flex-shrink: 0;
  85. }
  86. .goods-options {
  87. display: flex;
  88. align-items: center;
  89. }
  90. .goods-options .radio-inline {
  91. margin-right: 30px;
  92. margin-bottom: 0;
  93. }
  94. .goods-button-row {
  95. margin-left: 120px;
  96. margin-bottom: 15px;
  97. }
  98. .goods-description-row {
  99. margin-left: 120px;
  100. }
  101. .goods-description-box {
  102. min-height: 40px;
  103. padding: 10px;
  104. border: 1px dashed #ddd;
  105. border-radius: 4px;
  106. background-color: #fafafa;
  107. font-size: 12px;
  108. line-height: 1.4;
  109. }
  110. /* 任务金额设置样式 */
  111. .task-amount-setting {
  112. display: flex;
  113. align-items: center;
  114. margin-bottom: 15px;
  115. flex-wrap: wrap;
  116. }
  117. .task-amount-label {
  118. display: inline-block;
  119. margin-right: 10px;
  120. font-weight: normal;
  121. white-space: nowrap;
  122. flex-shrink: 0;
  123. }
  124. .task-amount-input {
  125. width: 180px;
  126. margin-right: 10px;
  127. flex-shrink: 0;
  128. }
  129. .task-amount-desc {
  130. color: #666;
  131. font-size: 13px;
  132. white-space: nowrap;
  133. flex-shrink: 0;
  134. }
  135. .task-amount-help {
  136. color: #999;
  137. font-size: 12px;
  138. line-height: 1.4;
  139. margin-top: 5px;
  140. }
  141. .task-amount-help .fa-question-circle {
  142. color: #999;
  143. cursor: help;
  144. }
  145. .next-box{
  146. margin-top: 10px;
  147. background-color: #f4f6f8;
  148. padding: 30px 20px;
  149. border-radius: 2px;
  150. font-size: 14px;
  151. line-height: 20px;
  152. color: #262b30;
  153. }
  154. /* 渠道选择样式 */
  155. </style>
  156. <!-- 基础信息区域 -->
  157. <div class="section-content">
  158. <div class="section-title">基础信息</div>
  159. <!-- 活动名称 -->
  160. <div class="form-group">
  161. <label class="control-label col-xs-12 col-sm-2">活动名称:</label>
  162. <div class="col-xs-12 col-sm-8">
  163. <div class="input-group">
  164. <input id="c-name" maxlength="24" data-rule="required" class="form-control" name="row[name]" type="text" placeholder="请输入活动名称,最多24个字符">
  165. <span class="input-group-addon text-muted" id="activity-name-count">0/24</span>
  166. </div>
  167. <span class="help-block">活动名称最多24个字符</span>
  168. </div>
  169. </div>
  170. <!-- 活动时间 -->
  171. <div class="form-group">
  172. <label class="control-label col-xs-12 col-sm-2">活动时间:</label>
  173. <div class="col-xs-12 col-sm-8">
  174. <div class="input-daterange input-group">
  175. <input id="c-start_time" data-rule="required" class="form-control datetimepicker" name="row[start_time]" type="text" placeholder="请选择开始时间">
  176. <span class="input-group-addon">~</span>
  177. <input id="c-end_time" data-rule="required" class="form-control datetimepicker" name="row[end_time]" type="text" placeholder="请选择结束时间">
  178. </div>
  179. <span class="help-block">设置活动的开始和结束时间</span>
  180. </div>
  181. </div>
  182. <!-- 活动渠道 -->
  183. <div class="form-group">
  184. <label class="control-label col-xs-12 col-sm-2">活动渠道:</label>
  185. <div class="col-xs-12 col-sm-8">
  186. <!-- 渠道选择 -->
  187. <div class="channel-list">
  188. {foreach name="channelList" item="vo" key="key"}
  189. <label class="checkbox-inline">
  190. <input type="checkbox" name="row[channels][]" value="{$key}" {if condition="$key eq 1"}data-rule="checked" data-rule-message="请至少选择一个活动渠道"{/if}>
  191. {$vo}
  192. </label>
  193. {/foreach}
  194. </div>
  195. <span class="help-block">请选择本次活动投放的渠道,至少选择一个</span>
  196. </div>
  197. </div>
  198. <!-- 活动描述 -->
  199. <div class="form-group">
  200. <label class="control-label col-xs-12 col-sm-2">活动描述:</label>
  201. <div class="col-xs-12 col-sm-8">
  202. <textarea id="c-description" class="form-control" rows="3" name="row[description]" placeholder="请输入活动描述"></textarea>
  203. <span class="help-block">简要描述活动内容和规则</span>
  204. </div>
  205. </div>
  206. <!-- 活动封面 -->
  207. <div class="form-group">
  208. <label class="control-label col-xs-12 col-sm-2">活动封面:</label>
  209. <div class="col-xs-12 col-sm-8">
  210. <div class="input-group">
  211. <input id="c-cover_image" class="form-control" name="row[cover_image]" type="text" placeholder="请上传活动封面图片">
  212. <div class="input-group-addon no-border no-padding">
  213. <span><button type="button" id="plupload-cover_image" class="btn btn-danger plupload" data-input-id="c-cover_image" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp" data-multiple="false" data-preview-id="p-cover_image"><i class="fa fa-upload"></i> 上传</button></span>
  214. <span><button type="button" id="fachoose-cover_image" class="btn btn-primary fachoose" data-input-id="c-cover_image" data-mimetype="image/*" data-multiple="false"><i class="fa fa-list"></i> 选择</button></span>
  215. </div>
  216. </div>
  217. <ul class="row list-inline plupload-preview" id="p-cover_image"></ul>
  218. <span class="help-block">建议尺寸:750*400像素</span>
  219. </div>
  220. </div>
  221. <!-- 活动状态 -->
  222. <!-- <div class="form-group">
  223. <label class="control-label col-xs-12 col-sm-2">活动状态:</label>
  224. <div class="col-xs-12 col-sm-8">
  225. {foreach name="statusList" item="vo"}
  226. <label for="row[status]-{$key}" class="radio-inline">
  227. <input id="row[status]-{$key}" name="row[status]" type="radio" value="{$key}" {if condition="$key eq 0"}checked{/if}> {$vo}
  228. </label>
  229. {/foreach}
  230. <span class="help-block">草稿状态不会对外展示,进行中状态用户可参与</span>
  231. </div>
  232. </div> -->
  233. </div>
  234. <div class="section-content">
  235. <div class="section-title">开奖设置</div>
  236. <!-- 开奖方式 -->
  237. <div class="form-group">
  238. <label class="control-label col-xs-12 col-sm-2">开奖方式:</label>
  239. <div class="col-xs-12 col-sm-8">
  240. {foreach name="lotteryTypeList" item="vo"}
  241. <label for="row[lottery_type]-{$key}" class="radio-inline">
  242. <input id="row[lottery_type]-{$key}" name="row[lottery_type]" data-rule="checked" data-rule-message="请至少选择一种开奖方式" type="radio" value="{$key}" {if condition="$key eq 1"}checked{/if}> {$vo}
  243. </label>
  244. {/foreach}
  245. </div>
  246. </div>
  247. <!-- 开奖时间 -->
  248. <div class="form-group" data-favisible="lottery_type=2,3">
  249. <label class="control-label col-xs-12 col-sm-2">开奖时间:</label>
  250. <div class="col-xs-12 col-sm-8">
  251. <input id="c-lottery_time" data-rule="required" data-rule-message="请选择开奖时间" class="form-control datetimepicker" data-date-format="YYYY-MM-DD HH:mm:ss" name="row[lottery_time]" type="text">
  252. </div>
  253. </div>
  254. <!-- 开奖人数 -->
  255. <div class="form-group" data-favisible="lottery_type=3">
  256. <label class="control-label col-xs-12 col-sm-2">开奖人数:</label>
  257. <div class="col-xs-12 col-sm-8">
  258. <input id="c-lottery_people_num" data-rule="required" data-rule-message="请输入开奖人数" class="form-control" name="row[lottery_people_num]" type="number" min="1">
  259. </div>
  260. </div>
  261. </div>
  262. <!-- 奖品设置区域 -->
  263. <div class="section-content">
  264. <div class="section-title">奖品设置</div>
  265. <div class="form-group">
  266. <label class="control-label col-xs-12 col-sm-2"><span class="text-danger">*</span> 奖品配置:</label>
  267. <div class="col-xs-12 col-sm-10">
  268. <!-- 添加奖品按钮和提示信息 -->
  269. <div style="margin-bottom: 15px;">
  270. <button type="button" id="add-prize-btn" class="btn btn-success btn-sm" onclick="addPrize()">
  271. <i class="fa fa-plus"></i> <span class="btn-text">添加奖品</span> (<span id="prize-count">1</span>/8)
  272. </button>
  273. <span class="text-muted" style="margin-left: 15px;">
  274. 当前总概率:<span id="total-rate" class="text-warning">0.00%</span>
  275. </span>
  276. <div id="prize-count-tip" class="text-muted" style="margin-top: 5px; font-size: 12px;">还需添加 7 个奖品</div>
  277. </div>
  278. <!-- 提示信息 -->
  279. <div class="alert alert-info" style="padding: 8px 12px; margin-bottom: 15px; font-size: 12px;">
  280. 所有奖品总概率必须等于100%,包含未中奖;当奖品库存不足时,抽奖结果自动置为"未中奖"
  281. </div>
  282. <!-- 奖品表格 -->
  283. <div class="table-responsive">
  284. <table class="table table-bordered" style="margin-bottom: 0;">
  285. <thead style="background-color: #f5f5f5;">
  286. <tr>
  287. <th width="60" class="text-center">排序</th>
  288. <th width="120">奖品名称</th>
  289. <th width="100">奖品详情</th>
  290. <th width="80" class="text-center">奖品图片</th>
  291. <th width="80" class="text-center">奖品数量 <i class="fa fa-question-circle" title="设置奖品库存数量"></i></th>
  292. <th width="100" class="text-center">中奖概率 <i class="fa fa-question-circle" title="设置中奖概率,所有奖品概率总和必须≤100%"></i></th>
  293. <th width="80" class="text-center">已发放</th>
  294. <th width="120" class="text-center">操作</th>
  295. </tr>
  296. </thead>
  297. <tbody class="prize-list">
  298. <!-- 默认未中奖项 -->
  299. <tr class="prize-item" data-type="no-prize" data-index="0" data-prize-id="system-no-prize">
  300. <td class="text-center">
  301. <i class="fa fa-bars prize-sort-handle" style="cursor: move; color: #ccc;" title="拖拽排序"></i>
  302. </td>
  303. <td>
  304. <div class="prize-info">
  305. <strong class="prize-name">谢谢参与</strong>
  306. </div>
  307. <!-- 隐藏域存储未中奖项的表单数据 -->
  308. <input type="hidden" class="prize-name-input" name="prizes[0][name]" value="谢谢参与">
  309. <input type="hidden" class="prize-type-input" name="prizes[0][type]" value="1">
  310. <input type="hidden" class="prize-image-input" name="prizes[0][image]" value="{$prize_losing_lottery}">
  311. </td>
  312. <td class="text-center">
  313. <span class="label label-default">未中奖</span>
  314. </td>
  315. <td class="text-center">
  316. <img src="{$prize_losing_lottery|cdnurl}" class="prize-image img-rounded" alt="谢谢参与">
  317. </td>
  318. <td class="text-center">
  319. <span class="text-muted">-</span>
  320. </td>
  321. <td class="text-center">
  322. <div class="input-group prize-rate-group">
  323. <input type="number" class="form-control input-sm prize-rate text-center" name="prizes[0][rate]" id="no-prize-rate-input" value="50.00" min="0" max="100" step="0.01">
  324. <span class="input-group-addon">%</span>
  325. </div>
  326. </td>
  327. <td class="text-center">
  328. <span class="text-muted">-</span>
  329. </td>
  330. <td class="text-center">
  331. <button type="button" class="btn btn-xs btn-primary edit-prize" style="margin-right: 5px;">编辑</button>
  332. <br><span class="text-muted" style="font-size: 11px;">系统默认</span>
  333. </td>
  334. </tr>
  335. </tbody>
  336. </table>
  337. </div>
  338. <!-- 隐藏验证字段 -->
  339. <input type="hidden" name="prize_setting_check" data-rule="prize_setting_check" data-rule-message="请完善奖品设置" />
  340. <!-- 底部提示 -->
  341. <!-- <div class="text-danger" style="margin-top: 10px; font-size: 12px;">
  342. 必须添加8个奖品
  343. </div> -->
  344. </div>
  345. </div>
  346. <!-- 兑奖期限设置 -->
  347. <div class="form-group">
  348. <label class="control-label col-xs-12 col-sm-2">兑奖期限:</label>
  349. <div class="col-xs-12 col-sm-8">
  350. <label class="radio-inline">
  351. <input name="row[redeem_expire_type]" type="radio" value="1" checked data-rule="required" data-rule-message="请选择兑奖期限"> 永久有效
  352. </label>
  353. <label class="radio-inline">
  354. <input name="row[redeem_expire_type]" type="radio" value="2"> 固定时长
  355. </label>
  356. <div data-favisible="redeem_expire_type=2" style="margin-top: 10px;">
  357. <div class="input-group" style="width: 200px;">
  358. <input type="number" class="form-control" name="row[redeem_expire_days]" min="1" max="365" value="7" data-rule="range(1~365)" data-rule-message="兑奖期限必须在1-365天之间">
  359. <span class="input-group-addon">天</span>
  360. </div>
  361. </div>
  362. <span class="help-block">仅针对商品设置兑奖期限,其他奖品类型兑奖期限皆在中奖时直接发放</span>
  363. </div>
  364. </div>
  365. </div>
  366. <!-- 规则设置区域 -->
  367. <div class="section-content">
  368. <div class="section-title">规则设置</div>
  369. <!-- 适用人群 -->
  370. <div class="form-group">
  371. <label class="control-label col-xs-12 col-sm-2">适用人群:</label>
  372. <div class="col-xs-12 col-sm-8">
  373. {foreach name="userLimitTypeList" item="vo"}
  374. <label for="row[user_limit_type]-{$key}" class="radio-inline">
  375. <input id="row[user_limit_type]-{$key}" name="row[user_limit_type]" type="radio" value="{$key}" {if condition="$key eq 3"}checked{/if} data-rule="required" data-rule-message="请选择适用人群"> {$vo}
  376. </label>
  377. {/foreach}
  378. </div>
  379. </div>
  380. <!-- 任务设置 -->
  381. <div class="form-group">
  382. <label class="control-label col-xs-12 col-sm-2">任务设置:</label>
  383. <div class="col-xs-12 col-sm-10">
  384. <!-- 任务类型选择 -->
  385. <div class="task-checkboxes" style="margin-bottom: 15px;">
  386. {foreach name="conditionTypeList" item="vo"}
  387. <label class="checkbox-inline" style="margin-right: 15px; margin-bottom: 10px;">
  388. <input type="checkbox" name="row[task_type][]" value="{$key}" data-rule="checked" data-rule-message="请至少选择一种任务类型" >
  389. <span>{$vo}</span>
  390. </label>
  391. {/foreach}
  392. </div>
  393. <!-- 隐藏验证字段 -->
  394. <div class="help-block" style="margin-bottom: 15px;">每完成一次指定任务将获得一次抽奖机会</div>
  395. <!-- 任务详细设置区域 -->
  396. <div class="task-settings-container">
  397. <!-- 购买指定商品设置 -->
  398. <div class="task-setting-item" id="task-setting-1" style="display: none;">
  399. <div class="panel panel-default">
  400. <div class="panel-heading">
  401. <h4 class="panel-title">购买指定商品</h4>
  402. </div>
  403. <div class="panel-body">
  404. <div class="goods-select-container">
  405. <!-- 条件类型隐藏字段 -->
  406. <input type="hidden" name="condition[1][type]" value="1">
  407. <div class="goods-select-row">
  408. <span class="goods-label"><span class="text-danger">*</span> 选择商品:</span>
  409. <div class="goods-options">
  410. <label class="radio-inline">
  411. <input type="radio" name="condition[1][goods_rule]" value="1" checked> 指定商品参与
  412. </label>
  413. <label class="radio-inline">
  414. <input type="radio" name="condition[1][goods_rule]" value="2"> 指定商品不可参与
  415. </label>
  416. </div>
  417. </div>
  418. <div class="goods-button-row">
  419. <button type="button" class="btn btn-success btn-sm" onclick="selectTaskGoods('#selected-goods')">
  420. <i class="fa fa-plus"></i> 添加商品
  421. </button>
  422. </div>
  423. <div class="goods-description-row">
  424. <div id="selected-goods" class="goods-description-box">
  425. <span class="text-muted">该商品下单后将自动触发抽奖活动且发放一次抽奖机会,若用户产生维权退款,已发放的奖励自动回收。如果要制约用户使用其他无法回收:若该商品同时参与秒杀、砍价、拼团及其他营销活动,弹窗提醒将有次数限定 <i class="fa fa-question-circle" title="帮助说明"></i></span>
  426. </div>
  427. <!-- 商品ID列表隐藏字段,用于存储JSON格式的商品IDs -->
  428. <input type="hidden" name="condition[1][goods_ids]" value="" id="task-goods-ids-1">
  429. </div>
  430. </div>
  431. </div>
  432. </div>
  433. </div>
  434. <!-- 单笔订单消费满N元设置 -->
  435. <div class="task-setting-item" id="task-setting-2" style="display: none;">
  436. <div class="panel panel-default">
  437. <div class="panel-heading">
  438. <h4 class="panel-title">单笔订单消费满N元</h4>
  439. </div>
  440. <div class="panel-body">
  441. <!-- 条件类型隐藏字段 -->
  442. <input type="hidden" name="condition[2][type]" value="2">
  443. <div class="task-amount-setting">
  444. <span class="task-amount-label">单次消费满</span>
  445. <div class="input-group task-amount-input">
  446. <input type="number" class="form-control" name="condition[2][condition_value]" min="0.01" step="0.01" placeholder="请输入">
  447. <span class="input-group-addon">元</span>
  448. </div>
  449. <span class="task-amount-desc">可触发抽奖活动且发放一次抽奖机会</span>
  450. </div>
  451. <div class="task-amount-help">单次消费金额满足设置可触发抽奖活动,满足条件即可触发,消费金额不包含运费,整单维权成功后收回奖励</div>
  452. </div>
  453. </div>
  454. </div>
  455. <!-- 单次充值金额满N元设置 -->
  456. <div class="task-setting-item" id="task-setting-3" style="display: none;">
  457. <div class="panel panel-default">
  458. <div class="panel-heading">
  459. <h4 class="panel-title">单次充值金额满N元</h4>
  460. </div>
  461. <div class="panel-body">
  462. <!-- 条件类型隐藏字段 -->
  463. <input type="hidden" name="condition[3][type]" value="3">
  464. <div class="task-amount-setting">
  465. <span class="task-amount-label">单次充值满</span>
  466. <div class="input-group task-amount-input">
  467. <input type="number" class="form-control" name="condition[3][condition_value]" min="0.01" step="0.01" placeholder="请输入">
  468. <span class="input-group-addon">元</span>
  469. </div>
  470. <span class="task-amount-desc">可触发抽奖活动且发放一次抽奖机会</span>
  471. </div>
  472. <div class="task-amount-help">单次充值金额满足设置可触发抽奖活动,满足条件即可触发,充值页面将有进行提示 <i class="fa fa-question-circle" title="帮助说明"></i></div>
  473. </div>
  474. </div>
  475. </div>
  476. <!-- 活动期间累计消费N元设置 -->
  477. <div class="task-setting-item" id="task-setting-4" style="display: none;">
  478. <div class="panel panel-default">
  479. <div class="panel-heading">
  480. <h4 class="panel-title">活动期间累计消费N元</h4>
  481. </div>
  482. <div class="panel-body">
  483. <!-- 条件类型隐藏字段 -->
  484. <input type="hidden" name="condition[4][type]" value="4">
  485. <div class="task-amount-setting">
  486. <span class="task-amount-label">活动期间内累计消费满</span>
  487. <div class="input-group task-amount-input">
  488. <input type="number" class="form-control" name="condition[4][condition_value]" min="0.01" step="0.01" placeholder="请输入">
  489. <span class="input-group-addon">元</span>
  490. </div>
  491. <span class="task-amount-desc">可触发抽奖活动且发放一次抽奖机会</span>
  492. </div>
  493. <div class="task-amount-help">活动期间内累计消费金额满足设置可触发抽奖活动,满足条件即可触发,消费金额不包含运费,一旦发放抽奖次数无法收回 <i class="fa fa-question-circle" title="帮助说明"></i></div>
  494. </div>
  495. </div>
  496. </div>
  497. </div>
  498. </div>
  499. </div>
  500. <!-- 引导样式 -->
  501. <div class="form-group">
  502. <label class="control-label col-xs-12 col-sm-2">引导样式:</label>
  503. <div class="col-xs-12 col-sm-8">
  504. {foreach name="guideStyleList" item="vo"}
  505. <label for="row[guide_style]-{$key}" class="radio-inline">
  506. <input id="row[guide_style]-{$key}" name="row[guide_style]" type="radio" value="{$key}" {if condition="$key eq 1"}checked{/if} data-rule="required" data-rule-message="请选择引导样式"> {$vo}
  507. </label>
  508. {/foreach}
  509. <!-- 默认样式预览 -->
  510. <div data-favisible="guide_style=1" class="next-box">
  511. <img src="{$lottery_guide|cdnurl}" style="width: 100px;">
  512. </div>
  513. </div>
  514. </div>
  515. <!-- 自定义引导样式 -->
  516. <div class="form-group" data-favisible="guide_style=2">
  517. <label class="control-label col-xs-12 col-sm-2">自定义引导图片:</label>
  518. <div class="col-xs-12 col-sm-8">
  519. <div class="input-group">
  520. <input id="c-guide_image" data-rule="required" class="form-control" name="row[guide_image]" type="text" placeholder="请上传引导图片">
  521. <div class="input-group-addon no-border no-padding">
  522. <span><button type="button" id="plupload-guide_image" class="btn btn-danger plupload" data-input-id="c-guide_image" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp" data-multiple="false"><i class="fa fa-upload"></i> 上传</button></span>
  523. </div>
  524. </div>
  525. </div>
  526. </div>
  527. <div class="form-group" data-visible="row[guide_style]=2">
  528. <label class="control-label col-xs-12 col-sm-2">引导文案:</label>
  529. <div class="col-xs-12 col-sm-8">
  530. <input id="c-guide_text" class="form-control" name="row[guide_text]" type="text" placeholder="请输入引导文案">
  531. </div>
  532. </div>
  533. <!-- 单人参与次数限制 -->
  534. <div class="form-group">
  535. <label class="control-label col-xs-12 col-sm-2">单人参与次数限制:</label>
  536. <div class="col-xs-12 col-sm-8">
  537. <input id="c-person_limit_num" class="form-control" name="row[person_limit_num]" type="number" value="1" min="1">
  538. <span class="help-block">设置每个用户最多可参与的抽奖次数</span>
  539. </div>
  540. </div>
  541. <!-- 抽奖介绍内容 -->
  542. <div class="form-group">
  543. <label class="control-label col-xs-12 col-sm-2">抽奖介绍内容:</label>
  544. <div class="col-xs-12 col-sm-8">
  545. <textarea id="c-intro_content" class="form-control editor" rows="5" name="row[intro_content]" placeholder="请输入抽奖活动的详细介绍"></textarea>
  546. <span class="help-block">支持富文本编辑,用于向用户展示活动详情</span>
  547. </div>
  548. </div>
  549. </div>
  550. <!-- 底部按钮 -->
  551. <div class="form-group layer-footer" style="margin-top: 30px;">
  552. <div class="col-xs-12 text-center">
  553. <button type="submit" class="btn btn-success btn-lg" style="margin-right: 10px;">
  554. <i class="fa fa-save"></i> 保存活动
  555. </button>
  556. <button type="reset" class="btn btn-default btn-lg">
  557. <i class="fa fa-refresh"></i> 重置
  558. </button>
  559. </div>
  560. </div>
  561. </form>
  562. <!-- 引入JavaScript模板 -->
  563. {include file="lottery/activity/scripttpl" /}