-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
95 lines (85 loc) · 2.89 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
<html>
<head>
<title>Inspect Github Issues of Atom Repository</title>
</head>
<body>
<div id="app" class="container">
<br>
<h1>Bienvenue!</h1>
<h3>This simple page is built to make your life easier while searching for specific issues of <a href="https://github.com/atom/atom">Atom repository</a> on Github.com</h3>
<hr>
<responses></responses>
</div>
<footer class="center">
<center>
<hr>
Istanbul, May 2018
</center>
</footer>
<!-- Componenet Template -->
<template id="responses-template">
<div>
<h3>Not So Cool Query Builder</h3>
<span><strong>State:</strong>
<select v-model="selectedState">
<option disabled value="">Please select one</option>
<option>open</option>
<option>closed</option>
<option>all</option>
</select>
{{ selectedState }}
</span>
<br>
<span><strong>Labels:</strong> </span>
<div style="max-height:300px;overflow:auto">
<div v-for="label in labels" >
<input type="checkbox" v-bind:id="label.id" v-bind:value="label.name" v-model="checkedLabels">
{{label.name}}
</div>
</div>
<hr>
<span><em>Checked labels:</em>{{ checkedLabels }}</span>
<br>
<span><strong>Sort:</strong>
<select v-model="selectedSort">
<option disabled value="">Please select one</option>
<option>created</option>
<option>updated</option>
<option>comments</option>
</select>
{{ selectedSort }}
</span>
<p><strong>Direction ascending:</strong> <input type="checkbox" id="checkbox" v-model="direction"></p>
<button v-on:click="initiateQuery"> Create Query & Fetch Issues</button>
<hr>
<h3>Here are the fetched issues.</h3>
<table>
<thead>
<tr>
<th>Title</th>
<th>Comments</th>
<th>Created At</th>
<th>Updated At</th>
</tr>
</thead>
<tbody>
<tr v-for="issue in issues">
<td><a v-bind:href="issue.html_url">{{issue.title}}</a></td>
<td>{{issue.comments}}</td>
<td>{{issue.created_at}}</td>
<td>{{issue.updated_at}}</td>
</tr>
</tbody>
</table>
</div>
</template>
<!-- Import Vue.js and my application -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.3.3/vue.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.16.1/axios.js"></script>
<script src="app.js"></script>
<!-- Import the UI framework -->
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic">
<link rel="stylesheet" href="//cdn.rawgit.com/necolas/normalize.css/master/normalize.css">
<link rel="stylesheet" href="//cdn.rawgit.com/milligram/milligram/master/dist/milligram.min.css">
</body>
</html>