当前位置: 首页 > news >正文

遍历数组,将数组中key值相同的对象合并

  定义一个空数组接收汇总
  const TotalData = [];
  // 拿到明细数据 tempData 进行遍历
  tempData.forEach((value, key) => {
    //判断过滤后的数组是否为空
    if (TotalData.length == 0) {
      TotalData.push(value);
    } else {
      TotalData.forEach((valueIndex, keyIndex) => {
        if (valueIndex.itemCode && valueIndex.itemCode !== value.itemCode) {
          TotalData.push(value);
        } else if (
          valueIndex.itemCode &&
          valueIndex.itemCode === value.itemCode
        ) {
          // 含税金额
          valueIndex.totalAmt = valueIndex.totalAmt + value.totalAmt;
          // 含税金额本位币
          valueIndex.totalCurAmt =
            valueIndex.totalCurAmt + value.totalCurAmt;
          //  不含税金额
          valueIndex.exclTaxAmt = valueIndex.exclTaxAmt + value.exclTaxAmt;
          //  不含税金额本位币
          valueIndex.exclTaxCurAmt =
            valueIndex.exclTaxCurAmt + value.exclTaxCurAmt;
          //  税额
          valueIndex.taxAmt = valueIndex.taxAmt + value.taxAmt;
          //  税额本位币
          valueIndex.taxCurAmt = valueIndex.taxCurAmt + value.taxCurAmt;
        }
      });
    }
  });

在这里插入图片描述
就是封装一下

  sum = async (data) => {
    var arrayFilted = [];
    data.forEach(function (value, key) {
      //判断过滤后的数组是否为空
      if (arrayFilted.length == 0) {
        console.log('222');
        arrayFilted.push(value);
        console.log('arrayFilted');
      } else {
        console.log('333');
        arrayFilted.forEach(function (valueIndex, keyIndex) {
          console.log(valueIndex);
          if (valueIndex.itemCode && valueIndex.itemCode !== value.itemCode) {
            console.log('444');
            arrayFilted.push(value);
          } else if (
            valueIndex.itemCode &&
            valueIndex.itemCode === value.itemCode
          ) {
            console.log('555');
            valueIndex.qty = valueIndex.qty + value.qty;
            // 含税金额
            valueIndex.totalAmt += value.totalAmt;
            // 含税金额本位币
            valueIndex.totalCurAmt += valueIndex.totalCurAmt;
            //  不含税金额
            valueIndex.exclTaxAmt += valueIndex.exclTaxAmt;
            //  不含税金额本位币
            valueIndex.exclTaxCurAmt += valueIndex.exclTaxCurAmt;
            //  税额
            valueIndex.taxAmt = valueIndex.taxAmt + value.taxAmt;
            //  税额本位币
            valueIndex.taxCurAmt = valueIndex.taxCurAmt + value.taxCurAmt;
          }
        });
      }
    });
    await this.state.getDetailTableRef.clearRows();
    await this.state.getDetailTableRef.addRows(arrayFilted);
    await this.forDataArr(arrayFilted);
    return arrayFilted;
  };

注意的是,当我们编辑的时候可能就不能用这个方法了,因为我们不知道那个弹框是两级层所以用里一个方法,但是大差不差。

如图,也就是当我新增时候,点击了商品编码,然而它是个弹框所以我要判断
商品编码下的编码是否一致才可以汇总到汇总单,如果不一致就要单独计算,如果一致就求和计算展示。这里我们就要注意,拿到数据后要实时清空和添加表格数据才能做到实时更新。
在这里插入图片描述

在这里插入图片描述
代码如下
编辑了明细的某个值

  onDetailValuesChange = async (
    changedValues,
    allValues,
    record,
    formRef,
    editTableRef,
    extraData
  ) => {
    if (
      Object.keys(changedValues)[0] === 'itemCode' ||
      Object.keys(changedValues)[0] === 'qty' ||
      Object.keys(changedValues)[0] === 'exclTaxPrice' ||
      Object.keys(changedValues)[0] === 'price'
    ) {
      this.calcTotalAmt(true, extraData);
    }
  };
   calcTotalAmt = async (isDetailEditing = false, extraData: any = {}) => {
    const Assemble = this.state.editTableRef.getRows(); // 重新拿到表格数据
    this.sunArr(Assemble);
  };
  //当编辑了表格时把重新得到的表格数据 进行数据的数值相加处理
  sunArr = async (data) => {
    data.forEach((x) => {
      if (x.itemCode.itemCode) {
        x.itemCode.itemCode = x.itemCode.itemCode;
      } else {
        x.itemCode.itemCode = x.itemCode.spuCode;
      }
    });
    const newData = {};
    data.map((item) => {
      if (newData.hasOwnProperty(item.itemCode.itemCode)) {
        newData[item.itemCode.itemCode].push(item);
      } else {
        newData[item.itemCode.itemCode] = [];
        newData[item.itemCode.itemCode].push(item);
      }
    });
    let newArrData = [];
    for (let key in newData) {
      let qty = 0;
      let totalAmt = 0;
      let totalCurAmt = 0;
      let exclTaxAmt = 0;
      let exclTaxCurAmt = 0;
      let taxAmt = 0;
      let taxCurAmt = 0;
      let itemCode = '';
      let itemName = '';
      let smallCateCode = '';
      let smallCateName = '';
      newData[key].map((items) => {
        console.log(items);
        qty = items.qty + qty; // 数量;
        totalAmt = items.totalAmt + totalAmt; // 含税金额
        totalCurAmt = items.totalCurAmt + totalCurAmt; // 含税金额本位币
        exclTaxAmt = items.exclTaxAmt + exclTaxAmt; //  不含税金额
        exclTaxCurAmt = items.exclTaxCurAmt + exclTaxCurAmt; //  不含税金额本位币
        taxAmt = items.taxAmt + taxAmt; //  税额
        taxCurAmt = items.taxCurAmt + taxCurAmt; //  税额本位币
        itemCode = items.itemCode.itemCode || items.itemCode; //spuCode
        itemName = items.itemCode.spuName || items.itemName;
        smallCateCode = items.itemSource || items.smallCateCode;
        smallCateName = items.itemSourceName || items.smallCateName;
      });
      console.log(' newData[key]', newData[key]);
      newData[key] = {
        ...newData[key][0],
        qty,
        totalAmt,
        totalCurAmt,
        exclTaxAmt,
        exclTaxCurAmt,
        taxAmt,
        taxCurAmt,
        itemCode,
        itemName,
        smallCateCode,
        smallCateName
      };
      // 对象转成数组
      newArrData.push(newData[key]);
    }

    // console.log(newArrData);
    // 清空并实时创建
    await this.state.getDetailTableRef.clearRows();
    await this.state.getDetailTableRef.addRows(newArrData);
    await this.forDataArr(newArrData);
    return newArrData;
  };
  效果就是下边的图样,实时汇总和更新(就要删除和新增表格。)

