teratail
回答率
85.36%
teratail header banner
teratail header banner
質問するログイン新規登録
トップに関する質問【GAS】勤怠管理システムを作成する上で、spreadsheet上で、出勤と退勤時間が同じ行に反映されない問題を解決したい。

編集履歴

質問編集履歴

7

タイトルの変更

2021/01/09 07:36

投稿

YousukeTanaka
YousukeTanaka

スコア79

test CHANGED
@@ -1 +1 @@
1
- 【GAS】勤怠管理システムを作成する上で、出勤と退勤時間が同時にspreadsheetに反映される問題を解決したい。
1
+ 【GAS】勤怠管理システムを作成する上で、spreadsheet上で、出勤と退勤時間が同じ行に反映されない問題を解決したい。
test CHANGED
@@ -160,7 +160,7 @@
160
160
 
161
161
  function doPost(e){
162
162
 
163
- const ss = SpreadsheetApp.openById(@@@@@@@');
163
+ const ss = SpreadsheetApp.openById('@@@@@@@');
164
164
 
165
165
  // スプレッドシートの中のシート名を指定して変数に格納。
166
166
 

6

画像の変更

2021/01/09 07:36

投稿

YousukeTanaka
YousukeTanaka

スコア79

test CHANGED
File without changes
test CHANGED
@@ -36,7 +36,7 @@
36
36
 
37
37
  が同じ行で表示されるようにしたいと考えています。
38
38
 
39
- ![イメージ説明](158a5f5e4982fb3f879a36685076b63d.png)
39
+ ![イメージ説明](5f4478def6a566c0508f13459136e899.png)
40
40
 
41
41
 
42
42
 

5

コードの修正

2021/01/09 07:34

投稿

YousukeTanaka
YousukeTanaka

スコア79

test CHANGED
File without changes
test CHANGED
@@ -160,9 +160,7 @@
160
160
 
161
161
  function doPost(e){
162
162
 
163
- //var url ="https://docs.google.com/spreadsheets/d/100lQIP5vzPDrgHb3DFY1zuhMkj_gswpo0kL-ksnZUXo/edit#gid=0";
164
-
165
- const ss = SpreadsheetApp.openById('1gkuaYdvJaYMjWNHteu2qsPAJzgVlPzihvjMMTQWyPWw');
163
+ const ss = SpreadsheetApp.openById(@@@@@@@');
166
164
 
167
165
  // スプレッドシートの中のシート名を指定して変数に格納。
168
166
 

4

文字の修正

2021/01/09 07:30

投稿

YousukeTanaka
YousukeTanaka

スコア79

test CHANGED
File without changes
test CHANGED
@@ -194,7 +194,7 @@
194
194
 
195
195
 
196
196
 
197
- //関数 showLastModifide の定義
197
+ //関数 attendTime() の定義
198
198
 
199
199
  function attendTime(){
200
200
 

3

タイトル、説明、コードの変更

2021/01/09 07:28

投稿

YousukeTanaka
YousukeTanaka

スコア79

test CHANGED
@@ -1 +1 @@
1
- 【GAS】google.script.runと.gsを紐付けたい。
1
+ 【GAS】勤怠管理システムを作成する上で、出勤と退勤時間が同時にspreadsheetに反映される問題を解決したい。
test CHANGED
@@ -2,17 +2,13 @@
2
2
 
3
3
  ---
4
4
 
5
- 勤怠管理システムをgasで作成しています。htmlで「出勤」と「退勤」ボタンを用意し、それぞれをクリックすれば、自動的にspreadsheetにその日付と時間が記録される仕組みです。
5
+ 勤怠管理システムをgasで作成しています。htmlで「出勤」と「退勤」ボタンを用意し、それぞれをクリックすれば、自動的にspreadsheetにその日付とスタッフID,出勤時間、退勤時間が記録される仕組みです。
6
-
7
-
8
-
9
- うまくいけば、B列、E列、F列が入力されます。また、E列が入力されれば、出勤フラグがたちます。
6
+
10
-
11
-
12
-
13
-
14
-
15
- ![イメージ説明](266e03775f10978ce6e3dce466f3779f.png)
7
+
8
+
9
+
10
+
11
+
16
12
 
17
13
 
18
14
 
@@ -20,7 +16,27 @@
20
16
 
21
17
  ---
22
18
 
23
- js.htmlで作成したjavascriptファイルがあります。このファイル内でaddEventListenerを使って、ボタンがクリックされたら、その時間を取得する処理を行なっています。その時間をgasで取得し、spreadsheetに記載したいと考えていますが、それができずにおります。特に、javascriptファイルでgoogle.script.run.関数(引数1,引数2,,)を使って、取得した値を.gsに送っていますが、その方法が間違っているようです。
19
+ 出勤ボタンをクリックすると、特定の行に、値は入りますが、出勤と退勤で行が異なる問題に直面しています。
20
+
21
+ これを修正し、出勤ボタンを押した時には、
22
+
23
+ 0. 本日の日付
24
+
25
+ 0. スタッフのID
26
+
27
+ 0. 出勤時間
28
+
29
+
30
+
31
+ 退勤ボタンを押した時には、
32
+
33
+ 0. 退勤時間
34
+
35
+
36
+
37
+ が同じ行で表示されるようにしたいと考えています。
38
+
39
+ ![イメージ説明](158a5f5e4982fb3f879a36685076b63d.png)
24
40
 
25
41
 
26
42
 
@@ -38,7 +54,7 @@
38
54
 
39
55
  <base target="_top">
40
56
 
41
- <meta charset="utf-8">
57
+ <meta charset="UTF-8">
42
58
 
43
59
  <meta viewport="width=device-width, initial-scale=1">
44
60
 
@@ -54,23 +70,45 @@
54
70
 
55
71
  <div class="container">
56
72
 
57
-
73
+ <div class="row">
74
+
58
-
75
+ <div class="col-md-8 col-md-offset-2">
76
+
77
+ <div class="row">
78
+
79
+ <div class="col-md-6">
80
+
59
- <canvas width="100%" height="500">
81
+ <canvas width="300" height="260">
60
-
82
+
61
- Canvas not supported
83
+ Canvas not supported
62
-
84
+
63
- </canvas>
85
+ </canvas>
86
+
64
-
87
+ <h1 id="time"></h1>
88
+
89
+ </div>
90
+
91
+ <div class="col-md-6">
92
+
65
- <form action="https://script.google.com/macros/s/@@@@@@/exec" method="post">
93
+ <form action="https://script.google.com/macros/s/AKfycbxPBqLtX3253ejqzTihglqYt8SifoZK9CmZwXPePj_niFIhnD9W/exec" method="post">
94
+
66
-
95
+ <label for="staffId" class="form-label">Staff ID</label>
96
+
67
- <button type="submit" id="staffId" class="btn btn-primary btn-size" name="id" value="ID">STAFF ID</button>
97
+ <input type="text" class="form-control mb-3" id="staffId" name="staffId">
68
-
98
+
69
- <button type="submit" id="attend-btn" class="btn btn-primary btn-size" name="attend" value="出勤">出勤</button>
99
+ <button type="submit" id="attend-btn" class="btn btn-primary mb-3 btn-lg" name="attend" value="出勤時間" onclick="attendTime()">出勤</button>
70
-
100
+
71
- <button type="submit" id="leave-btn" class="btn btn-primary btn-size" name="leave" value="退勤">退勤</button>
101
+ <button type="submit" id="leave-btn" class="btn btn-primary mb-3 btn-lg" name="leave" value="退勤時間" onclick="leaveTime()">退勤</button>
72
-
102
+
73
- </form>
103
+ </form>
104
+
105
+ </div>
106
+
107
+ </div>
108
+
109
+ </div>
110
+
111
+ </div>
74
112
 
75
113
  </div>
76
114
 
@@ -92,29 +130,9 @@
92
130
 
93
131
  <script>
94
132
 
95
- const attend-btn = document.getElementById('attend-btn');
96
-
97
- attend-btn.addEventListener('click', function() {
98
-
99
- const date = Utilities.formatDate(new Date(), 'Asia/Tokyo', 'yyyy/MM/dd');
100
-
101
- const attendTime = Utilities.formatDate(new Date(), 'Asia/Tokyo', 'HH:mm');
102
-
103
- google.script.run.withSuccessHandler().setTime(date,attendTime);
133
+ google.script.run.withSuccessHandler.attendTime();
104
-
105
- });
134
+
106
-
107
-
108
-
109
- const leave-btn = document.getElementById('leave-btn');
110
-
111
- leave-btn.addEventListener('click', function() {
112
-
113
- const leaveTime = Utilities.formatDate(new Date(), 'Asia/Tokyo', 'HH:mm');
114
-
115
- google.script.run.withSuccessHandler().setTime(leaveTime);
135
+ google.script.run.withSuccessHandler.leaveTime();
116
-
117
- });
118
136
 
119
137
  </script>
120
138
 
@@ -124,9 +142,9 @@
124
142
 
125
143
  ```gas
126
144
 
145
+ //doGetでindex.htmlを表示する
146
+
127
- function doGet(e){
147
+ function doGet(){
128
-
129
- setTime(id, date, attendTime, leaveTime);
130
148
 
131
149
  const htmlOutput = HtmlService.createTemplateFromFile("index").evaluate();
132
150
 
@@ -136,30 +154,68 @@
136
154
 
137
155
 
138
156
 
139
- function setTime(id, date, attendTime, leaveTime) {
157
+
140
-
158
+
141
- // スプレッドシートのIDを指定して変数に格納。
159
+ //doGetでindex.htmlに入力された値を取得してスプシへ移行
160
+
142
-
161
+ function doPost(e){
162
+
163
+ //var url ="https://docs.google.com/spreadsheets/d/100lQIP5vzPDrgHb3DFY1zuhMkj_gswpo0kL-ksnZUXo/edit#gid=0";
164
+
143
- const app = SpreadsheetApp.openById('@@@@@');
165
+ const ss = SpreadsheetApp.openById('1gkuaYdvJaYMjWNHteu2qsPAJzgVlPzihvjMMTQWyPWw');
144
-
166
+
145
- // スプレッドシートの中のシート名を指定して変数に格納。
167
+ // スプレッドシートの中のシート名を指定して変数に格納。
146
-
168
+
147
- const sheet = app.getSheetByName('データ');
169
+ const recordSheet = ss.getSheetByName('データ');
170
+
171
+
172
+
148
-
173
+ //結果
174
+
149
-
175
+ const date = Utilities.formatDate(new Date(), 'Asia/Tokyo', 'yyyy/MM/dd');
176
+
150
-
177
+ const id = e.parameters.staffId;
178
+
151
- const row = sheet.getDataRange().getLastRow();
179
+ const array = [date,id,attendTime(),leaveTime()];
180
+
152
-
181
+ recordSheet.appendRow(array);
182
+
183
+
184
+
185
+ //送信後に返されるページ
186
+
187
+ //var resultpage = HtmlService.createTemplateFromFile("result");
188
+
189
+ //return resultpage.evaluate();
190
+
191
+
192
+
193
+ }
194
+
195
+
196
+
197
+ //関数 showLastModifide の定義
198
+
199
+ function attendTime(){
200
+
153
- const attendDate = sheet.getRange(2, 1, row - 1).setValue(date);
201
+ const attendTime = Utilities.formatDate(new Date(), 'Asia/Tokyo', 'HH:mm');
154
-
155
- const staffId = sheet.getRange(2, 2, row - 1).setValue(id);
202
+
156
-
157
- const attend = sheet.getRange(2, 4, row - 1).setValue(attendTime);
203
+ return attendTime;
204
+
158
-
205
+ }
206
+
207
+
208
+
209
+ //関数 leaveTime の定義
210
+
211
+ function leaveTime(){
212
+
159
- const leave = sheet.getRange(2, 5, row - 1).setValue(leaveTime);
213
+ const leaveTime = Utilities.formatDate(new Date(), 'Asia/Tokyo', 'HH:mm');
214
+
215
+ 　return leaveTime;
160
216
 
161
217
  }
162
218
 
163
219
  ```
164
220
 
165
- 色々試したのですが、解決に程遠かったので、ご相談させていただきました。よろしくお願いいたします。
221
+ 様々な方にご助言いただき、少しづつ修正しここまで来ており、もう少しなのですがお力をお貸しいただければ幸いです。。

2

コードの修正

2021/01/09 07:27

投稿

YousukeTanaka
YousukeTanaka

スコア79

test CHANGED
File without changes
test CHANGED
@@ -94,13 +94,13 @@
94
94
 
95
95
  const attend-btn = document.getElementById('attend-btn');
96
96
 
97
- btn.addEventListener('click', function() {
97
+ attend-btn.addEventListener('click', function() {
98
98
 
99
99
  const date = Utilities.formatDate(new Date(), 'Asia/Tokyo', 'yyyy/MM/dd');
100
100
 
101
101
  const attendTime = Utilities.formatDate(new Date(), 'Asia/Tokyo', 'HH:mm');
102
102
 
103
- google.script.run.setTime(date,attendTime);
103
+ google.script.run.withSuccessHandler().setTime(date,attendTime);
104
104
 
105
105
  });
106
106
 
@@ -108,11 +108,11 @@
108
108
 
109
109
  const leave-btn = document.getElementById('leave-btn');
110
110
 
111
- btn.addEventListener('click', function() {
111
+ leave-btn.addEventListener('click', function() {
112
112
 
113
113
  const leaveTime = Utilities.formatDate(new Date(), 'Asia/Tokyo', 'HH:mm');
114
114
 
115
- google.script.run.setTime(leaveTime);
115
+ google.script.run.withSuccessHandler().setTime(leaveTime);
116
116
 
117
117
  });
118
118
 

1

修正

2021/01/08 00:10

投稿

YousukeTanaka
YousukeTanaka

スコア79

test CHANGED
File without changes
test CHANGED
@@ -162,6 +162,4 @@
162
162
 
163
163
  ```
164
164
 
165
-
166
-
167
165
  色々試したのですが、解決に程遠かったので、ご相談させていただきました。よろしくお願いいたします。