goods-import-featured.blade.php 42 KB

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