根据提供的规格数据(Map<规格名称,List<规格值>>),实现生成规格商品

规格数量可以随意添加(比如由颜色,尺码,改变成颜色,尺码,材质),按照顺序,同一规格项的数据自动合并单元格,简单的实现逻辑如下

补充个效果图:

function createTable(){
			//获取生成表格需要的数据
			// alert("获取规格信息");
			var checkSpList = [];
			//规格项数据
			var specData=changeDate(checkSpList);
			//获取门店数据
			var shopData="";
			if($("#shopId").val()!=null && $("#shopId").val().length>0){
				//说明是超市
				shopDataArr=$("#shopId").val();
				$(shopDataArr).each(function(index,ele){
					shopData+=ele+",";
				});
				shopData=shopData.substring(0,shopData.length-1);

			}else{
				//说明非超市
				//判断是否有选中的门店
				if($("#shopSel").val()!=null && $("#shopSel").val()!=''){
					shopData=$("#shopSel option:selected").text()+":"+$("#shopSel").val();
				}

			}


			//开始生成表格
			var specInfoTable=$("#specInfo-table");

			//选择的规格名称
			var checkSpName = [];
			if(checkSpList.length>0){
				$(checkSpList).each(function(index,element){
					$("input[name='specId']").each(function(index,ele){
						var specId=$(ele).val();
						if(specId==element){
							var specNmae=$(ele).attr("specNmae");
							checkSpName.push(specNmae);
						}


					});
				});
			}

			if(shopData!=""){
				specData.push(shopData);
				checkSpName.push("参与门店");
			}
			if(specData.length==0){
				specInfoTable.children().remove();
				return ;
			}




			var html="";
			html+="<thead  style='top:10px;position:sticky;z-index: 888'><tr>"
			$(checkSpName).each(function(index,element){
				html+="<th style='text-align: center'>"+element+"</th>"
			});

			html+="<th style='text-align: center'>业态:</th><th style='text-align: center'>分类:</th><th style='text-align: center'>库  存: <input id='stockInfo' type='text' style='margin-left: 22px;width:100px;' value='' class='input-control number input-l' oninput='input(this)'></th><th style='text-align: center'>库存控制比例: <input id='goodsStockRatio' type='text' style='margin-left: 22px;width:80px;' value='' oninput='input(this)'></th><th style='text-align: center' >价  格:  <input id='priceInfo' type='text' style='margin-left: 22px;width:80px;' value='' oninput='input(this)'></th>";
			html+="<th>特价价格<input type='text' class='input-control number input-l' id='specPrice' name='specPrice' value='' style='margin-left: 22px;width:80px;' oninput='input(this)'></th><th>积分兑付数额<input type='text' class='input-control number input-l'  id='jfPrice'  style='margin-left: 22px;width:80px;' value='' oninput='input(this)'></th><th>兑付后剩余商品价格<input type='text' class='input-control number input-l'  id='money'  style='margin-left: 22px;width:80px;' value='' oninput='input(this)'></th>";
			// html+="<th><label class='control-label' >参与门店</label><td colspan='3' style='width: 600px;'><select id='shopId' name='shopId' class='shopName_selected' data-placeholder='请选择所属门店' style='width: 80%;height:35px;' multiple = 'multiple'></select></td></th>";
			html+="<th style='text-align: center'>是否打折<input id='dzInfo' type='checkbox'></th><th style='text-align: center'>是否热门<input id='hotInfo' type='checkbox'></th><th style='text-align: center'>是否上架<input id='marketbleInfo' type='checkbox'></th>"
			html+="</tr></thead>"
			//计算第n个规格需要跨几列
			var rowsNum=[];
			rowsNum=getRowsNum(specData);
			var code=$("#code option:selected").text()=="请选择..."?"	--    ":$("#code option:selected").text();
			var categoryName=$("#categoryName").val();
			console.error(categoryName);
			//开始循环生成表格
			var totalRows=rowsNum[0]*(specData[0].split(',').length);
			for (let i = 0; i < totalRows; i++) {
				html+="<tr>"
				//判断是否需要第几个单元格
				var specText="";
				var specId="";
				var storeSn="";

				for(let j=0;j<specData.length;j++){
					var times=Math.floor(i/rowsNum[j]);
					var index=times%(specData[j].split(',').length);
					var text=specData[j].split(',')[index].split(':')[0];
					var id=specData[j].split(',')[index].split(':')[1];
					if(!text.includes("=")){
						specText+=text+",";
						specId+=id+",";
					}else{
						storeSn=id;
					}


					if(i%rowsNum[j]==0){
						//第几次出现
						html+="<td rowspan='"+rowsNum[j]+"' style='text-align: center'>"+text+"</td>";
					}

				}
				specText=specText.substring(0,specText.length-1);
				specId=specId.substring(0,specId.length-1);
				html+="<td style='text-align: center'><input  type='text' value='"+code+"' readonly style='width: 80px'></td><td style='text-align: center'><input name='categoryName' type='text' value='"+categoryName+"' readonly style='width: 80px'></td><td><input name='stockInfo' type='text' onchange='changeStock(this)' oninput='input(this)' style='width: 80px'></td><td><input name='goodsStockRatio' type='text' onchange='changeStockRatio(this)' oninput='input(this)' style='width: 80px'></td><td><input name='priceInfo' type='text' onchange='changePrice(this)'  oninput='input(this)' style='width: 80px'></td>";
				html+="<td><input type='text' class='input-control number input-l'  name='specPrice' style='margin-left: 22px;width:100px;' oninput='input(this)' onchange='changeSpecPrice(this)'></td><td><input type='text' class='input-control number input-l' name='jfPrice'  style='margin-left: 22px;width:80px;' oninput='input(this)' onchange='changeJfPrice(this)'></td><td><input type='text' class='input-control number input-l'  name='money'  style='margin-left: 22px;width:80px;' oninput='input(this)' onchange='changeMoney(this)'></td>";
				// html+="<th><label class='control-label' >参与门店</label><td colspan='3' style='width: 600px;'><select id='shopId' name='shopId' class='shopName_selected' data-placeholder='请选择所属门店' style='width: 80%;height:35px;' multiple = 'multiple'></select></td></th>";
				html+="<td><input name='dzInfo' type='checkbox' onchange='changeDz(this)'></td><td><input name='hotInfo' type='checkbox' onchange='changeHot(this)'></td><td><input name='marketbleInfo' type='checkbox' onchange='changeMarketble(this)'><input name='specAndPriceStockInfo' type='text' hidden='hidden'  price='0.0' stock='0.0' marketble='0' isDz='0' specId='"+specId+"' storeSn='"+storeSn+"' specText='"+specText+"' specPrice='' StockRatio='' hotInfo='0'  jfPrice=''  money=''/></td></tr>";


			}
			specInfoTable.html(html);
		}

