edit.php 41 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  6. <link href="{__FRAME_PATH}css/font-awesome.min.css" rel="stylesheet">
  7. <link href="{__ADMIN_PATH}plug/umeditor/themes/default/css/umeditor.css" type="text/css" rel="stylesheet">
  8. <script type="text/javascript" src="{__ADMIN_PATH}plug/umeditor/third-party/jquery.min.js"></script>
  9. <script type="text/javascript" src="{__ADMIN_PATH}plug/umeditor/third-party/template.min.js"></script>
  10. <script type="text/javascript" charset="utf-8" src="{__ADMIN_PATH}plug/umeditor/umeditor.config.js"></script>
  11. <script type="text/javascript" charset="utf-8" src="{__ADMIN_PATH}plug/umeditor/umeditor.min.js"></script>
  12. <script type="text/javascript" src="{__ADMIN_PATH}plug/umeditor/lang/zh-cn/zh-cn.js"></script>
  13. <link rel="stylesheet" href="/static/plug/layui/css/layui.css">
  14. <script src="/static/plug/layui/layui.js"></script>
  15. <script src="{__PLUG_PATH}vue/dist/vue.min.js"></script>
  16. <script src="/static/plug/axios.min.js"></script>
  17. <script src="{__MODULE_PATH}widget/aliyun-oss-sdk-4.4.4.min.js"></script>
  18. <script src="{__MODULE_PATH}widget/cos-js-sdk-v5.min.js"></script>
  19. <script src="{__MODULE_PATH}widget/qiniu-js-sdk-2.5.5.js"></script>
  20. <script src="{__MODULE_PATH}widget/plupload.full.min.js"></script>
  21. <script src="{__MODULE_PATH}widget/videoUpload.js"></script>
  22. <style>
  23. .layui-form-item {
  24. margin-bottom: 0px;
  25. }
  26. .pictrueBox {
  27. display: inline-block !important;
  28. }
  29. .pictrue {
  30. width: 60px;
  31. height: 60px;
  32. border: 1px dotted rgba(0, 0, 0, 0.1);
  33. margin-right: 15px;
  34. display: inline-block;
  35. position: relative;
  36. cursor: pointer;
  37. }
  38. .pictrue img {
  39. width: 100%;
  40. height: 100%;
  41. }
  42. .upLoad {
  43. width: 58px;
  44. height: 58px;
  45. line-height: 58px;
  46. border: 1px dotted rgba(0, 0, 0, 0.1);
  47. border-radius: 4px;
  48. background: rgba(0, 0, 0, 0.02);
  49. cursor: pointer;
  50. display: flex;
  51. justify-content: center;
  52. align-items: center;
  53. }
  54. .rulesBox {
  55. display: flex;
  56. flex-wrap: wrap;
  57. margin-left: 10px;
  58. }
  59. .layui-tab-content {
  60. margin-top: 15px;
  61. }
  62. .ml110 {
  63. margin: 18px 0 4px 110px;
  64. }
  65. .rules {
  66. display: flex;
  67. }
  68. .rules-btn-sm {
  69. height: 30px;
  70. line-height: 30px;
  71. font-size: 12px;
  72. width: 109px;
  73. }
  74. .rules-btn-sm input {
  75. width: 79% !important;
  76. height: 84% !important;
  77. padding: 0 10px;
  78. }
  79. .ml10 {
  80. margin-left: 10px !important;
  81. }
  82. .ml40 {
  83. margin-left: 40px !important;
  84. }
  85. .closes {
  86. position: absolute;
  87. left: 86%;
  88. top: -18%;
  89. }
  90. .red {
  91. color: red;
  92. }
  93. .layui-input-block .layui-video-box{
  94. width: 22%;
  95. height: 180px;
  96. border-radius: 10px;
  97. background-color: #707070;
  98. margin-top: 10px;
  99. position: relative;
  100. overflow: hidden;
  101. }
  102. .layui-input-block .layui-video-box i{
  103. color: #fff;
  104. line-height: 180px;
  105. margin: 0 auto;
  106. width: 50px;
  107. height: 50px;
  108. display: inherit;
  109. font-size: 50px;
  110. }
  111. .layui-input-block .layui-video-box .mark{
  112. position: absolute;
  113. width: 100%;
  114. height: 30px;
  115. top: 0;
  116. background-color: rgba(0,0,0,.5);
  117. text-align: center;
  118. }
  119. .store_box{
  120. display: flex;
  121. }
  122. .info{
  123. color: #c9c9c9;
  124. padding-left: 10px;
  125. line-height: 30px;
  126. }
  127. </style>
  128. </head>
  129. <body>
  130. <div class="layui-fluid">
  131. <div class="layui-row layui-col-space15" id="app" v-cloak="">
  132. <div class="layui-card">
  133. <div class="layui-card-header">
  134. <span class="">竞拍添加</span>
  135. <button style="margin-left: 20px" type="button" class="layui-btn layui-btn-primary layui-btn-xs" @click="goBack">返回列表</button>
  136. </div>
  137. <div class="layui-card-body">
  138. <form class="layui-form" action="" v-cloak="">
  139. <div class="layui-tab layui-tab-brief" lay-filter="docTabBrief">
  140. <div class="layui-tab-content">
  141. <div class="layui-tab-item layui-show">
  142. <div class="layui-row layui-col-space15">
  143. <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
  144. <div class="grid-demo grid-demo-bg1">
  145. <div class="layui-form-item">
  146. <label class="layui-form-label">商品名称<i class="red">*</i></label>
  147. <div class="layui-input-block">
  148. <input type="text" name="nickname" lay-verify="title" autocomplete="off"
  149. placeholder="竞拍名称" class="layui-input" v-model="formData.nickname" maxlength="100">
  150. </div>
  151. </div>
  152. </div>
  153. </div>
  154. <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
  155. <div class="grid-demo grid-demo-bg1">
  156. <div class="layui-form-item">
  157. <label class="layui-form-label">竞拍封面图<i class="red">*</i></label>
  158. <div class="pictrueBox">
  159. <div class="pictrue" v-if="formData.image" @click="uploadImage('image')">
  160. <img :src="formData.image"></div>
  161. <div class="upLoad" @click="uploadImage('image')" v-else>
  162. <i class="layui-icon layui-icon-camera" class="iconfont"
  163. style="font-size: 26px;"></i>
  164. </div>
  165. </div>
  166. </div>
  167. </div>
  168. </div>
  169. <div class="layui-form-item">
  170. <label class="layui-form-label">场馆</label>
  171. <div class="layui-input-inline">
  172. <select id="auction_gu_id" name="auction_gu_id" lay-verify="title" v-model="formData.auction_gu_id">
  173. <option value="">请选择场馆</option>
  174. {foreach $auction as $key=>$vo }
  175. <option value="{$vo.id}">{$vo.name}<option>
  176. {/foreach}
  177. </select>
  178. </div>
  179. </div>
  180. <!-- <div class="layui-row layui-col-space15">-->
  181. <!-- <div class="layui-col-xs12 layui-col-sm4 layui-col-md4">-->
  182. <!-- <div class="grid-demo grid-demo-bg1">-->
  183. <!-- <div class="layui-form-item">-->
  184. <!-- <label class="layui-form-label">商品状态</label>-->
  185. <!-- <div class="layui-input-block">-->
  186. <!-- <input id="status" type="radio" name="status" lay-filter="status" value="1" title="正常" :checked="formData.status == 1 ? true : false">-->
  187. <!-- <input id="status" type="radio" name="status" lay-filter="status" value="0" title="禁用" :checked="formData.status == 0 ? true : false">-->
  188. <!-- </div>-->
  189. <!-- </div>-->
  190. <!-- </div>-->
  191. <!-- </div>-->
  192. <!-- </div>-->
  193. <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
  194. <div class="grid-demo grid-demo-bg1">
  195. <div class="layui-form-item">
  196. <label class="layui-form-label">预约价格<i class="red">*</i></label>
  197. <div class="layui-input-inline">
  198. <input type="number" name="anticipate" lay-verify="title" autocomplete="off" class="layui-input" v-model="formData.anticipate" maxlength="100" value="0">
  199. </div>
  200. </div>
  201. </div>
  202. </div>
  203. <div class="layui-row layui-col-space15">
  204. <div class="layui-col-xs12 layui-col-sm4 layui-col-md4">
  205. <div class="grid-demo grid-demo-bg1">
  206. <div class="layui-form-item">
  207. <label class="layui-form-label">预约时间<i class="red ">*</i></label>
  208. <div class="layui-input-inline">
  209. <input type="text" class="layui-input" name="time" id="time" value="" placeholder="-">
  210. </div>
  211. </div>
  212. </div>
  213. </div>
  214. </div>
  215. <div class="layui-row layui-col-space15">
  216. <div class="layui-col-xs12 layui-col-sm4 layui-col-md4">
  217. <div class="grid-demo grid-demo-bg1">
  218. <div class="layui-form-item">
  219. <label class="layui-form-label">进场时间<i class="red">*</i></label>
  220. <div class="layui-input-inline">
  221. <input type="text" class="layui-input" name="rtime" id="rtime" value="" placeholder="-">
  222. </div>
  223. </div>
  224. </div>
  225. </div>
  226. </div>
  227. <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
  228. <div class="grid-demo grid-demo-bg1">
  229. <div class="layui-form-item layui-form-text">
  230. <label class="layui-form-label">商品简介</label>
  231. <div class="layui-input-block">
  232. <textarea name="info" v-model="formData.info"
  233. placeholder="请输入商品简介" class="layui-textarea"></textarea>
  234. </div>
  235. </div>
  236. </div>
  237. </div>
  238. <div class="layui-tab-item">
  239. <div class="layui-row layui-col-space15">
  240. <textarea type="text/plain" name="description" id="myEditor" style="width:100%;">{{formData.description}}</textarea>
  241. </div>
  242. </div>
  243. <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
  244. <div class="grid-demo grid-demo-bg1">
  245. <div class="layui-form-item">
  246. <label class="layui-form-label">排序<i class="red">*</i></label>
  247. <div class="layui-input-inline">
  248. <input type="number" name="sort" lay-verify="title" autocomplete="off" class="layui-input" v-model="formData.sort" maxlength="100" value="0">
  249. </div>
  250. </div>
  251. </div>
  252. </div>
  253. </div>
  254. </div>
  255. <div class="layui-tab-content">
  256. <div class="layui-row layui-col-space15">
  257. <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
  258. <button class="layui-btn layui-btn-normal layui-btn-sm" id="submit" type="button" @click="handleSubmit()">提交</button>
  259. </div>
  260. </div>
  261. </div>
  262. </div>
  263. </form>
  264. </div>
  265. </div>
  266. </div>
  267. </div>
  268. <script>
  269. var id = {$id};
  270. var add_time = '{$dataList.add_time}';
  271. var end_time = '{$dataList.end_time}';
  272. var radd_time = '{$dataList.radd_time}';
  273. var rend_time = '{$dataList.rend_time}';
  274. layui.use('laydate', function(){
  275. var laydate = layui.laydate;
  276. laydate.render({
  277. elem: '#time'
  278. ,type: 'time'
  279. ,range: true
  280. ,value: add_time+' - '+end_time
  281. });
  282. laydate.render({
  283. elem: '#rtime'
  284. ,type: 'time'
  285. ,range: true
  286. ,value: radd_time+' - '+rend_time
  287. });
  288. })
  289. //Demo
  290. layui.use('form', function(){
  291. var form = layui.form;
  292. //监听提交
  293. form.on('submit(formDemo)', function(data){
  294. layer.msg(JSON.stringify(data.field));
  295. return false;
  296. });
  297. });
  298. </script>
  299. <script>
  300. var id = {$id};
  301. layui.use('laydate', function(){
  302. var laydate = layui.laydate;
  303. laydate.render({
  304. elem: '#time'
  305. ,type: 'time'
  306. ,range: true
  307. });
  308. laydate.render({
  309. elem: '#rtime'
  310. ,type: 'time'
  311. ,range: true
  312. });
  313. })
  314. new Vue({
  315. el: '#app',
  316. data: {
  317. id:id,
  318. //分类列表
  319. cateList: [],
  320. //运费模板
  321. tempList: [],
  322. upload:{
  323. videoIng:false
  324. },
  325. formData: {
  326. nickname: '',
  327. image:'',
  328. time:'',
  329. rtime:'',
  330. description: '',
  331. info: '',
  332. anticipate: '',
  333. sort: '',
  334. auction_gu_id:''
  335. },
  336. rule: { //多图选择规则
  337. slider_image: {
  338. maxLength: 1
  339. }
  340. },
  341. attr: [],//临时属性
  342. newRule: false,//是否添加新规则
  343. radioRule: ['status'],//radio 当选规则
  344. ruleList:[],
  345. ruleIndex:-1,
  346. progress: 0,
  347. um: null,//编译器实例化
  348. form: null,//layui.form
  349. layTabId: 1,
  350. ruleBool: id ? true : false,
  351. },
  352. watch:{
  353. 'formData.is_sub':function (n) {
  354. if (n == 1) {
  355. this.formHeader.push({title:'一级返佣(元)'});
  356. this.formHeader.push({title:'二级级返佣(元)'});
  357. } else {
  358. this.formHeader.pop();
  359. this.formHeader.pop();
  360. }
  361. },
  362. 'formData.spec_type':function (n) {
  363. if (n) {
  364. this.render();
  365. }
  366. },
  367. // 'formData.image':function (n) {
  368. // if(!this.batchAttr.pic){
  369. // this.batchAttr.pic = n;
  370. // }
  371. // if(!this.formData.attr.pic){
  372. // this.formData.attr.pic = n;
  373. // }
  374. // }
  375. },
  376. methods: {
  377. back:function(){
  378. var that = this;
  379. layui.use(['element'], function () {
  380. layui.element.tabChange('docTabBrief', that.layTabId == 1 ? 1 : parseInt(that.layTabId) - 1);
  381. });
  382. },
  383. next:function(){
  384. var that = this;
  385. layui.use(['element'], function () {
  386. layui.element.tabChange('docTabBrief', that.layTabId == 3 ? 3 : parseInt(that.layTabId) + 1);
  387. });
  388. },
  389. goBack:function(){
  390. location.href = this.U({c:'auction.auction',a:'index'});
  391. },
  392. U: function (opt) {
  393. var m = opt.m || 'admin', c = opt.c || window.controlle || '', a = opt.a || 'index', q = opt.q || '',
  394. p = opt.p || {};
  395. var params = Object. keys(p).map(function (key) {
  396. return key + '/' + p[key];
  397. }).join('/');
  398. var gets = Object.keys(q).map(function (key) {
  399. return key+'='+ q[key];
  400. }).join('&');
  401. return '/' + m + '/' + c + '/' + a + (params == '' ? '' : '/' + params) + (gets == '' ? '' : '?' + gets);
  402. },
  403. /**
  404. * 提示
  405. * */
  406. showMsg: function (msg, success) {
  407. $('#submit').removeAttr('disabled').text('提交');
  408. layui.use(['layer'], function () {
  409. layui.layer.msg(msg, success);
  410. });
  411. },
  412. addBrokerage:function(){
  413. if (this.brokerage.brokerage >= 0 && this.brokerage.brokerage_two >= 0){
  414. var that = this;
  415. this.$set(this.formData,'attrs',this.formData.attrs.map(function (item) {
  416. item.brokerage = that.brokerage.brokerage;
  417. item.brokerage_two = that.brokerage.brokerage_two;
  418. return item;
  419. }));
  420. } else {
  421. return this.showMsg('请填写返佣金额在进行批量添加');
  422. }
  423. },
  424. batchClear:function(){
  425. this.$set(this,'batchAttr',{
  426. pic: '',
  427. price: 0,
  428. cost: 0,
  429. ot_price: 0,
  430. stock: 0,
  431. bar_code: '',
  432. weight: 0,
  433. volume: 0,
  434. });
  435. },
  436. /**
  437. * 批量添加
  438. * */
  439. batchAdd:function(){
  440. var that = this;
  441. this.$set(this.formData,'attrs',this.formData.attrs.map(function (item) {
  442. if (that.batchAttr.pic) {
  443. item.pic = that.batchAttr.pic;
  444. }
  445. if (that.batchAttr.price > 0){
  446. item.price = that.batchAttr.price;
  447. }
  448. if (that.batchAttr.cost > 0){
  449. item.cost = that.batchAttr.cost;
  450. }
  451. if (that.batchAttr.ot_price > 0){
  452. item.ot_price = that.batchAttr.ot_price;
  453. }
  454. if (that.batchAttr.stock > 0){
  455. item.stock = that.batchAttr.stock;
  456. }
  457. if (that.batchAttr.bar_code != ''){
  458. item.bar_code = that.batchAttr.bar_code;
  459. }
  460. if (that.batchAttr.weight > 0){
  461. item.weight = that.batchAttr.weight;
  462. }
  463. if (that.batchAttr.volume > 0){
  464. item.volume = that.batchAttr.volume;
  465. }
  466. return item;
  467. }));
  468. },
  469. /**
  470. * 获取商品信息
  471. * */
  472. getProductInfo: function () {
  473. var that = this;
  474. that.requestGet(that.U({c:"auction.auction",a:'get_auction',q:{id:that.id}})).then(function (res) {
  475. that.$set(that,'cateList',res.data.cateList);
  476. that.$set(that,'tempList',res.data.tempList);
  477. var productInfo = res.data.productInfo || {};
  478. if(productInfo.id && that.id){
  479. that.$set(that,'formData',productInfo);
  480. that.generate();
  481. }
  482. that.getRuleList();
  483. that.init();
  484. }).catch(function (res) {
  485. that.showMsg(res.msg);
  486. })
  487. },
  488. /**
  489. * 给某个属性添加属性值
  490. * @param item
  491. * */
  492. addDetail: function (item) {
  493. if (!item.detailValue) return false;
  494. if (item.detail.find(function (val) {
  495. if(item.detailValue == val){
  496. return true;
  497. }
  498. })) {
  499. return this.showMsg('添加的属性值重复');
  500. }
  501. item.detail.push(item.detailValue);
  502. item.detailValue = '';
  503. },
  504. /**
  505. * 删除某个属性值
  506. * @param item 父级循环集合
  507. * @param inx 子集index
  508. * */
  509. deleteValue: function (item, inx) {
  510. if (item.detail.length > 1) {
  511. item.detail.splice(inx, 1);
  512. } else {
  513. return this.showMsg('请设置至少一个属性');
  514. }
  515. },
  516. /**
  517. * 删除某条属性
  518. * @param index
  519. * */
  520. deleteItem: function (index) {
  521. this.formData.items.splice(index, 1);
  522. },
  523. /**
  524. * 删除某条属性
  525. * @param index
  526. * */
  527. deleteAttrs: function (index) {
  528. var that = this;
  529. if(that.id > 0){
  530. that.requestGet(that.U({c:"store.StoreProduct",a:'check_activity',q:{id:that.id}})).then(function (res) {
  531. that.showMsg(res.msg);
  532. }).catch(function (res) {
  533. if (that.formData.attrs.length > 1) {
  534. that.formData.attrs.splice(index, 1);
  535. } else {
  536. return that.showMsg('请设置至少一个规则');
  537. }
  538. })
  539. }else{
  540. if (that.formData.attrs.length > 1) {
  541. that.formData.attrs.splice(index, 1);
  542. } else {
  543. return that.showMsg('请设置至少一个规则');
  544. }
  545. }
  546. },
  547. /**
  548. * 创建属性
  549. * */
  550. createAttrName: function () {
  551. if (this.formDynamic.attrsName && this.formDynamic.attrsVal) {
  552. if (this.formData.items.find(function (val) {
  553. if (val.value == this.formDynamic.attrsName) {
  554. return true;
  555. }
  556. }.bind(this))) {
  557. return this.showMsg('添加的属性重复');
  558. }
  559. this.formData.items.push({
  560. value: this.formDynamic.attrsName,
  561. detailValue: '',
  562. attrHidden: false,
  563. detail: [this.formDynamic.attrsVal]
  564. });
  565. this.formDynamic.attrsName = '';
  566. this.formDynamic.attrsVal = '';
  567. this.newRule = false;
  568. } else {
  569. return this.showMsg('请添加完整的规格!');
  570. }
  571. },
  572. /**
  573. * 删除图片
  574. * */
  575. deleteImage: function (key, index) {
  576. var that = this;
  577. if (index != undefined) {
  578. that.formData[key].splice(index, 1);
  579. that.$set(that.formData, key, that.formData[key]);
  580. } else {
  581. that.$set(that.formData, key, '');
  582. }
  583. },
  584. createFrame: function (title, src, opt) {
  585. opt === undefined && (opt = {});
  586. var h = 0;
  587. if (window.innerHeight < 800 && window.innerHeight >= 700) {
  588. h = window.innerHeight - 50;
  589. } else if (window.innerHeight < 900 && window.innerHeight >= 800) {
  590. h = window.innerHeight - 100;
  591. } else if (window.innerHeight < 1000 && window.innerHeight >= 900) {
  592. h = window.innerHeight - 150;
  593. } else if (window.innerHeight >= 1000) {
  594. h = window.innerHeight - 200;
  595. } else {
  596. h = window.innerHeight;
  597. }
  598. var area = [(opt.w || window.innerWidth / 2) + 'px', (!opt.h || opt.h > h ? h : opt.h) + 'px'];
  599. layui.use('layer',function () {
  600. return layer.open({
  601. type: 2,
  602. title: title,
  603. area: area,
  604. fixed: false, //不固定
  605. maxmin: true,
  606. moveOut: false,//true 可以拖出窗外 false 只能在窗内拖
  607. anim: 5,//出场动画 isOutAnim bool 关闭动画
  608. offset: 'auto',//['100px','100px'],//'auto',//初始位置 ['100px','100px'] t[ 上 左]
  609. shade: 0,//遮罩
  610. resize: true,//是否允许拉伸
  611. content: src,//内容
  612. move: '.layui-layer-title'
  613. });
  614. });
  615. },
  616. changeIMG: function (name, value) {
  617. if (this.getRule(name).maxLength !== undefined) {
  618. var that = this;
  619. value.map(function (v) {
  620. that.formData[name].push(v);
  621. });
  622. this.$set(this.formData, name, this.formData[name]);
  623. } else {
  624. if(name == 'batchAttr.pic'){
  625. this.batchAttr.pic = value;
  626. } else {
  627. if (name.indexOf('.') !== -1) {
  628. var key = name.split('.');
  629. if (key.length == 2){
  630. this.formData[key[0]][key[1]] = value;
  631. } else if(key.length == 3){
  632. this.formData[key[0]][key[1]][key[2]] = value;
  633. } else if(key.length == 4){
  634. this.$set(this.formData[key[0]][key[1]][key[2]],key[3],value)
  635. }
  636. } else {
  637. this.formData[name] = value;
  638. }
  639. }
  640. }
  641. },
  642. getRule: function (name) {
  643. return this.rule[name] || {};
  644. },
  645. uploadImage: function (name) {
  646. return this.createFrame('选择图片',this.U({c:"widget.images",a:'index',p:{fodder:name}}),{h:545,w:900});
  647. },
  648. uploadVideo: function () {
  649. if (this.videoLink) {
  650. this.formData.video_link = this.videoLink;
  651. } else {
  652. $(this.$refs.filElem).click();
  653. }
  654. },
  655. delVideo: function () {
  656. var that = this;
  657. that.$set(that.formData, 'video_link', '');
  658. },
  659. insertEditor: function (list) {
  660. this.um.execCommand('insertimage', list);
  661. },
  662. insertEditorVideo: function (src) {
  663. this.um.setContent('<div><video style="width: 99%" src="'+src+'" class="video-ue" controls="controls" width="100"><source src="'+src+'"></source></video></div><br>',true);
  664. },
  665. getContent: function () {
  666. return this.um.getContent();
  667. },
  668. /**
  669. * 监听radio字段
  670. */
  671. eeventRadio: function () {
  672. var that = this;
  673. that.radioRule.map(function (val) {
  674. that.form.on('radio(' + val + ')', function (res) {
  675. that.formData[val] = res.value;
  676. });
  677. })
  678. },
  679. init: function () {
  680. var that = this;
  681. window.UMEDITOR_CONFIG.toolbar = [
  682. // 加入一个 test
  683. 'source | undo redo | bold italic underline strikethrough | superscript subscript | forecolor backcolor | removeformat |',
  684. 'insertorderedlist insertunorderedlist | selectall cleardoc paragraph | fontfamily fontsize',
  685. '| justifyleft justifycenter justifyright justifyjustify |',
  686. 'link unlink | emotion selectimgs video | map',
  687. '| horizontal print preview fullscreen', 'drafts', 'formula'
  688. ];
  689. UM.registerUI('selectimgs', function (name) {
  690. var me = this;
  691. var $btn = $.eduibutton({
  692. icon: 'image',
  693. click: function () {
  694. that.createFrame('选择图片', "{:Url('widget.images/index',['fodder'=>'editor'])}");
  695. },
  696. title: '选择图片'
  697. });
  698. this.addListener('selectionchange', function () {
  699. //切换为不可编辑时,把自己变灰
  700. var state = this.queryCommandState(name);
  701. $btn.edui().disabled(state == -1).active(state == 1)
  702. });
  703. return $btn;
  704. });
  705. UM.registerUI('video', function (name) {
  706. var me = this;
  707. var $btn = $.eduibutton({
  708. icon: 'video',
  709. click: function () {
  710. that.createFrame('选择视频', "{:Url('widget.video/index',['fodder'=>'video'])}");
  711. },
  712. title: '选择视频'
  713. });
  714. this.addListener('selectionchange', function () {
  715. //切换为不可编辑时,把自己变灰
  716. var state = this.queryCommandState(name);
  717. $btn.edui().disabled(state == -1).active(state == 1)
  718. });
  719. return $btn;
  720. });
  721. //实例化编辑器
  722. this.um = UM.getEditor('myEditor', {initialFrameWidth: '99%', initialFrameHeight: 400});
  723. this.um.setContent(that.formData.description);
  724. that.$nextTick(function () {
  725. layui.use(['form','element'], function () {
  726. that.form = layui.form;
  727. that.form.render();
  728. that.form.on('select(temp_id)', function (data) {
  729. that.$set(that.formData, 'temp_id', data.value);
  730. });
  731. that.form.on('select(rule_index)', function (data) {
  732. that.ruleIndex = data.value;
  733. });
  734. layui.element.on('tab(docTabBrief)', function(){
  735. that.layTabId = this.getAttribute('lay-id');
  736. });
  737. that.eeventRadio();
  738. });
  739. })
  740. },
  741. requestPost: function (url, data) {
  742. return new Promise(function (resolve, reject) {
  743. axios.post(url, data).then(function (res) {
  744. if (res.status == 200 && res.data.code == 200) {
  745. resolve(res.data)
  746. } else {
  747. reject(res.data);
  748. }
  749. }).catch(function (err) {
  750. reject({msg:err})
  751. });
  752. })
  753. },
  754. requestGet: function (url) {
  755. return new Promise(function (resolve, reject) {
  756. axios.get(url).then(function (res) {
  757. if (res.status == 200 && res.data.code == 200) {
  758. resolve(res.data)
  759. } else {
  760. reject(res.data);
  761. }
  762. }).catch(function (err) {
  763. reject({msg:err})
  764. });
  765. })
  766. },
  767. generates: function () {
  768. var that = this;
  769. that.generate(1);
  770. },
  771. generate: function (type = 0) {
  772. var that = this;
  773. this.requestPost(that.U({c:"store.StoreProduct",a:'is_format_attr',p:{id:that.id,type:type}}), {attrs:this.formData.items}).then(function (res) {
  774. that.$set(that.formData, 'attrs', res.data.value);
  775. that.$set(that, 'formHeader', res.data.header);
  776. if (that.id && that.formData.is_sub == 1 && that.formData.spec_type == 1) {
  777. that.formHeader.push({title:'一级返佣(元)'});
  778. that.formHeader.push({title:'二级级返佣(元)'});
  779. }
  780. }).catch(function (res) {
  781. return that.showMsg(res.msg);
  782. });
  783. },
  784. handleSubmit:function () {
  785. var that = this;
  786. var time = $('#time').val();
  787. var rtime = $('#rtime').val();
  788. var auction_gu_id = $('#auction_gu_id').val();
  789. that.formData.time = time;
  790. that.formData.rtime = rtime;
  791. that.formData.auction_gu_id = auction_gu_id;
  792. if (!that.formData['auction_gu_id']){
  793. return that.showMsg('请绑定会馆');
  794. }
  795. if (!that.formData['nickname']){
  796. return that.showMsg('请填写名称');
  797. }
  798. if (!that.formData['image']){
  799. return that.showMsg('请上传图片');
  800. }
  801. if (!that.formData['time']){
  802. return that.showMsg('请选择预约时间');
  803. }
  804. if (!that.formData['rtime']){
  805. return that.showMsg('请选择进场时间');
  806. }
  807. that.formData.description = that.getContent();
  808. that.requestPost(that.U({c:'auction.auction',a:'save',p:{id:that.id}}),that.formData).then(function (res) {
  809. that.confirm();
  810. }).catch(function (res) {
  811. that.showMsg(res.msg);
  812. });
  813. },
  814. confirm: function(){
  815. var that = this;
  816. layui.use(['layer'], function () {
  817. var layer = layui.layer;
  818. layer.confirm(that.id ? '修改成功是否返回产品列表' : '添加成功是否返回产品列表', {
  819. btn: ['返回列表',that.id ? '继续修改' : '继续添加'] //按钮
  820. }, function(){
  821. location.href = that.U({c:'auction.auction',a:'index'});
  822. }, function(){
  823. location.reload();
  824. });
  825. });
  826. },
  827. render:function(){
  828. this.$nextTick(function(){
  829. layui.use(['form'], function () {
  830. layui.form.render('select');
  831. });
  832. })
  833. },
  834. // 移动
  835. handleDragStart (e, item) {
  836. this.dragging = item;
  837. },
  838. handleDragEnd (e, item) {
  839. this.dragging = null
  840. },
  841. handleDragOver (e) {
  842. e.dataTransfer.dropEffect = 'move'
  843. },
  844. handleDragEnter (e, item) {
  845. e.dataTransfer.effectAllowed = 'move'
  846. if (item === this.dragging) {
  847. return
  848. }
  849. var newItems = [...this.formData.activity];
  850. var src = newItems.indexOf(this.dragging);
  851. var dst = newItems.indexOf(item);
  852. newItems.splice(dst, 0, ...newItems.splice(src, 1))
  853. this.formData.activity = newItems;
  854. },
  855. getRuleList:function (type) {
  856. var that = this;
  857. that.requestGet(that.U({c:'store.StoreProduct',a:'get_rule'})).then(function (res) {
  858. that.$set(that,'ruleList',res.data);
  859. if(type !== undefined){
  860. that.render();
  861. }
  862. });
  863. },
  864. addRule:function(){
  865. return this.createFrame('添加商品规则',this.U({c:'store.StoreProductRule',a:'create'}));
  866. },
  867. allRule:function () {
  868. if (this.ruleIndex != -1) {
  869. var rule = this.ruleList[this.ruleIndex];
  870. if (rule) {
  871. this.ruleBool = true;
  872. var rule_value = rule.rule_value.map(function (item) {
  873. return item;
  874. });
  875. this.$set(this.formData,'items',rule_value);
  876. this.$set(this.formData,'attrs',[]);
  877. this.$set(this,'formHeader',[]);
  878. return true;
  879. }
  880. }
  881. this.showMsg('选择的属性无效');
  882. }
  883. },
  884. mounted: function () {
  885. var that = this;
  886. axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
  887. that.getProductInfo();
  888. window.$vm = that;
  889. window.changeIMG = that.changeIMG;
  890. window.insertEditor = that.insertEditor;
  891. window.insertEditorVideo = that.insertEditorVideo;
  892. window.successFun = function(){
  893. that.getRuleList(1);
  894. }
  895. $(that.$refs.filElem).change(function () {
  896. var inputFile = this.files[0];
  897. that.requestPost(that.U({c:"widget.video",a:'get_signature'})).then(function (res) {
  898. AdminUpload.upload(res.data.uploadType,{
  899. token: res.data.uploadToken || '',
  900. file: inputFile,
  901. accessKeyId: res.data.accessKey || '',
  902. accessKeySecret: res.data.secretKey || '',
  903. bucketName: res.data.storageName || '',
  904. region: res.data.storageRegion || '',
  905. domain: res.data.domain || '',
  906. uploadIng:function (progress) {
  907. that.upload.videoIng = true;
  908. that.progress = progress;
  909. }
  910. }).then(function (res) {
  911. //成功
  912. that.$set(that.formData, 'video_link', res.url);
  913. that.progress = 0;
  914. that.upload.videoIng = false;
  915. return that.showMsg('上传成功');
  916. }).catch(function (err) {
  917. //失败
  918. console.info(err);
  919. return that.showMsg('上传错误请检查您的配置');
  920. });
  921. }).catch(function (res) {
  922. return that.showMsg(res.msg || '获取密钥失败,请检查您的配置');
  923. });
  924. })
  925. }
  926. });
  927. </script>
  928. </body>
  929. </html>
  930. <script>
  931. import Layout from "../../../../../public/static/plug/iview/dist/iview";
  932. export default {
  933. components: {Layout}
  934. }
  935. </script>