zoukankan      html  css  js  c++  java
  • 电商商品规则属性sku 工具类

    /**
     * 商品模块;
     * 使用:var SKU = sku.init({ id:'sku', item: item, data:data });
     * @config item = [{"id":1,"name":"职位","sub":[{"id":1,"name":"adc"},{"id":2,"name":"辅助"},{"id":3,"name":"战士"}]},{"id":2,"name":"知名度","sub":[{"id":4,"name":"50%"},{"id":5,"name":80%"},{"id":6,"name":"90%"}]}];
     * @param data = [{"ids":[{"1":"1"},{"2":"4"}],"price":0,"stock":0,"sku":0}];
     * **/
    layui.define(['jquery','form'],function(e){
        "use strict";var $ = layui.jquery,form=layui.form,o ={
            c : {sv:'',iv:'',tv:'',item:[],itemed:[],data:[],tableTitleId:[],tableTitle:[],tableTd:[]},
            z:function (x,y,a) {
                for(var i=0;i<a.length;i++){if( x+'_'+y == a[i] ) return 'checked';} return '';
            },
            y:function (s,d,a,h) {
                for(var i=0;i<d.length;i++){ h += '<input type="checkbox" data-id="'+s+'_'+d[i].id+'" title="'+d[i].name+'" lay-skin="primary" lay-filter="item"'+ this.z(s,d[i].id,a) +'>';} return h;
            },
            x:function (d,a,h) {
                return '<div class="layui-form-item" pane><label class="layui-form-label">'+d.name+'</label><div class="layui-input-block" data-id="'+d.id+'">'+this.y(d.id,d.sub,a,'')+'</div></div>';
            },
            w:function (d,a,h) {
                for(var i=0;i<d.length;i++){ h += this.x(d[i],a,''); } return h;
            },
            st:function () {
                return '<table class="layui-table" lay-skin="" style="margin:0"><thead>'+this.sth()+'</thead><tbody>'+this.stb()+this.stf()+'</tbody></table>';
            },
            sth:function () {
                var h = '<tr>'; for(var i=0;i<this.c.tableTitle.length;i++){ h += '<th>' +this.c.tableTitle[i]+ '</th>';} h += '<th>价格</th><th>库存</th><!--<th>货号</th>--></tr>'; return h;
            },
            stb:function () {
                var t =this, h = '', na = [];
                for(var i=0;i<t.c.data.length;i++){
                    h += '<tr>';
                    for(var s=0;s<t.c.data[i].ids.length;s++){
                        var k = '',v='';
                        for(var item in t.c.data[i].ids[s]){
                            k = item; v = t.c.data[i].ids[s][item];
                        }
                        if(!na[k] || na[k]<1){
                            na[k] = this.ai(t.c.data[i].ids[s][item],this.c.tableTd);
                            if(na[k]>0){
                                h += '<td rowspan="'+na[k]+'">';
                                h += this.gin(item,t.c.data[i].ids[s][item]);
                                h += '</td>';
                            }
                        }
                        na[k] --;
                    }
                    h += '<td><input class="layui-input layui-table-input" data-index="'+i+'" data-type="price" lay-filter="input"  value="'+t.c.data[i].price+'" ></td>';
                    // h += '<td><input class="layui-input layui-table-input" data-index="'+i+'" data-type="stock" lay-filter="input" value="'+t.c.data[i].stock+'" ></td>';
                    h += '<td><input class="layui-input layui-table-input" data-index="'+i+'" data-type="sku" lay-filter="input" value="'+t.c.data[i].sku+'" ></td>';
                    h += '</tr>';
                }
                return h;
            },
            stf:function () {
                if(this.c.data.length < 2) return '';
                return '<tr><th colspan="'+this.c.tableTitle.length+'" style="text-align: center">批量修改</th><th><input type="text" class="layui-input layui-table-input" lay-filter="input" data-type="sku-price" /></th><!--<th><input type="text" class="layui-input layui-table-input" lay-filter="input" data-type="sku-stock" /></th>--><th><input type="text" class="layui-input layui-table-input" lay-filter="input" data-type="sku-sku" /></th></tr>';
            },
            gin:function (a,b) {
                for( var i=0;i<this.c.item.length;i++){
                    if(a == this.c.item[i].id){
                        for(var x=0;x<this.c.item[i].sub.length;x++){
                            if( this.c.item[i].sub[x].id == b ) return this.c.item[i].sub[x].name;
                        }
                    }
                }
                return '';
            },
            ai:function (a,b) {
                for(var i=0;i<b.length;i++){
                    for(var s=0;s<b[i].length;s++){
                        if(a == b[i][s]){
                            var c = 1;
                            for(var y=i+1;y<b.length;y++){
                                c *= (b[y].length);
                            }
                            return c;
                        }
                    }
                }
                return 0;
            },
            inArray:function (s,a) { if(s && a && a.length>0){ for(var i=0;i<a.length;i++){ if(s == a[i]) return true; } } return false; },
            citd:function (i,b) {
                if(b && !this.inArray(i,this.c.itemed)) { this.c.itemed.push(i);return;}
                if(!b && this.c.itemed.indexOf(i) > -1) {this.c.itemed.splice(this.c.itemed.indexOf(i),1);return;}
            },
            cd:function () {
                var it = this.c.itemed;
                var ids = this.c.tableTitleId;
                var arr = [];
                if(it.length<1) return;
                for(var i=0;i<ids.length;i++){
                    for(var s=0;s<it.length;s++){
                        var kv = it[s].split('_');
                        if( kv[0] == ids[i] ) {
                            if(!arr[i]) arr[i] = [];
                            arr[i].push( kv[1] );
                        }
                    }
                }
                this.c.tableTd = arr;
                var sarr = [[]];
                for (var i = 0; i < arr.length; i++) {
                    var tarr = [];
                    for (var j = 0; j < sarr.length; j++)
                        for (var k = 0; k < arr[i].length; k++)
                            tarr.push(sarr[j].concat(arr[i][k]));
                    sarr = tarr;
                }
                var narr = [];
                for( var i=0;i<sarr.length;i++ ){
                    var tarr = {};
                    tarr['ids'] = [];
                    for(var ii=0;ii<sarr[i].length;ii++){
                        var obj = {};
                        obj[ ids[ii] ] = sarr[i][ii];
                        tarr['ids'].push( obj );
                    }
                    var rr = this.ced(tarr['ids']);
                    tarr['price'] = rr['price'];
                    // tarr['stock'] = rr['stock'];
                    tarr['sku'] = rr['sku'];
                    narr.push(tarr);
                }
                this.c.data = JSON.parse(JSON.stringify(narr));
            },
            ced:function(ids){
                var arr = [];arr['price']=0;arr['stock']=0;arr['sku']=0;
                var nd = [];
                for(var i=0;i<ids.length;i++){
                    for(var d in ids[i]) nd.push(d+'_'+ids[i][d]);
                }
                var sd = [];
                for(var i=0;i<this.c.data.length;i++){
                    sd[i] = [];
                    ids = this.c.data[i].ids;
                    for(var s=0;s<ids.length;s++){
                        for(var d in ids[s]) sd[i].push(d+'_'+ids[s][d]);
                    }
                    // 比对数据
                    var is = true;
                    for(var s=0;s<nd.length;s++){
                        if(this.inArray(nd[s],sd[i])){
                            is = is * true;
                        }else{
                            is = is * false;
                        }
                    }
                    if(is){
                        arr['price'] = parseFloat(this.c.data[i].price);
                        // arr['stock'] = parseInt(this.c.data[i].stock);
                        arr['sku'] = this.c.data[i].sku;
                        return arr;
                    }
                }
                return arr;
            },
            sod:function () {
                this.c.itemed.sort(function (v1,v2) {
                    var kv1 = v1.split('_');
                    var kv2 = v2.split('_');
                    if(parseInt(kv1[0]) < parseInt(kv2[0])) return -1;
                    if(parseInt(kv1[0]) > parseInt(kv2[0])) return 1;
                    if(parseInt(kv1[1]) < parseInt(kv2[1])) return -1;
                    if(parseInt(kv1[1]) > parseInt(kv2[1])) return 1;
                    return 0;
                });
            },
            stt:function (d,a) {
                var t = this,d = t.c.item,a = t.c.itemed;
                t.c.tableTitleId = [];t.c.tableTitle = [];
                for(var i=0;i<d.length;i++){
                    for(var ii=0;ii<d[i].sub.length;ii++){
                        if( t.inArray( d[i].id+'_'+d[i].sub[ii].id , a) && !t.inArray( d[i].id , t.c.tableTitleId )){
                            t.c.tableTitle.push(d[i].name);
                            t.c.tableTitleId.push(d[i].id);
                        }
                    }
                }
                return;
            },
            listenInput:function () {
                var t = this;
                $('input[lay-filter]').on('change',function (e) {
                    var v = $(this).val();
                    var p = $(this).attr('data-type');
                    var i = $(this).attr('data-index');
                    if(p=='sku' && t.c.data[i]) t.c.data[i].sku = v;
                    if(p=='price' && t.c.data[i]) t.c.data[i].price = isNaN(parseFloat(v))?0:parseFloat(v);
                    // if(p=='stock' && t.c.data[i]) t.c.data[i].stock = isNaN(parseInt(v))?0:parseInt(v);
                    if(p=='sku-sku'){ for(var k=0;k<t.c.data.length;k++) t.c.data[k].sku = v+(k+1);}
                    if(p=='sku-price'){ for(var k=0;k<t.c.data.length;k++) t.c.data[k].price = isNaN(parseFloat(v))?0:parseFloat(v);}
                    // if(p=='sku-stock'){ for(var k=0;k<t.c.data.length;k++) t.c.data[k].stock = isNaN(parseInt(v))?0:parseInt(v);}
                    t.rl();
                })
            },
            listen:function () {
                var t = this;
                form.on('checkbox(item)', function(data){
                    var id = $(data.elem).attr('data-id');
                    t.citd(id,data.elem.checked);
                    t.sod();
                    t.stt();
                    t.cd();
                    t.rl();
                });
                this.listenInput();
            },
            getItem:function () {
                return this.c.item;
            },
            getData:function () {
                console.log(111111)
                console.log(this.c.data)
                return this.c.data;
            },
            si:function (d) {
                for(var i=0;i<d.length;i++){
                    if(d[i].ids){
                        for(var ii=0;ii<d[i].ids.length;ii++){
                            for(var k in d[i].ids[ii]){
                                if(!this.inArray(k+'_'+d[i].ids[ii][k],this.c.itemed)) this.c.itemed.push(k+'_'+d[i].ids[ii][k]);
                            }
                        }
                    }
                }
            },
            f:function (c) {
                var s=new Date().getTime(),t = this;
                t.c.sv = c.id?c.id:'sku';
                t.c.iv = c.itemelem?c.itemelem:'item-'+s;
                t.c.tv = c.tableelem?c.tableelem:'table-'+s;
                t.c.item = c.item?c.item:[];
                t.c.data = c.data?JSON.parse(JSON.stringify(c.data)):[];
                t.c.itemed = [];
                if(t.c.data){t.si(t.c.data);t.sod();t.stt();t.cd();}
            },
            rl:function () {
                $('#'+this.c.tv).html(this.st());
                this.listenInput();
            },
            l:function () {
                $('#'+this.c.sv).append('<div id="'+this.c.iv+'">'+this.w(this.c.item,this.c.itemed,'')+'</div>');
                $('#'+this.c.sv).append('<div class="layui-form-item" pane><label class="layui-form-label">商品</label><div class="layui-input-block" id="'+this.c.tv+'">'+this.st()+'</div></div></div>');
                form.render('checkbox');this.listen();
            },
            init:function (c) {this.f(c);this.l();return o;}
        };o.v = '1.0.0'; e('sku', o);
    });

    html 部分::

    <!-- 商品测试 -->
    <div style="display:none;" id="sku" data-item="" data-data=""></div>
    <div class="layui-form-item" pane>
    <label class="layui-form-label"></label>
    <div class="layui-input-inline" id="data-html">
    </div>
    </div>
    <!--<div class="layui-form-item">
    <div class="layui-input-inline">
    <a class="layui-btn" id="_get">修改</a>
    </div>
    </div>-->
    js部分::
    console.log(JSON.stringify(data.data))
    $("#sku").html("");
    item=data.data;
    var data = [{"ids":[{"1":"1"},{"2":"2"}],"price":0,"stock":0,"sku":0}];//加载默认数据
    SKU = sku.init({ id:'sku', item: item, data:data });
    $("#_get").click(function () {
    var data1=SKU.getData();//获取sku 数据
    var data2=SKU.getItem();//获取sku 数据
    property_ids=data1;
    $('#data-html').html(JSON.stringify(data1))
    });
  • 相关阅读:
    Torchkeras,一个源码不足300行的深度学习框架
    【知乎】语义分割该如何走下去?
    【SDOI2017】天才黑客(前后缀优化建图 & 最短路)
    【WC2014】紫荆花之恋(替罪羊重构点分树 & 平衡树)
    【SDOI2017】相关分析(线段树)
    【学习笔记】分治法最短路小结
    【CH 弱省互测 Round #1 】OVOO(可持久化可并堆)
    【学习笔记】K 短路问题详解
    【学习笔记】浅析平衡树套线段树 & 带插入区间K小值
    【APIO2020】交换城市(Kruskal重构树)
  • 原文地址:https://www.cnblogs.com/caozengling/p/9165262.html
Copyright © 2011-2022 走看看