其中getRows()方法如下

function getRowsNum(specData){
			var rowsNum=[];
			var len=$(specData).length;
			var row1=1;
			for (let i = 0; i < len; i++) {
				var item=specData[i].split(',').length;
				row1*=item;
			}
			for (let i = 0; i < len; i++) {
				var item=specData[i].split(',').length;
				if(i==0){
					rowsNum[i]=row1/item;
				}else{
					rowsNum[i]=rowsNum[i-1]/item;
				}


				row1*=item;
			}
			return rowsNum;

		}

新增java实现根据提供的规格数据,实现生成规格商品

public R createTableData(String tenantId,String specId,String gName) {
        List<String> result=new ArrayList<>();
        Map<String,List<String>> map=new HashMap<>();
        map.put("颜色",Arrays.asList(new String[]{"赤","橙","黄","绿"}));
        map.put("大小",Arrays.asList(new String[]{"65","66","67","68"}));
        map.put("内存",Arrays.asList(new String[]{"128","256"}));
        map.put("版本",Arrays.asList(new String[]{"pro","plus"}));
        map.put("材质",Arrays.asList(new String[]{"k99"}));

        //选择的规格名称
        List<String> spec=new ArrayList<>();
        if(map.keySet().size()>0){
            StringBuilder sb=new StringBuilder("");
            for (String s : map.keySet()) {
                spec.add(s);
            }
        }
        //每个规格的步长
        int[] rowsNum=getRowNum(spec,map);
        int totalRows=rowsNum[0]*(map.get(spec.get(0)).size());
        for (int i = 0; i < totalRows; i++) {
            StringBuilder sb=new StringBuilder();
            for (int j = 0; j < spec.size(); j++) {
                int times=(int)(Math.floor(i/rowsNum[j]));
                int index=times%(map.get(spec.get(j)).size());
               sb.append(map.get(spec.get(j)).get(index));
            }
            String s = sb.substring(0, sb.length() - 1).toString();
            result.add(s);
        }
        return  R.data(result);
    }
private int[] getRowNum(List<String> spec,Map<String, List<String>> map) {
        int[] rowsNum=new int[spec.size()];
        int len=spec.size();
        int row1=1;
        for (int i = 0; i < len; i++) {
            int item=map.get(spec.get(i)).size();
            row1*=item;
        }
        for (int i = 0; i < len; i++) {
            int item=map.get(spec.get(i)).size();
            if(i==0){
                rowsNum[i]=row1/item;
            }else{
                rowsNum[i]=rowsNum[i-1]/item;
            }


            row1*=item;
        }
        return rowsNum;

    }

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值