在这里插入图片描述
只不过这样做存在有一定的缺陷,但是 效果有了。

例子

var a = [
		{
		BondKey: "010221.IB",
		BondName: "01国开21",
		amount:2000
		},
		{
		BondKey: "010221.IB",
		BondName: "01国开21",
		amount:2000
		},
		{
		BondKey: "011800642.IB",
		BondName: "18珠海港SCP002",
		amount:2000
		}
	]
console.log(a);
 
function mergeObject( array ) {
    var arrayFilted = [];
    array.forEach(function (value,key) {
      //判断过滤后的数组是否为空
      if ( arrayFilted.length == 0 ) {
        arrayFilted.push(value);
      }else{
        arrayFilted.forEach( function (valueIndex,keyIndex) {
          if (valueIndex.BondKey && valueIndex.BondKey !== value.BondKey) {
            arrayFilted.push(value);
          }else if (valueIndex.BondKey && valueIndex.BondKey === value.BondKey) {
            valueIndex.amount = valueIndex.amount + value.amount;
          }
        });
      }
    });
    return arrayFilted;
}
console.log(mergeObject(a));

这样就把3条数据柔和到一条里面去了。在这里插入图片描述

相关文章:

  • RAID磁盘阵列详细说明
  • linux下安装php的imagick扩展模块(附php升级脚本)
  • 正则校验非中文 加长度校验
  • Day8-php 文件的操作
  • toFixed() 踩坑----四舍六入 银行家算法
  • 基于.net开发chrome核心浏览器
  • juery 选择器 选择多个元素
  • Object.keys() 判断每一行的值是否相等
  • IBM公布Kitura 1.0和Bluemix Runtime for Swift 3
  • vsCode 文件保存自动格式化 设置
  • 程序员客栈携手野狗 体验国内领先的实时后端云协作
  • MyEclipse中点击Deploy MyEclipse J2EE Project to Server无响应解决方法
  • react 项目 计算列表金额 数据 汇总并实时变更
  • MongoDB学习(一)
  • Xcode8 Could not build Objective-C module 'FBSDKCoreKit'
  • [rust! #004] [译] Rust 的内置 Traits, 使用场景, 方式, 和原因
  • 【翻译】Mashape是如何管理15000个API和微服务的(三)
  • Angular 4.x 动态创建组件
  • Create React App 使用
  • Debian下无root权限使用Python访问Oracle
  • docker容器内的网络抓包
  • el-input获取焦点 input输入框为空时高亮 el-input值非法时
  • emacs初体验
  • Fabric架构演变之路
  • gulp 教程
  • pdf文件如何在线转换为jpg图片
  • Phpstorm怎样批量删除空行?
  • SAP云平台运行环境Cloud Foundry和Neo的区别
  • thinkphp5.1 easywechat4 微信第三方开放平台
  • vue2.0项目引入element-ui
  • win10下安装mysql5.7
  • Xmanager 远程桌面 CentOS 7
  • 飞驰在Mesos的涡轮引擎上
  • 技术胖1-4季视频复习— (看视频笔记)
  • 聊聊redis的数据结构的应用
  • 猫头鹰的深夜翻译:JDK9 NotNullOrElse方法
  • 文本多行溢出显示...之最后一行不到行尾的解决
  • mysql面试题分组并合并列
  • scrapy中间件源码分析及常用中间件大全
  • ​configparser --- 配置文件解析器​
  • #pragma data_seg 共享数据区(转)
  • #我与Java虚拟机的故事#连载07:我放弃了对JVM的进一步学习
  • (1)Nginx简介和安装教程
  • (html转换)StringEscapeUtils类的转义与反转义方法
  • (PHP)设置修改 Apache 文件根目录 (Document Root)(转帖)
  • (pojstep1.3.1)1017(构造法模拟)
  • (二)斐波那契Fabonacci函数
  • (更新)A股上市公司华证ESG评级得分稳健性校验ESG得分年均值中位数(2009-2023年.12)
  • (简单) HDU 2612 Find a way,BFS。
  • (三)uboot源码分析
  • (十)c52学习之旅-定时器实验
  • (四)Tiki-taka算法(TTA)求解无人机三维路径规划研究(MATLAB)
  • (转)创业的注意事项
  • .java 指数平滑_转载:二次指数平滑法求预测值的Java代码
  • .Net CoreRabbitMQ消息存储可靠机制