GASからBacklog apiで情報取得してVueで表示
GASからBacklog apiで情報取得してVueで表示:
GASからBacklog apiで情報取得してVueで表示
html表示するGASの部分
function doGet() {
var htmlOutput = HtmlService.createTemplateFromFile("index").evaluate();
htmlOutput
.setTitle('GAS+Vue.js')
.addMetaTag('viewport', 'width=device-width, initial-scale=1')
return htmlOutput;
}
html表示部分(index.html)
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<?!= HtmlService.createHtmlOutputFromFile('css').getContent(); ?>
</head>
<body>
<div id="app">
<h2>{{ tocTitle }}</h2>
<p>{{ tocDescription }}</p>
<ol>
<li v-for="list in lists"><a :href="list[1]">{{ list[0] }}</a>
<span>{{list[1]}}</span>
<span>{{list[2]}}</span>
<span>{{list[3]}}</span>
<span>{{list[4]}}</span>
<span>{{list[5]}}</span>
<span>{{list[6]}}</span>
<span>{{list[7]}}</span>
<span>{{list[8]}}</span>
</li>
</ol>
</div>
<?!= HtmlService.createHtmlOutputFromFile('js').getContent(); ?>
</body>
</html>
vueの部分 .js
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>
<script>
google.script.run.withSuccessHandler(initializeVue).getSpreadsheetValues();
function initializeVue(values){
values.shift();
new Vue({
el: '#app',
data: {
tocTitle: 'Backlog',
tocDescription: 'hogehoge',
lists: values
}
});
}
</script>
GASバックログapi呼び出し部分
function myFunction() {
var space_id = 'bokeboek';
var api_key = "hogehogheogeho"
var response = UrlFetchApp.fetch("https://"+space_id+".backlog.jp/api/v2/issues?apiKey="+api_key);
if (response.getResponseCode() != 200) {
return false;
}
var spread_sheet_id = 'XXXXXXXXX';
var target_sheet_name = 'hoge'
var target_sheet = SpreadsheetApp.openById(spread_sheet_id).getSheetByName(target_sheet_name);
//取得
var issue_list = JSON.parse(response.getContentText());
Object.keys(issue_list).forEach(function(id, idx) {
const issue = issue_list[id]
const row = idx + 2
target_sheet.getRange(row, 1).setValue(issue.issueType.name)
target_sheet.getRange(row, 2).setValue(issue.summary)
target_sheet.getRange(row, 3).setValue(issue.assignee ? issue.assignee.name : '')
target_sheet.getRange(row, 4).setValue(issue.status.name)
target_sheet.getRange(row, 5).setValue(issue.priority.name)
target_sheet.getRange(row, 6).setValue(issue.created)
target_sheet.getRange(row, 7).setValue(issue.dueDate)
target_sheet.getRange(row, 8).setValue(issue.updated)
target_sheet.getRange(row, 9).setValue(issue.createdUser.name)
})
}
コメント
コメントを投稿