Eamco/eamco_office_frontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Updated looks

Browse Source
This commit is contained in:
Anekdotin
2024-04-04 16:38:35 -04:00
parent 2d9fce2e89
commit 7164e41aa1
36 changed files with 2863 additions and 1567 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
src/pages/employee/edit.vue
View File

@@ -30,7 +30,7 @@
<div class="mb-4">
<label class="block text-white text-sm font-bold mb-2">First Name</label>
<input v-model="CreateEmployeeForm.basicInfo.employee_first_name"
class="input input-bordered w-full max-w-xs" id="title" type="text" placeholder="First Name" />
class="input input-bordered input-sm w-full max-w-xs" id="title" type="text" placeholder="First Name" />
<span v-if="v$.CreateEmployeeForm.basicInfo.employee_first_name.$error" class="text-red-600 text-center">
{{ v$.CreateEmployeeForm.basicInfo.employee_first_name.$errors[0].$message }}
</span>
@@ -41,7 +41,7 @@
<div class="mb-4">
<label class="block text-white text-sm font-bold mb-2">Last Name</label>
<input v-model="CreateEmployeeForm.basicInfo.employee_last_name"
class="input input-bordered w-full max-w-xs" id="title" type="text" placeholder="Last Name" />
class="input input-bordered input-sm w-full max-w-xs" id="title" type="text" placeholder="Last Name" />
<span v-if="v$.CreateEmployeeForm.basicInfo.employee_last_name.$error" class="text-red-600 text-center">
{{ v$.CreateEmployeeForm.basicInfo.employee_last_name.$errors[0].$message }}
</span>
@@ -52,7 +52,7 @@
<div class="flex gap-5">
<div class="flex-1 mb-4">
<label class="block text-white text-sm font-bold mb-2">Type of employee</label>
<select class="select select-bordered w-full max-w-xs" aria-label="Default select example"
<select class="select select-bordered select-sm w-full max-w-xs" aria-label="Default select example"
id="employee_type" v-model="CreateEmployeeForm.basicInfo.employee_type">
<option class="text-white" v-for="(employee, index) in employList" :key="index"
:value="employee['value']">
@@ -68,7 +68,8 @@
<!-- street address -->
<div class="col-span-12 mb-5 md:mb-5">
<label class="block text-white text-sm font-bold mb-2">Street Address</label>
<input v-model="CreateEmployeeForm.basicInfo.employee_address" class="input input-bordered w-full max-w-xs"
<input v-model="CreateEmployeeForm.basicInfo.employee_address"
class="input input-bordered input-sm w-full max-w-xs"
id="address" type="text" placeholder="Address" />
<span v-if="v$.CreateEmployeeForm.basicInfo.employee_address.$error" class="text-red-600 text-center">
{{ v$.CreateEmployeeForm.basicInfo.employee_address.$errors[0].$message }}
@@ -78,14 +79,16 @@
<!-- apt -->
<div class="col-span-12 mb-5 md:mb-5">
<input v-model="CreateEmployeeForm.basicInfo.employee_apt" class="input input-bordered w-full max-w-xs"
<input v-model="CreateEmployeeForm.basicInfo.employee_apt"
class="input input-bordered input-sm w-full max-w-xs"
id="apt" type="text" placeholder="Apt, suite, unit, building, floor, etc" />
</div>
<!-- employee_town -->
<div class="col-span-12 md:col-span-4 mb-20 md:mb-5 ">
<label class="block text-white text-sm font-bold mb-2">Town</label>
<input v-model="CreateEmployeeForm.basicInfo.employee_town" class="input input-bordered w-full max-w-xs"
<input v-model="CreateEmployeeForm.basicInfo.employee_town"
class="input input-bordered input-sm w-full max-w-xs"
id="city" type="text" placeholder="Town" />
<span v-if="v$.CreateEmployeeForm.basicInfo.employee_town.$error" class="text-red-600 text-center">
{{ v$.CreateEmployeeForm.basicInfo.employee_town.$errors[0].$message }}
@@ -96,7 +99,7 @@
<div class="col-span-12 md:col-span-4 mb-5 md:mb-5">
<label class="block text-white text-sm font-bold mb-2">Phone Number</label>
<input v-model="CreateEmployeeForm.basicInfo.employee_phone_number" @input="acceptNumber()"
class="input input-bordered w-full max-w-xs" id="phone number" type="text" placeholder="Phone Number" />
class="input input-bordered input-sm w-full max-w-xs" id="phone number" type="text" placeholder="Phone Number" />
<span v-if="v$.CreateEmployeeForm.basicInfo.employee_phone_number.$error" class="text-red-600 text-center">
{{ v$.CreateEmployeeForm.basicInfo.employee_phone_number.$errors[0].$message }}
</span>
@@ -105,7 +108,7 @@
<!-- state -->
<div class="flex-1 mb-4">
<label class="block text-white text-sm font-bold mb-2">State</label>
<select class="select select-bordered w-full max-w-xs" aria-label="Default select example"
<select class="select select-bordered select-sm w-full max-w-xs" aria-label="Default select example"
id="employee_state" v-model="CreateEmployeeForm.basicInfo.employee_state">
<option class="text-white" v-for="(state, index) in stateList" :key="index" defaultValue="state_default"
:value="state['value']">
@@ -120,7 +123,8 @@
<!-- zip -->
<div class="col-span-12 md:col-span-4 mb-5 md:mb-0">
<label class="block text-white text-sm font-bold mb-2">Zip Code</label>
<input v-model="CreateEmployeeForm.basicInfo.employee_zip" class="input input-bordered w-full max-w-xs"
<input v-model="CreateEmployeeForm.basicInfo.employee_zip"
class="input input-bordered input-sm w-full max-w-xs"
id="zip" type="text" placeholder="Zip" />
<span v-if="v$.CreateEmployeeForm.basicInfo.employee_zip.$error" class="text-red-600 text-center">
{{ v$.CreateEmployeeForm.basicInfo.employee_zip.$errors[0].$message }}
@@ -130,25 +134,25 @@
<div class="mb-4">
<label class="block text-white text-sm font-bold mb-2">Employee BirthDay</label>
<input v-model="CreateEmployeeForm.basicInfo.employee_birthday" class="input input-bordered w-full max-w-xs"
<input v-model="CreateEmployeeForm.basicInfo.employee_birthday"
class="input input-bordered input-sm w-full max-w-xs"
id="title" type="date" min="1945-01-01" max="2030-01-01" />
</div>
<div class="text-[18px] mt-10 mb-10">Employee Dates</div>
<div class="mb-4">
<label class="block text-white text-sm font-bold mb-2">Employee Start Date</label>
<input v-model="CreateEmployeeForm.basicInfo.employee_start_date"
class="input input-bordered w-full max-w-xs" id="title" type="date" min="2023-01-01" max="2030-01-01" />
class="input input-bordered input-sm w-full max-w-xs" id="title" type="date" min="2023-01-01" max="2030-01-01" />
</div>
<div class="mb-4">
<label class="block text-white text-sm font-bold mb-2">Employee End Date</label>
<input v-model="CreateEmployeeForm.basicInfo.employee_end_date" class="input input-bordered w-full max-w-xs"
<input v-model="CreateEmployeeForm.basicInfo.employee_end_date"
class="input input-bordered input-sm w-full max-w-xs"
id="title" type="date" min="2023-01-01" max="2030-01-01" />
</div>

