@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>
                {{--                <li class="active"><a href="{{yzWebFullUrl('plugin.yz-supply.admin.label-import.index')}}">标签导入</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-select v-model="search_form.commission_agent" clearable  placeholder="请选择商品库" @change="changeWarehouse()" clearable>--}}
                                {{--                                    <el-option  v-for="(item,index) in goods_agent"--}}
                                {{--                                                :key="index"--}}
                                {{--                                                :label="item.label"--}}
                                {{--                                                :value="item.value"></el-option>--}}
                                {{--                                </el-select>--}}
                                {{--                                @change="changeSource()"--}}
                                <el-select v-model="search_form.source" clearable placeholder="请选择来源" clearable>
                                    <el-option v-for="(item,index) in goods_source"
                                               :key="index"
                                               :label="item.label"
                                               :value="item.value"></el-option>
                                </el-select>
                                <el-select v-model="search_form.shipping" clearable placeholder="是否包邮" clearable>
                                    <el-option v-for="(item,index) in goods_shipping"
                                               :key="index"
                                               :label="item.label"
                                               :value="item.value"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="">
                                <el-select v-model="search_form.cate_v1" placeholder="请选择一级分类" clearable
                                           @change="searchCateV2()" filterable>
                                    <el-option v-for="item in search_cate_v1" :key="item.id" :label="item.name"
                                               :value="item.id"></el-option>
                                </el-select>
                                <el-select v-model="search_form.cate_v2" placeholder="请选择二级分类" clearable
                                           @change="searchCateV3()" filterable>
                                    <el-option v-for="item in search_cate_v2" :key="item.id" :label="item.name"
                                               :value="item.id"></el-option>
                                </el-select>
                                <el-select v-model="search_form.cate_v3" placeholder="请选择三级分类" clearable  filterable>
                                    <el-option v-for="item in search_cate_v3" :key="item.id" :label="item.name"
                                               :value="item.id"></el-option>
                                </el-select>
                            </el-form-item>
                            <br>
                            <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="origin_rate"></el-option>
                                    <el-option label="营销价格" value="profit"></el-option>
                                    <el-option label="指导价格" value="origin_price"></el-option>
                                    <el-option label="营销利润率" value="profit_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-col>
                                    <el-input type="text" placeholder="商品名称" v-model="search_form.word"></el-input>
                                </el-col>
                            </el-form-item>
                            <el-form-item label="">
                                <el-col>
                                    <el-input type="text" placeholder="店铺名称"
                                              v-model="search_form.supplier_name"></el-input>
                                </el-col>
                            </el-form-item>
                            <el-form-item label="">
                                <el-col>
                                    <el-input type="text" placeholder="店铺id"
                                              v-model="search_form.supplier_id"></el-input>
                                </el-col>
                            </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-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-select v-model="search_form.is_display" clearable placeholder="上下架"
                                               clearable>
                                        <el-option v-for="(item,index) in is_display"
                                                   :key="index"
                                                   :label="item.label"
                                                   :value="item.value"></el-option>
                                    </el-select>
                                    <el-select v-model="middleground_configuration_id" clearable placeholder="中台配置项">
                                        <el-option v-for="(item,index) in middleground_configuration"
                                                   :key="index"
                                                   :label="item.title"
                                                   :value="item.id"></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">
                            <div>
                                <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_at'?'#29BA9C':'#333'}"
                                     @click="changeOrderBy('created_at')">
                                    <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=='sales'?'#29BA9C':'#333'}"--}}
{{--                                     @click="changeOrderBy('sales')">--}}
{{--                                    <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="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="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="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>
                            <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.image_url" :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 || '0']]</div>
                                            </div>
                                            <div class="box-li-price-one">
                                                <div>利润率</div>
                                                <div style="color:#FF0000">[[item.origin_rate || '0']]%</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 || '0']]</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||'0']]</div>
                                            </div>
                                            <div class="box-li-price-one">
                                                <div>市场价</div>
                                                <div style="color:#FF0000">￥[[item.market_price||'0']]</div>
                                            </div>
                                            <div class="box-li-price-one">
                                                <div>推荐品牌</div>
                                                <div style="color:#FF0000">[[item.recommend_brand_str||'--  ']]</div>
                                            </div>
                                            <div class="box-li-price-one">
                                                <div>推荐分类</div>
                                                <div style="color:#FF0000">[[item.recommend_category_str||'--']]</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>


                            <!-- 表格end -->
                        </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]]个，因条件限制该操作只能导入前2500款商品
                    </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?:'{}' !!};
            let topic_id = {!! $topic_id !!};

            return {
                middleground_configuration:{},//中台配置数组
                middleground_configuration_id:0,
                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: '',
                    is_display:1,
                    topic_id: topic_id
                },
                category_page: {
                    pageIndex: 1,
                    pageSize: 20,
                },
                category_form: {
                    id_v1: "",
                    id_v2: "",
                    id_v3: "",
                    fid_v1: "",
                    fid_v2: "",
                },
                is_display:[
                    {
                        value: 1,
                        label: '上架',
                    },
                    {
                        value: 2,
                        label: '下架',
                    }
                ],
                goods_source: [
                    {
                        value: 'all',
                        label: '全部',
                    },
                    {
                        value: 'zt', //中台传0
                        label: '中台',
                    },
                    {
                        value: 1,
                        label: '云仓',
                    },
                    {
                        value: 2,
                        label: '京东',
                    }, {
                        value: 6,
                        label: '阿里'
                    }, {
                        value: 7,
                        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.getMiddlegroundConfiguration();
        },
        methods: {
            getMiddlegroundConfiguration(){
                this.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.middleground-configuration.get-middleground-configurations') !!}').then(function (response) {
                    if (response.data.result) {
                        this.middleground_configuration = response.data.data;
                        this.middleground_configuration_id = this.middleground_configuration[0].id;
                        this.getGoodsList({search: {topic_id: this.search_form.topic_id}});
                        this.changeSource();
                    } else {
                        this.$message({message: response.data.msg, type: 'error'});
                    }
                }, function (response) {
                    this.$message({message: response.data.msg, type: 'error'});
                })
            },
            // 获得商品列表
            getGoodsList(json) {
                json['middleground_configuration_id'] = this.middleground_configuration_id;
                var that = this;
                that.all_loading = true;
                that.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.goods-import.goods-pagination') !!}', json).then(response => {

                    if (response.data.result == 1) {

                        that.list = response.data.data.data;
                        that.list.forEach((item, index) => {
                            that.list[index].is_choose = 0;
                        })

                        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.list= [];
                        that.current_page = 1;
                        that.per_size = 1;
                        that.total = 0;
                        that.$message.error(response.data.msg);
                        that.all_loading = false;
                    }
                }), function (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) {
                // if(page-this.current_page>=7){
                //     this.$message.error("只能跳转7页之内");
                //     var current_page = this.current_page;
                //     $(".el-pager li").each(function () {
                //         if($(this).text() == current_page){
                //             $(this).click();
                //         }
                //     })
                //     return
                // }
                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;
                }
                // if(this.current_page>100){
                //     this.current_page = 100
                // }

                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;

            },

            // 一级分类改变
            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.yz-supply.admin.goods-import.getChildrenCategory') !!}', {
                    'source': source,
                    'parent_id': parent_id,
                    'middleground_configuration_id':this.middleground_configuration_id
                }).then(response => {
                    if (response.data.result == 1) {
                        this.search_cate_v2 = response.data.data;
                    }
                }), function (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.yz-supply.admin.goods-import.getChildrenCategory') !!}', {
                    'source': source,
                    'parent_id': parent_id,
                    'middleground_configuration_id':this.middleground_configuration_id
                }).then(response => {

                    if (response.data.result == 1) {
                        this.search_cate_v3 = response.data.data;
                    }
                }), function (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 = that.search_form.source;
                // 'source':source
                that.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.goods-import.getChildrenCategory') !!}', {middleground_configuration_id:this.middleground_configuration_id}).then(response => {

                    if (response.data.result == 1) {

                        that.search_cate_v1 = response.data.data;
                    }
                }), function (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;

                        that.goods_source.push(item);
                    });
                } else {
                    that.goods_source = [
                        {
                            value: '',
                            label: '全部',
                        },
                        {
                            value: 2,
                            label: '京东',
                        }, {
                            value: 6,
                            label: '阿里'
                        }, {
                            value: 7,
                            label: '天猫'
                        }, {
                            value: 1,
                            label: '云仓'
                        }];

                }

            },


            // 一级标签改变
            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,
                    middleground_configuration_id:this.middleground_configuration_id
                };

                this.list.forEach((item, index) => {
                    if (item.is_choose) {
                        json.goods_ids.push(item.id)
                    }
                })

                that.is_import_disabled = true;
                that.all_loading = true;
                that.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.goods-import.select') !!}', json).then(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) {

                    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,
                    middleground_configuration_id:this.middleground_configuration_id
                };
                that.is_import_disabled = true;
                that.all_loading = true;
                this.all_import_disabled = true
                that.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.goods-import.all-select') !!}', json).then(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) {

                    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')