screen/public/assets/js/backend/goods.js

define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefined, Backend, Table, Form) {

    var Controller = {
        index: function () {
            // 初始化表格参数配置
            Table.api.init({
                extend: {
                    index_url: 'goods/index' + location.search,
                    add_url: 'goods/add',
                    edit_url: 'goods/edit',
                    del_url: 'goods/del',
                    multi_url: 'goods/multi',
                    import_url: 'goods/import',
                    bind_url: 'goods/bind_goods',
                    statistics_url: 'goods/goods_statistics',
                    amount_rank_url: 'goods/goods_buy_rank',
                    order_amount_rank_url: 'goods/order_amount_rank',
                    order_num_rank_url: 'goods/order_num_rank',
                    copy_url: 'goods/copy',
                    table: 'goods',
                }
            });
            let extend=$.fn.bootstrapTable.defaults.extend
            var table = $("#table");

            // 初始化表格
            table.bootstrapTable({
                url: $.fn.bootstrapTable.defaults.extend.index_url,
                pk: 'id',
                sortName: 'id',
                searchFormVisible:true,
                columns: [
                    [
                        {checkbox: true},
                        {field: 'id', title: __('Id')},
                        {field: 'name', title: __('Name'),formatter: Table.api.formatter.content,width:200,operate: 'like'},
                        {field: 'category.name', title: __('分类'),formatter: Table.api.formatter.label,operate: "like"},
                        {field: 'brand', title: __('Brand'),operate: 'like'},
                        //{field: 'amount', title: __('售价'), operate:'BETWEEN'},
                        //{field: 'amount_kill', title: __('Amount_kill'), operate:'BETWEEN'},
                        {field: 'is_hot', title: __('Is_hot'),formatter:Table.api.formatter.label,searchList:{0:'否',1:'是'}},
                        {field: 'is_kill', title: __('Is_kill'),formatter:Table.api.formatter.label,searchList:{0:'否',1:'是'}},
                        {field: 'is_level_discount', title: __('参与会员折扣'),formatter:Table.api.formatter.label,searchList:{0:'否',1:'是'}},
                        {field: 'status', title: __('状态'),formatter:Table.api.formatter.label,searchList:goodsStatus},
                        {field: 'sku', title: __('库存预警'),operate: false,formatter(sku,goods){
                            let a=[],
                                stock=goods.is_kill?'num_stock':'num_stock_kill'
                                /*sku.forEach(item=>{
                                    if(item.num_stock>0 && item.num_stock<=10){
                                        a.push(`<div class="bg-yellow" style="margin-top: 5px;">${item.name}库存：${item.num_stock}</div>`)
                                    }else if(item.num_stock===0){
                                        a.push(`<div class="bg-gray" style="margin-top: 5px;">${item.name}库存：${item.num_stock}</div>`)
                                    }else{
                                        a.push(`<div class="bg-green" style="margin-top: 5px;">${item.name}库存：${item.num_stock}</div>`)
                                    }
                                })
                                return a.join('')*/
                                if(goods.num_stock===0){
                                    return `<a class="label label-danger"">是</a>`
                                }else if(goods.num_stock<=10){
                                    return `<a class="label label-warning"">是</a>`
                                }else{
                                    return `<a class="label label-success"">否</a>`
                                }
                            }},
                        {field: 'num_sell', title: __('Num_sell')},
                        {field: 'create_time', title: __('Create_time'),formatter: Table.api.formatter.datetime,addClass:'datetimerange'},
                        //{field: 'update_time', title: __('Update_time'),formatter: Table.api.formatter.datetime,addClass:'datetimerange'},

                        {field:'',title:'统计',table: table,events: Table.api.events.operate,formatter: Table.api.formatter.buttons,operate: false,
                            buttons:[
                                {
                                    name: 'detail',
                                    text: __('商品组合'),
                                    title: __('商品组合'),
                                    classname: 'btn btn-xs btn-primary btn-dialog btn-operation',
                                    icon: 'fa',
                                    url: extend.bind_url,
                                    callback: function (data) {
                                    },
                                    visible: function (row) {
                                        return table.data('operate-bind_goods');
                                    }
                                },
                                {
                                    name: 'detail',
                                    text: __('数据统计'),
                                    title: __('数据统计'),
                                    classname: 'btn btn-xs btn-info btn-dialog btn-operation btn-operation-mt10',
                                    icon: 'fa',
                                    url: extend.statistics_url,
                                    extend:`data-area='["800px","80%"]'`,
                                    callback: function (data) {
                                    },
                                    visible: function (row) {
                                        return table.data('operate-buy_rank');
                                    }
                                },
                                {
                                    name: 'detail',
                                    text: __('采购金额排名'),
                                    title: __('采购金额排名'),
                                    classname: 'btn btn-xs btn-info btn-dialog btn-operation btn-operation-mt10',
                                    icon: 'fa',
                                    url: extend.amount_rank_url,
                                    extend:`data-area='["800px","80%"]'`,
                                    callback: function (data) {
                                    },
                                    visible: function (row) {
                                        return table.data('operate-buy_rank');
                                    }
                                },
                                {
                                    name: 'detail',
                                    text: __('订单金额排名'),
                                    title: __('订单金额排名'),
                                    classname: 'btn btn-xs btn-info btn-dialog btn-operation btn-operation-mt10',
                                    icon: 'fa',
                                    url: extend.order_amount_rank_url,
                                    extend:`data-area='["800px","80%"]'`,
                                    callback: function (data) {
                                    },
                                    visible: function (row) {
                                        return table.data('operate-order_amount_rank');
                                    }
                                },
                                {
                                    name: 'detail',
                                    text: __('订单笔数排名'),
                                    title: __('订单笔数排名'),
                                    classname: 'btn btn-xs btn-info btn-dialog btn-operation btn-operation-mt10',
                                    icon: 'fa',
                                    url: extend.order_num_rank_url,
                                    extend:`data-area='["800px","80%"]'`,
                                    callback: function (data) {
                                    },
                                    visible: function (row) {
                                        return table.data('operate-order_num_rank');
                                    }
                                },
                                {
                                    name: 'detail',
                                    text: __('复制商品'),
                                    title: __('复制商品'),
                                    confirm: __('复制此商品?'),
                                    classname: 'btn btn-xs btn-danger btn-ajax btn-operation btn-operation-mt10',
                                    icon: 'fa',
                                    url: extend.copy_url,
                                    extend:`data-area='["800px","80%"]'`,
                                    success: function (data) {
                                        $('.btn-refresh').trigger('click')
                                    },
                                    visible: function (row) {
                                        return table.data('operate-copy');
                                    }
                                },
                            ]},
                        {field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate},
                    ]
                ],
                onLoadSuccess(){
                    setTimeout(()=>{
                        $('.btn-editone').attr('data-area','["900px","100%"]')
                    },100)
                }
            });

            $(document).on('click','.bindGoods',function (){
                let id=$(this).data('id')
                Fast.api.open(extend.bind_url+`/id/${id}`,'绑定商品')
            })

            // 为表格绑定事件
            Table.api.bindevent(table);
        },
        add: function () {
            this.editor()
        },
        edit: function () {
            this.editor(1)
        },
        goods_statistics(){
            //Controller.api.bindevent();
            Form.events.daterangepicker($('.form'))
            $('.doSearch').click(()=>{
                layer.load()
            })
        },
        goods_buy_rank(){
            Table.api.init()
            var table = $("#table");
            // 初始化表格
            table.bootstrapTable({
                url: location.href,
                pk: 'id',
                sortName: 'id',
                searchFormVisible:true,
                showExport:false,
                commonSearch:true,
                search:false,
                columns: [
                    [
                        {field: 'rank', title: __('排名'),operate:false,},
                        {field: 'nickname', title: __('用户名'),operate:false,},
                        {field: 'amount', title: __('金额'),operate:false,},
                        {field: 'date', title: __('时间'),operate:'range',addClass:'datetimerange',visible:false},
                    ]
                ]
            });
            Table.api.bindevent(table);
        },
        order_amount_rank(){
            Table.api.init()
            var table = $("#table");
            // 初始化表格
            table.bootstrapTable({
                url: location.href,
                pk: 'id',
                sortName: 'id',
                searchFormVisible:true,
                showExport:false,
                commonSearch:true,
                search:false,
                columns: [
                    [
                        {field: 'rank', title: __('排名'),operate: false,},
                        {field: 'order_no', title: __('订单号'),operate: false,},
                        {field: 'nickname', title: __('用户名'),operate: false,},
                        {field: 'amount', title: __('金额'),operate: false,},
                        {field: 'date', title: __('时间'),operate:'range',addClass:'datetimerange',visible:false},
                    ]
                ]
            });
            Table.api.bindevent(table);
        },
        order_num_rank(){
            Table.api.init()
            var table = $("#table");
            // 初始化表格
            table.bootstrapTable({
                url: location.href,
                pk: 'id',
                sortName: 'id',
                searchFormVisible:true,
                showExport:false,
                commonSearch:true,
                search:false,
                columns: [
                    [
                        {field: 'rank', title: __('排名'),operate: false,},
                        {field: 'nickname', title: __('用户名'),operate: false,},
                        {field: 'num', title: __('笔数'),operate: false,},
                        {field: 'date', title: __('时间'),operate:'range',addClass:'datetimerange',visible:false},
                    ]
                ]
            });
            Table.api.bindevent(table);
        },
        editor(isEdit){
            let app=new Vue({
                el:'#app',
                data(){
                    return {
                        form:row||{
                            is_hot:0,
                            is_kill:0,
                            is_level_discount:0,
                            is_fix:0,
                            status:1,
                            is_ni:1,
                            logo:[],
                            video:null,
                            size:[],
                            sku:[],
                            detail:{},
                            service:[{name:null,value:null}],
                        },
                        category:category,
                        status:status,
                        logoLength:5,
                        idx:1,
                        isLoad:false,
                        rules:{
                            name:[{required:true,message:'此项必须'}],
                            category_id:[{required:true,message:'此项必须'}],
                            brand:[{required:true,message:'此项必须'}],
                            describe:[{required:true,message:'此项必须'}],
                            logo:[{required:true,message:'此项必须'},{type:'array',min:1,message: '请上传'}],
                            size:[{required:true,message:'此项必须'}],
                            sku:[{required:true,message:'此项必须'}],
                        }
                    }
                },
                mounted(){
                    Controller.api.bindevent();
                },
                filters:{
                    showName(key){
                    }
                },
                methods:{
                    addImg(type, index, multiple) {
                        let that = this;
                        let ext
                        if(type==='image'){
                            ext='image/*'
                        }else if(type==='video'){
                            ext='video/mp4'
                        }
                        parent.Fast.api.open(`general/attachment/select?mimetype=${ext}&multiple=` + multiple, "选择图片", {
                            callback: function (data) {
                                switch (type) {
                                    case "image":
                                        data.url.split(',').forEach(item=>{
                                            if(that.form.logo.length<that.logoLength) {
                                                that.form.logo.push(item)
                                            }
                                        })
                                        break;
                                    case "video":
                                        that.form.video=data.url
                                        break;
                                }
                            }
                        });
                        return false;
                    },
                    delImg(index) {
                        this.form.logo.splice(index,1)
                    },
                    delVideo(){
                        this.form.video=null
                    },
                    addMain(){
                        let idx=this.form.size.length+1
                        this.form.size.push({
                            type:'',
                            names:[],
                        })
                        /*this.$set(this.form.size,idx,{
                            type:null,
                            names:{},
                        })*/
                    },
                    delMain(idx){
                        this.$delete(this.form.size,idx)
                        this.buildSku()
                    },
                    addName(spec){
                        this.$prompt('请输入名称', '提示', {
                            confirmButtonText: '确定',
                            cancelButtonText: '取消',
                            inputErrorMessage: '请输入',
                            inputPattern:/\S+/
                        }).then(({value})=>{
                            for (let i=0;i<Object.values(this.form.size).length;i++){
                                for (let a=0;a<Object.values(this.form.size[i].names).length;a++){
                                    if(this.form.size[i].names[a].name==value){
                                        this.$message.error('名称已存在')
                                        return false
                                    }
                                }
                            }
                            spec.names.push({
                                name:value,
                                temp_id:Date.now().toString(),
                            })
                            this.buildSku()
                        })
                    },
                    changeName(item,idx,item_idx){
                        this.$prompt('请输入名称', '提示', {
                            confirmButtonText: '确定',
                            cancelButtonText: '取消',
                            inputErrorMessage: '请输入',
                            inputPattern:/\S+/,
                            inputValue:item.name
                        }).then(({value})=>{
                            for (let i=0;i<Object.values(this.form.size).length;i++){
                                for (let a=0;a<Object.values(this.form.size[i].names).length;a++){
                                    if(this.form.size[i].names[a].name==value && i!==idx && a!==item_idx){
                                        this.$message.error('名称已存在')
                                        return false
                                    }
                                }
                            }
                            item.name=value
                            this.buildSku()
                        })
                    },
                    buildSku(){
                        this.setTableList()
                    },
                    /**
                     * 设置表格数据 该方法在新增规格、新增规格值、规格和规格值的文本改变都要调用
                     */
                    setTableList(){
                        let newList=[];
                        this.getRowList(null,0,newList,null)
                        this.form.sku=newList;
                    },
                    /**
                     * 获取行数据 specList规格集合 tableList表格集合
                     * @param specValues 多规格值通过逗号拼接组成每一行唯一值
                     * @param specIndex 规格索引
                     * @param newList 新表格数据
                     * @param temp_ids
                     */
                    getRowList(specValues,specIndex,newList,temp_ids){
                        if(specIndex<this.form.size.length){
                            this.form.size[specIndex].names.forEach((t)=>{
                                let newValues=(specValues===null?t.name:(specValues+","+t.name))
                                let new_temp_ids=(temp_ids===null?t.temp_id:(temp_ids+","+t.temp_id))
                                //当前规格值，一直往下规格值循环完
                                this.getRowList(newValues,specIndex+1,newList,new_temp_ids)
                            })
                            //当添加新规格（第二个规格的时候）没有规格值时，默认一个空值
                            if(this.form.size[specIndex].names.length===0 && specValues!==null){
                                let newValues=specValues+","
                                let new_temp_ids=temp_ids+","
                                this.getRowList(newValues,specIndex+1,newList,new_temp_ids)
                            }
                        }
                        //当最后规格的规格值循环到最后后添加行数据
                        else{
                            //判断表格行数据是否已经存在，存在直接添加不创建新行
                            let row = this.form.sku.find((r)=>{
                                //return r.specValues.split(',').sort().toString()===specValues.split(',').sort().toString()
                                let eq=r.temp_ids.split(',').sort().toString() === temp_ids.split(',').sort().toString()
                                return eq
                            });
                            if(row){
                                specValues.split(',').forEach((c,index)=>{
                                    row["sku-"+index]=c
                                })
                                row.specValues=specValues
                                newList.push({...row})
                            }
                            else{
                                //默认的字段
                                row = {
                                    size:specIndex,
                                    specValues:specValues,
                                    temp_ids:temp_ids,
                                    num_stock:0,
                                    num_stock_kill:0,
                                    amount_cost:0,
                                    amount_ladder:[
                                        {
                                            min:null,
                                            max:null,
                                            amount:null,
                                        }
                                    ],
                                    amount_kill_ladder:[
                                        {
                                            min:null,
                                            max:null,
                                            amount:null,
                                        }
                                    ],
                                    detail:[
                                        {
                                            name:null,
                                            value:null,
                                        }
                                    ],
                                    is_down:0,
                                    num_max:0,
                                }
                                //通过规格值循环出规格值列数
                                specValues.split(',').forEach((c,index)=>{
                                    row["sku-"+index]=c
                                })
                                newList.push(row);
                            }
                        }
                    },
                    nameChange(idx,name){
                        //console.log(this.form.sku,this.sku)
                        this.setTableList()
                    },
                    delSize(spec,idx){
                        //this.$delete(spec.names,idx)
                        spec.names.splice(idx,1)
                        this.setTableList()
                    },
                    addLadder(ladder){
                        ladder.push({min:null,max:null,amount:null})
                        this.$forceUpdate()
                    },
                    delLadder(ladder,idx){
                        if(ladder.length>1) {
                            ladder.splice(idx, 1)
                        }
                        this.$forceUpdate()
                    },
                    addDetail(arr){
                        arr.push({name:null,value:null})
                    },
                    delDetail(arr,idx){
                        arr.splice(idx, 1)
                    },
                    addService(){
                        this.form.service.push({name:null,value:null})
                    },
                    delService(idx){
                        this.form.service.splice(idx, 1)
                    },
                    saveGoods(){
                        this.form.content=$('#c-content').val()
                        if(!this.form.content){
                            layer.msg('请填写商品详情')
                            return
                        }
                        let _this=this
                        this.$refs.form.validate(v=>{
                            if(!v){
                                layer.msg('请填写商品信息')
                                return
                            }
                            this.isLoad=true
                            let form=JSON.stringify(this.form)
                            $.ajax('',{
                                type:'post',
                                data:form,
                                dataType:"json",
                                headers:{
                                    'content-type':'application/json'
                                },
                                success({code,msg}){
                                    if(code){
                                        parent.document.getElementsByClassName('btn-refresh')[0].click()
                                        Fast.api.close()
                                    }else{
                                        layer.alert(msg)
                                    }
                                },
                                error(){
                                    layer.alert('服务器错误')
                                },
                                complete(){
                                    _this.isLoad=false
                                }
                            })
                        })
                    },
                    makeDown(sku){
                        let val=sku.is_down?0:1
                        this.$set(sku,'is_down',val)
                        this.$message.success(`${val?'下架':'上架'}成功`)
                    }
                }
            })
        },
        api: {
            bindevent: function () {
                Form.api.bindevent($("form[role=form]"));
            }
        },
        bind_goods(){
            Controller.api.bindevent();
            $('.skuItem input[type=radio]').change(function (){
                getGoods(goods.id,this.value)
            })

            let getGoods=(goods_id,sku_id)=>{
                let idx=layer.load()
                $.post('',{e:'get',sku_id,goods_id},function (res){
                    if(res.data.length) {
                        $('#c-name').val(res.data.join(','))
                    }else{
                        $('#c-name').selectPageClear()
                    }
                    $('#c-name').selectPageRefresh();
                    layer.close(idx)
                })
            }

            $('.firstSku').trigger('click')
        }
    };
    return Controller;
});