背景・実現したいこと
予算・実績管理アプリを下記のようにカスタマイズしました。
予算管理アプリのフォーム
年月…作成日時から関数で年月をとってくる
部署名…プルダウンで選択
名前…ユーザー選択
予算…手入力
実績管理アプリのフォーム
年月…ルックアップで予算管理から取得。同時に部署名、担当者をコピーしてくる
実績…手入力
按分割合…プルダウンで選択
個人AP…自動計算(実績×按分割合)
実績管理アプリで、以下のような表を表示させたいです。
年月 部署 担当者 予算 個人AP 差異 達成率
サンプルのコードを書き換えたのですが、何も表示されなくなってしまいました。
どこが間違っているのか、ご教示いただけないでしょうか。
利用したソースコード
/*
* カスタマイズビューのサンプルプログラム
* Copyright (c) 2016 Cybozu
*
* Licensed under the MIT License
* https://opensource.org/licenses/mit-license.php
*/
jQuery.noConflict();
(function($) {
‘use strict’;
// 予算管理アプリを全レコード取得
function fetchRecords(appId, opt_offset, opt_limit, opt_records) {
var app_yosan = kintone.app.getLookupTargetAppId(‘年月’); // 予算管理アプリID
var offset = opt_offset || 0;
var limit = opt_limit || 100;
var allRecords = opt_records || [];
var 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(function(resp) {
allRecords = allRecords.concat(resp.records);
if (resp.records.length === limit) {
return fetchRecords(appId, offset + limit, limit, allRecords);
}
return allRecords;
});
}
// 予実管理データのカスタマイズビュー用データの作成
function makeYojitsuData(records, opt_data, opt_i) {
var i = opt_i || 0; // レコードのカウント
var allData = opt_data || []; // 予実の集計結果
var appId = kintone.app.getId(); // 実績管理アプリID
var key1, key2, key3, key4, key5, key6, key7;
key1 = records[i][‘年月’].value;
key1 = key1.replace(/</g, ‘<’).replace(/>/g, ‘>’);
key2 = records[i][‘部署’].value;
key3 = records[i][‘担当者’].value;
key4 = records[i][‘予算’].value;
var params = {‘app’: appId, ‘query’: ‘年月 = "’ + key1 + ‘"’};
return kintone.api(kintone.api.url(‘/k/v1/records’, true), ‘GET’, params).then(function(resp) {
if (resp.records) {
key5 = 0;
var obj = resp.records;
for (var j = 0; j < obj.length; j++) {
key5 += parseInt(obj[j][‘個人AP’].value, 10);
}
key6 = parseInt(key5, 10) - parseInt(key4, 10);
key7 = parseInt(key5, 10) / parseInt(key4, 10) * 100;
key7 = key7.toFixed(2);
key7 += ‘%’;
allData.push({nengetsu: key1, busyo: key2, tantosya: key3, yosan: key4, kojinAP: key5, sai: key6, tasseiritsu: key7});
} else {
event.error = ‘実績管理情報が取得できません。’;
}
i += 1;
if (records.length !== i) {
return makeYojitsuData(records, allData, i);
}
return allData;
});
}
// 差異のマイナス値を赤色に変更
function cellDesign() {
$(‘#view tr td’).each(function(index, elm) {
if ($(this).hasClass(‘tasseiritsu_class’)) {
if ($(this).text().indexOf(‘-’) > -1) {
$(this).css(‘color’, ‘#ff0000’);
}
}
});
}
// 予実管理のカスタマイズビューを取得
function dispYojitsuCustomizeView(records) {
makeYojitsuData(records).then(function(data) {
// 列の設定
var colModelSettings = [
{name: ‘nengetsu’,
index: ‘nengetsu’,
width: 300,
align: ‘center’,
classes: ‘nengetsu_class’},
{name: ‘busyo’,
index: ‘busyo’,
width: 200,
align: ‘right’,
classes: ‘busyo_class’,
formatter: ‘currency’,
sorttype: ‘float’},
{name: ‘tantosya’,
index: ‘tantosya’,
width: 200,
align: ‘right’,
classes: ‘tantosya_class’,
formatter: ‘currency’,
sorttype: ‘float’},
{name: ‘yosan’,
index: ‘yosan’,
width: 200,
align: ‘right’,
classes: ‘yosan_class’,
formatter: ‘currency’,
sorttype: ‘float’},
{name: ‘kojinAP’,
index: ‘kojinAP’,
width: 150,
align: ‘center’,
classes: ‘kojinAP_class’,
sorttype: ‘float’}
{name: ‘sai’,
index: ‘sai’,
width: 150,
align: ‘center’,
classes: ‘sai_class’,
sorttype: ‘float’}
{name: ‘tasseiritsu’,
index: ‘tasseiritsu’,
width: 150,
align: ‘center’,
classes: ‘tasseiritsu_class’,
sorttype: ‘float’}
];
// 列の表示名
var colNames = [‘年月’, ‘部署’, ‘担当者’, ‘予算’, ‘個人AP’,‘差異’,達成率];
$(‘#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: function() {
cellDesign();
}
});
});
}
// イベント処理
kintone.events.on([‘app.record.index.show’], function(event) {
var appId = kintone.app.getId(); // 実績管理アプリID
fetchRecords(appId).then(function(records) {
dispYojitsuCustomizeView(records);
});
});
})(jQuery);