refactor to follow current styles
This commit is contained in:
parent
b143f1f9c7
commit
b017891508
|
|
@ -80,45 +80,30 @@ function getWorkerAvatar() {
|
|||
<q-img :src="getWorkerAvatar()" class="q-mb-md" />
|
||||
<q-list>
|
||||
<q-item>
|
||||
<q-item-section side>
|
||||
<q-icon name="person" />
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption> {{ t('worker.card.name') }} </q-item-label>
|
||||
<q-item-label>{{ worker.user.nickname }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section side>
|
||||
<q-icon name="email" />
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption> {{ t('worker.card.email') }} </q-item-label>
|
||||
<q-item-label>{{ worker.user.email }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section side>
|
||||
<q-icon name="work" />
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption> {{ t('worker.list.department') }} </q-item-label>
|
||||
<q-item-label>{{ worker.department.department.name }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section side>
|
||||
<q-icon name="phone" />
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption> {{ t('worker.card.phone') }} </q-item-label>
|
||||
<q-item-label>{{ worker.phone }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section side>
|
||||
<q-icon name="extension" />
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('worker.summary.sipExtension') }} </q-item-label>
|
||||
<q-item-label>{{ sipExtension() }}</q-item-label>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,6 @@ import { ref, onMounted, computed, onUpdated } from 'vue';
|
|||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useQuasar } from 'quasar';
|
||||
import { useSession } from 'src/composables/useSession';
|
||||
import axios from 'axios';
|
||||
import workerDescriptorDialog from './WorkerDescriptorDialog.vue';
|
||||
|
||||
|
|
@ -14,7 +13,6 @@ onUpdated(() => fetch());
|
|||
const route = useRoute();
|
||||
const { t } = useI18n();
|
||||
const quasar = useQuasar();
|
||||
const { getToken } = useSession();
|
||||
|
||||
t == t;
|
||||
|
||||
|
|
@ -86,11 +84,6 @@ function openDescriptorDialog(id) {
|
|||
},
|
||||
});
|
||||
}
|
||||
|
||||
function getWorkerAvatar() {
|
||||
const token = getToken();
|
||||
return `/api/Images/user/160x160/${worker.value.boss.id}/download?access_token=${token}`;
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -98,7 +91,9 @@ function getWorkerAvatar() {
|
|||
<q-card>
|
||||
<skeleton-summary v-if="!worker" />
|
||||
<template v-if="worker">
|
||||
<div class="header bg-primary q-pa-sm q-mb-md">{{ worker.id }} - {{ worker.firstName }}</div>
|
||||
<div class="header bg-primary q-pa-sm q-mb-md">
|
||||
{{ worker.id }} - {{ worker.firstName }} {{ worker.lastName }}
|
||||
</div>
|
||||
<div class="row q-pa-md q-col-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<q-list>
|
||||
|
|
@ -106,45 +101,30 @@ function getWorkerAvatar() {
|
|||
{{ t('worker.summary.basicData') }}
|
||||
</q-item-label>
|
||||
<q-item>
|
||||
<q-item-section side>
|
||||
<q-icon name="grid_3x3" />
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption> ID </q-item-label>
|
||||
<q-item-label>{{ worker.id }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section side>
|
||||
<q-icon name="person" />
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('worker.card.name') }} </q-item-label>
|
||||
<q-item-label>{{ worker.user.nickname }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section side>
|
||||
<q-icon name="work" />
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('worker.list.department') }} </q-item-label>
|
||||
<q-item-label>{{ worker.department.department.name }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section side>
|
||||
<q-icon name="email" />
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('worker.list.email') }} </q-item-label>
|
||||
<q-item-label>{{ worker.user.email }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item class="items-start cursor-pointer q-hoverable" v-if="worker.boss">
|
||||
<q-item-section side @click="openDescriptorDialog(worker.bossFk)">
|
||||
<q-img :src="getWorkerAvatar()" class="avatar" />
|
||||
</q-item-section>
|
||||
<q-item-section @click="openDescriptorDialog(worker.bossFk)">
|
||||
<q-item-label caption>{{ t('worker.summary.boss') }} </q-item-label>
|
||||
<q-item-label>
|
||||
|
|
@ -153,9 +133,6 @@ function getWorkerAvatar() {
|
|||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section side>
|
||||
<q-icon name="grid_3x3" />
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('worker.summary.phoneExtension') }} </q-item-label>
|
||||
<q-item-label>
|
||||
|
|
@ -164,18 +141,12 @@ function getWorkerAvatar() {
|
|||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section side>
|
||||
<q-icon name="phone" />
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('worker.summary.entPhone') }} </q-item-label>
|
||||
<q-item-label>{{ worker.phone }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section side>
|
||||
<q-icon name="phone_android" />
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('worker.summary.personalPhone') }} </q-item-label>
|
||||
<q-item-label>{{ worker.client.phone }}</q-item-label>
|
||||
|
|
@ -189,36 +160,24 @@ function getWorkerAvatar() {
|
|||
{{ t('worker.summary.userData') }}
|
||||
</q-item-label>
|
||||
<q-item>
|
||||
<q-item-section side>
|
||||
<q-icon name="grid_3x3" />
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption> {{ t('worker.summary.userId') }} </q-item-label>
|
||||
<q-item-label>{{ worker.user.id }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section side>
|
||||
<q-icon name="person" />
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('worker.card.name') }} </q-item-label>
|
||||
<q-item-label>{{ worker.user.nickname }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section side>
|
||||
<q-icon name="group" />
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('worker.summary.role') }} </q-item-label>
|
||||
<q-item-label>{{ worker.user.role.name }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section side>
|
||||
<q-icon name="extension" />
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('worker.summary.sipExtension') }} </q-item-label>
|
||||
<q-item-label>{{ sipExtension() }}</q-item-label>
|
||||
|
|
|
|||
|
|
@ -52,21 +52,23 @@ function viewSummary(id) {
|
|||
<q-card class="card" v-for="row in rows" :key="row.id">
|
||||
<q-item class="q-pa-none items-start cursor-pointer q-hoverable" v-ripple clickable>
|
||||
<q-item-section class="q-pa-md" @click="navigate(row.id)">
|
||||
<q-item-label caption>#{{ row.id }}</q-item-label>
|
||||
<q-item-label class="text-h6">{{ row.user.nickname }}</q-item-label>
|
||||
<q-item-label caption>#{{ row.id }}</q-item-label>
|
||||
<q-list>
|
||||
<q-item class="q-pa-none">
|
||||
<q-item-section class="q-pa-md">
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('worker.list.name') }}</q-item-label>
|
||||
<q-item-label>{{ row.user.name }}</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section class="q-pa-md">
|
||||
</q-item>
|
||||
<q-item class="q-pa-none">
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('worker.list.email') }}</q-item-label>
|
||||
<q-item-label>{{ row.user.email }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item class="q-pa-none">
|
||||
<q-item-section class="q-pa-md">
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('worker.list.department') }}</q-item-label>
|
||||
<q-item-label>{{ row.department.department.name }}</q-item-label>
|
||||
</q-item-section>
|
||||
|
|
|
|||
|
|
@ -2,10 +2,12 @@ import Customer from './customer';
|
|||
import Ticket from './ticket';
|
||||
import Claim from './claim';
|
||||
import InvoiceOut from './invoiceOut';
|
||||
import Worker from './worker';
|
||||
|
||||
export default [
|
||||
Customer,
|
||||
Ticket,
|
||||
Claim,
|
||||
InvoiceOut
|
||||
InvoiceOut,
|
||||
Worker
|
||||
]
|
||||
|
|
|
|||
|
|
@ -8,14 +8,14 @@ export default {
|
|||
icon: 'vn:worker',
|
||||
},
|
||||
component: RouterView,
|
||||
redirect: { name: 'workerMain' },
|
||||
redirect: { name: 'WorkerMain' },
|
||||
menus: {
|
||||
main: ['workerMain'],
|
||||
main: ['WorkerList'],
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
name: 'workerMain',
|
||||
name: 'WorkerMain',
|
||||
component: () => import('src/pages/Worker/WorkerMain.vue'),
|
||||
redirect: { name: 'WorkerList' },
|
||||
children: [
|
||||
|
|
@ -31,13 +31,13 @@ export default {
|
|||
],
|
||||
},
|
||||
{
|
||||
name: 'workerCard',
|
||||
name: 'WorkerCard',
|
||||
path: ':id',
|
||||
component: () => import('src/pages/Worker/Card/WorkerCard.vue'),
|
||||
redirect: { name: 'WorkerSummary' },
|
||||
children: [
|
||||
{
|
||||
name: 'workerSummary',
|
||||
name: 'WorkerSummary',
|
||||
path: 'summary',
|
||||
meta: {
|
||||
title: 'summary',
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import { useRole } from 'src/composables/useRole';
|
|||
import routes from 'src/router/modules';
|
||||
|
||||
export const useNavigationStore = defineStore('navigationStore', () => {
|
||||
const modules = ['customer', 'claim', 'ticket', 'invoiceOut'];
|
||||
const modules = ['customer', 'claim', 'ticket', 'invoiceOut', 'worker'];
|
||||
const pinnedModules = ref([]);
|
||||
const role = useRole();
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue