予実管理アプリのカスタマイズについて

実現したいこと
サブテーブルの値をカスタマイズビューで表示させたい

発生した問題やエラーメッセージを具体的に書きましょう
業務に応用できればと考え、 こちらを参考にいくつかコードを変更しました。
予算アプリと実績アプリの集計表をカスタマイズビューに表示する - cybozu developer network
それまでは正常に表示されていることが確認できたものの、実績管理アプリ内で拠点レコードをテーブル内に移し替えたところ、カスタマイズビューに表示されなくなってしまいました。

テーブル内に拠点を入れた理由
→実績登録時拠点には番号を入れて、番号に紐づく件名(文字列)も一緒に表示したいと思っているため。

この部分を書き換えたところ表示されなくなりました⇓
const makeYojitsuData = (records,tableRecords,opt_data, opt_i) => {
let i = opt_i || 0; // レコードのカウント
const allData = opt_data || ; // 予実の集計結果
const appId = kintone.app.getId(); // 実績管理アプリID
let key2, key4, key5, key6;

const key1 = tableRecords[0].value['拠点'].value;

質問がざっくりしていたため、修正して再度質問させていただきました。お手数おかけしますが、ご教示いただけますと幸いです。

実行したコードをコピー&ペーストしましょう(コード全体です)

  • カスタマイズビューのサンプルプログラム
  • Copyright (c) 2016 Cybozu
  • Licensed under the MIT License
  • https://opensource.org/license/mit/
    */
    jQuery.noConflict();
    (($) => {

‘use strict’;
// 予算管理アプリを全レコード取得
const fetchRecords = (app_yosan, opt_offset, opt_limit, opt_records) => {
const offset = opt_offset || 0;
const limit = opt_limit || 100;
let allRecords = opt_records || ;
const params = {app: app_yosan, query: ‘order by レコード番号 asc limit ’ + limit + ’ offset ’ + offset};
return kintone.api(kintone.api.url(’/k/v1/records’, true), ‘GET’, params).then((resp) => {
allRecords = allRecords.concat(resp.records);
if (resp.records.length === limit) {
return fetchRecords(app_yosan, offset + limit, limit, allRecords);
}
return allRecords;
});
};
// 予実管理データのカスタマイズビュー用データの作成
const makeYojitsuData = (records,tableRecords,opt_data, opt_i) => {
let i = opt_i || 0; // レコードのカウント
const allData = opt_data || ; // 予実の集計結果
const appId = kintone.app.getId(); // 実績管理アプリID
let key2, key4, key5, key6;

const key1 = tableRecords[0].value['拠点'].value;

key2 = records[i]['件名'].value;
key2 = key2.replace(/</g, '&lt;').replace(/>/g, '&gt;');

const key3 = records[i]['予算'].value;

const params = {app: appId, query: '拠点 = "' + key1 + '"'};
return kintone.api(kintone.api.url('/k/v1/records', true), 'GET', params).then((resp) => {
  if (resp.records) {
    key4 = 0;
    const obj = resp.records;
    for (let j = 0; j < obj.length; j++) {
      key4 += parseInt(obj[j]['実績合計'].value, 10);
    }
    key5 = parseInt(key3, 10) - parseInt(key4, 10);
    key6 = parseInt(key4, 10) / parseInt(key3, 10) * 100;
    key6 = key6.toFixed(2);
    key6 += '%';
    allData.push({segment: key1, segment2: key2, budget: key3,  results: key4, Difference: key5, AchievementRate: key6});
  } else {
    event.error = '実績管理情報が取得できません。';
  }
  i += 1;
  if (records.length !== i) {
    return makeYojitsuData(records, allData, i);
  }
  return allData;
});

};
// 差異のマイナス値を赤色に変更
const cellDesign = () => {
$(‘#view tr td’).each((index, elm) => {
if ($(this).hasClass(‘Difference_class’)) {
if ($(this).text().indexOf(‘-’) > -1) {
$(this).css(‘color’, ‘#ff0000’);
}
}
});

};
// 予実管理のカスタマイズビューを取得
const dispYojitsuCustomizeView = (records) => {
makeYojitsuData(records).then((data) => {
// 列の設定
const colModelSettings = [
{name: ‘segment’,
index: ‘segment’,
width: 200,
align: ‘center’,
classes: ‘segment_class’},
{name: ‘segment2’,
index: ‘segment2’,
width: 800,
align: ‘left’,
classes: ‘segment2_class’},
{name: ‘budget’,
index: ‘budget’,
width: 200,
align: ‘right’,
classes: ‘budget_class’,
formatter: ‘currency’,
sorttype: ‘float’},
{name: ‘results’,
index: ‘results’,
width: 200,
align: ‘right’,
classes: ‘results_class’,
formatter: ‘currency’,
sorttype: ‘float’},
{name: ‘Difference’,
index: ‘Difference’,
width: 200,
align: ‘right’,
classes: ‘Difference_class’,
formatter: ‘currency’,
sorttype: ‘float’},
{name: ‘AchievementRate’,
index: ‘AchievementRate’,
width: 150,
align: ‘center’,
classes: ‘AchievementRate_class’,
sorttype: ‘float’}
];
// 列の表示名
const colNames = [‘予算番号’, ‘予算件名’,‘予算’, ‘実績’, ‘残額’, ‘達成率’];
$(‘#view’).jqGrid({
data: data,
datatype: ‘local’,
colNames: colNames,
colModel: colModelSettings,
rowNum: 10,
rowList: [1, 10, 20],
caption: ‘予算執行状況表’,
height: ‘auto’,
width: 1100,
pager: ‘pager’,
shrinkToFit: true,
viewrecords: true,
gridComplete: () => {
cellDesign();
}
});
});
};
// イベント処理
kintone.events.on([‘app.record.index.show’], (event) => {
const app_yosan = kintone.app.getLookupTargetAppId(‘拠点’); // 予算管理アプリID
fetchRecords(app_yosan).then((records) => {
dispYojitsuCustomizeView(records);
});
});

})(jQuery);

コードをここに入力または貼り付け

その後上手く行きましたでしょうか??

コードを書く場合はコードブロックを使うと見やすくなるのでよいですよ。

さて、ルックアップをテーブルにれたようですが、テーブル外のフィールドとテーブル内のフィールドとでは扱いがだいぶ異なります。

このあたりの記事を参考にされるとよいかもしれません:eyes:
答えではなくて申し訳ないですが、挑戦してみてくださいね!