-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathMaskUseDate.html
151 lines (123 loc) · 4.18 KB
/
MaskUseDate.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
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
<body>
<h3>The Mask Date-of-Use can be extended for up to 365 days.</h3>
<br><br>
<table>
<tr>
<th>Mask Design Id</th>
<th> - </th>
<th>Mask Blueprint Id</th>
<th> - </th>
<th>Mask Design Name</th>
<th> - </th>
<th>Current Use Date</th>
<th> - </th>
<th>Mask Status</th>
</tr>
<tr>
<td align="center"><div id="design-id"></div></td>
<td> - </td>
<td align="center"><div id="blue-id"></div></td>
<td> - </td>
<td align="center"><div id="design-name-id"></div></td>
<td> - </td>
<td align="center"><div id="use-date-id"></div></td>
<td> - </td>
<td align="center"><div id="mask-status-id"></div></td>
</tr>
</table>
<br><br>
<form>
<label for="numDays">Number of Days:</label>
<input type="number" id="numDays" value="0" min="0" max="365"/>
<button type="button" onclick="updateUseDate()">Set Use Date</button>
</form>
<script>
let apiRootUrl;
function showCurrentUse() {
// Find the object with the name "Blueprint"
const urlParams = new URLSearchParams(window.location.search);
const designId = urlParams.get('design-id');
const useDateId = document.getElementById("use-date-id");
const designNameId = document.getElementById("design-name-id");
let full_url = `${apiRootUrl}/mask-detail?design-id=${designId}`;
fetch(full_url, {
mode: 'cors',
credentials: 'include' // cookies
})
.then(response => response.json())
.then(data => {
const blueprintObject = data.data.find(item => item[0] === "Blueprint");
// Access the date_use property from the "Blueprint" object
if (blueprintObject) {
const dateUse = blueprintObject[1][0].date_use;
const date = new Date(dateUse);
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
const formattedDate = `${year}-${month}-${day}`;
useDateId.innerText = formattedDate;
} else {
console.log("Blueprint not found in the data.");
}
const maskDesign = data.data.find(item => item[0] === "Mask Design");
// Access the date_use property from the "Blueprint" object
if (blueprintObject) {
const designName = maskDesign[1][0]["Design-Name"];
designNameId.innerText = designName;
} else {
console.log("Blueprint not found in the data.");
}
})
.catch(error => {
alert(`Error accessing data, check API at ${apiRootUrl}${apiUrl}: ${error}`);
});
}
function updateUseDate() {
let apiUrl = "/extend-mask-use-date"
setUseDate(apiUrl);
}
function setUseDate(apiUrl) {
// Get the design-id parameter from the URL
const urlParams = new URLSearchParams(window.location.search);
const designId = urlParams.get('design-id');
showCurrentUse(apiRootUrl, designId);
const numDays = document.getElementById("numDays").value;
let full_url = `${apiRootUrl}${apiUrl}?design-id=${designId}&number-days=${numDays}`;
// update the Use Date
fetch(full_url, {
mode: 'cors',
credentials: 'include' // cookies
})
.then(response => response.json())
.then(data => {
queryResults = data.data;
})
.catch(error => {
alert(`Error accessing data, check API at ${apiRootUrl}${apiUrl}: ${error}`);
});
}
// makes sure the input is only integers
const inputField = document.getElementById("numDays");
inputField.addEventListener("input", function() {
// Get the input value
const inputValue = inputField.value;
// Check if the input value is numeric
if (!isNaN(inputValue)) {
// Parse the input value as a number
const numericValue = parseInt(inputValue);
// Check if the numeric value is greater than 365
if (numericValue > 365) {
// If so, set the input value to 365
inputField.value = 365;
}
} else {
// If the input value is not numeric, set it to an empty string
inputField.value = "";
}
});
// expose the updateUseDate to be used in index.html
window.onload = updateUseDate;
// load the Date-Use and Design ID
window.onload = loadParams();
</script>
</body>