133 lines
5.7 KiB
Plaintext
133 lines
5.7 KiB
Plaintext
@model List<PSTW_CentralSystem.Areas.OTcalculate.Models.RateModel>
|
|
|
|
@{
|
|
ViewData["Title"] = "Rate Update";
|
|
Layout = "~/Views/Shared/_Layout.cshtml";
|
|
}
|
|
|
|
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
<div class="col-6 col-md-6 col-lg-3">
|
|
<div class="card card-hover">
|
|
<a asp-area="OTcalculate" asp-controller="HrDashboard" asp-action="Rate">
|
|
<div class="box bg-success text-center">
|
|
<h1 class="font-light text-white">
|
|
<i class="mdi mdi-currency-usd"></i>
|
|
</h1>
|
|
<h6 class="text-white">Rate</h6>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-6 col-md-6 col-lg-3">
|
|
<div class="card card-hover">
|
|
<a asp-area="OTcalculate" asp-controller="HrDashboard" asp-action="Calendar">
|
|
<div class="box bg-purple text-center">
|
|
<h1 class="font-light text-white">
|
|
<i class="mdi mdi-calendar"></i>
|
|
</h1>
|
|
<h6 class="text-white">Calendar</h6>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="row">
|
|
<div id="rateUpdate" class="card m-1">
|
|
<div class="row" v-if="addSection == true">
|
|
<form v-on:submit.prevent="updateRate" data-aos="fade-right">
|
|
<div class="container update" data-aos="fade-right">
|
|
<div class="row" data-aos="fade-right">
|
|
<div class="col-md-12">
|
|
<div class="tab-content" id="myTabContent">
|
|
<div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
|
|
<div class="row update-form card-body">
|
|
<div class="card-header" style="background-color: white;">
|
|
<h3 class="rate-heading text-center">UPDATE RATE</h3>
|
|
</div>
|
|
<div class="col-md-6">
|
|
|
|
@* Enter Rate *@
|
|
<div class="form-group row">
|
|
<label for="rate" class="col-sm-3">Rate</label>
|
|
<div class="col-sm-9">
|
|
<input type="number" id="rate" class="form-control" v-model="rate" placeholder="Enter new rate">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@* User Table Rate *@
|
|
<div id="app">
|
|
<table class="table table-bordered table-hover table-striped">
|
|
<thead>
|
|
<tr>
|
|
<th>Full Name</th>
|
|
<th>Department</th>
|
|
<th>Select Rate</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr v-for="user in users" :key="user.UserId">
|
|
<td>{{ user.FullName }}</td>
|
|
<td>{{ user.DepartmentName }}</td>
|
|
<td>
|
|
<input type="checkbox" v-model="selectedRates" :value="user.RateId">
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<button @click ="updateRates" class="btn btn-primary">Update Rates</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@section Scripts {
|
|
@{
|
|
await Html.RenderPartialAsync("_ValidationScriptsPartial");
|
|
}
|
|
<script>
|
|
new Vue({
|
|
el: "#app",
|
|
data: {
|
|
users: [],
|
|
selectedRates: []
|
|
},
|
|
mounted() {
|
|
this.fetchRates();
|
|
},
|
|
methods: {
|
|
async fetchRates() {
|
|
const response = await fetch("/HrDashboard/GetUserRates", {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" }
|
|
});
|
|
this.users = await response.json();
|
|
},
|
|
async updateRates() {
|
|
const response = await fetch("/HrDashboard/UpdateRates", {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify(this.selectedRates.map(id => ({ RateId: id })))
|
|
});
|
|
|
|
const updatedUsers = await response.json();
|
|
this.users = updatedUsers;
|
|
}
|
|
}
|
|
});
|
|
</script>
|
|
} |