@extends('layouts.base')

@section('content')
@section('title', trans('商品导入'))
<style>
    [v-cloak]{
        display:none;
    }
    .vue-page {
        border-radius: 5px;
        width: calc(100% - 266px);
        float: right;
        margin-right: 10px;
        position: fixed;
        bottom: 0;
        right: 0;
        padding: 15px 5% 15px 0;
        background: #fff;
        height: 60px;
        z-index: 999;
        margin-top: 0;
        box-shadow: 0 2px 9px rgba(51, 51, 51, 0.1);
    }
    .content{background-color: #eff3f6;}

    .caret-wrapper {
        display: inline-flex;
        flex-direction: column;
        align-items: center;
        height: 25px;
        width: 11px;
        vertical-align: middle;
        cursor: pointer;
        overflow: initial;
        position: relative;
    }
    .caret-top{
        border: 5px solid transparent;
        border-bottom-color: #333;
        margin:1px 0;
    }
    .caret-bottom{
        border: 5px solid transparent;
        border-top-color: #333;
        margin:1px 0;


</style>
<style>
    /* .flex{display:flex;width:100%;flex-wrap: wrap;justify-content: space-between} */
    .flex{display: grid;grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));grid-gap: 15px;}
    .box-lis{min-width: 240px;width:240px}
    .flex:after {
        content: "";
        width: 240px;
    }
    .box-li{width:240px;border:1px solid #ccc;border-radius: 10px 10px 0 0;margin:10px 0;position: relative;}
    .box-li-img{width:240px;height:240px;border-radius: 10px 10px 0 0;}
    .box-li-img img{width:238px;height:100%;border-radius: 10px 10px 0 0;border:0px solid #333;}
    .box-li-bottom{padding:10px 0;margin:0 5px;}
    .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;}
    .box-li-price{display:flex;flex-wrap: wrap;color:#333;font-weight: 500;margin:0 8px;}
    .box-li-price-one{margin:5px 0;width:33%;text-align: center;font-size: 12px;}
    .box-li-sel{position: absolute;top:0;right: 7px;}
    .el-checkbox__inner {border-color:#29ba9b}

</style>

<div class="w1200 ">

    <link rel="stylesheet" type="text/css" href="{{static_url('css/font-awesome.min.css')}}">
    <link rel="stylesheet" type="text/css" href="{{static_url('yunshop/goods/goods.css')}}"/>
    <div id="goods-index" class=" rightlist ">
        <div class="right-titpos">
            <ul class="add-snav">
                <li class="active"><a href="#">商品列表</a></li>
            </ul>
        </div>
        <div class="right-addbox">
            <div id="app" v-cloak>
                <div class="panel panel-info" style="margin-bottom:15px;border-radius:8px">
                    <div class="panel-body" style="margin-bottom:15px;">
                        <el-form :inline="true" :model="search_form" ref="search_form">
                            <el-form-item label="">
                                <el-col>
                                    <el-input  type="text" placeholder="商品名称、品牌" v-model="search_form.word"></el-input>
                                </el-col>
                            </el-form-item>
                            <el-form-item label = "">
                                <el-select v-model="search_form.range_type" clearable  placeholder="请选择区间筛选类型">
                                    <el-option label="协议价格" value="agreement_price"></el-option>
                                    <el-option label="常规利润率" value="promotion_rate"></el-option>
                                    <el-option label="营销价格" value="activity_price"></el-option>
                                    <el-option label="指导价格" value="guide_price"></el-option>
                                    <el-option label="营销利润率" value="activity_rate"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="">
                                <el-col :span="11">
                                    <el-input  type="number" placeholder="区间开始" v-model="search_form.range_from"></el-input>
                                </el-col>
                                <el-col class="line" :span="2" style="border:0;font-size:25px;">-</el-col>
                                <el-col :span="11">
                                    <el-input type="number" placeholder="区间结束" v-model="search_form.range_to" ></el-input>
                                </el-col>
                            </el-form-item>
                            <el-form-item label="">
                                <el-select v-model="search_form.cate_v1" placeholder="请选择一级分类" clearable @change="searchCateV2()">
                                    <el-option v-for="item in search_cate_v1" :key="item.id" :label="item.title" :value="item.id"></el-option>
                                </el-select>
                                <el-select v-model="search_form.cate_v2" placeholder="请选择二级分类" clearable @change="searchCateV3()">
                                    <el-option v-for="item in search_cate_v2" :key="item.id" :label="item.title" :value="item.id"></el-option>
                                </el-select>
                                <el-select v-model="search_form.cate_v3" placeholder="请选择三级分类" clearable>
                                    <el-option v-for="item in search_cate_v3" :key="item.id" :label="item.title" :value="item.id"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-select v-model="search_form.goods_group" clearable  placeholder="营销活动" clearable>
                                <el-option  v-for="(item,index) in goods_group"
                                            :key="index"
                                            :label="item.name"
                                            :value="item.id"></el-option>
                            </el-select>
                            <el-form-item label="">
                                <el-select v-model="search_form.goods_page_size" clearable  placeholder="每页条数" clearable >
                                    <el-option  v-for="(item,index) in goods_page_size"
                                                :key="index"
                                                :label="item.label"
                                                :value="item.value"></el-option>
                                </el-select>
                                <el-select v-model="search_form.goods_import" clearable  placeholder="是否已导入" clearable >
                                    <el-option  v-for="(item,index) in goods_import"
                                                :key="index"
                                                :label="item.label"
                                                :value="item.value"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item>
                                <el-button type="success" icon="el-icon-search" @click="search()">搜索</el-button>
                            </el-form-item>
                        </el-form>
                        <el-form :model="category_form" ref="category_form" :inline="true">
                            <el-form-item label="选择导入分类">
                                <el-select v-model="category_form.id_v1" placeholder="请选择一级分类" clearable @change="changeV1()">
                                    <el-option v-for="item in category_list" :key="item.id" :label="item.name" :value="item.id"></el-option>
                                </el-select>
                                <el-select v-model="category_form.id_v2" placeholder="请选择二级分类" clearable @change="changeV2()">
                                    <el-option v-for="item in category_list_v2" :key="item.id" :label="item.name" :value="item.id"></el-option>
                                </el-select>
                                <el-select v-model="category_form.id_v3" placeholder="请选择三级分类" clearable v-if="category_level == 3">
                                    <el-option v-for="item in category_list_v3" :key="item.id" :label="item.name" :value="item.id"></el-option>
                                </el-select>
                            </el-form-item>

                            <el-form-item label="选择导入商品标签">
                                <el-select v-model="category_form.fid_v1" placeholder="请选择标签组" clearable @change="filteringV1()">
                                    <el-option v-for="item in filtering_list" :key="item.id" :label="item.name" :value="item.id"></el-option>
                                </el-select>
                                <el-select v-model="category_form.fid_v2" placeholder="请选择标签值" clearable >
                                    <el-option v-for="item in filtering_list_v2" :key="item.id" :label="item.name" :value="item.id"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-col v-if="create_category == 1" style="color: red">已开启自动匹配分类，如不选择导入分类则自动匹配或创建分类！（阿里商品不支持）</el-col>

                        </el-form>
                    </div>
                </div>

                <div class="panel panel-default" style="border-radius:8px">
                    <div class="panel-body table-responsive">
                        <div v-loading="loading">
                            <el-checkbox v-model.number="is_all_choose" :true-label="1" :false-label="0" @change="allChoose">[[is_all_choose==1?'全不选':'全选']]</el-checkbox>
                            <div style="display:inline-block;margin:0 10px;cursor: pointer;" :style="{color:search_form.goods_type=='created_time'?'#29BA9C':'#333'}" @click="changeOrderBy('created_time')">
                                <span style="font-weight:500">最新上架</span>
                                <span class="caret-wrapper">
                                        <i class="el-icon-bottom" style="line-height: 25px;font-weight:700"></i>
                                    </span>
                            </div>
                            <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')">
                                <span style="font-weight:500">本月销量</span>
                                <span class="caret-wrapper">
                                        <i class="el-icon-bottom" style="line-height: 25px;font-weight:700"></i>
                                    </span>
                            </div>
                            <div style="display:inline-block;margin:0 10px;cursor: pointer;" :style="{color:(search_form.goods_type=='agreement_price')?'#29BA9C':'#333'}" @click="changeOrderBy('agreement_price')">
                                <span style="font-weight:500">协议价</span>
                                <span class="caret-wrapper">
                                        <i class="caret-top" :style="{borderBottomColor:search_form.agreement_price_sort=='asc'?'#29BA9C':'#333'}"></i>
                                        <i class="caret-bottom" :style="{borderTopColor:search_form.agreement_price_sort=='desc'?'#29BA9C':'#333'}"></i>
                                    </span>
                            </div>
                            <div style="display:inline-block;margin:0 10px;cursor: pointer;" :style="{color:(search_form.goods_type=='guide_price')?'#29BA9C':'#333'}" @click="changeOrderBy('guide_price')">
                                <span style="font-weight:500">指导价</span>
                                <span class="caret-wrapper">
                                          <i class="caret-top" :style="{borderBottomColor:search_form.guide_price_sort=='asc'?'#29BA9C':'#333'}"></i>
                                        <i class="caret-bottom" :style="{borderTopColor:search_form.guide_price_sort=='desc'?'#29BA9C':'#333'}"></i>

                                    </span>
                            </div>
                            <div style="display:inline-block;margin:0 10px;cursor: pointer;" :style="{color:(search_form.goods_type=='activity_price')?'#29BA9C':'#333'}" @click="changeOrderBy('activity_price')">
                                <span style="color:#333;font-weight:500">营销价</span>
                                <span class="caret-wrapper">
                                        <i class="caret-top" :style="{borderBottomColor:search_form.activity_price_sort=='asc'?'#29BA9C':'#333'}"></i>
                                        <i class="caret-bottom" :style="{borderTopColor:search_form.activity_price_sort=='desc'?'#29BA9C':'#333'}"></i>

                                    </span>
                            </div>
                            <div style="display:inline-block;margin:0 10px;cursor: pointer;" :style="{color:(search_form.goods_type=='promotion_rate')?'#29BA9C':'#333'}" @click="changeOrderBy('promotion_rate')">
                                <span style="color:#333;font-weight:500">常规利润率</span>
                                <span class="caret-wrapper">
                                        <i class="caret-top" :style="{borderBottomColor:search_form.promotion_rate_sort=='asc'?'#29BA9C':'#333'}"></i>
                                        <i class="caret-bottom" :style="{borderTopColor:search_form.promotion_rate_sort=='desc'?'#29BA9C':'#333'}"></i>

                                    </span>
                            </div>
                            <div style="display:inline-block;margin:0 10px;cursor: pointer;" :style="{color:(search_form.goods_type=='activity_rate')?'#29BA9C':'#333'}" @click="changeOrderBy('activity_rate')">
                                <span style="color:#333;font-weight:500">营销利润率</span>
                                <span class="caret-wrapper">
                                       <i class="caret-top" :style="{borderBottomColor:search_form.activity_rate_sort=='asc'?'#29BA9C':'#333'}"></i>
                                        <i class="caret-bottom" :style="{borderTopColor:search_form.activity_rate_sort=='desc'?'#29BA9C':'#333'}"></i>

                                    </span>
                            </div>
                            <div class="flex" style="min-height:100vh;margin-bottom: 40px;">
                                <div class="box-lis" v-for="(item,index) in list" :key="index">
                                    <div class="box-li" @mouseover="hoverIndex(index)" @mouseout="outIndex()" :style="{borderColor:(goods_index==index?'#29ba9b':'')}">
                                        <div class="box-li-img">
                                            <img :src="item.cover" :alt="item.title" :title="item.title">
                                        </div>
                                        <div class="box-li-bottom">
                                            <div class="box-li-title">[[item.title]]</div>
                                        </div>
                                        <p style="border-top: 1px dashed rgb(204, 204, 204); margin: 8px;margin-top:0"></p>
                                        <div class="box-li-price">
                                            <div class="box-li-price-one">
                                                <div>协议价</div>
                                                <div style="color:#FF0000">￥[[item.agreement_price || '--']]</div>
                                            </div>
                                            <div class="box-li-price-one">
                                                <div>利润率</div>
                                                <div style="color:#FF0000">[[item.promotion_rate || '--']]%</div>
                                            </div>
                                            <div class="box-li-price-one">
                                                <div>销售价</div>
                                                <div style="color:#FF0000">￥[[item.sale_price]]</div>
                                            </div>
                                            <div class="box-li-price-one">
                                                <div>营销价</div>
                                                <div style="color:#FF0000">￥[[item.activity_price || '--']]</div>
                                            </div>
                                            <div class="box-li-price-one">
                                                <div>营销利润率</div>
                                                <div style="color:#FF0000">[[item.activity_rate]]%</div>
                                            </div>
                                            <div class="box-li-price-one">
                                                <div>指导价</div>
                                                <div style="color:#FF0000">￥[[item.guide_price||'--']]</div>
                                            </div>
                                            <div class="box-li-price-one">
                                                <div>市场价</div>
                                                <div style="color:#FF0000">￥[[item.market_price||'--']]</div>
                                            </div>
                                            <div class="box-li-price-one">
                                                <div>推荐品牌</div>
                                                <div style="color:#FF0000">[[item.third_brand_name||'--']]</div>
                                            </div>
                                            <div class="box-li-price-one">
                                                <div>推荐分类</div>
                                                <div style="color:#FF0000">[[item.third_category_name||'--']]</div>
                                            </div>
                                        </div>
                                        <div class="box-li-sel">
                                            <el-checkbox v-model.number="item.is_choose" :true-label="1" :false-label="0" @change="oneChange(item)"></el-checkbox>
                                        </div>
                                    </div>

                                </div>

                            </div>
                            <div class="vue-page">
                                <el-row>
                                    <el-col :span="11" style="margin-left:20px">
                                        <input name="submit" type="button" @click="confirm()" :disabled="is_import_disabled" class="btn btn-success" value="导入商品">
                                        <input  type="button" @click="show_all_import()" :disabled="is_import_disabled" class="btn btn-danger" value="导入全部筛选商品">
                                    </el-col>
                                    <el-col :span="12" align="right">
                                        <el-pagination layout="prev, pager, next,jumper" @current-change="search" :total="total"
                                                       :page-size="per_size" :current-page="current_page" background
                                                       v-loading="loading"></el-pagination>
                                    </el-col>
                                </el-row>
                            </div>
                        </div>
                    </div>
                    <div class='panel-footer'>

                    </div>
                </div>
                <el-dialog :visible.sync="all_import_show" width="750px"  title="导入全部商品">

                    <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>
                    <el-col v-if="all_import.import_status == 1" style="color: red">已导入商品数：[[all_import.import_exits]]</el-col>
                    <el-col v-if="all_import.import_status == 1" style="color: red">总进度约：[[all_import.import_process]]%</el-col>
                    <span slot="footer" class="dialog-footer">
                <el-button @click="all_import_show = false">取 消</el-button>
                <el-button type="primary" :disabled="all_import_disabled" @click="all_confirm">确认导入</el-button>
            </span>
                </el-dialog>

            </div>
        </div>
    </div>
</div>
</div>

<script>
    var app = new Vue({
        el:"#app",
        delimiters: ['[[', ']]'],
        directives: {
            'el-select-loadmore': {
                bind(el, binding) {
                    // 获取element-ui定义好的scroll盒子
                    const SELECTWRAP_DOM = el.querySelector('.el-select-dropdown .el-select-dropdown__wrap');
                    SELECTWRAP_DOM.addEventListener('scroll', function () {
                        /**
                         * scrollHeight 获取元素内容高度(只读)
                         * scrollTop 获取或者设置元素的偏移值,常用于, 计算滚动条的位置, 当一个元素的容器没有产生垂直方向的滚动条, 那它的scrollTop的值默认为0.
                         * clientHeight 读取元素的可见高度(只读)
                         * 如果元素滚动到底, 下面等式返回true, 没有则返回false:
                         * ele.scrollHeight - ele.scrollTop === ele.clientHeight;
                         */
                        const condition = this.scrollHeight - this.scrollTop <= this.clientHeight;
                        if (condition) {
                            binding.value();
                        }
                    });
                }
            }
        },
        data() {
            let category_level = {!! $category_level !!};
            let create_category = {!! $create_category !!};
            let filtering_list = {!! $filtering_list?:'{}' !!};
            let category_list = {!! $category_list?:'{}' !!};
            let search_cate_v1 = '{}';
            let group_list = {!! $group_list?:'{}' !!};
            let app_group_list = {!! $app_group_list?:'{}' !!};
            let all_import = {!! $import?:'{}' !!};

            return{
                goods_index:-1,
                is_all_choose:0,
                loading:false,
                all_loading:false,
                page_number: 20, //每页显示条数
                all_import_show:false,
                list: [],
                all_import: all_import,
                search_form: {
                    cate_v1:'',
                    cate_v2:'',
                    cate_v3:'',
                    range_type:'',
                    range_from:'',
                    range_to:'',
                    source:'',
                    commission_agent:'1',
                    goods_import:'',
                    shop_words:'芸信商城',
                },
                category_page: {
                    pageIndex: 1,
                    pageSize: 20,
                },
                category_form:{
                    id_v1:"",
                    id_v2:"",
                    id_v3:"",
                    fid_v1:"",
                    fid_v2:"",
                },
                goods_source:[
                    {
                        value: '',
                        label: '全部',
                    },
                    {
                        value: 2,
                        label: '京东',
                    }, {
                        value: 6,
                        label: '阿里'
                    }, {
                        value: 7,
                        label: '天猫'
                    }, {
                        value: 1,
                        label: '云仓'
                    }],
                goods_shipping:[{
                    value: '',
                    label: '',
                }, {
                    value: '0',
                    label: '不包邮'
                }, {
                    value: '1',
                    label: '包邮'
                }],
                goods_page_size:[{
                    value: '20',
                    label: '20条'
                }, {
                    value: '50',
                    label: '50条'
                }],
                goods_import:[{
                    value: '',
                    label: ''
                }, {
                    value: '1',
                    label: '未导入'
                }, {
                    value: '2',
                    label: '已导入'
                }],
                goods_agent:[{
                    value: '0',
                    label: '选品库商品',

                }, {
                    value: '1',
                    label: '全部商品'
                }],
                is_import_disabled : false,
                all_import_disabled:false,
                filtering_list:filtering_list, //商品标签
                filtering_list_v2:[], //商品标签
                category_level:category_level,//分类等级
                create_category:create_category,//分类等级
                category_list:category_list,
                category_list_v2:[],
                category_list_v3:[],
                selectionGoodsIds: [],
                goods_group: group_list,
                app_goods_group: app_group_list,
                search_cate_v1: search_cate_v1,
                search_cate_v2: [],
                search_cate_v3: [],

                //分页
                total: 0,
                per_size: 0,
                current_page: 0,

            }

        },
        created() {
            this.getGoodsList({page:1,search:this.search_form});
            this.changeSource();
        },
        methods: {
            // 获得商品列表
            getGoodsList(json) {
                var that = this;
                that.all_loading = true;
                that.$http.post('{!! yzWebFullUrl('plugin.jd-supply.admin.goods-import.goods-pagination') !!}',json).then(response => {
                    console.log(response);
                    if(response.data.result==1){
                        console.log(response);
                        that.list = response.data.data.data;
                        that.list.forEach((item,index) => {
                            that.list[index].is_choose = 0;
                        })
                        console.log(that.list)
                        that.current_page = response.data.data.current_page;
                        that.per_size = response.data.data.per_page;
                        that.total = response.data.data.total;

                        that.all_loading = false;
                    } else{
                        that.$message.error(response.data.msg);
                        that.all_loading = false;
                    }
                }),function(res){
                    console.log(res);
                    that.all_loading = false;
                };
            },

            show_all_import()
            {
                if (this.all_import.import_status == 1) {
                    this.all_import_disabled = true
                }
                this.all_import_show = true;
            },

            search(page) {
                this.getGoodsList({page:page,search:this.search_form});
            },

            // 上一页
            prev() {
                let page = parseInt(this.current_page) - 1;
                if (page < 1) {
                    return false;
                }

                this.getGoodsList({page:page,search:this.search_form});
            },
            //下一页
            next() {
                let page =  parseInt(this.current_page) + 1;
                if (this.per_size < this.page_number) {
                    return false;
                }

                this.getGoodsList({page:page,search:this.search_form});
            },
            //跳页
            jumpPage() {
                if (this.current_page <= 1) {
                    this.current_page = 1;
                }

                this.getGoodsList({page:this.current_page,search:this.search_form});
            },

            //选择商品
            handleSelectionChange(val) {
                var arr = [];
                for(var j = 0,len = val.length; j < len; j++){
                    arr.push(val[j].id);
                }
                this.selectionGoodsIds = arr;
                console.log(this.selectionGoodsIds);
            },

            // 一级分类改变
            changeV1(){
                this.category_form.id_v2 = "";
                this.category_form.id_v3 =  "";
                this.category_list_v2 = [];
                this.category_list_v3 = [];
                this.category_list.find(item => {
                    if(item.id == this.category_form.id_v1) {
                        this.category_list_v2 = item.childrens;
                    }
                });
            },
            // 二级分类改变
            changeV2(){
                this.category_form.id_v3 =  "";
                this.category_list_v3 = [];
                if(this.category_level==3) {
                    this.category_list_v2.find(item => {
                        if(item.id == this.category_form.id_v2) {
                            this.category_list_v3 = item.childrens;
                        }
                    })
                }
            },
            // 一级分类改变
            searchCateV2(){
                this.search_form.cate_v2 = "";
                this.search_form.cate_v3 =  "";
                this.search_cate_v2 = [];
                this.search_cate_v3 = [];
                //搜索二级分类
                var source = this.search_form.source;
                var parent_id = this.search_form.cate_v1;
                // 这里是接口请求数据, 带分页条件
                this.$http.post('{!! yzWebFullUrl('plugin.jd-supply.admin.goods-import.getChildrenCategory') !!}',{'source':source,'parent_id':parent_id}).then(response => {
                    console.log(response.data);
                    if(response.data.result==1){
                        this.search_cate_v2 = response.data.data;
                    }
                }),function(res){
                    console.log(res);
                };
            },
            // 二级分类改变
            searchCateV3(){
                this.search_form.cate_v3 =  "";
                this.search_cate_v3 = [];
                //搜索三级分类
                var source = this.search_form.source;
                var parent_id = this.search_form.cate_v2;
                // 这里是接口请求数据, 带分页条件
                this.$http.post('{!! yzWebFullUrl('plugin.jd-supply.admin.goods-import.getChildrenCategory') !!}',{'source':source,'parent_id':parent_id}).then(response => {
                    console.log(response.data);
                    if(response.data.result==1){
                        this.search_cate_v3 = response.data.data;
                    }
                }),function(res){
                    console.log(res);
                };
            },
            changeSource() {
                var that = this;
                that.search_form.cate_v1 = "";
                that.search_form.cate_v2 =  "";
                that.search_form.cate_v3 =  "";
                that.search_cate_v1 = [];
                that.search_cate_v2 = [];
                that.search_cate_v3 = [];
                var source = 1;
                that.$http.post('{!! yzWebFullUrl('plugin.jd-supply.admin.goods-import.getChildrenCategory') !!}',{'source':source}).then(response => {
                    console.log(response.data);
                    if(response.data.result==1){
                        console.log(response);
                        that.search_cate_v1 = response.data.data;
                    }
                }),function(res){
                    console.log(res);
                };
            },
            changeWarehouse() {
                var that = this;
                var commission_agent = that.search_form.commission_agent;
                if (commission_agent == 0) {
                    that.goods_source = [
                        {
                            value: '',
                            label: '全部'
                        },
                        {
                            value: 0,
                            label: '未分组'
                        }];
                    var item = {};
                    that.app_goods_group.forEach((element, index) => {
                        item = {};
                        item.value = element.id;
                        item.label = element.name;
                        console.log(item)
                        that.goods_source.push(item);
                    });
                } else {
                    that.goods_source = [
                        {
                            value: '',
                            label: '全部',
                        },
                        {
                            value: 2,
                            label: '京东',
                        }, {
                            value: 6,
                            label: '阿里'
                        }, {
                            value: 7,
                            label: '天猫'
                        }, {
                            value: 1,
                            label: '云仓'
                        }];

                }
                console.log(that.goods_source);
            },
            loadmore() {
                this.category_page.pageIndex++;
                var source = this.search_form.source;
                // 这里是接口请求数据, 带分页条件
                this.$http.post('{!! yzWebFullUrl('plugin.jd-supply.admin.goods-import.getThirdPartyCategory') !!}',{'source':source,'page':this.category_page.pageIndex}).then(response => {
                    console.log(response.data);
                    if(response.data.result==1){
                        this.thirdPartyCategory = [...this.thirdPartyCategory, ...response.data.data];
                    }
                }),function(res){
                    console.log(res);
                };
            },

            // 一级标签改变
            filteringV1(){
                this.category_form.fid_v2 = "";
                this. filtering_list_v2 = [];
                this.filtering_list.find(item => {
                    if(item.id == this.category_form.fid_v1) {
                        this.filtering_list_v2 = item.value;
                    }
                });
            },

            //导入商品
            confirm()
            {
                var that = this;

                var arr = {
                    'parentid': [],
                    'childid':[],
                    'thirdid':[],
                };

                // if(!this.category_form.id_v1){
                //     this.$message.error("请选择要导入的商品分类");
                //     return false;
                // }
                //
                // if(!this.category_form.id_v2){
                //     this.$message.error("请选择二级分类");
                //     return false;
                // }
                //
                // if(this.category_level == 3 && !this.category_form.id_v3){
                //     this.$message.error("请选择三级分类");
                //     return false;
                // }

                if(this.category_form.fid_v1){
                    if (!this.category_form.fid_v2) {
                        this.$message.error("商品标签值不能为空");
                        return false;
                    }
                }

                arr.parentid.push(this.category_form.id_v1);

                arr.childid.push(this.category_form.id_v2);

                if(this.category_form.id_v3){
                    arr.thirdid.push(this.category_form.id_v3);
                }

                // let json = {category:arr,goods_ids:this.selectionGoodsIds,f_value_id:this.category_form.fid_v2,commission_agent:this.search_form.commission_agent};
                let json = {category:arr,goods_ids:[],f_value_id:this.category_form.fid_v2,commission_agent:this.search_form.commission_agent};
                console.log(json)
                this.list.forEach((item,index) => {
                    if(item.is_choose) {
                        json.goods_ids.push(item.id)
                    }
                })
                console.log(json)
                that.is_import_disabled = true;
                that.all_loading = true;
                that.$http.post('{!! yzWebFullUrl('plugin.jd-supply.admin.goods-import.select') !!}',json).then(response => {
                    console.log(response);
                    that.is_import_disabled = true;
                    that.all_loading = false;
                    if(response.data.result==1) {
                        that.$message.success(response.data.msg);
                        that.is_import_disabled = false;
                        this.getGoodsList({page:this.current_page,search:this.search_form});
                    } else{
                        that.$message.error(response.data.msg);
                        that.is_import_disabled = false;
                    }
                }),function(res){
                    console.log(res);
                    that.is_import_disabled = true;
                    that.all_loading = false;
                };
            },
            all_confirm()
            {
                var that = this;

                var arr = {
                    'parentid': [],
                    'childid':[],
                    'thirdid':[],
                };
                if(this.category_form.fid_v1){
                    if (!this.category_form.fid_v2) {
                        this.$message.error("商品标签值不能为空");
                        return false;
                    }
                }
                arr.parentid.push(this.category_form.id_v1);
                arr.childid.push(this.category_form.id_v2);
                if(this.category_form.id_v3){
                    arr.thirdid.push(this.category_form.id_v3);
                }
                let json = {category:arr,f_value_id:this.category_form.fid_v2,search:this.search_form};
                that.is_import_disabled = true;
                that.all_loading = true;
                this.all_import_disabled = true
                that.$http.post('{!! yzWebFullUrl('plugin.jd-supply.admin.goods-import.all-select') !!}',json).then(response => {
                    console.log(response);
                    that.is_import_disabled = true;
                    that.all_loading = false;
                    if(response.data.result==1) {
                        that.$message.success(response.data.msg);
                        location.reload()
                    } else{
                        that.$message.error(response.data.msg);
                    }
                }),function(res){
                    console.log(res);
                    that.is_import_disabled = true;
                    that.all_loading = false;
                };
            },
            hoverIndex(index) {
                this.goods_index = index;
            },
            outIndex() {
                this.goods_index = -1
            },
            // 单个选择
            oneChange(item) {
                let that = this;
                this.$forceUpdate();
                let is_all = 0;
                that.list.some((item,index) => {
                    if(item.is_choose == 1) {
                        is_all = 1;
                    }
                    else {
                        is_all = 0;
                        return true;
                    }
                })
                that.is_all_choose = is_all;
            },
            // 全选
            allChoose() {
                let that = this;
                let status = 0;
                if(that.is_all_choose == 1){
                    status = 1;
                }
                else{
                    status = 0;
                }
                that.list.forEach((item,index) => {
                    item.is_choose = status;
                })
            },
            changeOrderBy(type) {
                var sort = type + '_sort';
                var current_sort = this.search_form['goods_type'] + '_sort';
                this.search_form[current_sort] = '';
                if (type == this.search_form['goods_type']) {
                    if (this.search_form['goods_sort'] == 'asc') {
                        this.search_form[sort] = 'desc';
                    } else  {
                        this.search_form[sort] = 'asc';
                    }
                } else  {
                    this.search_form[sort] = 'desc';
                }
                this.search_form['goods_sort'] = this.search_form[sort];
                this.search_form['goods_type'] = type;
                if (type == 'created_time' || type == 'real_month_sale') {
                    this.search_form['goods_sort'] = 'desc';
                }
                this.$forceUpdate();
                this.getGoodsList({page:1,search:this.search_form});
            },

        },
    })

</script>
@endsection('content')