アプリのレコードをスプレッドシートに反映して帳票出力させたいです

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

下記の記事を参考に、請求書アプリを作成し、レコードの内容をスプレッドシートに反映させ、帳票出力したいと考えております。

発生した問題やエラーメッセージを具体的に書きましょう

ページ下部のほうの「Googleログイン」ボタンをクリック後、「帳票出力」ボタンが出現するのですが、クリックしても何の反応もありません。

原因を探しても不慣れなため解決できずお手上げ状態です(>_<):sweat_drops:

問題がありそうと思い当たるのが、
「請求先会社名」や「住所」など、会社情報は別アプリからルックアップで引用しているため、なにかしらの手を加えないといけないのでは。。?でもどうすればいいかわからないという状態です:sweat_drops:

皆様お忙しいところ恐れ入りますが、お力添えいただけますと幸いです(>_<)

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

(☆☆は伏字です)

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

前半のコードは必要な箇所(スプレッドシートIDなど)は編集しましたが、他はそのままなので割愛させていただきます。

// 請求リストをSpreadSheet用の配列に変更
const productArray = record.請求明細.value.map((item) => [
  item.value.日付.value,
  item.value.内訳1.value,
  item.value.内訳2.value,
  null,
  null,
  item.value.数量.value,
  item.value.単価.value

]);

// スプレッドシートに出力するデータの設定
const batchUpdateSpreadsheetRequestBody = {
  valueInputOption: 'RAW',
  data: [
    {
      range: '\'Invoice\'!A1:A5',
      majorDimension: 'COLUMNS',
      values: [
        [
          record.請求先会社名.value,
          record.送付先肩書き.value,
          record.郵便番号.value,
          record.住所.value,
          record.住所2.value
        ]
      ]
    },
    {
      range: '\'Invoice\'!F5:H7',
      majorDimension: 'ROWS',
      values: [
        [
          record.請求書番号.value,
          null,
          record.作成日時.value
        ],
        [],
        [
          null,
          null,
          record.有効期限.value
        ]
      ]
    },
    {
      range: '\'Invoice\'!A12',
      majorDimension: 'COLUMNS',
      values: [
        [
          record.請求先会社名.value + '御中'
        ]
      ]
    },
    {
      range: '\'Invoice\'!G13:G13',
      majorDimension: 'COLUMNS',
      values: [
        [
          record.担当者.value
        ]
      ]
    },
    {
      range: '\'Invoice\'!B41:B41',
      majorDimension: 'COLUMNS',
      values: [
        [record.備考.value]
      ]
    },
    {
      range: '\'Invoice\'!A21:G38',
      majorDimension: 'ROWS',
      values: productArray
    }
  ]
};

// スプレッドシートへの出力実行
const request = gapi.client.sheets.spreadsheets.values.batchUpdate(params, batchUpdateSpreadsheetRequestBody);
request.then((response) => {
  alert('帳票出力に成功しました。');
}, (reason) => {
  alert('エラー: ' + reason.result.error.message);
});

};

// レコード詳細画面の表示後イベント
kintone.events.on(‘app.record.detail.show’, (event) => {
// ボタン増殖回避
if (document.getElementById(‘print_button’) !== null) {
return event;
}

// Googleログインボタン作成
const loginButton = document.createElement('button');
loginButton.id = 'login_button';
loginButton.textContent = 'Googleログイン';
loginButton.style.visibility = 'hidden';

// Googleログアウトボタン作成
const logoutButton = document.createElement('button');
logoutButton.id = 'logout_button';
logoutButton.textContent = 'Googleログアウト';
logoutButton.style.visibility = 'hidden';

// 帳票出力ボタン作成
const printButton = document.createElement('button');
printButton.id = 'print_button';
printButton.textContent = '帳票出力';
printButton.style.visibility = 'hidden';

// 各ボタンに機能を持たせる
logoutButton.addEventListener('click', handleLogoutClick);
loginButton.addEventListener('click', handleLoginClick);
printButton.addEventListener('click', () => {
  printInvoice(event);
});

// スペースフィールドに各ボタンを設置
kintone.app.record.getSpaceElement('print_button_space').appendChild(loginButton);
kintone.app.record.getSpaceElement('print_button_space').appendChild(logoutButton);
kintone.app.record.getSpaceElement('print_button_space').appendChild(printButton);

// Googleログイン準備
initClient();
return event;

});
})();

その後いかがですか:eyes:!?

ブラウザの開発者ツールのコンソールに、
ボタンを押したあとになにか表示されたりしませんか??

どこがおかしいのかを探すのに、↓こちら参考になるとおもいます!