293 lines
12 KiB
HTML
293 lines
12 KiB
HTML
<!--
|
|
Written By: Robert Zmrzli robert@wellnuo.com
|
|
edit_caretaker.html
|
|
-->
|
|
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Caretaker</title>
|
|
<style>
|
|
body {
|
|
margin: 0;
|
|
font-family: Arial, sans-serif;
|
|
}
|
|
|
|
.title {
|
|
font-size: 24px;
|
|
}
|
|
|
|
.form-group {
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
.form-group label {
|
|
display: block;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.form-group input,
|
|
.form-group button {
|
|
width: 100%;
|
|
padding: 10px;
|
|
box-sizing: border-box;
|
|
}
|
|
</style>
|
|
<script>
|
|
|
|
token = "0"
|
|
user_name = ""
|
|
user_id = "0"
|
|
priviledges = 0
|
|
//api_url = "https://well-api.azurewebsites.net/api/well_api";
|
|
const baseURL = window.location.origin;
|
|
const api_url = `${baseURL}/function/well-api`;
|
|
function initialize() {
|
|
token = localStorage.getItem('token');
|
|
user_name = localStorage.getItem('user_name');
|
|
user_id = localStorage.getItem('user_id');
|
|
priviledges = localStorage.getItem('priviledges');
|
|
|
|
|
|
}
|
|
|
|
async function SendToServer(formData) {
|
|
|
|
console.log(formData.toString());
|
|
const response = await fetch(api_url, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/x-www-form-urlencoded'
|
|
},
|
|
mode: 'no-cors',
|
|
body: formData.toString()
|
|
});
|
|
|
|
if (response.ok) {
|
|
const text = await response.text();
|
|
console.log(text);
|
|
try {
|
|
data = JSON.parse(text);
|
|
return data;
|
|
|
|
}
|
|
catch {
|
|
data = {
|
|
ok: 0
|
|
}
|
|
return data;
|
|
}
|
|
|
|
} else {
|
|
console.log(await response.json());
|
|
data = {
|
|
ok: 0
|
|
}
|
|
return data;
|
|
}
|
|
}
|
|
|
|
async function SubmitCaretakerForm(formData) {
|
|
|
|
console.log(formData.toString());
|
|
const response = await fetch(api_url, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/x-www-form-urlencoded'
|
|
},
|
|
mode: 'no-cors',
|
|
body: formData.toString()
|
|
});
|
|
|
|
if (response.ok) {
|
|
const text = await response.text();
|
|
console.log(text);
|
|
try {
|
|
data = JSON.parse(text);
|
|
return data;
|
|
|
|
}
|
|
catch {
|
|
data = {
|
|
ok: 0
|
|
}
|
|
return data;
|
|
}
|
|
|
|
} else {
|
|
console.log(await response.json());
|
|
data = {
|
|
ok: 0
|
|
}
|
|
return data;
|
|
}
|
|
}
|
|
|
|
|
|
async function SubmitCaretaker() {
|
|
|
|
editing_user_id = document.getElementById("editing_user_id").innerText;
|
|
role_ids = document.getElementById("role_ids").value;
|
|
access_to_deployments = document.getElementById("access_to_deployments").value;
|
|
email = document.getElementById("email").value;
|
|
new_user_name = document.getElementById("new_user_name").value;
|
|
key = document.getElementById("key").value;
|
|
first_name = document.getElementById("first_name").value;
|
|
last_name = document.getElementById("last_name").value;
|
|
address_street = document.getElementById("address_street").value;
|
|
address_city = document.getElementById("address_city").value;
|
|
address_zip = document.getElementById("address_zip").value;
|
|
address_state = document.getElementById("address_state").value;
|
|
address_country = document.getElementById("address_country").value;
|
|
phone_number = document.getElementById("phone_number").value;
|
|
picture = document.getElementById("picture").value;
|
|
|
|
if (new_user_name.length < 2) {
|
|
alert("User Name is too short!")
|
|
}
|
|
else if (email.length < 4) {
|
|
alert("Email too short!")
|
|
}
|
|
else if (key.length < 4) {
|
|
alert("Password too short!")
|
|
}
|
|
else {
|
|
|
|
// Form URL encoded data
|
|
const formData = new URLSearchParams();
|
|
formData.append('function', "caretaker_form");
|
|
formData.append('user_name', user_name);
|
|
formData.append('user_id', user_id);
|
|
formData.append('token', token);
|
|
formData.append('key', key);
|
|
formData.append('new_user_name', new_user_name);
|
|
formData.append('editing_user_id', editing_user_id);
|
|
formData.append('role_ids', role_ids);
|
|
formData.append('access_to_deployments', access_to_deployments);
|
|
formData.append('email', email);
|
|
formData.append('first_name', first_name);
|
|
formData.append('last_name', last_name);
|
|
formData.append('address_street', address_street);
|
|
formData.append('address_city', address_city);
|
|
formData.append('address_zip', address_zip);
|
|
formData.append('address_state', address_state);
|
|
formData.append('address_country', address_country);
|
|
formData.append('phone_number', phone_number);
|
|
formData.append('picture', picture);
|
|
|
|
data = await SubmitCaretakerForm(formData);
|
|
|
|
if(data.ok == 1){
|
|
alert("Caretaker is stored!");
|
|
}
|
|
else {
|
|
alert('Failed to store');
|
|
}
|
|
}
|
|
}
|
|
|
|
async function DeleteCaretaker() {
|
|
|
|
editing_user_id = document.getElementById("editing_user_id").innerText;
|
|
|
|
if (confirm("Are you sure you want to delete this caretaker?")) {
|
|
const formData = new URLSearchParams();
|
|
formData.append('function', "caretaker_delete");
|
|
formData.append('token', token);
|
|
formData.append('user_id', editing_user_id);
|
|
|
|
data = await SendToServer(formData);
|
|
|
|
if(data.ok == 1){
|
|
alert("Caretaker is deleted!");
|
|
}
|
|
else {
|
|
alert('Failed to delete');
|
|
}
|
|
}
|
|
}
|
|
|
|
</script>
|
|
</head>
|
|
|
|
<body onload="initialize();">
|
|
|
|
<div id="edit_caretaker_content" style="margin: 0 auto; max-width: 400px; background-color: #f9f9f9; border: 1px solid #ccc; border-radius: 10px; padding: 20px; text-align: left; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);">
|
|
<h2 class="info-text">Caretaker Information Id = <span id="editing_user_id">23</span></h2>
|
|
<div class="form-group" style="margin-bottom: 15px;">
|
|
<label for="new_user_name" style="display: block; margin-bottom: 5px; color: #333;">User Name: *</label>
|
|
<input type="text" id="new_user_name" style="width: 100%; padding: 8px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px;" placeholder='Name to log-in with'>
|
|
</div>
|
|
|
|
<div class="form-group" style="margin-bottom: 15px;">
|
|
<label for="key" style="display: block; margin-bottom: 5px; color: #333;">Password: *</label>
|
|
<input type="text" id="key" style="width: 100%; padding: 8px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px;">
|
|
</div>
|
|
|
|
<div class="form-group" style="margin-bottom: 15px;">
|
|
<label for="email" style="display: block; margin-bottom: 5px; color: #333;">Email: *</label>
|
|
<input type="text" id="email" style="width: 100%; padding: 8px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px;">
|
|
</div>
|
|
|
|
<div class="form-group" style="margin-bottom: 15px;">
|
|
<label for="first_name" style="display: block; margin-bottom: 5px; color: #333;">First Name:</label>
|
|
<input type="text" id="first_name" style="width: 100%; padding: 8px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px;">
|
|
</div>
|
|
|
|
<div class="form-group" style="margin-bottom: 15px;">
|
|
<label for="last_name" style="display: block; margin-bottom: 5px; color: #333;">Last Name:</label>
|
|
<input type="text" id="last_name" style="width: 100%; padding: 8px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px;">
|
|
</div>
|
|
|
|
<div class="form-group" style="margin-bottom: 15px;">
|
|
<h3 style="color: #333; border-bottom: 1px solid #ddd; padding-bottom: 5px;">Address</h3>
|
|
<label for="address_street" style="display: block; margin-bottom: 5px; color: #333;">Street # and name:</label>
|
|
<input type="text" id="address_street" style="width: 100%; padding: 8px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px;">
|
|
|
|
<label for="address_city" style="display: block; margin-top: 10px; margin-bottom: 5px; color: #333;">City:</label>
|
|
<input type="text" id="address_city" style="width: 100%; padding: 8px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px;">
|
|
|
|
<label for="address_zip" style="display: block; margin-top: 10px; margin-bottom: 5px; color: #333;">ZIP:</label>
|
|
<input type="text" id="address_zip" style="width: 100%; padding: 8px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px;">
|
|
|
|
<label for="address_state" style="display: block; margin-top: 10px; margin-bottom: 5px; color: #333;">State:</label>
|
|
<input type="text" id="address_state" style="width: 100%; padding: 8px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px;">
|
|
|
|
<label for="address_country" style="display: block; margin-top: 10px; margin-bottom: 5px; color: #333;">Country:</label>
|
|
<input type="text" id="address_country" style="width: 100%; padding: 8px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px;">
|
|
</div>
|
|
|
|
<div class="form-group" style="margin-bottom: 15px;">
|
|
<h3 style="color: #333; border-bottom: 1px solid #ddd; padding-bottom: 5px;"></h3>
|
|
<label for="phone_number" style="display: block; margin-bottom: 5px; color: #333;">Phone Number:</label>
|
|
<input type="text" id="phone_number" style="width: 100%; padding: 8px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px;">
|
|
</div>
|
|
|
|
<div class="form-group" style="margin-bottom: 15px;">
|
|
<label for="role_ids" style="display: block; margin-bottom: 5px; color: #333;">Roles:</label>
|
|
<input type="text" id="role_ids" style="width: 100%; padding: 8px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px;" placeholder='Enter role IDs here (1=B, 2=C, 3=O, 4=I). Like "1,2,4"' title="1=Beneficiary, 2=Caretaker, 3=Owner, 4=Installer">
|
|
</div>
|
|
|
|
<div class="form-group" style="margin-bottom: 15px;">
|
|
<label for="access_to_deployments" style="display: block; margin-bottom: 5px; color: #333;">Access to deployments:</label>
|
|
<input type="text" id="access_to_deployments" style="width: 100%; padding: 8px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px;" placeholder='Enter Deployment IDs here. Like "34,56"'>
|
|
</div>
|
|
|
|
<div class="form-group" style="margin-bottom: 15px;">
|
|
<label for="picture" style="display: block; margin-bottom: 5px; color: #333;">Picture:</label>
|
|
<input type="text" id="picture" style="width: 100%; padding: 8px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px;">
|
|
</div>
|
|
|
|
<div style="text-align: center;">
|
|
<button style="background-color: #007bff; color: white; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer; font-size: 16px;" onclick="SubmitCaretaker()">Submit</button>
|
|
<button style="background-color: #007bff; color: white; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer; font-size: 16px;" onclick="DeleteCaretaker()">Delete</button>
|
|
</div>
|
|
</div>
|
|
|
|
</body>
|
|
|
|
</html>
|