goods-import.blade.php 50 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103
  1. @extends('layouts.base')
  2. @section('content')
  3. @section('title', trans('商品导入'))
  4. <style>
  5. [v-cloak] {
  6. display: none;
  7. }
  8. .vue-page {
  9. border-radius: 5px;
  10. width: calc(100% - 266px);
  11. float: right;
  12. margin-right: 10px;
  13. position: fixed;
  14. bottom: 0;
  15. right: 0;
  16. padding: 15px 5% 15px 0;
  17. background: #fff;
  18. height: 60px;
  19. z-index: 999;
  20. margin-top: 0;
  21. box-shadow: 0 2px 9px rgba(51, 51, 51, 0.1);
  22. }
  23. .content {
  24. background-color: #eff3f6;
  25. }
  26. .caret-wrapper {
  27. display: inline-flex;
  28. flex-direction: column;
  29. align-items: center;
  30. height: 25px;
  31. width: 11px;
  32. vertical-align: middle;
  33. cursor: pointer;
  34. overflow: initial;
  35. position: relative;
  36. }
  37. .caret-top {
  38. border: 5px solid transparent;
  39. border-bottom-color: #333;
  40. margin: 1px 0;
  41. }
  42. .caret-bottom {
  43. border: 5px solid transparent;
  44. border-top-color: #333;
  45. margin: 1px 0;
  46. }
  47. </style>
  48. <style>
  49. /* .flex{display:flex;width:100%;flex-wrap: wrap;justify-content: space-between} */
  50. .flex {
  51. display: grid;
  52. grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  53. grid-gap: 15px;
  54. }
  55. .box-lis {
  56. min-width: 240px;
  57. width: 240px
  58. }
  59. .flex:after {
  60. content: "";
  61. width: 240px;
  62. }
  63. .box-li {
  64. width: 240px;
  65. border: 1px solid #ccc;
  66. border-radius: 10px 10px 0 0;
  67. margin: 10px 0;
  68. position: relative;
  69. }
  70. .box-li-img {
  71. width: 240px;
  72. height: 240px;
  73. border-radius: 10px 10px 0 0;
  74. }
  75. .box-li-img img {
  76. width: 238px;
  77. height: 100%;
  78. border-radius: 10px 10px 0 0;
  79. border: 0px solid #333;
  80. }
  81. .box-li-bottom {
  82. padding: 10px 0;
  83. margin: 0 5px;
  84. }
  85. .box-li-title {
  86. height: 40px;
  87. color: #333;
  88. font-weight: 500;
  89. font-size: 12px;
  90. overflow: hidden;
  91. display: -webkit-box;
  92. -webkit-line-clamp: 2;
  93. overflow: hidden;
  94. text-overflow: ellipsis;
  95. line-height: 20px;
  96. -webkit-box-orient: vertical;
  97. }
  98. .box-li-price {
  99. display: flex;
  100. flex-wrap: wrap;
  101. color: #333;
  102. font-weight: 500;
  103. margin: 0 8px;
  104. }
  105. .box-li-price-one {
  106. margin: 5px 0;
  107. width: 33%;
  108. text-align: center;
  109. font-size: 12px;
  110. }
  111. .box-li-sel {
  112. position: absolute;
  113. top: 0;
  114. right: 7px;
  115. }
  116. .el-checkbox__inner {
  117. border-color: #29ba9b
  118. }
  119. </style>
  120. <div class="w1200 ">
  121. <link rel="stylesheet" type="text/css" href="{{static_url('css/font-awesome.min.css')}}">
  122. <link rel="stylesheet" type="text/css" href="{{static_url('yunshop/goods/goods.css')}}"/>
  123. <div id="goods-index" class=" rightlist ">
  124. <div class="right-titpos">
  125. <ul class="add-snav">
  126. <li class="active"><a href="#">商品导入</a></li>
  127. {{-- <li class="active"><a href="{{yzWebFullUrl('plugin.yz-supply.admin.label-import.index')}}">标签导入</a></li> 暂无标签--}}
  128. </ul>
  129. </div>
  130. <div class="right-addbox">
  131. <div id="app" v-cloak>
  132. <div class="panel panel-info" style="margin-bottom:15px;border-radius:8px">
  133. <div class="panel-body" style="margin-bottom:15px;">
  134. <el-form :inline="true" :model="search_form" ref="search_form">
  135. <el-form-item label="筛选条件">
  136. {{-- <el-select v-model="search_form.commission_agent" clearable placeholder="请选择商品库" @change="changeWarehouse()" clearable>--}}
  137. {{-- <el-option v-for="(item,index) in goods_agent"--}}
  138. {{-- :key="index"--}}
  139. {{-- :label="item.label"--}}
  140. {{-- :value="item.value"></el-option>--}}
  141. {{-- </el-select>--}}
  142. {{-- @change="changeSource()"--}}
  143. <el-select v-model="search_form.source" clearable placeholder="请选择来源" clearable>
  144. <el-option v-for="(item,index) in goods_source"
  145. :key="index"
  146. :label="item.label"
  147. :value="item.value"></el-option>
  148. </el-select>
  149. <el-select v-model="search_form.shipping" clearable placeholder="是否包邮" clearable>
  150. <el-option v-for="(item,index) in goods_shipping"
  151. :key="index"
  152. :label="item.label"
  153. :value="item.value"></el-option>
  154. </el-select>
  155. </el-form-item>
  156. <el-form-item label="">
  157. <el-select v-model="search_form.cate_v1" placeholder="请选择一级分类" clearable
  158. @change="searchCateV2()" filterable>
  159. <el-option v-for="item in search_cate_v1" :key="item.id" :label="item.name"
  160. :value="item.id"></el-option>
  161. </el-select>
  162. <el-select v-model="search_form.cate_v2" placeholder="请选择二级分类" clearable
  163. @change="searchCateV3()" filterable>
  164. <el-option v-for="item in search_cate_v2" :key="item.id" :label="item.name"
  165. :value="item.id"></el-option>
  166. </el-select>
  167. <el-select v-model="search_form.cate_v3" placeholder="请选择三级分类" clearable filterable>
  168. <el-option v-for="item in search_cate_v3" :key="item.id" :label="item.name"
  169. :value="item.id"></el-option>
  170. </el-select>
  171. </el-form-item>
  172. <br>
  173. <el-form-item label="">
  174. <el-select v-model="search_form.range_type" clearable placeholder="请选择区间筛选类型">
  175. <el-option label="协议价格" value="agreement_price"></el-option>
  176. <el-option label="常规利润率" value="origin_rate"></el-option>
  177. <el-option label="营销价格" value="profit"></el-option>
  178. <el-option label="指导价格" value="origin_price"></el-option>
  179. <el-option label="营销利润率" value="profit_rate"></el-option>
  180. </el-select>
  181. </el-form-item>
  182. <el-form-item label="">
  183. <el-col :span="11">
  184. <el-input type="number" placeholder="区间开始"
  185. v-model="search_form.range_from"></el-input>
  186. </el-col>
  187. <el-col class="line" :span="2" style="border:0;font-size:25px;">-</el-col>
  188. <el-col :span="11">
  189. <el-input type="number" placeholder="区间结束"
  190. v-model="search_form.range_to"></el-input>
  191. </el-col>
  192. </el-form-item>
  193. <el-form-item label="">
  194. <el-col>
  195. <el-input type="text" placeholder="商品名称" v-model="search_form.word"></el-input>
  196. </el-col>
  197. </el-form-item>
  198. <el-form-item label="">
  199. <el-col>
  200. <el-input type="text" placeholder="店铺名称"
  201. v-model="search_form.supplier_name"></el-input>
  202. </el-col>
  203. </el-form-item>
  204. <el-form-item label="">
  205. <el-col>
  206. <el-input type="text" placeholder="店铺id"
  207. v-model="search_form.supplier_id"></el-input>
  208. </el-col>
  209. </el-form-item>
  210. {{-- <el-select v-model="search_form.goods_group" clearable placeholder="营销活动" clearable>--}}
  211. {{-- <el-option v-for="(item,index) in goods_group"--}}
  212. {{-- :key="index"--}}
  213. {{-- :label="item.name"--}}
  214. {{-- :value="item.id"></el-option>--}}
  215. {{-- </el-select>--}}
  216. <el-form-item label="    ">
  217. <el-form-item label="">
  218. <el-select v-model="search_form.goods_page_size" clearable placeholder="每页条数"
  219. clearable>
  220. <el-option v-for="(item,index) in goods_page_size"
  221. :key="index"
  222. :label="item.label"
  223. :value="item.value"></el-option>
  224. </el-select>
  225. <el-select v-model="search_form.goods_import" clearable placeholder="是否已导入"
  226. clearable>
  227. <el-option v-for="(item,index) in goods_import"
  228. :key="index"
  229. :label="item.label"
  230. :value="item.value"></el-option>
  231. </el-select>
  232. <el-select v-model="search_form.is_display" clearable placeholder="上下架"
  233. clearable>
  234. <el-option v-for="(item,index) in is_display"
  235. :key="index"
  236. :label="item.label"
  237. :value="item.value"></el-option>
  238. </el-select>
  239. <el-select v-model="middleground_configuration_id" clearable placeholder="中台配置项">
  240. <el-option v-for="(item,index) in middleground_configuration"
  241. :key="index"
  242. :label="item.title"
  243. :value="item.id"></el-option>
  244. </el-select>
  245. </el-form-item>
  246. <el-form-item>
  247. <el-button type="success" icon="el-icon-search" @click="search()">搜索</el-button>
  248. </el-form-item>
  249. </el-form>
  250. <el-form :model="category_form" ref="category_form" :inline="true">
  251. <el-form-item label="选择导入分类">
  252. <el-select v-model="category_form.id_v1" placeholder="请选择一级分类" clearable
  253. @change="changeV1()">
  254. <el-option v-for="item in category_list" :key="item.id" :label="item.name"
  255. :value="item.id"></el-option>
  256. </el-select>
  257. <el-select v-model="category_form.id_v2" placeholder="请选择二级分类" clearable
  258. @change="changeV2()">
  259. <el-option v-for="item in category_list_v2" :key="item.id" :label="item.name"
  260. :value="item.id"></el-option>
  261. </el-select>
  262. <el-select v-model="category_form.id_v3" placeholder="请选择三级分类" clearable
  263. v-if="category_level == 3">
  264. <el-option v-for="item in category_list_v3" :key="item.id" :label="item.name"
  265. :value="item.id"></el-option>
  266. </el-select>
  267. </el-form-item>
  268. <el-form-item label="选择导入商品标签">
  269. <el-select v-model="category_form.fid_v1" placeholder="请选择标签组" clearable
  270. @change="filteringV1()">
  271. <el-option v-for="item in filtering_list" :key="item.id" :label="item.name"
  272. :value="item.id"></el-option>
  273. </el-select>
  274. <el-select v-model="category_form.fid_v2" placeholder="请选择标签值" clearable>
  275. <el-option v-for="item in filtering_list_v2" :key="item.id" :label="item.name"
  276. :value="item.id"></el-option>
  277. </el-select>
  278. </el-form-item>
  279. <el-col v-if="create_category == 1" style="color: red">
  280. 已开启自动匹配分类,如不选择导入分类则自动匹配或创建分类!(阿里商品不支持)
  281. </el-col>
  282. </el-form>
  283. </div>
  284. </div>
  285. <div class="panel panel-default" style="border-radius:8px">
  286. <div class="panel-body table-responsive">
  287. <div v-loading="loading">
  288. <div>
  289. <el-checkbox v-model.number="is_all_choose" :true-label="1" :false-label="0"
  290. @change="allChoose">[[is_all_choose==1?'全不选':'全选']]
  291. </el-checkbox>
  292. <div style="display:inline-block;margin:0 10px;cursor: pointer;"
  293. :style="{color:search_form.goods_type=='created_at'?'#29BA9C':'#333'}"
  294. @click="changeOrderBy('created_at')">
  295. <span style="font-weight:500">最新上架</span>
  296. <span class="caret-wrapper">
  297. <i class="el-icon-bottom" style="line-height: 25px;font-weight:700"></i>
  298. </span>
  299. </div>
  300. {{-- <div style="display:inline-block;margin:0 10px;cursor: pointer;"--}}
  301. {{-- :style="{color:search_form.goods_type=='sales'?'#29BA9C':'#333'}"--}}
  302. {{-- @click="changeOrderBy('sales')">--}}
  303. {{-- <span style="font-weight:500">本月销量</span>--}}
  304. {{-- <span class="caret-wrapper">--}}
  305. {{-- <i class="el-icon-bottom" style="line-height: 25px;font-weight:700"></i>--}}
  306. {{-- </span>--}}
  307. {{-- </div>--}}
  308. <div style="display:inline-block;margin:0 10px;cursor: pointer;"
  309. :style="{color:(search_form.goods_type=='agreement_price')?'#29BA9C':'#333'}"
  310. @click="changeOrderBy('agreement_price')">
  311. <span style="font-weight:500">协议价</span>
  312. <span class="caret-wrapper">
  313. <i class="caret-top"
  314. :style="{borderBottomColor:search_form.agreement_price_sort=='asc'?'#29BA9C':'#333'}"></i>
  315. <i class="caret-bottom"
  316. :style="{borderTopColor:search_form.agreement_price_sort=='desc'?'#29BA9C':'#333'}"></i>
  317. </span>
  318. </div>
  319. <div style="display:inline-block;margin:0 10px;cursor: pointer;"
  320. :style="{color:(search_form.goods_type=='guide_price')?'#29BA9C':'#333'}"
  321. @click="changeOrderBy('guide_price')">
  322. <span style="font-weight:500">指导价</span>
  323. <span class="caret-wrapper">
  324. <i class="caret-top"
  325. :style="{borderBottomColor:search_form.guide_price_sort=='asc'?'#29BA9C':'#333'}"></i>
  326. <i class="caret-bottom"
  327. :style="{borderTopColor:search_form.guide_price_sort=='desc'?'#29BA9C':'#333'}"></i>
  328. </span>
  329. </div>
  330. <div style="display:inline-block;margin:0 10px;cursor: pointer;"
  331. :style="{color:(search_form.goods_type=='activity_price')?'#29BA9C':'#333'}"
  332. @click="changeOrderBy('activity_price')">
  333. <span style="font-weight:500">营销价</span>
  334. <span class="caret-wrapper">
  335. <i class="caret-top"
  336. :style="{borderBottomColor:search_form.activity_price_sort=='asc'?'#29BA9C':'#333'}"></i>
  337. <i class="caret-bottom"
  338. :style="{borderTopColor:search_form.activity_price_sort=='desc'?'#29BA9C':'#333'}"></i>
  339. </span>
  340. </div>
  341. <div style="display:inline-block;margin:0 10px;cursor: pointer;"
  342. :style="{color:(search_form.goods_type=='promotion_rate')?'#29BA9C':'#333'}"
  343. @click="changeOrderBy('promotion_rate')">
  344. <span style="font-weight:500">常规利润率</span>
  345. <span class="caret-wrapper">
  346. <i class="caret-top"
  347. :style="{borderBottomColor:search_form.promotion_rate_sort=='asc'?'#29BA9C':'#333'}"></i>
  348. <i class="caret-bottom"
  349. :style="{borderTopColor:search_form.promotion_rate_sort=='desc'?'#29BA9C':'#333'}"></i>
  350. </span>
  351. </div>
  352. <div style="display:inline-block;margin:0 10px;cursor: pointer;"
  353. :style="{color:(search_form.goods_type=='activity_rate')?'#29BA9C':'#333'}"
  354. @click="changeOrderBy('activity_rate')">
  355. <span style="font-weight:500">营销利润率</span>
  356. <span class="caret-wrapper">
  357. <i class="caret-top"
  358. :style="{borderBottomColor:search_form.activity_rate_sort=='asc'?'#29BA9C':'#333'}"></i>
  359. <i class="caret-bottom"
  360. :style="{borderTopColor:search_form.activity_rate_sort=='desc'?'#29BA9C':'#333'}"></i>
  361. </span>
  362. </div>
  363. </div>
  364. <div class="flex" style="min-height:100vh;margin-bottom: 40px;">
  365. <div class="box-lis" v-for="(item,index) in list" :key="index">
  366. <div class="box-li" @mouseover="hoverIndex(index)" @mouseout="outIndex()"
  367. :style="{borderColor:(goods_index==index?'#29ba9b':'')}">
  368. <div class="box-li-img">
  369. <img :src="item.image_url" :alt="item.title" :title="item.title">
  370. </div>
  371. <div class="box-li-bottom">
  372. <div class="box-li-title">[[item.title]]</div>
  373. </div>
  374. <p style="border-top: 1px dashed rgb(204, 204, 204); margin: 8px;margin-top:0"></p>
  375. <div class="box-li-price">
  376. <div class="box-li-price-one">
  377. <div>协议价</div>
  378. <div style="color:#FF0000">¥[[item.agreement_price || '0']]</div>
  379. </div>
  380. <div class="box-li-price-one">
  381. <div>利润率</div>
  382. <div style="color:#FF0000">[[item.origin_rate || '0']]%</div>
  383. </div>
  384. <div class="box-li-price-one">
  385. <div>销售价</div>
  386. <div style="color:#FF0000">¥[[item.sale_price]]</div>
  387. </div>
  388. <div class="box-li-price-one">
  389. <div>营销价</div>
  390. <div style="color:#FF0000">¥[[item.activity_price || '0']]</div>
  391. </div>
  392. <div class="box-li-price-one">
  393. <div>营销利润率</div>
  394. <div style="color:#FF0000">[[item.activity_rate]]%</div>
  395. </div>
  396. <div class="box-li-price-one">
  397. <div>指导价</div>
  398. <div style="color:#FF0000">¥[[item.guide_price||'0']]</div>
  399. </div>
  400. <div class="box-li-price-one">
  401. <div>市场价</div>
  402. <div style="color:#FF0000">¥[[item.market_price||'0']]</div>
  403. </div>
  404. <div class="box-li-price-one">
  405. <div>推荐品牌</div>
  406. <div style="color:#FF0000">[[item.recommend_brand_str||'-- ']]</div>
  407. </div>
  408. <div class="box-li-price-one">
  409. <div>推荐分类</div>
  410. <div style="color:#FF0000">[[item.recommend_category_str||'--']]</div>
  411. </div>
  412. </div>
  413. <div class="box-li-sel">
  414. <el-checkbox v-model.number="item.is_choose" :true-label="1"
  415. :false-label="0" @change="oneChange(item)"></el-checkbox>
  416. </div>
  417. </div>
  418. </div>
  419. </div>
  420. <div class="vue-page">
  421. <el-row>
  422. <el-col :span="11" style="margin-left:20px">
  423. <input name="submit" type="button" @click="confirm()"
  424. :disabled="is_import_disabled" class="btn btn-success" value="导入商品">
  425. <input type="button" @click="show_all_import()" :disabled="is_import_disabled"
  426. class="btn btn-danger" value="导入全部筛选商品">
  427. </el-col>
  428. <el-col :span="12" align="right">
  429. <el-pagination layout="prev, pager, next,jumper" @current-change="search"
  430. :total="total"
  431. :page-size="per_size" :current-page="current_page" background
  432. v-loading="loading"></el-pagination>
  433. </el-col>
  434. </el-row>
  435. </div>
  436. <!-- 表格end -->
  437. </div>
  438. </div>
  439. <div class='panel-footer'>
  440. </div>
  441. </div>
  442. <el-dialog :visible.sync="all_import_show" width="750px" title="导入全部商品">
  443. <el-col v-if="all_import.import_status == 0" style="color: red">
  444. 共计商品数为[[total]]个,因条件限制该操作只能导入前2500款商品
  445. </el-col>
  446. <el-col v-if="all_import.import_status == 1" style="color: red">导入商品总数:[[all_import.import_total]]
  447. </el-col>
  448. <el-col v-if="all_import.import_status == 1" style="color: red">已导入商品数:[[all_import.import_exits]]
  449. </el-col>
  450. <el-col v-if="all_import.import_status == 1" style="color: red">
  451. 总进度约:[[all_import.import_process]]%
  452. </el-col>
  453. <span slot="footer" class="dialog-footer">
  454. <el-button @click="all_import_show = false">取 消</el-button>
  455. <el-button type="primary" :disabled="all_import_disabled" @click="all_confirm">确认导入</el-button>
  456. </span>
  457. </el-dialog>
  458. </div>
  459. </div>
  460. </div>
  461. </div>
  462. </div>
  463. <script>
  464. var app = new Vue({
  465. el: "#app",
  466. delimiters: ['[[', ']]'],
  467. directives: {
  468. 'el-select-loadmore': {
  469. bind(el, binding) {
  470. // 获取element-ui定义好的scroll盒子
  471. const SELECTWRAP_DOM = el.querySelector('.el-select-dropdown .el-select-dropdown__wrap');
  472. SELECTWRAP_DOM.addEventListener('scroll', function () {
  473. /**
  474. * scrollHeight 获取元素内容高度(只读)
  475. * scrollTop 获取或者设置元素的偏移值,常用于, 计算滚动条的位置, 当一个元素的容器没有产生垂直方向的滚动条, 那它的scrollTop的值默认为0.
  476. * clientHeight 读取元素的可见高度(只读)
  477. * 如果元素滚动到底, 下面等式返回true, 没有则返回false:
  478. * ele.scrollHeight - ele.scrollTop === ele.clientHeight;
  479. */
  480. const condition = this.scrollHeight - this.scrollTop <= this.clientHeight;
  481. if (condition) {
  482. binding.value();
  483. }
  484. });
  485. }
  486. }
  487. },
  488. data() {
  489. let category_level = {!! $category_level !!};
  490. let create_category = {!! $create_category !!};
  491. let filtering_list = {!! $filtering_list?:'{}' !!};
  492. let category_list = {!! $category_list?:'{}' !!};
  493. let search_cate_v1 = '{}';
  494. let group_list = {!! $group_list?:'{}' !!};
  495. let app_group_list = {!! $app_group_list?:'{}' !!};
  496. let all_import = {!! $import?:'{}' !!};
  497. let topic_id = {!! $topic_id !!};
  498. return {
  499. middleground_configuration:{},//中台配置数组
  500. middleground_configuration_id:0,
  501. goods_index: -1,
  502. is_all_choose: 0,
  503. loading: false,
  504. all_loading: false,
  505. page_number: 20, //每页显示条数
  506. all_import_show: false,
  507. list: [],
  508. all_import: all_import,
  509. search_form: {
  510. cate_v1: '',
  511. cate_v2: '',
  512. cate_v3: '',
  513. range_type: '',
  514. range_from: '',
  515. range_to: '',
  516. source: '',
  517. commission_agent: '1',
  518. goods_import: '',
  519. is_display:1,
  520. topic_id: topic_id
  521. },
  522. category_page: {
  523. pageIndex: 1,
  524. pageSize: 20,
  525. },
  526. category_form: {
  527. id_v1: "",
  528. id_v2: "",
  529. id_v3: "",
  530. fid_v1: "",
  531. fid_v2: "",
  532. },
  533. is_display:[
  534. {
  535. value: 1,
  536. label: '上架',
  537. },
  538. {
  539. value: 2,
  540. label: '下架',
  541. }
  542. ],
  543. goods_source: [
  544. {
  545. value: 'all',
  546. label: '全部',
  547. },
  548. {
  549. value: 'zt', //中台传0
  550. label: '中台',
  551. },
  552. {
  553. value: 1,
  554. label: '云仓',
  555. },
  556. {
  557. value: 2,
  558. label: '京东',
  559. }, {
  560. value: 6,
  561. label: '阿里'
  562. }, {
  563. value: 7,
  564. label: '天猫'
  565. }],
  566. goods_shipping: [{
  567. value: '',
  568. label: '全部',
  569. }, {
  570. value: '0',
  571. label: '不包邮'
  572. }, {
  573. value: '1',
  574. label: '包邮'
  575. }],
  576. goods_page_size: [{
  577. value: '20',
  578. label: '20条'
  579. }, {
  580. value: '50',
  581. label: '50条'
  582. }],
  583. goods_import: [{
  584. value: '',
  585. label: ''
  586. }, {
  587. value: '1',
  588. label: '未导入'
  589. }, {
  590. value: '2',
  591. label: '已导入'
  592. }],
  593. goods_agent: [{
  594. value: '0',
  595. label: '选品库商品',
  596. }, {
  597. value: '1',
  598. label: '全部商品'
  599. }],
  600. is_import_disabled: false,
  601. all_import_disabled: false,
  602. filtering_list: filtering_list, //商品标签
  603. filtering_list_v2: [], //商品标签
  604. category_level: category_level,//分类等级
  605. create_category: create_category,//分类等级
  606. category_list: category_list,
  607. category_list_v2: [],
  608. category_list_v3: [],
  609. selectionGoodsIds: [],
  610. goods_group: group_list,
  611. app_goods_group: app_group_list,
  612. search_cate_v1: search_cate_v1,
  613. search_cate_v2: [],
  614. search_cate_v3: [],
  615. //分页
  616. total: 0,
  617. per_size: 0,
  618. current_page: 0,
  619. }
  620. },
  621. created() {
  622. this.getMiddlegroundConfiguration();
  623. },
  624. methods: {
  625. getMiddlegroundConfiguration(){
  626. this.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.middleground-configuration.get-middleground-configurations') !!}').then(function (response) {
  627. if (response.data.result) {
  628. this.middleground_configuration = response.data.data;
  629. this.middleground_configuration_id = this.middleground_configuration[0].id;
  630. this.getGoodsList({search: {topic_id: this.search_form.topic_id}});
  631. this.changeSource();
  632. } else {
  633. this.$message({message: response.data.msg, type: 'error'});
  634. }
  635. }, function (response) {
  636. this.$message({message: response.data.msg, type: 'error'});
  637. })
  638. },
  639. // 获得商品列表
  640. getGoodsList(json) {
  641. json['middleground_configuration_id'] = this.middleground_configuration_id;
  642. var that = this;
  643. that.all_loading = true;
  644. that.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.goods-import.goods-pagination') !!}', json).then(response => {
  645. if (response.data.result == 1) {
  646. that.list = response.data.data.data;
  647. that.list.forEach((item, index) => {
  648. that.list[index].is_choose = 0;
  649. })
  650. that.current_page = response.data.data.current_page;
  651. that.per_size = response.data.data.per_page;
  652. that.total = response.data.data.total;
  653. that.all_loading = false;
  654. } else {
  655. that.list= [];
  656. that.current_page = 1;
  657. that.per_size = 1;
  658. that.total = 0;
  659. that.$message.error(response.data.msg);
  660. that.all_loading = false;
  661. }
  662. }), function (res) {
  663. that.all_loading = false;
  664. };
  665. },
  666. show_all_import() {
  667. if (this.all_import.import_status == 1) {
  668. this.all_import_disabled = true
  669. }
  670. this.all_import_show = true;
  671. },
  672. search(page) {
  673. // if(page-this.current_page>=7){
  674. // this.$message.error("只能跳转7页之内");
  675. // var current_page = this.current_page;
  676. // $(".el-pager li").each(function () {
  677. // if($(this).text() == current_page){
  678. // $(this).click();
  679. // }
  680. // })
  681. // return
  682. // }
  683. this.getGoodsList({page: page, search: this.search_form});
  684. },
  685. // 上一页
  686. prev() {
  687. let page = parseInt(this.current_page) - 1;
  688. if (page < 1) {
  689. return false;
  690. }
  691. this.getGoodsList({page: page, search: this.search_form});
  692. },
  693. //下一页
  694. next() {
  695. let page = parseInt(this.current_page) + 1;
  696. if (this.per_size < this.page_number) {
  697. return false;
  698. }
  699. this.getGoodsList({page: page, search: this.search_form});
  700. },
  701. //跳页
  702. jumpPage() {
  703. if (this.current_page <= 1) {
  704. this.current_page = 1;
  705. }
  706. // if(this.current_page>100){
  707. // this.current_page = 100
  708. // }
  709. this.getGoodsList({page: this.current_page, search: this.search_form});
  710. },
  711. //选择商品
  712. handleSelectionChange(val) {
  713. var arr = [];
  714. for (var j = 0, len = val.length; j < len; j++) {
  715. arr.push(val[j].id);
  716. }
  717. this.selectionGoodsIds = arr;
  718. },
  719. // 一级分类改变
  720. changeV1() {
  721. this.category_form.id_v2 = "";
  722. this.category_form.id_v3 = "";
  723. this.category_list_v2 = [];
  724. this.category_list_v3 = [];
  725. this.category_list.find(item => {
  726. if (item.id == this.category_form.id_v1) {
  727. this.category_list_v2 = item.childrens;
  728. }
  729. });
  730. },
  731. // 二级分类改变
  732. changeV2() {
  733. this.category_form.id_v3 = "";
  734. this.category_list_v3 = [];
  735. if (this.category_level == 3) {
  736. this.category_list_v2.find(item => {
  737. if (item.id == this.category_form.id_v2) {
  738. this.category_list_v3 = item.childrens;
  739. }
  740. })
  741. }
  742. },
  743. // 一级分类改变
  744. searchCateV2() {
  745. this.search_form.cate_v2 = "";
  746. this.search_form.cate_v3 = "";
  747. this.search_cate_v2 = [];
  748. this.search_cate_v3 = [];
  749. //搜索二级分类
  750. var source = this.search_form.source;
  751. var parent_id = this.search_form.cate_v1;
  752. // 这里是接口请求数据, 带分页条件
  753. this.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.goods-import.getChildrenCategory') !!}', {
  754. 'source': source,
  755. 'parent_id': parent_id,
  756. 'middleground_configuration_id':this.middleground_configuration_id
  757. }).then(response => {
  758. if (response.data.result == 1) {
  759. this.search_cate_v2 = response.data.data;
  760. }
  761. }), function (res) {
  762. };
  763. },
  764. // 二级分类改变
  765. searchCateV3() {
  766. this.search_form.cate_v3 = "";
  767. this.search_cate_v3 = [];
  768. //搜索三级分类
  769. var source = this.search_form.source;
  770. var parent_id = this.search_form.cate_v2;
  771. // 这里是接口请求数据, 带分页条件
  772. this.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.goods-import.getChildrenCategory') !!}', {
  773. 'source': source,
  774. 'parent_id': parent_id,
  775. 'middleground_configuration_id':this.middleground_configuration_id
  776. }).then(response => {
  777. if (response.data.result == 1) {
  778. this.search_cate_v3 = response.data.data;
  779. }
  780. }), function (res) {
  781. };
  782. },
  783. changeSource() {
  784. var that = this;
  785. that.search_form.cate_v1 = "";
  786. that.search_form.cate_v2 = "";
  787. that.search_form.cate_v3 = "";
  788. that.search_cate_v1 = [];
  789. that.search_cate_v2 = [];
  790. that.search_cate_v3 = [];
  791. // var source = that.search_form.source;
  792. // 'source':source
  793. that.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.goods-import.getChildrenCategory') !!}', {middleground_configuration_id:this.middleground_configuration_id}).then(response => {
  794. if (response.data.result == 1) {
  795. that.search_cate_v1 = response.data.data;
  796. }
  797. }), function (res) {
  798. };
  799. },
  800. changeWarehouse() {
  801. var that = this;
  802. var commission_agent = that.search_form.commission_agent;
  803. if (commission_agent == 0) {
  804. that.goods_source = [
  805. {
  806. value: '',
  807. label: '全部'
  808. },
  809. {
  810. value: 0,
  811. label: '未分组'
  812. }];
  813. var item = {};
  814. that.app_goods_group.forEach((element, index) => {
  815. item = {};
  816. item.value = element.id;
  817. item.label = element.name;
  818. that.goods_source.push(item);
  819. });
  820. } else {
  821. that.goods_source = [
  822. {
  823. value: '',
  824. label: '全部',
  825. },
  826. {
  827. value: 2,
  828. label: '京东',
  829. }, {
  830. value: 6,
  831. label: '阿里'
  832. }, {
  833. value: 7,
  834. label: '天猫'
  835. }, {
  836. value: 1,
  837. label: '云仓'
  838. }];
  839. }
  840. },
  841. // 一级标签改变
  842. filteringV1() {
  843. this.category_form.fid_v2 = "";
  844. this.filtering_list_v2 = [];
  845. this.filtering_list.find(item => {
  846. if (item.id == this.category_form.fid_v1) {
  847. this.filtering_list_v2 = item.value;
  848. }
  849. });
  850. },
  851. //导入商品
  852. confirm() {
  853. var that = this;
  854. var arr = {
  855. 'parentid': [],
  856. 'childid': [],
  857. 'thirdid': [],
  858. };
  859. // if(!this.category_form.id_v1){
  860. // this.$message.error("请选择要导入的商品分类");
  861. // return false;
  862. // }
  863. //
  864. // if(!this.category_form.id_v2){
  865. // this.$message.error("请选择二级分类");
  866. // return false;
  867. // }
  868. //
  869. // if(this.category_level == 3 && !this.category_form.id_v3){
  870. // this.$message.error("请选择三级分类");
  871. // return false;
  872. // }
  873. if (this.category_form.fid_v1) {
  874. if (!this.category_form.fid_v2) {
  875. this.$message.error("商品标签值不能为空");
  876. return false;
  877. }
  878. }
  879. arr.parentid.push(this.category_form.id_v1);
  880. arr.childid.push(this.category_form.id_v2);
  881. if (this.category_form.id_v3) {
  882. arr.thirdid.push(this.category_form.id_v3);
  883. }
  884. // let json = {category:arr,goods_ids:this.selectionGoodsIds,f_value_id:this.category_form.fid_v2,commission_agent:this.search_form.commission_agent};
  885. let json = {
  886. category: arr,
  887. goods_ids: [],
  888. f_value_id: this.category_form.fid_v2,
  889. commission_agent: this.search_form.commission_agent,
  890. middleground_configuration_id:this.middleground_configuration_id
  891. };
  892. this.list.forEach((item, index) => {
  893. if (item.is_choose) {
  894. json.goods_ids.push(item.id)
  895. }
  896. })
  897. that.is_import_disabled = true;
  898. that.all_loading = true;
  899. that.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.goods-import.select') !!}', json).then(response => {
  900. that.is_import_disabled = true;
  901. that.all_loading = false;
  902. if (response.data.result == 1) {
  903. that.$message.success(response.data.msg);
  904. that.is_import_disabled = false;
  905. this.getGoodsList({page: this.current_page, search: this.search_form});
  906. } else {
  907. that.$message.error(response.data.msg);
  908. that.is_import_disabled = false;
  909. }
  910. }), function (res) {
  911. that.is_import_disabled = true;
  912. that.all_loading = false;
  913. };
  914. },
  915. all_confirm() {
  916. var that = this;
  917. var arr = {
  918. 'parentid': [],
  919. 'childid': [],
  920. 'thirdid': [],
  921. };
  922. if (this.category_form.fid_v1) {
  923. if (!this.category_form.fid_v2) {
  924. this.$message.error("商品标签值不能为空");
  925. return false;
  926. }
  927. }
  928. arr.parentid.push(this.category_form.id_v1);
  929. arr.childid.push(this.category_form.id_v2);
  930. if (this.category_form.id_v3) {
  931. arr.thirdid.push(this.category_form.id_v3);
  932. }
  933. let json = {
  934. category: arr,
  935. f_value_id: this.category_form.fid_v2,
  936. search: this.search_form,
  937. middleground_configuration_id:this.middleground_configuration_id
  938. };
  939. that.is_import_disabled = true;
  940. that.all_loading = true;
  941. this.all_import_disabled = true
  942. that.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.goods-import.all-select') !!}', json).then(response => {
  943. that.is_import_disabled = true;
  944. that.all_loading = false;
  945. if (response.data.result == 1) {
  946. that.$message.success(response.data.msg);
  947. location.reload()
  948. } else {
  949. that.$message.error(response.data.msg);
  950. }
  951. }), function (res) {
  952. that.is_import_disabled = true;
  953. that.all_loading = false;
  954. };
  955. },
  956. hoverIndex(index) {
  957. this.goods_index = index;
  958. },
  959. outIndex() {
  960. this.goods_index = -1
  961. },
  962. // 单个选择
  963. oneChange(item) {
  964. let that = this;
  965. this.$forceUpdate();
  966. let is_all = 0;
  967. that.list.some((item, index) => {
  968. if (item.is_choose == 1) {
  969. is_all = 1;
  970. } else {
  971. is_all = 0;
  972. return true;
  973. }
  974. })
  975. that.is_all_choose = is_all;
  976. },
  977. // 全选
  978. allChoose() {
  979. let that = this;
  980. let status = 0;
  981. if (that.is_all_choose == 1) {
  982. status = 1;
  983. } else {
  984. status = 0;
  985. }
  986. that.list.forEach((item, index) => {
  987. item.is_choose = status;
  988. })
  989. },
  990. changeOrderBy(type) {
  991. var sort = type + '_sort';
  992. var current_sort = this.search_form['goods_type'] + '_sort';
  993. this.search_form[current_sort] = '';
  994. if (type == this.search_form['goods_type']) {
  995. if (this.search_form['goods_sort'] == 'asc') {
  996. this.search_form[sort] = 'desc';
  997. } else {
  998. this.search_form[sort] = 'asc';
  999. }
  1000. } else {
  1001. this.search_form[sort] = 'desc';
  1002. }
  1003. this.search_form['goods_sort'] = this.search_form[sort];
  1004. this.search_form['goods_type'] = type;
  1005. if (type == 'created_time' || type == 'real_month_sale') {
  1006. this.search_form['goods_sort'] = 'desc';
  1007. }
  1008. this.$forceUpdate();
  1009. this.getGoodsList({page: 1, search: this.search_form});
  1010. },
  1011. },
  1012. })
  1013. </script>
  1014. @endsection('content')