363 lines
13 KiB
HTML
363 lines
13 KiB
HTML
<!--
|
|
Written By: Robert Zmrzli robert@wellnuo.com
|
|
edit_user.html
|
|
-->
|
|
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>User</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;
|
|
}
|
|
|
|
|
|
.checkbox-container {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
width: 100%;
|
|
max-width: 600px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.checkbox-item {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.checkbox-item label {
|
|
margin-left: 5px;
|
|
}
|
|
|
|
|
|
</style>
|
|
<script>
|
|
|
|
token = "0"
|
|
user = ""
|
|
priviledges = 0
|
|
//api_url = "https://wellwebapp.azurewebsites.net/api/web_app";
|
|
api_url = "https://well-api.azurewebsites.net/api/well_api";
|
|
|
|
function initialize() {
|
|
token = localStorage.getItem('token');
|
|
user = localStorage.getItem('user');
|
|
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 SubmitBeneficiaryForm(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 SubmitBeneficiary() {
|
|
|
|
email = document.getElementById("email").value;
|
|
c_password = document.getElementById("c_password").value;
|
|
first_name = document.getElementById("first_name").value;
|
|
last_name = document.getElementById("last_name").value;
|
|
address = document.getElementById("address").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;
|
|
persons = document.getElementById("persons").value;
|
|
|
|
gender = document.getElementById("gender").value;
|
|
race = document.getElementById("race").value;
|
|
born = document.getElementById("born").value;
|
|
pets = document.getElementById("pets").value;
|
|
creds = document.getElementById("creds").value;
|
|
devs = document.getElementById("devs").value;
|
|
tzone = document.getElementById("tzone").value;
|
|
if (email.length < 2) {
|
|
alert("Email is invalid!")
|
|
}
|
|
else if (c_password.length < 4) {
|
|
alert("Fill the password!")
|
|
}
|
|
else {
|
|
|
|
// Form URL encoded data
|
|
const formData = new URLSearchParams();
|
|
formData.append('function', "beneficiary_form");
|
|
formData.append('token', token);
|
|
|
|
formData.append('email', email);
|
|
formData.append('c_password', c_password);
|
|
formData.append('first_name', first_name);
|
|
formData.append('last_name', last_name);
|
|
formData.append('address', address);
|
|
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('persons', persons);
|
|
formData.append('gender', gender);
|
|
formData.append('race', race);
|
|
formData.append('born', born);
|
|
formData.append('pets', pets);
|
|
formData.append('creds', creds);
|
|
formData.append('devs', devs);
|
|
formData.append('tzone', tzone);
|
|
|
|
data = await SubmitBeneficiaryForm(formData);
|
|
|
|
if(data.ok == 1){
|
|
alert("Beneficiary is stored!");
|
|
}
|
|
else {
|
|
alert('Failed to store');
|
|
}
|
|
}
|
|
}
|
|
|
|
async function DeleteBeneficiary() {
|
|
|
|
id = "user_beneficiary_" + document.getElementById("email").value;
|
|
partition = "BENEFICIARY";
|
|
|
|
if (email.length < 2) {
|
|
alert("Email is invalid!")
|
|
}
|
|
else {
|
|
|
|
// Form URL encoded data
|
|
const formData = new URLSearchParams();
|
|
formData.append('function', "beneficiary_delete");
|
|
formData.append('token', token);
|
|
formData.append('id', id);
|
|
formData.append('partition', partition);
|
|
|
|
data = await SendToServer(formData);
|
|
|
|
if(data.ok == 1){
|
|
alert("Beneficiary is deleted!");
|
|
}
|
|
else {
|
|
alert('Failed to delete');
|
|
}
|
|
}
|
|
}
|
|
|
|
function TZoneChange() {
|
|
document.getElementById("tzone").value = document.getElementById("tzone_s").value;
|
|
}
|
|
408 856 8734
|
|
|
|
</script>
|
|
</head>
|
|
|
|
<body onload="initialize();">
|
|
|
|
<div id="edit_beneficiary_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 style="text-align: center; color: #333;">User Information</h2>
|
|
<label id="UserLabel" for="UserId">User ID:</label>
|
|
<label id="UserId">0</label>
|
|
<br><br>
|
|
|
|
<div class="form-group" style="margin-bottom: 15px; display: flex; align-items: center;">
|
|
<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; display: flex; align-items: center;">
|
|
<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; display: flex; align-items: center;">
|
|
<label for="user_name_" style="display: block; margin-bottom: 5px; color: #333;">User:*</label>
|
|
<input type="text" id="user_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; display: flex; align-items: center;">
|
|
<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; display: flex; align-items: center;">
|
|
<label for="c_password" style="display: block; margin-bottom: 5px; color: #333;">Password:*</label>
|
|
<input type="text" id="c_password" 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>
|
|
<div class="form-group" style="margin-bottom: 15px; display: flex; align-items: center;">
|
|
<label for="address" style="display: block; margin-bottom: 5px; color: #333;">Street # and name:</label>
|
|
<input type="text" id="address" style="width: 100%; padding: 8px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px;">
|
|
</div>
|
|
|
|
</div>
|
|
<div class="form-group" style="margin-bottom: 15px; display: flex; align-items: center;">
|
|
<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;">
|
|
</div>
|
|
|
|
<div class="form-group" style="margin-bottom: 15px; display: flex; align-items: center;">
|
|
<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;">
|
|
</div>
|
|
|
|
<div class="form-group" style="margin-bottom: 15px; display: flex; align-items: center;">
|
|
<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;">
|
|
</div>
|
|
|
|
<div class="form-group" style="margin-bottom: 15px; display: flex; align-items: center;">
|
|
<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; display: flex; align-items: center;">
|
|
<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="roles" style="display: block; margin-bottom: 5px; color: #333;">Roles:</label>
|
|
<div class="checkbox-container">
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="beneficiary" name="beneficiary" value="1">
|
|
<label for="beneficiary">Beneficiary</label>
|
|
</div>
|
|
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="caretaker" name="caretaker" value="2">
|
|
<label for="caretaker">Caretaker</label>
|
|
</div>
|
|
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="owner" name="owner" value="4">
|
|
<label for="owner">Owner</label>
|
|
</div>
|
|
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="installer" name="installer" value="8">
|
|
<label for="installer">Installer</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="form-group" style="margin-bottom: 15px; display: flex; align-items: center;">
|
|
<label for="acccess_to" style="display: block; margin-bottom: 5px; color: #333;">Access to:</label>
|
|
<input type="text" id="acccess_to" style="width: 100%; padding: 8px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px;" placeholder="deployment_ids">
|
|
</div>
|
|
|
|
|
|
|
|
<div class="form-group" style="margin-bottom: 15px; display: flex; align-items: center;">
|
|
<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;" placeholder="1">
|
|
</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="SubmitBeneficiary()">Submit</button>
|
|
<button style="background-color: #007bff; color: white; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer; font-size: 16px;" onclick="DeleteBeneficiary()">Delete</button>
|
|
</div>
|
|
</div>
|
|
|
|
</body>
|
|
|
|
</html>
|