20
src/pages/employee/home.vue
View File

@@ -5,7 +5,7 @@
<SideBar />
</div>
<div class=" w-full px-10 ">
<div class="text-sm breadcrumbs">
<div class="text-sm breadcrumbs mb-10">
<ul>
<li>
<router-link :to="{ name: 'home' }">
@@ -19,18 +19,20 @@
</li>
</ul>
</div>
<div class="flex justify-end">
<div class="flex start pb-10 text-2xl">Employees </div>
<div class="flex justify-end mb-10">
<router-link :to="{ name: 'employeeCreate' }">
<button class="btn btn-accent">Create Employee</button>
<button class="btn btn-accent btn-sm">Create Employee</button>
</router-link>
</div>
<div class="overflow-x-auto">
<div class="overflow-x-auto bg-neutral">
<table class="table">
<!-- head -->
<thead>
<tr>
<th>Employee ID</th>
<th>Name</th>
<th>Type</th>
<th>Town</th>
@@ -41,7 +43,7 @@
<tbody>
<!-- row 1 -->
<tr v-for="person in employees" :key="person['id']">
<td>{{ person['id'] }} </td>
<td>{{ person['employee_first_name'] }} {{ person['employee_last_name'] }}</td>
<td>
<div v-if="person['employee_type'] == 0">Owner</div>
@@ -61,10 +63,10 @@
<td>{{ person['employee_phone_number'] }}</td>
<td class="flex gap-5">
<router-link :to="{ name: 'employeeEdit', params: { id: person['id'] } }">
<button class="btn btn-accent">Edit</button>
<button class="btn btn-accent btn-sm">Edit</button>
</router-link>
<router-link :to="{ name: 'employeeProfile', params: { id: person['id'] } }">
<button class="btn btn-accent">View</button>
<router-link :to="{ name: 'employeeProfile', params: { id: person['id'] } }">
<button class="btn btn-accent btn-sm">View</button>
</router-link>
</td>
</tr>

