add.php 34 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704
  1. <?php use common\widgets\UeditorWidget; ?>
  2. <div class="row">
  3. <div class="col-sm-12">
  4. <div class="panel panel-default">
  5. <div class="panel-body">
  6. <form role="form" class="form-horizontal" id="goods-data-form">
  7. <input type="hidden" name="_csrf" value="<?= Yii::$app->request->csrfToken ?>"/>
  8. <div class="form-group">
  9. <label class="col-sm-2 control-label">*名称:</label>
  10. <div class="col-sm-10">
  11. <input type="text" class="form-control" name="goodsName" placeholder="">
  12. <p></p>
  13. </div>
  14. </div>
  15. <div class="form-group">
  16. <label class="col-sm-2 control-label">*已售出:</label>
  17. <div class="col-sm-10">
  18. <input type="tel" class="form-control" name="sold" placeholder="可自定义销售量,实际销售量会在此基础上累加">
  19. <p></p>
  20. </div>
  21. </div>
  22. <div class="form-group">
  23. <label class="col-sm-2 control-label" for="field-1">花材:</label>
  24. <div class="col-sm-10">
  25. <input type="text" class="form-control" name="material" placeholder="">
  26. <p></p>
  27. </div>
  28. </div>
  29. <div class="form-group">
  30. <label class="col-sm-2 control-label" for="field-1">花语:</label>
  31. <div class="col-sm-10">
  32. <input type="text" class="form-control" name="representative" placeholder="">
  33. <p></p>
  34. </div>
  35. </div>
  36. <div class="form-group-separator"></div>
  37. <div class="form-group">
  38. <label class="col-sm-2 control-label">*图片:</label>
  39. <div>
  40. <div style="margin-left:16px;width:113px;height:174px;float:left;display:inline-block">
  41. 封面[550x550]:
  42. <div style="width:97px;height:110px;display:inline-block;margin-bottom:3px;">
  43. <img src="/images/nopicture.png" name="cover" style="width:97px;height:110px;" class="img-thumbnail"/>
  44. </div>
  45. <a href="javascript:;" class="a-upload">
  46. <input type="file" id="cover" accept="image/*" value=""/>选择图片 </a>
  47. <input type="hidden" name="cover" value=""/>
  48. </div>
  49. <div style="margin-left:16px;width:157px;height:174px;float:left;display:inline-block;float:left;">
  50. 图Ⅰ[800x800]:
  51. <div style="width:141px;height:110px;display:inline-block;margin-bottom:3px;">
  52. <img src="/images/nopicture.png" name="shopImg1" style="width:128px;height:110px;" class="img-thumbnail"/>
  53. </div>
  54. <a href="javascript:;" class="a-upload">
  55. <input type="file" accept="image/*" id="shopImg1" value=""/>选择图片 </a>
  56. <input type="hidden" name="shopImg1" value=""/>
  57. </div>
  58. <div style="margin-left:16px;width:157px;height:174px;float:left;display:inline-block;float:left;">
  59. 图Ⅱ[800x800]:
  60. <div style="width:141px;height:110px;display:inline-block;margin-bottom:3px;">
  61. <img src="/images/nopicture.png" name="shopImg2" style="width:128px;height:110px;" class="img-thumbnail"/>
  62. </div>
  63. <a href="javascript:;" class="a-upload">
  64. <input type="file" accept="image/*" id="shopImg2" value=""/>选择图片 </a>
  65. <input type="hidden" name="shopImg2" value=""/>
  66. </div>
  67. <div style="margin-left:16px;width:157px;height:174px;float:left;display:inline-block;float:left;">
  68. 图Ⅲ[800x800]:
  69. <div style="width:141px;height:110px;display:inline-block;margin-bottom:3px;">
  70. <img src="/images/nopicture.png" name="shopImg3" style="width:128px;height:110px;" class="img-thumbnail"/>
  71. </div>
  72. <a href="javascript:;" class="a-upload">
  73. <input type="file" accept="image/*" id="shopImg3" value=""/>选择图片 </a>
  74. <input type="hidden" name="shopImg3" value=""/>
  75. </div>
  76. <div style="clear:both;margin-left:228px;"><p></p></div>
  77. </div>
  78. </div>
  79. <div class="form-group-separator"></div>
  80. <div class="form-group price-area">
  81. <label class="col-sm-2 control-label">商品规格:</label>
  82. <div class="col-sm-10">
  83. <div class="col-sm-2 radio-inline">
  84. <label><input type="radio" name="priceType" data-type='single' value='single' checked="checked">一种规格</label>
  85. </div>
  86. <div class="col-sm-2 radio-inline">
  87. <label><input type="radio" name="priceType" data-type='multi' value='multi'>多种规格</label>
  88. </div>
  89. </div>
  90. </div>
  91. <div class="form-group">
  92. <label class="col-sm-2 control-label">价格:</label>
  93. <div class="single-price-area">
  94. <div class="col-sm-10" style="color:#555">
  95. <div class="form-group">
  96. <div class="col-sm-10">
  97. <input type="text" name="price" class="form-control" value="">
  98. <p></p>
  99. </div>
  100. </div>
  101. </div>
  102. </div>
  103. <div class="multi-price-area" style="display:none; color:#555;">
  104. <div class="col-sm-10">
  105. <div class="form-group">
  106. <div class="col-sm-10">
  107. 名称:<input type="text" name="goodTitle[]" class="form-control" style="width:150px;display:inline-block;" placeholder="">
  108. &nbsp;&nbsp;&nbsp;&nbsp;价格:<input type="text" name="multiPrice[]" class="form-control" style="width:100px;display:inline-block;" placeholder="">
  109. &nbsp;&nbsp;&nbsp;&nbsp;<img src="/images/nopicture.png" style="width:50px;height:50px;" class="multi-price-img"> [210X150]
  110. <a href="javascript:;" class="a-upload">
  111. <input type="file" accept="image/*" class="img-upload-btn"/>上传图片 </a>
  112. <input type="hidden" name="multiImg[]" value=""/>
  113. </div>
  114. </div>
  115. <div class="form-group">
  116. <div class="col-sm-10">
  117. 名称:<input type="text" name="goodTitle[]" class="form-control" style="width:150px;display:inline-block;" placeholder="">
  118. &nbsp;&nbsp;&nbsp;&nbsp;价格:<input type="text" name="multiPrice[]" class="form-control" style="width:100px;display:inline-block;" placeholder="">
  119. &nbsp;&nbsp;&nbsp;&nbsp;<img src="/images/nopicture.png" style="width:50px;height:50px;" class="multi-price-img"> [210X150]
  120. <a href="javascript:;" class="a-upload">
  121. <input type="file" accept="image/*" class="img-upload-btn"/>上传图片 </a>
  122. <input type="hidden" name="multiImg[]" value=""/>
  123. </div>
  124. </div>
  125. </div>
  126. <div class="col-sm-10">
  127. <label class="col-sm-2 control-label"></label>
  128. <div class="col-sm-8" style="margin-left: 35px;">
  129. <button type="button" class="btn btn-turquoise add-price-btn">
  130. <li class="fa-plus"></li>
  131. 增加价格
  132. </button>
  133. </div>
  134. </div>
  135. </div>
  136. </div>
  137. <div class="form-group price-area">
  138. <label class="col-sm-2 control-label">运费计算:</label>
  139. <div class="col-sm-10 ">
  140. <div class="col-sm-2 radio-inline">
  141. <label><input type="radio" name="isCharge" value='1' checked="checked"> 按距离收费</label>
  142. </div>
  143. <div class="col-sm-2">
  144. <label><input type="radio" name="isCharge" value='0'> 免运费</label>
  145. </div>
  146. </div>
  147. </div>
  148. <div class="form-group-separator"></div>
  149. <div class="form-group">
  150. <label class="col-sm-2 control-label" for="field-3">*商品简介:</label>
  151. <div class="col-sm-10">
  152. <?= UeditorWidget::widget(['name' => 'content', 'content' => '']); ?>
  153. <p></p>
  154. </div>
  155. </div>
  156. <div class="form-group-separator"></div>
  157. <div class="form-group">
  158. <label class="col-sm-2 control-label">*鲜花类型</label>
  159. <div class="col-sm-10 category-area">
  160. <div style="border:1px solid #CCC;padding-left:8px;border-radius:4px;">
  161. <?php
  162. if (!empty($categoryList)) {
  163. foreach ($categoryList as $clKey => $clVal) {
  164. if (!empty($clVal['child'])) {
  165. echo '<label class="checkbox-inline" style="padding-left:0px;">' . $clVal['categoryName'] . '</label><p>';
  166. foreach ($clVal['child'] as $ccKey => $ccVal) {
  167. echo '&nbsp;&nbsp;&nbsp;|-- <label class="checkbox-inline"><input name="categoryId[]" value="' . $ccVal['id'] . '" type="checkbox" >' . $ccVal['categoryName'] . '</label>';
  168. }
  169. echo '</p>';
  170. } else {
  171. echo '<label class="checkbox-inline"><input name="categoryId[]" value="' . $clVal['id'] . '" type="checkbox" >' . $clVal['categoryName'] . '</label><p></p>';
  172. }
  173. }
  174. }
  175. ?>
  176. </div>
  177. <p name="categoryIdMention"></p>
  178. </div>
  179. </div>
  180. <div class="form-group-separator"></div>
  181. <div class="form-group">
  182. <label class="col-sm-2 control-label">*用途</label>
  183. <div class="col-sm-10 usage-area">
  184. <div style="border:1px solid #CCC;padding-left:8px;border-radius:4px;">
  185. <?php
  186. if (!empty($usageList)) {
  187. foreach ($usageList as $usageKey => $usageVal) {
  188. echo '<label class="checkbox-inline"><input name="usageId[]" value="' . $usageVal['id'] . '" type="checkbox" >' . $usageVal['usageName'] . '</label><p></p>';
  189. }
  190. }
  191. ?>
  192. </div>
  193. <p name="usageIdMention"></p>
  194. </div>
  195. </div>
  196. <div class="form-group-separator"></div>
  197. <div class="form-group">
  198. <label class="col-sm-2 control-label" for="field-4">*商品状态</label>
  199. <div class="col-sm-10">
  200. <div class="radio-inline">
  201. <label> <input type="radio" name="status" checked value="0"> 上架 </label>
  202. </div>
  203. <div class="radio-inline">
  204. <label> <input type="radio" name="status" value="1"> 下架 </label>
  205. </div>
  206. </div>
  207. </div>
  208. <div class="form-group-separator"></div>
  209. <div class="form-group" style="text-align:center;">
  210. <button type="button" onclick="addSubmit('click',this)" class="btn btn-info btn-single">确认</button>
  211. <button type="button" onclick="history.go(-1);" class="btn btn-info btn-single">返回</button>
  212. </div>
  213. </form>
  214. </div>
  215. </div>
  216. </div>
  217. </div>
  218. <!-- footer -->
  219. <?php
  220. use backend\widgets\FooterWidget;
  221. ?>
  222. <?= FooterWidget::widget() ?>
  223. <!-- footer -->
  224. <script src="/js/lrz/dist/lrz.bundle.js"></script>
  225. <script>
  226. //alert($(".form-group .category-id").length);
  227. //添加商品验证流程
  228. var goodsName = $("input[name=goodsName]");
  229. var price = $("input[name=price]");
  230. var sold = $("input[name=sold]");
  231. var material = $("input[name=material]");
  232. var representative = $(":input[name=representative]");
  233. var cover = $(":input[name=cover]");
  234. var shopImg1 = $(":input[name=shopImg1]");
  235. var shopImg2 = $(":input[name=shopImg2]");
  236. var shopImg3 = $(":input[name=shopImg3]");
  237. var content = $("textarea[name=content]");
  238. var needValidate = [goodsName, price, sold, material, representative];
  239. //添加商品验证流程
  240. addSubmit();
  241. function addSubmit() {
  242. var verifyStatus = true;
  243. setStats(goodsName, '请填写商品名称', function (val, mess) {
  244. var info = [false, mess];
  245. if (val.length <= 0) {
  246. info[1] = '请填写商品名称';
  247. } else if (getLength(val) >= 0 && getLength(val) <= 40) {
  248. info[0] = true;
  249. info[1] = '填写正确';
  250. } else {
  251. info[0] = false;
  252. }
  253. return info;
  254. });
  255. var priceType = $('.price-area input:radio[name=priceType]:checked').attr('data-type');
  256. if (priceType == 'single') {
  257. setStats(price, '请填写价格', function (val, mess) {
  258. var info = [false, mess];
  259. if (isNotNull(val) == false || isNaN(val)) {
  260. info[1] = '请填写价格';
  261. } else {
  262. info[0] = true;
  263. }
  264. return info;
  265. });
  266. } else {
  267. var units = $('.multi-price-area .col-sm-10').find('.form-group');
  268. units.each(function (e) {
  269. var title = $(this).find('.form-control').eq(0).val();
  270. var price = $(this).find('.form-control').eq(1).val();
  271. if ($.trim(title) == '') {
  272. xhPopMsg('价格项: 名称不为空', 2500);
  273. verifyStatus = false;
  274. return;
  275. }
  276. if ($.trim(price) == '') {
  277. xhPopMsg('价格项: 有价格未填写', 2500);
  278. verifyStatus = false;
  279. return;
  280. }
  281. if (isNaN(price)) {
  282. xhPopMsg('价格项: 价格必须为数字', 2500);
  283. verifyStatus = false;
  284. return;
  285. }
  286. });
  287. var singlePriceObj = $('.single-price-area input[name=price]');
  288. singlePriceObj.attr('addStatus', 'yes');
  289. singlePriceObj.siblings('p').removeClass('help-error-mention').html('');
  290. }
  291. setStats(sold, '请填写售量', function (val, mess) {
  292. var info = [false, mess];
  293. if (isNotNull(val) == false || isNaN(val)) {
  294. info[1] = '请填写售量';
  295. } else {
  296. info[0] = true;
  297. }
  298. return info;
  299. });
  300. setStats(material, '请填写花材', function (val, mess) {
  301. var info = [false, mess];
  302. if (getLength(val) >= 0) {
  303. info[0] = true;
  304. info[1] = '填写正确';
  305. } else {
  306. info[1] = '请填写花材';
  307. }
  308. return info;
  309. });
  310. setStats(representative, '请填写花语', function (val, mess) {
  311. var info = [false, mess];
  312. if (getLength(val) >= 0) {
  313. info[0] = true;
  314. info[1] = '填写正确';
  315. } else {
  316. info[1] = '请填写花语';
  317. }
  318. return info;
  319. });
  320. setStats(shopImg1, '请填写上传图片', function (val, mess) {
  321. var info = [false, mess];
  322. if (getLength(val) >= 0) {
  323. info[0] = true;
  324. info[1] = '填写正确';
  325. } else {
  326. info[1] = '至少需要上传一张图片';
  327. }
  328. return info;
  329. });
  330. setStats(content, '请填写简介', function (val, mess) {
  331. var info = [false, mess];
  332. if (val.length > 0) {
  333. info[0] = true;
  334. info[1] = '填写正确';
  335. } else {
  336. info[1] = '请填写简介';
  337. }
  338. return info;
  339. });
  340. if (arguments[0] == 'click') {//用户点击提交
  341. var submitButton = arguments[1];//获取提交按钮对象
  342. var submitButtonObj = $(submitButton);
  343. if (submitButtonObj.attr('submitStatus') == 'yes') {
  344. alert('表单已经提交成功,不允许重复提交');
  345. return;//表单已经提交成功,不允许重复提交
  346. }
  347. for (var m = 0; m < needValidate.length; m++) {
  348. var singleObj = needValidate[m];
  349. if (singleObj.attr('addStatus') == undefined) {
  350. singleObj.blur();
  351. }
  352. if (singleObj.attr('addStatus') == 'no') {
  353. verifyStatus = false;
  354. continue;
  355. }
  356. }
  357. //封面 图片1判断
  358. if (isNotNull(shopImg1.val()) == false || isNotNull(cover.val()) == false) {
  359. shopImg1.parent().parent().find('p').addClass('help-error-mention').html('封面和图Ⅰ必须上传');
  360. verifyStatus = false;
  361. } else {
  362. shopImg1.parent().parent().find('p').removeClass('help-error-mention').html('');
  363. }
  364. //确认有没选择分类
  365. var checkNum = $(".form-group .category-area :checkbox:checked").length;
  366. if (parseInt(checkNum) < 1) {
  367. $("p[name=categoryIdMention]").addClass('help-error-mention').html('请选择分类');
  368. verifyStatus = false;
  369. } else {
  370. $("p[name=categoryIdMention]").removeClass('help-error-mention').html('');
  371. }
  372. //确认有没选择用途
  373. var checkNum = $(".form-group .usage-area :checkbox:checked").length;
  374. if (parseInt(checkNum) < 1) {
  375. $("p[name=usageIdMention]").addClass('help-error-mention').html('请选择用途');
  376. verifyStatus = false;
  377. } else {
  378. $("p[name=usageIdMention]").removeClass('help-error-mention').html('');
  379. }
  380. if (verifyStatus) {
  381. var data = $('#goods-data-form').serialize();
  382. $.ajax({
  383. type: "POST",
  384. url: '/goods/save-add',
  385. data: data,
  386. dataType: 'json',
  387. async: false,
  388. success: function (data) {
  389. if (data.code == 'A0001') {
  390. submitButtonObj.attr('submitStatus', 'yes');
  391. xhPopMsg(data.msg, 1300);//调用定时浮层 XXX毫秒后消失
  392. setTimeout(function () {
  393. window.location.href = '/goods/list';
  394. }, 1400);
  395. } else {
  396. xhPopMsg(data.msg, 1300);
  397. }
  398. }
  399. });
  400. }
  401. }
  402. }
  403. function setStats(obj, mess, check) {
  404. obj.focus(function () {
  405. $(this).removeAttr('addStatus');
  406. $(this).siblings('p').removeClass('help-error-mention').html('');
  407. $(this).parent().parent().removeClass("has-success").removeClass('has-error');
  408. });
  409. obj.blur(function () {
  410. var objVal = obj.val();
  411. var info = check(objVal, mess);
  412. if (info[0]) {
  413. $(this).attr('addStatus', 'yes');
  414. $(this).siblings('p').removeClass('help-error-mention').html('');
  415. $(this).parent().parent().addClass("has-success").removeClass("has-error");
  416. } else {
  417. $(this).attr('addStatus', 'no');
  418. $(this).siblings('p').addClass('help-error-mention').html(info[1]);
  419. $(this).parent().parent().addClass("has-error").removeClass("has-success");
  420. }
  421. });
  422. }
  423. document.querySelector('#cover').addEventListener('change', function () {
  424. //参数说明 https://github.com/think2011/localResizeIMG/wiki/2.-%E5%8F%82%E6%95%B0%E6%96%87%E6%A1%A3
  425. lrz(this.files[0], {
  426. width: 800,// 图片最大不超过的宽度,默认为原图宽度,高度不设时会适应宽度。
  427. fieldName: 'Filedata',//文件名
  428. quality: 1,//图片质量 0.1 - 1
  429. }).then(function (rst) {
  430. // 处理成功会执行
  431. rst.formData.append('fileLen', rst.fileLen);
  432. rst.formData.append('_csrf', '<?= Yii::$app->request->csrfToken?>');
  433. $.ajax({
  434. //url: '/main/img', // 这个地址做了跨域处理,可以用于实际调试
  435. url: '/upload/upload-goods-img', // 这个地址做了跨域处理,可以用于实际调试
  436. data: rst.formData,
  437. processData: false,
  438. contentType: false,
  439. type: 'POST',
  440. dataType: 'json',
  441. success: function (data) {
  442. $("img[name=cover]").attr('src', '<?= Yii::$app->params['imgUrl']; ?>' + data.url);
  443. $("input[name='cover']").val(data.url);
  444. }
  445. });
  446. }).catch(function (err) {
  447. // 处理失败会执行
  448. //console.log(err);
  449. alert(err);
  450. }).always(function () {
  451. // 不管是成功失败,都会执行
  452. });
  453. });
  454. document.querySelector('#shopImg1').addEventListener('change', function () {
  455. //参数说明 https://github.com/think2011/localResizeIMG/wiki/2.-%E5%8F%82%E6%95%B0%E6%96%87%E6%A1%A3
  456. lrz(this.files[0], {
  457. width: 800,// 图片最大不超过的宽度,默认为原图宽度,高度不设时会适应宽度。
  458. fieldName: 'Filedata',//文件名
  459. quality: 1,//图片质量 0.1 - 1
  460. })
  461. .then(function (rst) {
  462. // 处理成功会执行
  463. rst.formData.append('fileLen', rst.fileLen);
  464. rst.formData.append('_csrf', '<?= Yii::$app->request->csrfToken?>');
  465. $.ajax({
  466. //url: '/main/img', // 这个地址做了跨域处理,可以用于实际调试
  467. url: '/upload/upload-goods-img', // 这个地址做了跨域处理,可以用于实际调试
  468. data: rst.formData,
  469. processData: false,
  470. contentType: false,
  471. type: 'POST',
  472. dataType: 'json',
  473. success: function (data) {
  474. $("img[name=shopImg1]").attr('src', '<?= Yii::$app->params['imgUrl']; ?>' + data.url);
  475. $("input[name='shopImg1']").val(data.url);
  476. }
  477. });
  478. })
  479. .catch(function (err) {
  480. // 处理失败会执行
  481. })
  482. .always(function () {
  483. // 不管是成功失败,都会执行
  484. });
  485. });
  486. document.querySelector('#shopImg2').addEventListener('change', function () {
  487. //参数说明 https://github.com/think2011/localResizeIMG/wiki/2.-%E5%8F%82%E6%95%B0%E6%96%87%E6%A1%A3
  488. lrz(this.files[0], {
  489. width: 800,// 图片最大不超过的宽度,默认为原图宽度,高度不设时会适应宽度。
  490. fieldName: 'Filedata',//文件名
  491. quality: 1,//图片质量 0.1 - 1
  492. })
  493. .then(function (rst) {
  494. // 处理成功会执行
  495. rst.formData.append('fileLen', rst.fileLen);
  496. rst.formData.append('_csrf', '<?= Yii::$app->request->csrfToken?>');
  497. $.ajax({
  498. //url: '/main/img', // 这个地址做了跨域处理,可以用于实际调试
  499. url: '/upload/upload-goods-img', // 这个地址做了跨域处理,可以用于实际调试
  500. data: rst.formData,
  501. processData: false,
  502. contentType: false,
  503. type: 'POST',
  504. dataType: 'json',
  505. success: function (data) {
  506. $("img[name=shopImg2]").attr('src', '<?= Yii::$app->params['imgUrl']; ?>' + data.url);
  507. $("input[name='shopImg2']").val(data.url);
  508. }
  509. });
  510. })
  511. .catch(function (err) {
  512. // 处理失败会执行
  513. })
  514. .always(function () {
  515. // 不管是成功失败,都会执行
  516. });
  517. });
  518. document.querySelector('#shopImg3').addEventListener('change', function () {
  519. //参数说明 https://github.com/think2011/localResizeIMG/wiki/2.-%E5%8F%82%E6%95%B0%E6%96%87%E6%A1%A3
  520. lrz(this.files[0], {
  521. width: 800,// 图片最大不超过的宽度,默认为原图宽度,高度不设时会适应宽度。
  522. fieldName: 'Filedata',//文件名
  523. quality: 1,//图片质量 0.1 - 1
  524. })
  525. .then(function (rst) {
  526. // 处理成功会执行
  527. rst.formData.append('fileLen', rst.fileLen);
  528. rst.formData.append('_csrf', '<?= Yii::$app->request->csrfToken?>');
  529. $.ajax({
  530. //url: '/main/img', // 这个地址做了跨域处理,可以用于实际调试
  531. url: '/upload/upload-goods-img', // 这个地址做了跨域处理,可以用于实际调试
  532. data: rst.formData,
  533. processData: false,
  534. contentType: false,
  535. type: 'POST',
  536. dataType: 'json',
  537. success: function (data) {
  538. $("img[name=shopImg3]").attr('src', '<?= Yii::$app->params['imgUrl']; ?>' + data.url);
  539. $("input[name='shopImg3']").val(data.url);
  540. }
  541. });
  542. })
  543. .catch(function (err) {
  544. // 处理失败会执行
  545. })
  546. .always(function () {
  547. // 不管是成功失败,都会执行
  548. });
  549. });
  550. $('.a-upload .img-upload-btn').on('change', function () {
  551. var obj = $(this);
  552. lrz(this.files[0], {
  553. width: 800,// 图片最大不超过的宽度,默认为原图宽度,高度不设时会适应宽度。
  554. fieldName: 'Filedata',//文件名
  555. quality: 1,//图片质量 0.1 - 1
  556. })
  557. .then(function (rst) {
  558. // 处理成功会执行
  559. rst.formData.append('fileLen', rst.fileLen);
  560. rst.formData.append('_csrf', '<?= Yii::$app->request->csrfToken?>');
  561. $.ajax({
  562. //url: '/main/img', // 这个地址做了跨域处理,可以用于实际调试
  563. url: '/upload/upload-goods-img', // 这个地址做了跨域处理,可以用于实际调试
  564. data: rst.formData,
  565. processData: false,
  566. contentType: false,
  567. type: 'POST',
  568. dataType: 'json',
  569. success: function (data) {
  570. obj.parent().prev().attr('src', '<?= Yii::$app->params['imgUrl']; ?>' + data.url);
  571. obj.parent().next().val(data.url);
  572. }
  573. });
  574. })
  575. .catch(function (err) {
  576. // 处理失败会执行
  577. })
  578. .always(function () {
  579. // 不管是成功失败,都会执行
  580. });
  581. });
  582. function delPrice(obj) {
  583. obj.closest('.form-group').remove();
  584. }
  585. $(function () {
  586. //增加价格按钮事件
  587. $('.add-price-btn').on('click', function () {
  588. var unitNum = $(this).closest('.form-group').find('.multi-price-area .col-sm-10').eq(0).find('.form-group').length;
  589. if (unitNum > 9) {
  590. xhPopMsg('价格最多只可设置10个', 2500);
  591. return;
  592. }
  593. var content = '<div class="form-group"><div class="col-sm-10">名称:<input type="text" name="goodTitle[]" class="form-control" style="width:150px;display:inline-block;" placeholder="">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;价格:<input type="text" name="multiPrice[]" class="form-control" style="width:100px;display:inline-block;" placeholder=""> &nbsp;&nbsp;&nbsp;&nbsp;<img src="/images/nopicture.png" alt="" style="width:50px;height:50px;">[210X150]&nbsp;&nbsp;<a href="javascript:;" class="a-upload"><input type="file" accept="image/*" class="img-upload-btn"/>上传图片</a><input type="hidden" name="multiImg[]" value="" />&nbsp;&nbsp;&nbsp;&nbsp;<button class="btn btn-sm btn-pink" onclick="delPrice(this)" style="margin:0;"><li class="fa-remove">删除</li></button></div></div>';
  594. $(this).closest('.form-group').find('.multi-price-area .col-sm-10').eq(0).find('.form-group').last().after(content);
  595. $(this).closest('.form-group').find('.multi-price-area .col-sm-10').eq(0).find('.form-group').last().find('.a-upload .img-upload-btn').on('change', function () {
  596. var obj = $(this);
  597. lrz(this.files[0], {
  598. width: 800,// 图片最大不超过的宽度,默认为原图宽度,高度不设时会适应宽度。
  599. fieldName: 'Filedata',//文件名
  600. quality: 1,//图片质量 0.1 - 1
  601. })
  602. .then(function (rst) {
  603. // 处理成功会执行
  604. rst.formData.append('fileLen', rst.fileLen);
  605. rst.formData.append('_csrf', '<?= Yii::$app->request->csrfToken?>');
  606. $.ajax({
  607. //url: '/main/img', // 这个地址做了跨域处理,可以用于实际调试
  608. url: '/upload/upload-goods-img', // 这个地址做了跨域处理,可以用于实际调试
  609. data: rst.formData,
  610. processData: false,
  611. contentType: false,
  612. type: 'POST',
  613. dataType: 'json',
  614. success: function (data) {
  615. obj.parent().prev().attr('src', '<?= Yii::$app->params['imgUrl']; ?>' + data.url);
  616. obj.parent().next().val(data.url);
  617. }
  618. });
  619. })
  620. .catch(function (err) {
  621. // 处理失败会执行
  622. })
  623. .always(function () {
  624. // 不管是成功失败,都会执行
  625. });
  626. })
  627. });
  628. //价格选项事件
  629. $('.price-area input:radio[name=priceType]').on('change', function () {
  630. var type = $(this).attr('data-type');
  631. if (type == 'single') {
  632. $('.single-price-area').show();
  633. $('.multi-price-area').hide();
  634. } else {
  635. $('.multi-price-area').show();
  636. $('.single-price-area').hide();
  637. var singlePriceObj = $('.single-price-area input[name=price]');
  638. singlePriceObj.attr('addStatus', 'yes');
  639. singlePriceObj.siblings('p').removeClass('help-error-mention').html('');
  640. }
  641. })
  642. });
  643. </script>