task table fixed
This commit is contained in:
parent
1aac5f664f
commit
f2ebae81b0
@ -96,116 +96,116 @@ const Tasks = () => {
|
||||
<div className="col-lg-12">
|
||||
<div className="card">
|
||||
<div className="card-body">
|
||||
<div className="row ml-0 mr-0 mb-10">
|
||||
<div className="col-lg-1 col-md-2 col-6">
|
||||
<div className="dataTables_length">
|
||||
<label className="w-100">
|
||||
Show
|
||||
<select
|
||||
onChange={(e) => {
|
||||
setItemPerPage(e.target.value);
|
||||
setCurrentPage(1);
|
||||
}}
|
||||
className="form-control"
|
||||
disabled={loading}
|
||||
>
|
||||
<option value="10">10</option>
|
||||
<option value="25">25</option>
|
||||
<option value="50">50</option>
|
||||
<option value="100">100</option>
|
||||
</select>
|
||||
entries
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-3 col-md-5 col-12">
|
||||
<label>TM Name:</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Trade name"
|
||||
className="form-control"
|
||||
ref={tmnameRef}
|
||||
onChange={handleSearchChange}
|
||||
disabled={loading}
|
||||
/>
|
||||
</div>
|
||||
<div className="col-lg-3 col-md-5 col-12">
|
||||
<label>SC Name:</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Trade name"
|
||||
className="form-control"
|
||||
ref={scnameRef}
|
||||
onChange={handleSearchChange}
|
||||
disabled={loading}
|
||||
/>
|
||||
</div>
|
||||
<div className="col-lg-2 col-md-4 col-4">
|
||||
<label>Start Date:</label>
|
||||
<input
|
||||
type="date"
|
||||
className="form-control"
|
||||
ref={startDateRef}
|
||||
onChange={handleSearchChange}
|
||||
disabled={loading}
|
||||
/>
|
||||
</div>
|
||||
<div className="col-lg-2 col-md-4 col-4">
|
||||
<label>End Date:</label>
|
||||
<input
|
||||
type="date"
|
||||
className="form-control"
|
||||
ref={endDateRef}
|
||||
onChange={handleSearchChange}
|
||||
disabled={loading}
|
||||
/>
|
||||
</div>
|
||||
<div className="col-lg-1 col-md-4 col-4">
|
||||
<label>Status:</label>
|
||||
<select
|
||||
className="form-control"
|
||||
ref={statusnameRef}
|
||||
onChange={handleSearchChange}
|
||||
disabled={loading}
|
||||
>
|
||||
<option value="">All</option>
|
||||
<option value="New">New</option>
|
||||
<option value="Pending">Pending</option>
|
||||
<option value="Completed">Completed</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row ml-0 mr-0 mb-10">
|
||||
<div className="col-lg-1 col-md-2 col-6">
|
||||
<div className="dataTables_length">
|
||||
<label className="w-100">
|
||||
Show
|
||||
<select
|
||||
onChange={(e) => {
|
||||
setItemPerPage(e.target.value);
|
||||
setCurrentPage(1);
|
||||
}}
|
||||
className="form-control"
|
||||
disabled={loading}
|
||||
>
|
||||
<option value="10">10</option>
|
||||
<option value="25">25</option>
|
||||
<option value="50">50</option>
|
||||
<option value="100">100</option>
|
||||
</select>
|
||||
entries
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-3 col-md-5 col-12">
|
||||
<label>TM Name:</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="TM name"
|
||||
className="form-control"
|
||||
ref={tmnameRef}
|
||||
onChange={handleSearchChange}
|
||||
disabled={loading}
|
||||
/>
|
||||
</div>
|
||||
<div className="col-lg-3 col-md-5 col-12">
|
||||
<label>SC Name:</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="SC name"
|
||||
className="form-control"
|
||||
ref={scnameRef}
|
||||
onChange={handleSearchChange}
|
||||
disabled={loading}
|
||||
/>
|
||||
</div>
|
||||
<div className="col-lg-2 col-md-4 col-4">
|
||||
<label>Start Date:</label>
|
||||
<input
|
||||
type="date"
|
||||
className="form-control"
|
||||
ref={startDateRef}
|
||||
onChange={handleSearchChange}
|
||||
disabled={loading}
|
||||
/>
|
||||
</div>
|
||||
<div className="col-lg-2 col-md-4 col-4">
|
||||
<label>End Date:</label>
|
||||
<input
|
||||
type="date"
|
||||
className="form-control"
|
||||
ref={endDateRef}
|
||||
onChange={handleSearchChange}
|
||||
disabled={loading}
|
||||
/>
|
||||
</div>
|
||||
<div className="col-lg-1 col-md-4 col-4">
|
||||
<label>Status:</label>
|
||||
<select
|
||||
className="form-control"
|
||||
ref={statusnameRef}
|
||||
onChange={handleSearchChange}
|
||||
disabled={loading}
|
||||
>
|
||||
<option value="">All</option>
|
||||
<option value="New">New</option>
|
||||
<option value="Pending">Pending</option>
|
||||
<option value="Completed">Completed</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style jsx>{`
|
||||
@media (max-width: 1200px) {
|
||||
.col-lg-1 {
|
||||
flex: 0 0 20%;
|
||||
max-width: 20%;
|
||||
}
|
||||
.col-lg-2 {
|
||||
flex: 0 0 37%;
|
||||
max-width: 37%;
|
||||
}
|
||||
.col-lg-3 {
|
||||
flex: 0 0 40%;
|
||||
max-width: 40%;
|
||||
}
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.col-lg-1,
|
||||
.col-lg-2,
|
||||
.col-lg-3,
|
||||
.col-md-2,
|
||||
.col-md-4,
|
||||
.col-md-5,
|
||||
.col-4,
|
||||
.col-6,
|
||||
.col-12 {
|
||||
flex: 0 0 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
`}</style>
|
||||
<style jsx>{`
|
||||
@media (max-width: 1200px) {
|
||||
.col-lg-1 {
|
||||
flex: 0 0 20%;
|
||||
max-width: 20%;
|
||||
}
|
||||
.col-lg-2 {
|
||||
flex: 0 0 37%;
|
||||
max-width: 37%;
|
||||
}
|
||||
.col-lg-3 {
|
||||
flex: 0 0 40%;
|
||||
max-width: 40%;
|
||||
}
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.col-lg-1,
|
||||
.col-lg-2,
|
||||
.col-lg-3,
|
||||
.col-md-2,
|
||||
.col-md-4,
|
||||
.col-md-5,
|
||||
.col-4,
|
||||
.col-6,
|
||||
.col-12 {
|
||||
flex: 0 0 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
`}</style>
|
||||
|
||||
<div className="table-responsive table-shoot mt-3">
|
||||
<table
|
||||
@ -230,7 +230,7 @@ const Tasks = () => {
|
||||
className="text-start"
|
||||
style={{ border: "1px solid" }}
|
||||
>
|
||||
Due Date
|
||||
Task Assigned Date
|
||||
</th>
|
||||
<th
|
||||
className="text-start"
|
||||
@ -250,6 +250,12 @@ const Tasks = () => {
|
||||
>
|
||||
Sales Coordinator
|
||||
</th>
|
||||
<th
|
||||
className="text-start"
|
||||
style={{ border: "1px solid" }}
|
||||
>
|
||||
Due Date
|
||||
</th>
|
||||
<th
|
||||
className="text-start"
|
||||
style={{ border: "1px solid" }}
|
||||
@ -283,7 +289,7 @@ const Tasks = () => {
|
||||
className="text-start"
|
||||
style={{ border: "1px solid" }}
|
||||
>
|
||||
{new Date(task.taskDueDate).toLocaleString(
|
||||
{new Date(task.createdAt).toLocaleString(
|
||||
"en-IN",
|
||||
{
|
||||
month: "short",
|
||||
@ -310,6 +316,19 @@ const Tasks = () => {
|
||||
>
|
||||
{task.taskAssignedTo.name}
|
||||
</td>
|
||||
<td
|
||||
className="text-start"
|
||||
style={{ border: "1px solid" }}
|
||||
>
|
||||
{new Date(task.taskDueDate).toLocaleString(
|
||||
"en-IN",
|
||||
{
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
}
|
||||
)}
|
||||
</td>
|
||||
<td
|
||||
className="text-start"
|
||||
style={{ border: "1px solid" }}
|
||||
|
Loading…
Reference in New Issue
Block a user