hrms-bangkok/hrms-mgt
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

ปรับ css ระบบทะเบียนประวัติลูกจ้าง,พ้นจากราชการ

Browse source
This commit is contained in:
Tanyalak 2023-07-14 15:38:09 +07:00
parent a4966331e5
commit 332e61599b
10 changed files with 286 additions and 286 deletions
Download patch file Download diff file Expand all files Collapse all files

5
src/modules/05_placement/components/Main.vue
View file

@ -299,7 +299,7 @@ const paginationLabel = (start: number, end: number, total: number) => {
รายการสอบแข่งขัน / คัดเลือก
</div>
<q-card flat bordered class="col-12 q-mt-sm q-pa-md">
<div class="row q-col-gutter-md">
<div class="row q-col-gutter-sm">
<div class="row col-12 q-col-gutter-sm">
<q-select
class="col-xs-12 col-sm-3 col-md-2"
@ -422,7 +422,8 @@ const paginationLabel = (start: number, end: number, total: number) => {
<template v-slot:pagination="scope">
<q-pagination
v-model="pagination.page"
color="primary"
active-color="primary"
color="dark"
:max="scope.pagesNumber"
:max-pages="5"
size="sm"

3
src/modules/05_placement/components/OrderPlacement/step/step02.vue
View file

@ -138,7 +138,8 @@
<template v-slot:pagination="scope">
<q-pagination
v-model="pagination.page"
color="primary"
active-color="primary"
color="dark"
:max="scope.pagesNumber"
:max-pages="5"
size="sm"

6
src/modules/05_placement/components/OrderPlacement/step/step03.vue
View file

@ -130,7 +130,8 @@
<template v-slot:pagination="scope">
<q-pagination
v-model="pagination.page"
color="primary"
active-color="primary"
color="dark"
:max="scope.pagesNumber"
:max-pages="5"
size="sm"
@ -306,7 +307,8 @@
<template v-slot:pagination="scope">
<q-pagination
v-model="paginationModal.page"
color="primary"
active-color="primary"
color="dark"
:max="scope.pagesNumber"
:max-pages="5"
size="sm"

2
src/modules/05_placement/components/PersonalList/TableView.vue
View file

@ -23,7 +23,7 @@
<q-table ref="table" flat bordered class="custom-header-table" v-bind="attrs" virtual-scroll
:virtual-scroll-sticky-size-start="48" dense :pagination-label="paginationLabel" v-model:pagination="pagination">
<template v-slot:pagination="scope">
<q-pagination v-model="pagination.page" color="primary" :max="scope.pagesNumber" :max-pages="5" size="sm"
<q-pagination v-model="pagination.page" active-color="primary" color="dark" :max="scope.pagesNumber" :max-pages="5" size="sm"
boundary-links direction-links></q-pagination>
</template>
<template v-slot:header="props">

323
src/modules/06_retirement/views/Main.vue
View file

@ -2,168 +2,169 @@
<div class="toptitle text-dark col-12 row items-center">
ประกาศเกษียณอายุราชการ
</div>
<q-card flat bordered class="col-12 q-mt-sm q-pa-md">
<div class="row q-col-gutter-sm">
<div class="row col-12 q-col-gutter-sm">
<q-select
class="col-xs-12 col-sm-3 col-md-1"
v-model="fiscalyear"
label="ปีงบประมาณ"
dense
emit-value
map-options
:options="fiscalyearOP"
option-value="id"
option-label="name"
lazy-rules
hide-bottom-space
:readonly="false"
:borderless="false"
:outlined="true"
:hide-dropdown-icon="false"
@update:model-value="searchFilterTable"
/>
<div>
<q-btn
@click="clickAdd()"
size="12px"
flat
round
color="add"
icon="mdi-plus"
>
<q-tooltip>เพิ่มผู้ทดลองปฏิบัติหน้าที่ราชการ</q-tooltip>
</q-btn>
<q-menu>
<q-list style="min-width: 100px">
<q-item clickable @click="clickAdd">
<q-item-section>ขรก.กทม.สามัญ</q-item-section>
</q-item>
<q-item clickable @click="clickAdd">
<q-item-section>ลูกจ้างประจำ</q-item-section>
</q-item>
</q-list>
</q-menu>
</div>
<q-space />
<q-input
class="col-xs-12 col-sm-3 col-md-2"
standout
dense
v-model="filterKeyword"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
>
<template v-slot:append>
<q-icon v-if="filterKeyword == ''" name="search" />
<q-icon
v-if="filterKeyword !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</template>
</q-input>
<q-select
v-model="visibleColumns"
multiple
outlined
dense
options-dense
:display-value="$q.lang.table.columns"
emit-value
map-options
:options="columns"
option-value="name"
options-cover
style="min-width: 150px"
class="col-xs-12 col-sm-3 col-md-2"
/>
</div>
<div class="col-12">
<div class="q-pa-sm">
<q-tabs
v-model="tab"
<q-card flat bordered class="col-12 q-mt-sm">
<div class="row col-12">
<q-tabs
v-model="tab"
dense
class="text-grey"
active-color="primary"
active-class="bg-teal-1"
indicator-color="primary"
align="left"
>
<q-tab name="samun" label="ขรก.กทม.สามัญ" />
<q-tab name="employee" label="ลูกจ้างประจำ" />
</q-tabs>
</div>
<q-separator/>
<div class="col-12 row q-pa-md">
<div class="row col-12">
<div class="row col-12 q-col-gutter-sm">
<q-select
v-model="fiscalyear"
label="ปีงบประมาณ"
dense
class="text-grey"
active-color="primary"
indicator-color="primary"
align="left"
narrow-indicator
>
<q-tab name="samun" label="ขรก.กทม.สามัญ" />
<q-tab name="employee" label="ลูกจ้างประจำ" />
</q-tabs>
</div>
emit-value
map-options
:options="fiscalyearOP"
option-value="id"
option-label="name"
lazy-rules
hide-bottom-space
:readonly="false"
:borderless="false"
:outlined="true"
:hide-dropdown-icon="false"
style="min-width: 150px;"
@update:model-value="searchFilterTable"
/>
<div>
<q-btn
@click="clickAdd()"
size="12px"
flat
round
color="add"
icon="mdi-plus"
>
<q-tooltip>เพิ่มผู้ทดลองปฏิบัติหน้าที่ราชการ</q-tooltip>
</q-btn>
<!-- <q-menu>
<q-list style="min-width: 100px">
<q-item clickable @click="clickAdd">
<q-item-section>ขรก.กทม.สามัญ</q-item-section>
</q-item>
<q-item clickable @click="clickAdd">
<q-item-section>ลูกจ้างประจำ</q-item-section>
</q-item>
</q-list>
</q-menu> -->
</div>
<q-space />
<q-space />
<q-table
ref="table"
:columns="columns"
:rows="rows"
:filter="filterKeyword"
row-key="name"
flat
bordered
:paging="true"
dense
class="custom-header-table"
v-bind="attrs"
:visible-columns="visibleColumns"
:pagination-label="paginationLabel"
v-model:pagination="pagination"
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th v-for="col in props.cols" :key="col.name" :props="props">
<span class="text-weight-medium">{{ col.label }}</span>
</q-th>
<q-th auto-width />
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td key="no" :props="props">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="Date" :props="props">
{{ props.row.Date }}
</q-td>
<q-td key="retireNumber" :props="props">
{{ props.row.retireNumber }}
</q-td>
<q-td auto-width>
<q-btn
dense
size="12px"
flat
round
color="red"
@click="clickDelete(props.row.id)"
icon="mdi-delete"
>
<q-tooltip>ลบข้อมูล</q-tooltip>
</q-btn>
</q-td>
</q-tr>
</template>
<template v-slot:pagination="scope">
<q-pagination
v-model="pagination.page"
active-color="primary"
color="primary"
:max="scope.pagesNumber"
:max-pages="5"
size="sm"
boundary-links
direction-links
></q-pagination>
</template>
</q-table>
<q-input
class="col-xs-12 col-sm-3 col-md-2"
standout
dense
v-model="filterKeyword"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
>
<template v-slot:append>
<q-icon v-if="filterKeyword == ''" name="search" />
<q-icon
v-if="filterKeyword !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</template>
</q-input>
<q-select
v-model="visibleColumns"
multiple
outlined
dense
options-dense
:display-value="$q.lang.table.columns"
emit-value
map-options
:options="columns"
option-value="name"
options-cover
style="min-width: 150px"
class="col-xs-12 col-sm-3 col-md-2"
/>
</div>
<div class="col-12 q-pt-sm">
<q-table
ref="table"
:columns="columns"
:rows="rows"
:filter="filterKeyword"
row-key="name"
flat
bordered
:paging="true"
dense
class="custom-header-table"
v-bind="attrs"
:visible-columns="visibleColumns"
:pagination-label="paginationLabel"
v-model:pagination="pagination"
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th v-for="col in props.cols" :key="col.name" :props="props">
<span class="text-weight-medium">{{ col.label }}</span>
</q-th>
<q-th auto-width />
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td key="no" :props="props">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="Date" :props="props">
{{ props.row.Date }}
</q-td>
<q-td key="retireNumber" :props="props">
{{ props.row.retireNumber }}
</q-td>
<q-td auto-width>
<q-btn
dense
size="12px"
flat
round
color="red"
@click="clickDelete(props.row.id)"
icon="mdi-delete"
>
<q-tooltip>ลบข้อมูล</q-tooltip>
</q-btn>
</q-td>
</q-tr>
</template>
<template v-slot:pagination="scope">
<q-pagination
v-model="pagination.page"
active-color="primary"
color="primary"
:max="scope.pagesNumber"
:max-pages="5"
size="sm"
boundary-links
direction-links
></q-pagination>
</template>
</q-table>
</div>
</div>
</div>
</q-card>
@ -176,8 +177,6 @@ import type {
FormMainProbation,
FormMainProbation2,
} from "@/modules/05_placement/interface/request/Main";
import DialogHeader from "@/modules/04_registry/components/DialogHeader.vue";
import router from "@/router";
import { useQuasar } from "quasar";
const $q = useQuasar(); //ใช้ noti quasar

2
src/modules/08_registryEmployee/router.ts
View file

@ -14,7 +14,7 @@ const Detail = defineAsyncComponent(
export default [
{
path: "/registry-employee",
path: "/registryEmployee",
name: "registryEmployee",
component: Main,
meta: {

8
src/modules/08_registryEmployee/views/Detail.vue
View file

@ -150,10 +150,10 @@
<div class="row items-center text-dark q-ml-md">
<div class="column">
<div class="text-bold q-pb-xs text-name">
{{ "เพิ่มข้อมูลทะเบียนประวัติ" }}
เพิ่มข้อมูลทะเบียนประวัติ
</div>
<div class="text-bold q-pb-xs text-sub">
{{ "ลูกจ้างชั่วคราว" }}
ลูกจ้างชั่วคราว
</div>
</div>
</div>
@ -1000,12 +1000,12 @@ const Retire = async () => {
}
.text-name {
font-size: 1.5em;
font-size: 1.3em;
overflow: hidden;
}
.text-sub {
font-size: 1.5em;
font-size: 1.2em;
overflow: hidden;
color: var(--q-primary);
}

216
src/modules/08_registryEmployee/views/Main.vue
View file

@ -2,9 +2,8 @@
<div class="toptitle text-dark col-12 row items-center">
รายชื่อลูกจ้างชั่วคราว
</div>
<div>
<div class="q-pa-md" style="min-height: 70vh; overflow-y: scroll">
<div class="col-12 row q-py-sm items-center">
<q-card flat bordered class="q-pa-md">
<div class="col-12 row items-center">
<q-btn flat round color="primary" @click="clickAdd" icon="mdi-plus">
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
</q-btn>
@ -49,116 +48,111 @@
/>
</div>
</div>
<q-table
flat
bordered
dense
:rows="rows"
:columns="columns"
:visible-columns="visibleColumns"
:filter="filter"
row-key="name"
class="custom-header-table"
:pagination-label="paginationLabel"
v-model:pagination="pagination"
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th v-for="col in props.cols" :key="col.name" :props="props">
<span class="text-weight-medium">{{ col.label }}</span>
</q-th>
<q-th auto-width />
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td key="no" :props="props">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="positionNum" :props="props">
{{ props.row.positionNum }}
</q-td>
<q-td key="name" :props="props">
{{ props.row.name }}
</q-td>
<q-td key="position" :props="props">
{{ props.row.position }}
</q-td>
<q-td key="path" :props="props">
{{ props.row.path }}
</q-td>
<q-td key="type" :props="props">
{{ props.row.type }}
</q-td>
<q-td key="level" :props="props">
{{ props.row.level }}
</q-td>
<q-td key="affiliation" :props="props">
{{ props.row.affiliation }}
</q-td>
<q-td key="yearly" :props="props">
{{ props.row.yearly }}
</q-td>
<q-td key="pay" :props="props">
{{ props.row.pay }}
</q-td>
<q-td auto-width>
<q-btn
icon="mdi-dots-vertical"
size="12px"
color="grey-7"
flat
round
dense
>
<q-menu transition-show="jump-down" transition-hide="jump-up">
<q-list dense style="min-width: 150px">
<q-item
clickable
v-close-popup
@click="editDetail(props.row)"
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
<div class="col-12 q-pt-sm">
<q-table
flat
bordered
dense
:rows="rows"
:columns="columns"
:visible-columns="visibleColumns"
:filter="filter"
row-key="name"
class="custom-header-table"
:pagination-label="paginationLabel"
v-model:pagination="pagination"
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th v-for="col in props.cols" :key="col.name" :props="props">
<span class="text-weight-medium">{{ col.label }}</span>
</q-th>
<q-th auto-width />
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td key="no" :props="props">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="positionNum" :props="props">
{{ props.row.positionNum }}
</q-td>
<q-td key="name" :props="props">
{{ props.row.name }}
</q-td>
<q-td key="position" :props="props">
{{ props.row.position }}
</q-td>
<q-td key="path" :props="props">
{{ props.row.path }}
</q-td>
<q-td key="type" :props="props">
{{ props.row.type }}
</q-td>
<q-td key="level" :props="props">
{{ props.row.level }}
</q-td>
<q-td key="affiliation" :props="props">
{{ props.row.affiliation }}
</q-td>
<q-td key="yearly" :props="props">
{{ props.row.yearly }}
</q-td>
<q-td key="pay" :props="props">
{{ props.row.pay }}
</q-td>
<q-td auto-width>
<q-btn
icon="mdi-dots-vertical"
size="12px"
color="grey-7"
flat
round
dense
>
<q-menu transition-show="jump-down" transition-hide="jump-up">
<q-list dense style="min-width: 160px">
<q-item
clickable
v-close-popup
@click="editDetail(props.row)"
>
</q-item-section>
<q-item-section>กำหนดตำแหน่ง</q-item-section>
</q-item>
<q-separator />
<q-item clickable v-close-popup @click="clickDelete('test')">
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
</q-item-section>
<q-item-section>ลบ</q-item-section>
</q-item>
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
<q-icon color="blue" size="xs" name="mdi-account-settings" />
</q-item-section>
<q-item-section>กำหนดตำแหน่ง</q-item-section>
</q-item>
<q-separator />
<q-item clickable v-close-popup @click="clickDelete('test')">
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
<q-icon color="red" size="xs" name="mdi-delete" />
</q-item-section>
<q-item-section>ลบ</q-item-section>
</q-item>
<q-separator />
</q-list>
</q-menu>
</q-btn>
</q-td>
</q-tr>
</template>
<template v-slot:pagination="scope">
<q-pagination
v-model="pagination.page"
color="primary"
:max="scope.pagesNumber"
:max-pages="5"
size="sm"
boundary-links
direction-links
></q-pagination>
</template>
</q-table>
</div>
<q-separator />
</div>
<q-separator />
</q-list>
</q-menu>
</q-btn>
</q-td>
</q-tr>
</template>
<template v-slot:pagination="scope">
<q-pagination
v-model="pagination.page"
active-color="primary"
color="dark"
:max="scope.pagesNumber"
:max-pages="5"
size="sm"
boundary-links
direction-links
></q-pagination>
</template>
</q-table>
</div>
</q-card>
</template>
<script setup lang="ts">
import { ref, onMounted } from "vue";

3
src/style/quasar-variables.sass
View file

@ -68,6 +68,9 @@ div
$separator-color: #EDEDED !default
.bg-teal-1
background: #e0f2f1a6 !important
.table_ellipsis
max-width: 200px
white-space: nowrap

4
src/views/MainLayout.vue
View file

@ -559,7 +559,7 @@ if (keycloak.tokenParsed != null) {
v-ripple
:active="link === menuItem.label"
@click="link = menuItem.label"
active-class="text-primary menuActiveMini"
active-class="text-primary menuActiveMini text-weight-medium"
v-if="menuItem.key == 3 || menuItem.key == 5"
>
<div class="row items-center no-wrap">
@ -939,7 +939,7 @@ if (keycloak.tokenParsed != null) {
background: #1e2529d9;
} */
.font-400{
font-weight: 400 !important;
font-weight: 400 ;
}
.expan2 .menuSubHover {
padding-left: 30%;