Garoon 予定表の画面から、kintone アプリを作ってみます。
概要
rex0220 アプリマイスター・レイ で、kintone アプリ画面からアプリを作成できたので、「Garoonからも出来んじゃねぇ！」ということで、やってみました。
※rex0220 アプリマイスター・レイ 画面からアプリ作成
ちゃんと項目を再現してくれますね。
カレンダー形式の一覧画面も追加してくれています。
- Garoon 予定の登録
- 画面の上部だけのスクリーンショットです。
- 作成された予定表アプリ
- カレンダー一覧も
アプリ作成
アプリマイスター・レイへのプロンプト
Garoon 予定の登録の画面を添付して、プロンプトで作成をお願いします。
Garoon の予定表と同じような予定表アプリを作って
1回目のスクリプト実行（エラー）
アプリのアイコン設定に問題があったようです。
エラー内容をコピペすると、対応してくれます。
修正版スクリプト
/**
* 🦊 kintone App Meister Ray's Work
* Project: スケジュール管理（Garoonライク・修正版）
* Description: アイコン指定を修正 (CALENDAR -> APP72)
*/
(async () => {
try {
console.log('🦊 レイ: スケジュールアプリの構築（修正版）を開始します！');
// 1. 新規アプリの作成
const createAppBody = { name: 'スケジュール' };
const createResp = await kintone.api(kintone.api.url('/k/v1/preview/app', true), 'POST', createAppBody);
const appId = createResp.app;
console.log(`Step 1: アプリを作成しました (ID: ${appId})`);
// 2. 基本設定（アイコン修正箇所★）
const settingsBody = {
app: appId,
name: 'スケジュール',
description: 'Garoonライクな予定管理アプリです。',
// ★ここを修正しました: 'CALENDAR' -> 'APP72' (有効なプリセットキー)
icon: { type: 'PRESET', key: 'APP72' },
theme: 'WHITE'
};
await kintone.api(kintone.api.url('/k/v1/preview/app/settings', true), 'PUT', settingsBody);
console.log('Step 2: アイコンとテーマを設定しました');
// 3. フィールド追加
const fieldsBody = {
app: appId,
properties: {
'予定種別': {
type: 'RADIO_BUTTON', label: '予定種別', code: '予定種別',
options: {
'通常予定': { label: '通常予定', index: 0 },
'期間予定': { label: '期間予定', index: 1 }
},
defaultValue: '通常予定', required: true
},
'開始日時': {
type: 'DATETIME', label: '開始日時', code: '開始日時',
required: true, defaultNowValue: true
},
'終了日時': {
type: 'DATETIME', label: '終了日時', code: '終了日時',
required: true, defaultNowValue: true
},
'終日': {
type: 'CHECK_BOX', label: 'オプション', code: '終日',
options: { '終日': { label: '終日', index: 0 } }
},
'タイトル': {
type: 'SINGLE_LINE_TEXT', label: 'タイトル', code: 'タイトル', required: true
},
'参加者': {
type: 'USER_SELECT', label: '参加者', code: '参加者',
defaultValue: [{ type: "FUNCTION", code: "LOGINUSER()" }]
},
'共有先': {
type: 'ORGANIZATION_SELECT', label: '共有先', code: '共有先'
},
'詳細': {
type: 'MULTI_LINE_TEXT', label: '詳細・メモ', code: '詳細'
}
}
};
await kintone.api(kintone.api.url('/k/v1/preview/app/form/fields', true), 'POST', fieldsBody);
console.log('Step 3: フィールドを追加しました');
// 4. レイアウト設定
const layoutBody = {
app: appId,
layout: [
{ type: 'ROW', fields: [
{ type: 'DATETIME', code: '開始日時' },
{ type: 'LABEL', label: '～', size: { width: 60 } },
{ type: 'DATETIME', code: '終了日時' },
{ type: 'CHECK_BOX', code: '終日' }
]},
{ type: 'ROW', fields: [ { type: 'RADIO_BUTTON', code: '予定種別' } ]},
{ type: 'ROW', fields: [ { type: 'SINGLE_LINE_TEXT', code: 'タイトル' } ]},
{ type: 'ROW', fields: [ { type: 'HR', size: { width: 600 } } ]},
{ type: 'ROW', fields: [
{ type: 'USER_SELECT', code: '参加者' },
{ type: 'ORGANIZATION_SELECT', code: '共有先' }
]},
{ type: 'ROW', fields: [ { type: 'MULTI_LINE_TEXT', code: '詳細', size: { innerHeight: 150 } } ]}
]
};
await kintone.api(kintone.api.url('/k/v1/preview/app/form/layout', true), 'PUT', layoutBody);
console.log('Step 4: レイアウトを整えました');
// 5. 一覧設定（カレンダー）
const viewsBody = {
app: appId,
views: {
'カレンダー': {
type: 'CALENDAR', name: 'カレンダー', index: 0,
date: '開始日時', title: 'タイトル', filterCond: '', sort: '開始日時 asc'
},
'一覧（全て）': {
type: 'LIST', name: '一覧（全て）', index: 1,
fields: ['開始日時', '終了日時', '予定種別', 'タイトル', '参加者', '共有先'],
sort: '開始日時 desc'
}
}
};
await kintone.api(kintone.api.url('/k/v1/preview/app/views', true), 'PUT', viewsBody);
console.log('Step 5: カレンダー一覧を設定しました');
// 6. アプリ公開
await kintone.api(kintone.api.url('/k/v1/preview/app/deploy', true), 'POST', { apps: [{ app: appId }] });
console.log('-------------------------------------------------------');
console.log('🎉 レイ: 修正完了です！');
console.log(`新規作成されたアプリID: ${appId}`);
console.log('アイコンもカレンダーのものになっているはずです！');
console.log('-------------------------------------------------------');
} catch (error) {
console.error('🦊 レイ: まだエラーが出ますか？念のため内容を見せてください。', error);
if (error.error) console.error(JSON.stringify(error.error, null, 2));
}
})();
修正版スクリプトの実行
console 画面で実行した結果、アプリ作成成功です。
まとめ
要件の似たアプリの画像を張り付けると、kintone アプリを作ってくれそうですね。