147
src/pages/employee/profile/home.vue
View File

@@ -1,10 +1,10 @@
<template>
<Header/>
<Header />
<div class="wrapper">
<div class="flex">
<div class="">
<SideBar/>
<SideBar />
</div>
<div class=" w-full px-10 ">
<div class="text-sm breadcrumbs">
@@ -24,56 +24,53 @@
<div class=" w-full mt-10" v-if="loaded">
<div class="grid grid-cols-12 gap-5 ">
<div class="col-span-3 ">
<img src="../../../assets/images/user_placeholder.png"
alt="Drone Image"
width="200"
height="250"/>
<img src="../../../assets/images/user_placeholder.png" alt="Drone Image" width="200" height="250" />
</div>
<div class="col-span-9 bg-neutral">
<div class="col-span-9">
<div class="grid grid-cols-12">
<div class="col-span-12 font-bold flex justify-end">
<div class="btn">
<router-link :to="{ name: 'employeeEdit', params: { id: employee.id } }" >
Edit Employee
</router-link>
</div>
</div>
<div class="col-span-12 font-bold flex">
{{ employee.employee_first_name }}
{{ employee.employee_last_name }}
</div>
<div class="col-span-12 font-bold flex">
{{ employee.employee_address }}
<div v-if="employee.employee_apt != 'None'">
<div class="col-span-12 font-bold flex justify-end">
<div class="btn">
<router-link :to="{ name: 'employeeEdit', params: { id: employee.id } }">
Edit Employee
</router-link>
</div>
</div>
<div class="col-span-12 font-bold flex">
{{ employee.employee_first_name }}
{{ employee.employee_last_name }}
</div>
<div class="col-span-12 font-bold flex">
{{ employee.employee_address }}
<div v-if="employee.employee_apt != 'None'">
{{ employee.employee_apt }}
</div>
</div>
<div class="col-span-12 font-bold flex">
<div class="pr-2">
{{ employee.employee_town }},
</div>
<div class="pr-2">
<div v-if="employee.employee_state == '0'">Massachusetts</div>
<div v-else-if="employee.employee_state == '1'">Rhode Island</div>
<div v-else-if="employee.employee_state == '2'">New Hampshire</div>
<div v-else-if="employee.employee_state == '3'">Maine</div>
<div v-else-if="employee.employee_state == '4'">Vermont</div>
<div v-else-if="employee.employee_state == '5'">Maine</div>
<div v-else-if="employee.employee_state == '6'">New York</div>
<div v-else>Unknown state</div>
</div>
<div class="pr-2">
{{ employee.employee_zip }}
</div>
</div>
<div class="col-span-12 font-bold flex" v-if="employee.employee_apt !== 'None'">
{{ employee.employee_apt }}
</div>
</div>
<div class="col-span-12 font-bold flex">
<div class="pr-2">
{{ employee.employee_town }},
<div class="col-span-12 font-bold flex">
{{ employee.employee_phone_number }}
</div>
<div class="pr-2">
<div v-if="employee.employee_state == '0'">Massachusetts</div>
<div v-else-if="employee.employee_state == '1'">Rhode Island</div>
<div v-else-if="employee.employee_state == '2'">New Hampshire</div>
<div v-else-if="employee.employee_state == '3'">Maine</div>
<div v-else-if="employee.employee_state == '4'">Vermont</div>
<div v-else-if="employee.employee_state == '5'">Maine</div>
<div v-else-if="employee.employee_state == '6'">New York</div>
<div v-else>Unknown state</div>
</div>
<div class="pr-2">
{{ employee.employee_zip }}
</div>
</div>
<div class="col-span-12 font-bold flex" v-if="employee.employee_apt !== 'None'">
{{ employee.employee_apt }}
</div>
<div class="col-span-12 font-bold flex">
{{ employee.employee_phone_number }}
</div>
<div class="col-span-12 font-bold flex">
<div class="col-span-12 font-bold flex">
<div v-if="employee.employee_type == '0'">owner</div>
<div v-else-if="employee.employee_type == '1'">manager</div>
<div v-else-if="employee.employee_type == '2'">secretary</div>
@@ -81,15 +78,15 @@
<div v-else-if="employee.employee_type == '4'">driver</div>
<div v-else-if="employee.employee_type == '5'">tech</div>
<div v-else-if="employee.employee_type == '6'">contract</div>
<div v-else-if="employee.employee_type == '7'">cash</div>
<div v-else-if="employee.employee_type == '8'">driver/tech</div>
<div v-else-if="employee.employee_type == '7'">cash</div>
<div v-else-if="employee.employee_type == '8'">driver/tech</div>
<div v-else>Unknown employee type</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-span-12 bg-neutral p-5 mt-5">
<div class="col-span-12 p-5 mt-5">
<div class="grid grid-cols-12">
<div class="col-span-12 font-bold flex text-2xl">
Delivery
@@ -112,11 +109,11 @@
</div>
</div>
</div>
<Footer/>
<Footer />
</template>
<script lang="ts">
import {defineComponent} from 'vue'
import { defineComponent } from 'vue'
import axios from 'axios'
import authHeader from '../../../services/auth.header'
import Header from '../../../layouts/headers/headerauth.vue'
@@ -140,19 +137,19 @@ export default defineComponent({
user: null,
loaded: false,
employee: {
id: '',
employee_last_name: "",
employee_first_name: "",
employee_town: "",
employee_address: "",
employee_apt: "",
employee_zip: "",
employee_birthday: "",
employee_phone_number: "",
employee_start_date: "",
employee_end_date: "",
employee_type: '',
employee_state:'',
id: '',
employee_last_name: "",
employee_first_name: "",
employee_town: "",
employee_address: "",
employee_apt: "",
employee_zip: "",
employee_birthday: "",
employee_phone_number: "",
employee_start_date: "",
employee_end_date: "",
employee_type: '',
employee_state: '',
},
}
},
@@ -181,17 +178,17 @@ export default defineComponent({
withCredentials: true,
headers: authHeader(),
})
.then((response: any) => {
if (response.data.ok) {
this.user = response.data.user;
}
})
.catch(() => {
this.user = null
})
.then((response: any) => {
if (response.data.ok) {
this.user = response.data.user;
}
})
.catch(() => {
this.user = null
})
},
getEmployee (userid:any) {
getEmployee(userid: any) {
let path = import.meta.env.VITE_BASE_URL + "/employee/" + userid;
axios({
method: "get",