setting_edit.blade.php 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333
  1. @extends('admin/layout')
  2. @section('header')
  3. <link href="{{asset('css/plugins/chosen/chosen.css')}}" rel="stylesheet">
  4. <link href="{{asset('css/plugins/switchery/switchery.css')}}" rel="stylesheet">
  5. <link rel="stylesheet"
  6. href="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.9/dist/css/bootstrap-select.min.css">
  7. @endsection
  8. @section('content')
  9. <style>
  10. .image-li img {
  11. width: 100%;
  12. max-height: 100%;
  13. }
  14. .imageDiv {
  15. border: 2px solid #F0F0F0;
  16. border-radius: 5px;
  17. }
  18. .image-li {
  19. list-style-type: none;
  20. cursor: pointer;
  21. float: left;
  22. width: 200px;
  23. padding: 5px 5px;
  24. text-align: center;
  25. }
  26. </style>
  27. <body class="gray-bg">
  28. <div class="wrapper wrapper-content animated fadeInRight">
  29. <div class="row">
  30. <div class="col-sm-12">
  31. <div class="ibox float-e-margins">
  32. <div class="ibox-content">
  33. <form method="get" class="form-horizontal" id="form">
  34. <div class="form-group">
  35. <label class="col-sm-2 control-label" for="theme"><span
  36. class="red">* </span>广告主题:</label>
  37. <div class="col-sm-6">
  38. <input type="text" class="form-control" id="theme" name="theme"
  39. value="{{$info->theme??''}}" autocomplete="off">
  40. </div>
  41. </div>
  42. <div class="form-group">
  43. <label class="col-sm-2 control-label" for="advert_id">投放位置:</label>
  44. <div class="col-sm-6">
  45. <select class="form-control" id="advert_id" name="advert_id">
  46. @foreach($advertList as $key=>$item)
  47. <option value="{{$item->id}}"
  48. @if (!empty($advertId) && $advertId==$item->id) selected @endif>{{$item->name}}
  49. [ {{$item->code}} ]
  50. </option>
  51. @endforeach
  52. </select>
  53. </div>
  54. </div>
  55. <div class="form-group">
  56. <label class="col-sm-2 control-label" for="type">展现形式:</label>
  57. <div class="col-sm-6">
  58. <select class="form-control" id="type" name="type" onchange="changeType()">
  59. <option value="none"
  60. @if (!empty($info->type) && $info->type=='none') selected @endif>请选择
  61. </option>
  62. <option value="text"
  63. @if (!empty($info->type) && $info->type=='text') selected @endif>文本
  64. </option>
  65. <option value="image"
  66. @if (!empty($info->type) && $info->type=='image') selected @endif>图片
  67. </option>
  68. <option value="html"
  69. @if (!empty($info->type) && $info->type=='html') selected @endif>HTML
  70. </option>
  71. </select>
  72. </div>
  73. </div>
  74. <div style="display: none" class="text">
  75. <div class="form-group">
  76. <label class="col-sm-2 control-label" for="text_description">内容文本:</label>
  77. <div class="col-sm-6">
  78. <input type="text" class="form-control" id="text_description"
  79. name="text_description"
  80. value="{{$info->description??''}}" autocomplete="off">
  81. </div>
  82. </div>
  83. <div class="form-group">
  84. <label class="col-sm-2 control-label" for="text_link">链接地址:</label>
  85. <div class="col-sm-6">
  86. <input type="text" class="form-control" id="text_link" name="text_link"
  87. value="{{$info->link??''}}" autocomplete="off">
  88. </div>
  89. </div>
  90. </div>
  91. <div style="display: none" class="html">
  92. <div class="form-group">
  93. <label class="col-sm-2 control-label" for="html">HTML代码:</label>
  94. <div class="col-sm-6">
  95. <input type="text" class="form-control" id="html" name="html"
  96. value="{{$info->html??''}}" autocomplete="off">
  97. </div>
  98. </div>
  99. </div>
  100. <div style="display: none" class="image">
  101. <div class="form-group">
  102. <label class="col-sm-2 control-label" for="image">图片上传:</label>&nbsp;&nbsp;&nbsp;
  103. <button type="button" class="btn btn-primary" onclick="addImages('advertise')">
  104. 图片上传
  105. </button>
  106. <input type="hidden" value="{{$info->source??''}}" id="source">
  107. <div id="images">
  108. </div>
  109. </div>
  110. <div class="form-group">
  111. <label class="col-sm-2 control-label" for="description">图片说明:</label>
  112. <div class="col-sm-6">
  113. <input type="text" class="form-control" id="description" name="description"
  114. value="{{$info->description??''}}" autocomplete="off">
  115. </div>
  116. </div>
  117. <div class="form-group">
  118. <label class="col-sm-2 control-label" for="description_two">图片说明2:</label>
  119. <div class="col-sm-6">
  120. <input type="text" class="form-control" id="description_two"
  121. name="description_two"
  122. value="{{$info->description_two??''}}" autocomplete="off">
  123. </div>
  124. </div>
  125. <div class="form-group">
  126. <label class="col-sm-2 control-label" for="description_three">图片说明3:</label>
  127. <div class="col-sm-6">
  128. <input type="text" class="form-control" id="description_three"
  129. name="description_three"
  130. value="{{$info->description_three??''}}" autocomplete="off">
  131. </div>
  132. </div>
  133. <div class="form-group">
  134. <label class="col-sm-2 control-label" for="link">图片链接:</label>
  135. <div class="col-sm-6">
  136. <input type="text" class="form-control my-date"
  137. name="link" id="link"
  138. value="{{$info->link??''}}" autocomplete="off">
  139. </div>
  140. </div>
  141. <div class="form-group">
  142. <label class="col-sm-2 control-label" for="button">按钮名称1:</label>
  143. <div class="col-sm-6">
  144. <input type="text" class="form-control my-date"
  145. name="button" id="button"
  146. value="{{$info->button??''}}" autocomplete="off">
  147. </div>
  148. </div>
  149. <div class="form-group">
  150. <label class="col-sm-2 control-label" for="button_link">按钮链接1:</label>
  151. <div class="col-sm-6">
  152. <input type="text" class="form-control my-date"
  153. name="button_link" id="button_link"
  154. value="{{$info->button_link??''}}" autocomplete="off">
  155. </div>
  156. </div>
  157. <div class="form-group">
  158. <label class="col-sm-2 control-label" for="button_two">按钮名称2:</label>
  159. <div class="col-sm-6">
  160. <input type="text" class="form-control my-date"
  161. name="button_two" id="button_two"
  162. value="{{$info->button_two??''}}" autocomplete="off">
  163. </div>
  164. </div>
  165. <div class="form-group">
  166. <label class="col-sm-2 control-label" for="button_two_link">按钮链接2:</label>
  167. <div class="col-sm-6">
  168. <input type="text" class="form-control my-date"
  169. name="button_two_link" id="button_two_link"
  170. value="{{$info->button_two_link??''}}" autocomplete="off">
  171. </div>
  172. </div>
  173. </div>
  174. <div class="form-group">
  175. <label class="col-sm-2 control-label" for="start_time">投放起始时间:</label>
  176. <div class="col-sm-6">
  177. <input type="text" class="form-control my-date deadline"
  178. name="start_time" id="start_time"
  179. value="{{$info->start_time??''}}" autocomplete="off">
  180. </div>
  181. </div>
  182. <div class="form-group">
  183. <label class="col-sm-2 control-label" for="end_time">投放截止时间:</label>
  184. <div class="col-sm-6">
  185. <input type="text" class="form-control my-date deadline"
  186. name="end_time" id="end_time"
  187. value="{{$info->end_time??''}}" autocomplete="off">
  188. </div>
  189. </div>
  190. <div class="form-group">
  191. <label class="col-sm-2 control-label" for="is_enabled">是否启用:</label>
  192. <div class="col-sm-6">
  193. <input type="radio" name="is_enabled" value="0"
  194. @if (empty($info->is_enabled)) checked="checked" @endif>启用
  195. <input type="radio" name="is_enabled" value="1"
  196. @if (!empty($info->is_enabled) && $info->is_enabled=='1') checked="checked" @endif>禁用
  197. </div>
  198. </div>
  199. <div class="form-group">
  200. <div class="col-sm-4 col-sm-offset-2">
  201. <button class="btn btn-primary" type="button" data-id="{{$info->id??0}}" id="save">
  202. 保存
  203. </button>
  204. <button class="btn btn-white" type="button" id="cancel">取消</button>
  205. </div>
  206. </div>
  207. </form>
  208. </div>
  209. </div>
  210. </div>
  211. </div>
  212. </div>
  213. </body>
  214. @endsection
  215. @section('footer')
  216. <script src="{{asset('js/plugins/switchery/switchery.js')}}"></script>
  217. <script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.9/dist/js/bootstrap-select.min.js"></script>
  218. <script src="{{asset('js/plugins/layDate-v5.0.9/laydate/laydate.js')}}"></script>
  219. <script>
  220. function addImages(type) {
  221. layer.open({
  222. type: 2,
  223. content: ['/admin/stencil/images/{{$siteId}}/' + type],
  224. area: ['80%', '80%'],
  225. title: '编辑'
  226. });
  227. }
  228. $(document).on('click', '.js-del-item', function () {
  229. $(this).parent().parent().remove();
  230. });
  231. changeType();
  232. //同时绑定多个
  233. lay('.deadline').each(function () {
  234. laydate.render({
  235. elem: this
  236. , trigger: 'click'
  237. , type: 'datetime'
  238. });
  239. });
  240. $(document).on('click', '#cancel', function () {
  241. tips.closeParentLayer();
  242. });
  243. $(document).on('click', '#save', function () {
  244. var data = tips.getFormValues('#form');
  245. var id = $(this).data('id');
  246. data.source = $('#images').find("img").attr('src');
  247. if (data.type === 'none') {
  248. layer.alert('请选择展现形式', {icon: 0});
  249. return;
  250. }
  251. var ajaxConfig = {
  252. url: '/admin/advertise/setting-edit/' + id + '/{{$siteId}}/{{$advertId}}',
  253. type: 'post',
  254. data: data,
  255. success: function (result) {
  256. layer.msg(result.message, {icon: 6, time: 1500}, function () {
  257. tips.closeParentLayer();
  258. window.parent.tips.tableRefresh('#table');
  259. });
  260. }
  261. };
  262. tips.ajax(ajaxConfig);
  263. });
  264. function changeType() {
  265. var type = $('#type').val();
  266. if (type === 'none') {
  267. $(".text").css("display", "none");
  268. $(".image").css("display", "none");
  269. $(".html").css("display", "none");
  270. }
  271. if (type === 'text') {
  272. $(".text").css("display", "block");
  273. $(".image").css("display", "none");
  274. $(".html").css("display", "none");
  275. }
  276. if (type === 'image') {
  277. $(".text").css("display", "none");
  278. $(".image").css("display", "block");
  279. $(".html").css("display", "none");
  280. var object = $('#images');
  281. object.empty();
  282. var source = $('#source').val();
  283. if (source) {
  284. var thumb =
  285. '<div class="col-sm-2 control-label">' +
  286. '</div>' +
  287. '<li class="image-li">' +
  288. '<div class="imageDiv">' +
  289. '<div style="justify-content: center;align-items: center;flex-direction: column;overflow: hidden;margin: auto;">' +
  290. '<img src="' + source + '" alt="' + source + '">' +
  291. '</div>' +
  292. '<div style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;padding: 10px;">' + source + '</div>' +
  293. '<a href="javascript:;" class="js-del-item">' +
  294. '<i class="fa fa-remove"></i>移除' +
  295. '</a>' +
  296. '</div>' +
  297. '</li>';
  298. object.append(thumb);
  299. }
  300. }
  301. if (type === 'html') {
  302. $(".text").css("display", "none");
  303. $(".image").css("display", "none");
  304. $(".html").css("display", "block");
  305. }
  306. }
  307. </script>
  308. @endsection