複数の関連レコードの小計をそれぞれ行いたい

[okada (oka)]

何を実現したいのかを書きましょう

・複数の関連レコードの小計をそれぞれ行いたい
アプリに工事費と広告費の関連レコードが存在します。
下記の記事を参考にし工事費の集計はスペースtotalAmountにできましたが、続けて広告費をスペースtotalAmount2に集計しようとしたところ反映できませんでした。

スクリプトファイルは一つではなく工事費と広告費でそれぞれ作成しています。

スペースIDの使い方が間違っていると思うのですが、ご教示のほどお願いいたします。

関連レコードの項目を条件付きで集計

実行したコードをコピー＆ペーストしましょう

/*

• total related records
• Copyright (c) 2018 Cybozu
• Licensed under the MIT License
  */
  (() => {
  ‘use strict’;

const events = [
‘app.record.detail.show’,
‘app.record.edit.show’
];
kintone.events.on(events, (event) => {
const clientRecordId = event.recordId;
const relatedAppId = kintone.app.getRelatedRecordsTargetAppId(‘関連レコード一覧_16’);
const query = 部門="${event.record['部門'].value}"and 種類 in ("広告費");
const outputFields = [‘金額’];
const appUrl = kintone.api.url(‘/k/v1/records’);

const params = {
  app: relatedAppId,
  query: query,
  fields: outputFields
};

const elementId = 'totalAmount2';

kintone.api(appUrl, 'GET', params, (resp) => {
  let amount = 0;
  for (let i = 0; i < resp.records.length; i++) {
    amount += parseFloat(resp.records[i].金額.value);
  }

 const divTotalAmount = document.createElement('div');
  const wString = String(amount.toFixed(0).replace(/(\d)(?=(\d\d\d)+(?!\d))/g, '$1,'));
  divTotalAmount.style.fontWeight = 'bold';
  divTotalAmount.style.textAlign = 'right';
  divTotalAmount.style.fontSize = 12;
  divTotalAmount.innerHTML = `¥${wString}-`;
  kintone.app.record.getSpaceElement(elementId).appendChild(divTotalAmount);
  return event;
});

});
})();

[pomo]

const elementId = 'TotalAmount2';

totalAmount2になってないからですかね

[okada (oka)]

申し訳ありません。本文が誤っていました。
広告費の集計を反映させたいスペースはTotalAmount2になっております。

[pomo]

queryの部分もバッククォートで囲われてないのでそこも大丈夫でしょうか？
エラーの文言はどのように表示されていますか？

[pomo]

(() => {
		"use strict";
		const events = [
			"app.record.detail.show",
			"app.record.edit.show"
		];
		kintone.events.on(events, (event) => {
			const elementId = 'TotalAmount2';

			const divTotalAmount = document.createElement('div');
			divTotalAmount.innerHTML = "test"
			kintone.app.record.getSpaceElement(elementId)?.appendChild(divTotalAmount)
			return event;
		});
	})();

まずはこちらでtestという文字がスペース位置に表示されるか試してみてください。

[okada (oka)]

お手数をお掛けします。
エラー表示のやり方もわからない初心者で大変申し訳ありません。

こんなメッセージが出ていましたが、testの表示はなりました。

[pomo]

下記にリンクにもありますが、F12で開発ツールを開いてどのようなエラーがでてるのか確認してみてください。このはじめようJavaScriptにわかりやすく掲載されてるのでイントロダクションから一通り目を通していただくといいかと思います。
はじめよう JavaScript アウトプット方法／DOM操作／基本文法

testの表示がでているので、今回問題視されていたスペースIDの使い方は問題ないかと思います。ですのでエラーがでているとするとその前の部分になるかと思います。

※追記
エディタエラーは私が追加した行末尾にセミコロンついてないので警告でてます。すみません

[okada (oka)]

かしこまりました。
参考にさせていただきます。

[pomo]

(() => {
		"use strict";
		const events = ["app.record.detail.show", "app.record.edit.show"];
		kintone.events.on(events, (event) => {
			console.log("hello")
			const relatedAppId = kintone.app.getRelatedRecordsTargetAppId("関連レコード一覧_16");
			const query = `物件名称 = "${event.record['部門'].value}" and 種類 in ("広告費")`;
			const outputFields = ["金額"];

			const params = {
				app: relatedAppId,
				query: query,
				fields: outputFields
			};

			const elementId = 'TotalAmount2';

			(async () => {
				const resp = await kintone.api(kintone.api.url('/k/v1/records', true), 'GET', params);
				let amount = 0;
				for (let i = 0; i < resp.records.length; i++) {
					amount += parseFloat(resp.records[i].金額.value);
				}

				const divTotalAmount = document.createElement('div');
				const wString = String(amount.toFixed(0).replace(/(\d)(?=(\d\d\d)+(?!\d))/g, '$1,'));
				divTotalAmount.style.fontWeight = 'bold';
				divTotalAmount.style.textAlign = 'right';
				divTotalAmount.style.fontSize = "12";
				divTotalAmount.innerHTML = `¥${wString}-`;
				kintone.app.record.getSpaceElement(elementId)?.appendChild(divTotalAmount);
			})()
			return event;
		});
	})();

ざっと組んだのでものとしてはこれで動くかなと思います。async/awaitについては先程のチュートリアルで確認してみてください

[okada (oka)]

pomo様

ご丁寧にコードを頂きありがとうございます。
お手数おかけして申し訳ありません。

無事集計することができました。

今後自身でも勉強していきたいと思います。