0
0
Fork 0

refactor(style): refs #7001 add style font vnTitle vnChip

This commit is contained in:
Pablo Natek 2024-03-14 15:06:06 +01:00
parent 0c3dc30b8c
commit 00a47cd5b2
51 changed files with 304 additions and 304 deletions

View File

@ -106,7 +106,7 @@ const pinnedModulesRef = ref();
width: max-content;
}
.q-header {
background-color: var(--vn-dark);
background-color: var(--vn-section-color);
}
</style>
<i18n>

View File

@ -71,7 +71,7 @@ function getBreadcrumb(param) {
}
&--last,
&__separator {
color: var(--vn-label);
color: var(--vn-label-color);
}
}
@media (max-width: $breakpoint-md) {

View File

@ -0,0 +1,13 @@
<script setup>
const $props = defineProps({
color: { type: String, default: null },
text: { type: String, default: null },
dense: { type: String, default: null },
textColor: { type: String, default: 'black' },
});
</script>
<template>
<QChip :color="$props.color" :text-color="textColor" :dense="$props.dense">{{
text
}}</QChip>
</template>

View File

@ -304,7 +304,7 @@ function parseDms(data) {
row-gap: 20px;
}
.labelColor {
color: var(--vn-label);
color: var(--vn-label-color);
}
</style>
<i18n>

View File

@ -14,6 +14,7 @@ import VnJsonValue from '../common/VnJsonValue.vue';
import FetchData from '../FetchData.vue';
import VnSelectFilter from './VnSelectFilter.vue';
import VnUserLink from '../ui/VnUserLink.vue';
import VnChip from '../common/VnChip.vue';
const stateStore = useStateStore();
const validationsStore = useValidator();
@ -443,10 +444,10 @@ setLogTree();
>
<QItemSection>
<QItemLabel class="model-info q-mb-xs" v-if="!byRecord">
<QChip
dense
<VnChip
size="md"
class="model-name q-mr-xs text-white"
text-color="white"
class="model-name q-mr-xs"
v-if="
!(modelLog.changedModel && modelLog.changedModelId) &&
modelLog.model
@ -455,9 +456,9 @@ setLogTree();
backgroundColor: useColor(modelLog.model),
}"
:title="modelLog.model"
>
{{ t(modelLog.modelI18n) }}
</QChip>
:text="t(modelLog.modelI18n)"
dense="dense"
/>
<span class="model-id" v-if="modelLog.id"
>#{{ modelLog.id }}</span
>
@ -819,7 +820,7 @@ setLogTree();
</template>
<style lang="scss" scoped>
.q-card {
background-color: var(--vn-gray);
background-color: var(--vn-section-color);
}
.q-item {
min-height: 0px;
@ -916,7 +917,7 @@ setLogTree();
font-style: italic;
}
.model-id {
color: var(--vn-label);
color: var(--vn-label-color);
font-size: 0.9rem;
}
.q-btn {
@ -942,7 +943,7 @@ setLogTree();
}
.change-info {
overflow: hidden;
background-color: var(--vn-dark);
background-color: var(--vn-section-color);
& > .date {
overflow: hidden;
white-space: nowrap;
@ -981,7 +982,7 @@ setLogTree();
position: relative;
overflow: hidden;
text-overflow: ellipsis;
background-color: var(--vn-gray);
background-color: var(--vn-section-color);
white-space: nowrap;
box-sizing: border-box;
& > .q-icon {

View File

@ -79,7 +79,7 @@ const toggleForm = () => {
border-radius: 50px;
&.--add-icon {
color: var(--vn-text);
color: var(--vn-text-color);
background-color: $primary;
}
}

View File

@ -4,6 +4,7 @@ import { useI18n } from 'vue-i18n';
import { useDialogPluginComponent } from 'quasar';
import VnInput from 'src/components/common/VnInput.vue';
import VnChip from 'src/components/common/VnChip.vue';
const { dialogRef, onDialogOK } = useDialogPluginComponent();
const { t, availableLocales } = useI18n();
@ -137,9 +138,7 @@ async function send() {
/>
</template>
<template #counter>
<QChip :color="color" dense>
{{ totalLength }}/{{ maxLength }}
</QChip>
<VnChip :color="color" :text="totalLength + '/' + maxLength" />
</template>
</QInput>
</QCardSection>

View File

@ -2,20 +2,24 @@
const $props = defineProps({
url: { type: String, default: null },
text: { type: String, default: null },
icon: { type: String, default: null },
icon: { type: String, default: 'open_in_new' },
});
</script>
<template>
<div class="titleBox">
<div class="header-link">
<a :href="$props.url" class="link">
{{ text }}
<QIcon :name="$props.icon" />
<a :href="$props.url" :class="$props.url ? 'link' : 'normalTitle'">
{{ $props.text }}
<QIcon v-if="url" :name="$props.icon" />
</a>
</div>
</div>
</template>
<style scoped>
<style scoped lang="scss">
.normalTitle {
color: whitesmoke;
cursor: auto;
}
a {
font-size: large;
}

View File

@ -171,7 +171,7 @@ const emit = defineEmits(['onFetch']);
<style lang="scss">
.body {
background-color: var(--vn-gray);
background-color: var(--vn-section-color);
.text-h5 {
padding-top: 5px;
padding-bottom: 5px;
@ -187,7 +187,7 @@ const emit = defineEmits(['onFetch']);
display: flex;
padding: 2px 16px;
.label {
color: var(--vn-label);
color: var(--vn-label-color);
font-size: 12px;
&:not(:has(a))::after {
@ -195,7 +195,7 @@ const emit = defineEmits(['onFetch']);
}
}
.value {
color: var(--vn-text);
color: var(--vn-text-color);
font-size: 14px;
margin-left: 12px;
overflow: hidden;
@ -220,13 +220,13 @@ const emit = defineEmits(['onFetch']);
}
}
.subtitle {
color: var(--vn-text);
color: var(--vn-text-color);
font-size: 16px;
margin-bottom: 15px;
}
.list-box {
.q-item__label {
color: var(--vn-label);
color: var(--vn-label-color);
}
}
.descriptor {

View File

@ -1,5 +1,6 @@
<script setup>
import { useI18n } from 'vue-i18n';
import VnChip from 'src/components/common/VnChip.vue';
const { t } = useI18n();
@ -28,9 +29,12 @@ const toggleCardCheck = (item) => {
<div class="title text-primary text-weight-bold text-h5">
{{ $props.title }}
</div>
<QChip class="q-chip-color" outline size="sm">
{{ t('ID') }}: {{ $props.id }}
</QChip>
<VnChip
:text="'ID:' + $props.id"
class="q-chip-color"
outline
size="sm"
/>
</div>
<QCheckbox
v-if="showCheckbox"
@ -61,7 +65,7 @@ const toggleCardCheck = (item) => {
}
.q-chip-color {
color: var(--vn-label);
color: var(--vn-label-color) !important;
}
.card-list-body {
@ -75,7 +79,7 @@ const toggleCardCheck = (item) => {
width: 50%;
.label {
width: 35%;
color: var(--vn-label);
color: var(--vn-label-color);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
@ -117,7 +121,7 @@ const toggleCardCheck = (item) => {
transition: background-color 0.2s;
}
.card:hover {
background-color: var(--vn-gray);
background-color: var(--vn-section-color);
}
.list-items {
width: 75%;

View File

@ -87,7 +87,7 @@ watch(props, async () => {
justify-content: space-evenly;
gap: 10px;
padding: 10px;
background-color: var(--vn-gray);
background-color: var(--vn-section-color);
> .q-card.vn-one {
flex: 1;
@ -104,7 +104,7 @@ watch(props, async () => {
> .q-card {
width: 100%;
background-color: var(--vn-gray);
background-color: var(--vn-section-color);
padding: 7px;
font-size: 16px;
min-width: 275px;
@ -114,7 +114,7 @@ watch(props, async () => {
flex-direction: row;
margin-top: 2px;
.label {
color: var(--vn-label);
color: var(--vn-label-color);
width: 8em;
overflow: hidden;
white-space: nowrap;
@ -124,7 +124,7 @@ watch(props, async () => {
flex-shrink: 0;
}
.value {
color: var(--vn-text);
color: var(--vn-text-color);
overflow: hidden;
}
}
@ -143,12 +143,12 @@ watch(props, async () => {
margin-bottom: 9px;
& .q-checkbox__label {
margin-left: 31px;
color: var(--vn-text);
color: var(--vn-text-color);
}
& .q-checkbox__inner {
position: absolute;
left: 0;
color: var(--vn-label);
color: var(--vn-label-color);
}
}
}

View File

@ -158,7 +158,7 @@ async function search() {
}
#searchbar {
.q-field--standout.q-field--highlighted .q-field__control {
background-color: var(--vn-text);
background-color: var(--vn-text-color);
}
}
</style>

View File

@ -4,6 +4,7 @@ import { date } from 'quasar';
import VnPaginate from 'src/components/ui/VnPaginate.vue';
import VnAvatar from '../ui/VnAvatar.vue';
import VnUserLink from 'src/components/ui/VnUserLink.vue';
import VnChip from '../common/VnChip.vue';
const $props = defineProps({
url: { type: String, default: null },
@ -89,15 +90,14 @@ function formatNumber(number) {
)
}}</QItemLabel>
<QItemLabel class="row center">
<QChip
<VnChip
:color="
row.sms.status == 'OK'
? 'positive'
: 'negative'
"
>
{{ row.sms.status }}
</QChip>
:text="row.sms.status"
/>
</QItemLabel>
</QItemSection>
</QItem>

View File

@ -2,29 +2,24 @@
@import './icons.scss';
body.body--light {
--fount-color: black;
--vn-sectionColor: #ffffff;
--vn-pageColor: #e0e0e0;
background-color: var(--vn-pageColor);
--font-color: black;
--vn-section-color: #e0e0e0;
--vn-page-color: #ffffff;
background-color: #ffffff;
.q-header .q-toolbar {
color: var(--fount-color);
color: var(--font-color);
}
--vn-text: var(--fount-color);
--vn-gray: var(--vn-sectionColor);
--vn-label: #5f5f5f;
--vn-dark: var(--vn-sectionColor);
--vn-light-gray: #e7e3e3;
--vn-text-color: var(--font-color);
--vn-label-color: #5f5f5f;
--vn-accent-color: #e7e3e3;
}
body.body--dark {
--vn-pageColor: #222;
--vn-SectionColor: #403c3c;
background-color: var(--vn-pageColor);
--vn-text: white;
--vn-gray: var(--vn-SectionColor);
--vn-label: #a8a8a8;
--vn-dark: var(--vn-SectionColor);
--vn-light-gray: #424242;
--vn-section-color: #403c3c;
background-color: #222;
--vn-text-color: white;
--vn-label-color: #a8a8a8;
--vn-accent-color: #424242;
}
a {
@ -59,19 +54,23 @@ a {
// Removes chrome autofill background
input:-webkit-autofill,
select:-webkit-autofill {
color: var(--vn-text);
color: var(--vn-text-color);
font-family: $typography-font-family;
-webkit-text-fill-color: var(--vn-text);
-webkit-text-fill-color: var(--vn-text-color);
-webkit-background-clip: text !important;
background-clip: text !important;
}
.bg-vn-dark {
background-color: var(--vn-dark);
background-color: var(--vn-section-color);
}
.bg-vn-dark {
background-color: var(--vn-section-color);
}
.color-vn-text {
color: var(--vn-text);
color: var(--vn-text-color);
}
.color-vn-white {
@ -79,8 +78,8 @@ select:-webkit-autofill {
}
.vn-card {
background-color: var(--vn-gray);
color: var(--vn-text);
background-color: var(--vn-section-color);
color: var(--vn-text-color);
border-radius: 8px;
}
@ -90,11 +89,11 @@ select:-webkit-autofill {
}
.bg-vn-primary-row {
background-color: var(--vn-dark);
background-color: var(--vn-section-color);
}
.bg-vn-secondary-row {
background-color: var(--vn-light-gray);
background-color: var(--vn-accent-color);
}
/* Estilo para el asterisco en campos requeridos */

View File

@ -14,10 +14,10 @@
// Tip: to add new colors https://quasar.dev/style/color-palette/#adding-your-own-colors
$primary: #ec8916;
$secondary: $primary;
$positive: #21ba45;
$negative: #c10015;
$info: #31ccec;
$warning: #f2c037;
$positive: #c8e484;
$negative: #fb5252;
$info: #84d0e2;
$warning: #f4b974;
// Pendiente de cuadrar con la base de datos
$success: $positive;
$alert: $negative;

View File

@ -107,7 +107,11 @@ onMounted(async () => {
<template #body="{ entity }">
<VnLv v-if="entity.claimState" :label="t('claim.card.state')">
<template #value>
<QBadge :color="stateColor(entity.claimState.code)" dense>
<QBadge
:color="stateColor(entity.claimState.code)"
text-color="black"
dense
>
{{ entity.claimState.description }}
</QBadge>
</template>

View File

@ -12,6 +12,7 @@ import FetchData from 'components/FetchData.vue';
import VnDiscount from 'components/common/vnDiscount.vue';
import ClaimLinesImport from './ClaimLinesImport.vue';
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
import VnChip from 'src/components/common/VnChip.vue';
const quasar = useQuasar();
const route = useRoute();
@ -161,16 +162,16 @@ function showImportDialog() {
<div class="row q-gutter-md">
<div>
{{ t('Amount') }}
<QChip :dense="$q.screen.lt.sm">
{{ toCurrency(amount) }}
</QChip>
<VnChip :dense="$q.screen.lt.sm" :text="toCurrency(amount)" />
</div>
<QSeparator dark vertical />
<div>
{{ t('Amount Claimed') }}
<QChip color="positive" :dense="$q.screen.lt.sm">
{{ toCurrency(amountClaimed) }}
</QChip>
<VnChip
color="positive"
:dense="$q.screen.lt.sm"
:text="toCurrency(amountClaimed)"
/>
</div>
</div>
</Teleport>

View File

@ -12,6 +12,7 @@ import ClaimNotes from 'src/pages/Claim/Card/ClaimNotes.vue';
import VnUserLink from 'src/components/ui/VnUserLink.vue';
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
import VnTitle from 'src/components/common/VnTitle.vue';
import VnChip from 'src/components/common/VnChip.vue';
const route = useRoute();
const { t } = useI18n();
@ -183,7 +184,6 @@ function openDialog(dmsId) {
<VnTitle
:url="`#/claim/${entityId}/basic-data`"
:text="t('claim.pageTitles.basicData')"
icon="open_in_new"
/>
<VnLv
:label="t('claim.summary.created')"
@ -191,9 +191,11 @@ function openDialog(dmsId) {
/>
<VnLv :label="t('claim.summary.state')">
<template #value>
<QChip :color="stateColor(claim.claimState.code)" dense>
{{ claim.claimState.description }}
</QChip>
<VnChip
:color="stateColor(claim.claimState.code)"
:text="claim.claimState.description"
dense="dense"
/>
</template>
</VnLv>
<VnLv :label="t('globals.salesPerson')">
@ -227,10 +229,10 @@ function openDialog(dmsId) {
/>
</QCard>
<QCard class="vn-three">
<a class="header header-link" :href="`#/claim/${entityId}/notes`">
{{ t('claim.summary.notes') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="`#/claim/${entityId}/notes`"
:text="t('claim.summary.notes')"
/>
<ClaimNotes
:id="entityId"
:add-note="false"
@ -239,10 +241,10 @@ function openDialog(dmsId) {
/>
</QCard>
<QCard class="vn-two" v-if="salesClaimed.length > 0">
<a class="header header-link" :href="`#/claim/${entityId}/lines`">
{{ t('claim.summary.details') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="`#/claim/${entityId}/lines`"
:text="t('claim.summary.details')"
/>
<QTable
:columns="detailsColumns"
:rows="salesClaimed"
@ -281,11 +283,10 @@ function openDialog(dmsId) {
</QTable>
</QCard>
<QCard class="vn-two" v-if="developments.length > 0">
<a class="header header-link" :href="claimUrl + 'development'">
{{ t('claim.summary.development') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="claimUrl + 'development'"
:text="t('claim.summary.development')"
/>
<QTable
:columns="developmentColumns"
:rows="developments"
@ -304,10 +305,10 @@ function openDialog(dmsId) {
</QTable>
</QCard>
<QCard class="vn-max" v-if="claimDms.length > 0">
<a class="header header-link" :href="`#/claim/${entityId}/photos`">
{{ t('claim.summary.photos') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="`#/claim/${entityId}/photos`"
:text="t('claim.summary.photos')"
/>
<div class="container">
<div
class="multimedia-container"
@ -347,10 +348,7 @@ function openDialog(dmsId) {
</QCard>
<QCard class="vn-max">
<a class="header header-link" :href="claimUrl + 'action'">
{{ t('claim.summary.actions') }}
<QIcon name="open_in_new" class="link" />
</a>
<VnTitle :url="claimUrl + 'action'" :text="t('claim.summary.actions')" />
<div id="slider-container" class="q-px-xl q-py-md">
<QSlider
v-model="claim.responsibility"

View File

@ -108,7 +108,11 @@ function navigate(event, id) {
/>
<VnLv :label="t('claim.list.state')">
<template #value>
<QBadge :color="stateColor(row.stateCode)" dense>
<QBadge
text-color="black"
:color="stateColor(row.stateCode)"
dense
>
{{ row.stateDescription }}
</QBadge>
</template>

View File

@ -150,14 +150,14 @@ const toCustomerConsigneeEdit = (consigneeId) => {
<style lang="scss" scoped>
.consignees-card {
border: 2px solid var(--vn-light-gray);
border: 2px solid var(--vn-accent-color);
border-radius: 10px;
padding: 10px;
display: flex;
cursor: pointer;
&:hover {
background-color: var(--vn-light-gray);
background-color: var(--vn-accent-color);
}
}
</style>

View File

@ -180,13 +180,13 @@ const toCustomerGreugeCreate = () => {
<style lang="scss">
.consignees-card {
border: 2px solid var(--vn-light-gray);
border: 2px solid var(--vn-accent-color);
border-radius: 10px;
padding: 10px;
}
.label-color {
color: var(--vn-label);
color: var(--vn-label-color);
}
</style>

View File

@ -85,12 +85,12 @@ const toCustomerNoteCreate = () => {
<style lang="scss">
.custom-border {
border: 2px solid var(--vn-light-gray);
border: 2px solid var(--vn-accent-color);
border-radius: 10px;
padding: 10px;
}
.label-color {
color: var(--vn-label);
color: var(--vn-label-color);
}
</style>

View File

@ -137,13 +137,13 @@ const toCustomerRecoverieCreate = () => {
<style lang="scss">
.consignees-card {
border: 2px solid var(--vn-light-gray);
border: 2px solid var(--vn-accent-color);
border-radius: 10px;
padding: 10px;
}
.label-color {
color: var(--vn-label);
color: var(--vn-label-color);
}
</style>

View File

@ -7,6 +7,7 @@ import CardSummary from 'components/ui/CardSummary.vue';
import { getUrl } from 'src/composables/getUrl';
import VnLv from 'src/components/ui/VnLv.vue';
import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
import VnTitle from 'src/components/common/VnTitle.vue';
const route = useRoute();
const { t } = useI18n();
@ -62,10 +63,10 @@ const creditWarning = computed(() => {
<CardSummary ref="summary" :url="`Clients/${entityId}/summary`">
<template #body="{ entity }">
<QCard class="vn-one">
<a class="header header-link" :href="`#/customer/${entityId}/basic-data`">
{{ t('customer.summary.basicData') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="`#/customer/${entityId}/basic-data`"
:text="t('customer.summary.basicData')"
/>
<VnLv :label="t('customer.summary.customerId')" :value="entity.id" />
<VnLv :label="t('customer.summary.name')" :value="entity.name" />
<VnLv :label="t('customer.summary.contact')" :value="entity.contact" />
@ -96,13 +97,10 @@ const creditWarning = computed(() => {
/>
</QCard>
<QCard class="vn-one">
<a
class="header header-link"
:href="`#/customer/${entityId}/fiscal-data`"
>
{{ t('customer.summary.fiscalAddress') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="`#/customer/${entityId}/fiscal-data`"
:text="t('customer.summary.fiscalAddress')"
/>
<VnLv
:label="t('customer.summary.socialName')"
:value="entity.socialName"
@ -124,14 +122,10 @@ const creditWarning = computed(() => {
<VnLv :label="t('customer.summary.street')" :value="entity.street" />
</QCard>
<QCard class="vn-one">
<a
class="header header-link"
:href="`#/customer/${entityId}/fiscal-data`"
link
>
{{ t('customer.summary.fiscalData') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="`#/customer/${entityId}/fiscal-data`"
:text="t('customer.summary.fiscalData')"
/>
<QCheckbox
:label="t('customer.summary.isEqualizated')"
v-model="entity.isEqualizated"
@ -169,14 +163,10 @@ const creditWarning = computed(() => {
/>
</QCard>
<QCard class="vn-one">
<a
class="header header-link"
:href="`#/customer/${entityId}/billing-data`"
link
>
{{ t('customer.summary.billingData') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="`#/customer/${entityId}/billing-data`"
:text="t('customer.summary.billingData')"
/>
<VnLv
:label="t('customer.summary.payMethod')"
:value="entity.payMethod.name"
@ -202,14 +192,10 @@ const creditWarning = computed(() => {
/>
</QCard>
<QCard class="vn-one" v-if="entity.defaultAddress">
<a
class="header header-link"
:href="`#/customer/${entityId}/consignees`"
link
>
{{ t('customer.summary.consignee') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="`#/customer/${entityId}/consignees`"
:text="t('customer.summary.consignee')"
/>
<VnLv
:label="t('customer.summary.addressName')"
:value="entity.defaultAddress.nickname"
@ -224,10 +210,10 @@ const creditWarning = computed(() => {
/>
</QCard>
<QCard class="vn-one" v-if="entity.account">
<a class="header header-link" :href="`#/customer/${entityId}/web-access`">
{{ t('customer.summary.webAccess') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="`#/customer/${entityId}/web-access`"
:text="t('customer.summary.webAccess')"
/>
<VnLv
:label="t('customer.summary.username')"
:value="entity.account.name"
@ -239,9 +225,7 @@ const creditWarning = computed(() => {
/>
</QCard>
<QCard class="vn-one" v-if="entity.account">
<div class="header header-link">
{{ t('customer.summary.businessData') }}
</div>
<VnTitle :text="t('customer.summary.businessData')" />
<VnLv
:label="t('customer.summary.totalGreuge')"
:value="toCurrency(entity.totalGreuge)"
@ -266,14 +250,11 @@ const creditWarning = computed(() => {
/>
</QCard>
<QCard class="vn-one" v-if="entity.account">
<a
class="header header-link"
:href="`https://grafana.verdnatura.es/d/40buzE4Vk/comportamiento-pagos-clientes?orgId=1&var-clientFk=${entityId}`"
link
>
{{ t('customer.summary.financialData') }}
<QIcon name="vn:grafana" />
</a>
<VnTitle
:url="`https://grafana.verdnatura.es/d/40buzE4Vk/comportamiento-pagos-clientes?orgId=1&var-clientFk=${entityId}`"
:text="t('customer.summary.financialData')"
icon="vn:grafana"
/>
<VnLv
:label="t('customer.summary.risk')"
:value="toCurrency(entity?.debt?.debt)"

View File

@ -30,16 +30,16 @@ const { t } = useI18n();
border: 1px solid black;
}
.title_balance {
color: var(--vn-text);
color: var(--vn-text-color);
margin-top: 0;
margin-bottom: 0;
}
.key_balance {
color: var(--vn-label);
color: var(--vn-label-color);
margin-bottom: 0;
}
.value_balance {
color: var(--vn-text);
color: var(--vn-text-color);
margin-bottom: 0;
}
</style>

View File

@ -196,7 +196,7 @@ function stateColor(row) {
</template>
<template #body-cell-state="{ row }">
<QTd auto-width class="text-center">
<QBadge :color="stateColor(row)">
<QBadge text-color="black" :color="stateColor(row)">
{{
row.isConfirmed
? t('Confirmed')
@ -227,6 +227,7 @@ function stateColor(row) {
v-if="col.name == 'state'"
>
<QBadge
text-color="black"
:color="
stateColor(row)
"

View File

@ -5,6 +5,7 @@ import { useI18n } from 'vue-i18n';
import CardSummary from 'components/ui/CardSummary.vue';
import { getUrl } from 'src/composables/getUrl';
import VnLv from 'src/components/ui/VnLv.vue';
import VnTitle from 'src/components/common/VnTitle.vue';
const route = useRoute();
const { t } = useI18n();
@ -36,13 +37,10 @@ onMounted(async () => {
</template>
<template #body="{ entity: department }">
<QCard class="column">
<a
class="header header-link"
:href="`#/department/department/${entityId}/basic-data`"
>
{{ t('Basic data') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="`#/department/department/${entityId}/basic-data`"
:text="t('Basic data')"
/>
<div class="full-width row wrap justify-between content-between">
<div class="column" style="min-width: 50%">
<VnLv

View File

@ -449,7 +449,7 @@ const showLockIcon = (groupingMode, mode) => {
<style lang="scss" scoped>
.separation-row {
background-color: var(--vn-gray) !important;
background-color: var(--vn-section-color) !important;
}
.grid-style-transition {
transition: transform 0.28s, background-color 0.28s;

View File

@ -5,9 +5,8 @@ import { useI18n } from 'vue-i18n';
import CardSummary from 'components/ui/CardSummary.vue';
import VnLv from 'src/components/ui/VnLv.vue';
import VnRow from 'components/ui/VnRow.vue';
import TravelDescriptorProxy from 'src/pages/Travel/Card/TravelDescriptorProxy.vue';
import FetchedTags from 'components/ui/FetchedTags.vue';
import VnTitle from 'src/components/common/VnTitle.vue';
import { toDate, toCurrency } from 'src/filters';
import { getUrl } from 'src/composables/getUrl';
@ -164,7 +163,7 @@ const fetchEntryBuys = async () => {
:url="`Entries/${entityId}/getEntry`"
@on-fetch="(data) => setEntryData(data)"
>
<template #header-left>
<template>
<a class="header-link" :href="entryUrl">
<QIcon name="open_in_new" color="white" size="sm" />
</a>
@ -175,10 +174,10 @@ const fetchEntryBuys = async () => {
<template #body>
<QCard class="vn-one">
<a class="header link" :href="`#/entry/${entityId}/basic-data`">
textos
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="`#/entry/${entityId}/basic-data`"
:text="t('basic data')"
/>
<VnLv :label="t('entry.summary.commission')" :value="entry.commission" />
@ -219,10 +218,7 @@ const fetchEntryBuys = async () => {
/>
</QCard>
<QCard class="vn-one">
<a class="header header-link" :href="entryUrl">
{{ t('Travel data') }}
<QIcon name="open_in_new" />
</a>
<VnTitle :url="entryUrl" :text="t('Travel data')" />
<VnLv :label="t('entry.summary.travelReference')">
<template #value>
@ -270,10 +266,7 @@ const fetchEntryBuys = async () => {
/>
</QCard>
<QCard class="vn-two" style="min-width: 100%">
<a class="header header-link">
{{ t('entry.summary.buys') }}
<QIcon name="open_in_new" />
</a>
<VnTitle :text="t('entry.summary.buys')" />
</QCard>
</template>
</CardSummary>
@ -281,7 +274,7 @@ const fetchEntryBuys = async () => {
<style lang="scss" scoped>
.separation-row {
background-color: var(--vn-gray) !important;
background-color: var(--vn-section-color) !important;
}
</style>

View File

@ -412,7 +412,7 @@ const removeTag = (index, params, search) => {
width: 60px;
height: 60px;
font-size: 1.4rem;
background-color: var(--vn-light-gray);
background-color: var(--vn-accent-color);
&.active {
background-color: $primary;

View File

@ -6,6 +6,8 @@ import { toCurrency, toDate } from 'src/filters';
import { getUrl } from 'src/composables/getUrl';
import CardSummary from 'components/ui/CardSummary.vue';
import VnLv from 'src/components/ui/VnLv.vue';
import VnChip from 'src/components/common/VnChip.vue';
import VnTitle from 'src/components/common/VnTitle.vue';
onMounted(async () => {
salixUrl.value = await getUrl('');
@ -209,10 +211,10 @@ function getLink(param) {
<!--Basic Data-->
<QCard class="vn-one">
<QCardSection class="q-pa-none">
<a class="header header-link" :href="getLink('basic-data')">
{{ t('invoiceIn.pageTitles.basicData') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="getLink('basic-data')"
:text="t('invoiceIn.pageTitles.basicData')"
/>
</QCardSection>
<VnLv
:label="t('invoiceIn.summary.supplier')"
@ -233,10 +235,10 @@ function getLink(param) {
</QCard>
<QCard class="vn-one">
<QCardSection class="q-pa-none">
<a class="header header-link" :href="getLink('basic-data')">
{{ t('invoiceIn.pageTitles.basicData') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="getLink('basic-data')"
:text="t('invoiceIn.pageTitles.basicData')"
/>
</QCardSection>
<VnLv
:ellipsis-value="false"
@ -258,10 +260,10 @@ function getLink(param) {
</QCard>
<QCard class="vn-one">
<QCardSection class="q-pa-none">
<a class="header header-link" :href="getLink('basic-data')">
{{ t('invoiceIn.pageTitles.basicData') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="getLink('basic-data')"
:text="t('invoiceIn.pageTitles.basicData')"
/>
</QCardSection>
<VnLv
:label="t('invoiceIn.summary.sage')"
@ -283,10 +285,10 @@ function getLink(param) {
</QCard>
<QCard class="vn-one">
<QCardSection class="q-pa-none">
<a class="header header-link" :href="getLink('basic-data')">
{{ t('invoiceIn.pageTitles.basicData') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="getLink('basic-data')"
:text="t('invoiceIn.pageTitles.basicData')"
/>
</QCardSection>
<QCardSection class="q-pa-none">
<div class="bordered q-px-sm q-mx-auto">
@ -300,7 +302,7 @@ function getLink(param) {
/>
<VnLv :label="t('invoiceIn.summary.dueTotal')">
<template #value>
<QChip
<VnChip
dense
class="q-pa-xs"
:color="amountsNotMatch ? 'negative' : 'transparent'"
@ -309,9 +311,8 @@ function getLink(param) {
? t('invoiceIn.summary.noMatch')
: t('invoiceIn.summary.dueTotal')
"
>
{{ toCurrency(invoiceIn.totals.totalDueDay) }}
</QChip>
:text="toCurrency(invoiceIn.totals.totalDueDay)"
/>
</template>
</VnLv>
</div>
@ -319,10 +320,7 @@ function getLink(param) {
</QCard>
<!--Vat-->
<QCard v-if="invoiceIn.invoiceInTax.length">
<a class="header header-link" :href="getLink('vat')">
{{ t('invoiceIn.card.vat') }}
<QIcon name="open_in_new" />
</a>
<VnTitle :url="getLink('vat')" :text="t('invoiceIn.card.vat')" />
<QTable
:columns="vatColumns"
:rows="invoiceIn.invoiceInTax"
@ -352,10 +350,7 @@ function getLink(param) {
</QCard>
<!--Due Day-->
<QCard v-if="invoiceIn.invoiceInDueDay.length">
<a class="header header-link" :href="getLink('due-day')">
{{ t('invoiceIn.card.dueDay') }}
<QIcon name="open_in_new" />
</a>
<VnTitle :url="getLink('due-day')" :text="t('invoiceIn.card.dueDay')" />
<QTable
class="full-width"
:columns="dueDayColumns"
@ -382,10 +377,10 @@ function getLink(param) {
</QCard>
<!--Intrastat-->
<QCard v-if="invoiceIn.invoiceInIntrastat.length">
<a class="header header-link" :href="getLink('intrastat')">
{{ t('invoiceIn.card.intrastat') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="getLink('intrastat')"
:text="t('invoiceIn.card.intrastat')"
/>
<QTable
:columns="intrastatColumns"
:rows="invoiceIn.invoiceInIntrastat"
@ -415,10 +410,10 @@ function getLink(param) {
</template>
<style lang="scss" scoped>
.bg {
background-color: var(--vn-light-gray);
background-color: var(--vn-accent-color);
}
.bordered {
border: 1px solid var(--vn-text);
border: 1px solid var(--vn-text-color);
max-width: 18em;
}
</style>

View File

@ -7,6 +7,7 @@ import { toCurrency, toDate } from 'src/filters';
import CardSummary from 'components/ui/CardSummary.vue';
import VnLv from 'src/components/ui/VnLv.vue';
import { getUrl } from 'src/composables/getUrl';
import VnTitle from 'src/components/common/VnTitle.vue';
onMounted(async () => {
fetch();
@ -101,10 +102,7 @@ const ticketsColumns = ref([
</template>
<template #body="{ entity: { invoiceOut } }">
<QCard class="vn-one">
<a class="header header-link">
{{ t('invoiceOut.pageTitles.basicData') }}
<QIcon name="open_in_new" />
</a>
<VnTitle :text="t('invoiceOut.pageTitles.basicData')" />
<VnLv
:label="t('invoiceOut.summary.issued')"
:value="toDate(invoiceOut.issued)"
@ -127,10 +125,7 @@ const ticketsColumns = ref([
/>
</QCard>
<QCard class="vn-three">
<a class="header header-link">
{{ t('invoiceOut.summary.taxBreakdown') }}
<QIcon name="open_in_new" />
</a>
<VnTitle :text="t('invoiceOut.summary.taxBreakdown')" />
<QTable :columns="taxColumns" :rows="invoiceOut.taxesBreakdown" flat>
<template #header="props">
<QTr :props="props">
@ -142,10 +137,7 @@ const ticketsColumns = ref([
</QTable>
</QCard>
<QCard class="vn-three">
<a class="header header-link">
{{ t('invoiceOut.summary.tickets') }}
<QIcon name="open_in_new" />
</a>
<VnTitle :text="t('invoiceOut.summary.tickets')" />
<QTable v-if="tickets" :columns="ticketsColumns" :rows="tickets" flat>
<template #header="props">
<QTr :props="props">

View File

@ -156,7 +156,7 @@ onUnmounted(() => {
display: flex;
justify-content: center;
width: 100%;
background-color: var(--vn-dark);
background-color: var(--vn-section-color);
padding: 16px;
.card-section {
@ -167,7 +167,7 @@ onUnmounted(() => {
.text {
font-size: 14px;
color: var(--vn-text);
color: var(--vn-text-color);
}
}

View File

@ -57,10 +57,13 @@ onMounted(async () => {
:href="button.url"
>
<div class="row items-center no-wrap q-gutter-md">
<div class="circle q-pa-sm" style="background-color: var(--vn-gray)">
<div
class="circle q-pa-sm"
style="background-color: var(--vn-section-color)"
>
<QImg :src="button.icon" class="q-pa-md" />
</div>
<div class="text-h5" style="color: var(--vn-gray)">
<div class="text-h5" style="color: var(--vn-section-color)">
{{ t(button.text) }}
</div>
</div>

View File

@ -420,7 +420,7 @@ const getCategoryClass = (category, params) => {
.category-icon {
border-radius: 50%;
background-color: var(--vn-light-gray);
background-color: var(--vn-accent-color);
font-size: 2.6rem;
padding: 8px;
cursor: pointer;

View File

@ -88,11 +88,11 @@ const dialog = ref(null);
font-size: 11px;
.label {
color: var(--vn-label);
color: var(--vn-label-color);
}
.value {
color: var(--vn-text);
color: var(--vn-text-color);
}
}
}
@ -125,7 +125,7 @@ const dialog = ref(null);
gap: 4px;
.subName {
color: var(--vn-label);
color: var(--vn-label-color);
text-transform: uppercase;
}

View File

@ -248,7 +248,7 @@ const detailsColumns = ref([
.subName {
text-transform: uppercase;
color: var(--vn-label);
color: var(--vn-label-color);
}
}
}

View File

@ -104,7 +104,7 @@ function extractTags(items) {
.no-result {
font-size: 24px;
font-weight: bold;
color: var(--vn-label);
color: var(--vn-label-color);
text-align: center;
}
</style>

View File

@ -14,6 +14,7 @@ import VnConfirm from 'components/ui/VnConfirm.vue';
import { toCurrency, toDate } from 'src/filters';
import { useSession } from 'composables/useSession';
import axios from 'axios';
import VnChip from 'src/components/common/VnChip.vue';
const route = useRoute();
const { t } = useI18n();
@ -150,9 +151,12 @@ async function confirmOrder() {
>
{{ row?.item?.name }}
</div>
<QChip class="q-chip-color" outline size="sm">
{{ t('ID') }}: {{ row.id }}
</QChip>
<VnChip
class="q-chip-color"
outline
size="sm"
:text="t('ID') + ':' + row.id"
/>
</div>
</template>
<template #list-items>
@ -213,7 +217,7 @@ async function confirmOrder() {
gap: 2%;
.label {
color: var(--vn-label);
color: var(--vn-label-color);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
@ -246,13 +250,13 @@ async function confirmOrder() {
}
.subname {
color: var(--vn-label);
color: var(--vn-label-color);
}
.no-result {
font-size: 24px;
font-weight: bold;
color: var(--vn-label);
color: var(--vn-label-color);
text-align: center;
}
</style>

View File

@ -104,7 +104,7 @@ function navigate(id) {
/>
<VnLv :label="t('order.field.landed')">
<template #value>
<QBadge color="positive" dense>
<QBadge text-color="black" color="positive" dense>
{{ toDate(row?.landed) }}
</QBadge>
</template>

View File

@ -106,7 +106,7 @@ const loadVolumes = async (rows) => {
gap: 2%;
.label {
color: var(--vn-label);
color: var(--vn-label-color);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
@ -132,7 +132,7 @@ const loadVolumes = async (rows) => {
.no-result {
font-size: 24px;
font-weight: bold;
color: var(--vn-label);
color: var(--vn-label-color);
text-align: center;
}
</style>

View File

@ -123,6 +123,7 @@ function downloadPdfs() {
<template #body-cell-hasCmrDms="{ value }">
<QTd align="center">
<QBadge
text-color="black"
:id="value ? 'true' : 'false'"
:label="
value

View File

@ -195,7 +195,7 @@ onMounted(async () => {
<style scoped lang="scss">
.label {
color: var(--vn-label);
color: var(--vn-label-color);
}
</style>

View File

@ -107,7 +107,7 @@ onMounted(() => {
<style lang="scss" scoped>
.border {
border-radius: 0px !important;
border: 1px solid var(--vn-text) !important;
border: 1px solid var(--vn-text-color) !important;
}
</style>

View File

@ -8,6 +8,7 @@ import { getUrl } from 'src/composables/getUrl';
import { useRole } from 'src/composables/useRole';
import { dashIfEmpty } from 'src/filters';
import VnUserLink from 'src/components/ui/VnUserLink.vue';
import VnTitle from 'src/components/common/VnTitle.vue';
onUpdated(() => summaryRef.value.fetch());
@ -51,7 +52,7 @@ const isAdministrative = computed(() => {
:url="`Suppliers/${entityId}/getSummary`"
@on-fetch="(data) => setData(data)"
>
<template #header-left>
<template>
<a v-if="isAdministrative" class="header header-link" :href="supplierUrl">
<QIcon name="open_in_new" color="white" size="sm" />
</a>

View File

@ -98,7 +98,10 @@ const setData = (entity) =>
</VnLv>
<VnLv v-if="entity.ticketState" :label="t('ticket.card.state')">
<template #value>
<QBadge :color="entity.ticketState.state.classColor">
<QBadge
text-color="black"
:color="entity.ticketState.state.classColor"
>
{{ entity.ticketState.state.name }}
</QBadge>
</template>

View File

@ -12,6 +12,8 @@ import VnLv from 'src/components/ui/VnLv.vue';
import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
import { getUrl } from 'src/composables/getUrl';
import VnUserLink from 'src/components/ui/VnUserLink.vue';
import VnChip from 'src/components/common/VnChip.vue';
import VnTitle from 'src/components/common/VnTitle.vue';
onUpdated(() => summaryRef.value.fetch());
@ -74,7 +76,7 @@ async function changeState(value) {
code: value,
};
await axios.post(`TicketTrackings/changeState`, formData);
await axios.post(`Tickets/state`, formData);
router.go(route.fullPath);
}
</script>
@ -102,8 +104,8 @@ async function changeState(value) {
<QBtnDropdown
side
top
color="orange-11"
text-color="black"
color="black"
text-color="white"
:label="t('ticket.summary.changeState')"
:disable="!isEditable()"
>
@ -147,15 +149,17 @@ async function changeState(value) {
</div>
</QCard>
<QCard class="vn-one">
<a class="header header-link" :href="ticketUrl + 'basic-data/step-one'">
{{ t('globals.summary.basicData') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="ticketUrl + 'basic-data/step-one'"
:text="t('globals.summary.basicData')"
/>
<VnLv :label="t('ticket.summary.state')">
<template #value>
<QChip :color="ticket.ticketState?.state?.classColor ?? 'dark'">
{{ ticket.ticketState?.state?.name }}
</QChip>
<VnChip
:color="ticket.ticketState?.state?.classColor ?? 'dark'"
dense="dense"
:text="ticket.ticketState?.state?.name"
/>
</template>
</VnLv>
<VnLv :label="t('ticket.summary.salesPerson')">
@ -193,10 +197,10 @@ async function changeState(value) {
/>
</QCard>
<QCard class="vn-one">
<a class="header header-link" :href="ticketUrl + 'basic-data/step-one'">
{{ t('globals.summary.basicData') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="ticketUrl + 'basic-data/step-one'"
:text="t('globals.summary.basicData')"
/>
<VnLv
:label="t('ticket.summary.shipped')"
:value="toDate(ticket.shipped)"
@ -236,10 +240,10 @@ async function changeState(value) {
/>
</QCard>
<QCard class="vn-one">
<a class="header header-link" :href="ticketUrl + 'observation'">
{{ t('ticket.pageTitles.notes') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="ticketUrl + 'observation'"
:text="t('ticket.pageTitles.notes')"
/>
<VnLv
v-for="note in ticket.notes"
:key="note.id"
@ -258,10 +262,10 @@ async function changeState(value) {
</VnLv>
</QCard>
<QCard class="vn-max">
<a class="header header-link" :href="ticketUrl + 'sale'">
{{ t('ticket.summary.saleLines') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="ticketUrl + 'sale'"
:text="t('ticket.summary.saleLines')"
/>
<QTable :rows="ticket.sales">
<template #header="props">
<QTr :props="props">
@ -396,10 +400,7 @@ async function changeState(value) {
class="vn-max"
v-if="ticket.packagings.length > 0 || ticket.services.length > 0"
>
<a class="header header-link" :href="ticketUrl + 'package'">
{{ t('globals.packages') }}
<QIcon name="open_in_new" />
</a>
<VnTitle :url="ticketUrl + 'package'" :text="t('globals.packages')" />
<QTable :rows="ticket.packagings" flat>
<template #header="props">
<QTr :props="props">
@ -416,11 +417,10 @@ async function changeState(value) {
</QTr>
</template>
</QTable>
<a class="header header-link q-mt-xl" :href="ticketUrl + 'service'">
{{ t('ticket.summary.service') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="ticketUrl + 'service'"
:text="t('ticket.summary.service')"
/>
<QTable :rows="ticket.services" flat>
<template #header="props">
<QTr :props="props">

View File

@ -89,6 +89,7 @@ function navigate(id) {
<VnLv :label="t('ticket.list.state')">
<template #value>
<QBadge
text-color="black"
:color="row.classColor ?? 'orange'"
class="q-ma-none"
dense

View File

@ -5,6 +5,7 @@ import { useI18n } from 'vue-i18n';
import CardSummary from 'components/ui/CardSummary.vue';
import VnLv from 'src/components/ui/VnLv.vue';
import VnTitle from 'src/components/common/VnTitle.vue';
import EntryDescriptorProxy from 'src/pages/Entry/Card/EntryDescriptorProxy.vue';
import FetchData from 'src/components/FetchData.vue';
import TravelDescriptorMenuItems from './TravelDescriptorMenuItems.vue';
@ -294,9 +295,7 @@ async function setTravelData(travelData) {
<VnLv :label="t('globals.totalEntries')" :value="travel.totalEntries" />
</QCard>
<QCard class="full-width" v-if="entriesTableRows.length > 0">
<span class="header header-link">
{{ t('travel.summary.entries') }}
</span>
<VnTitle :text="t('travel.summary.entries')" />
<QTable
:rows="entriesTableRows"
:columns="entriesTableColumns"

View File

@ -100,6 +100,7 @@ onMounted(async () => {
<VnLv :label="t('globals.shipped')">
<template #value>
<QBadge
text-color="black"
v-if="getDateQBadgeColor(row.shipped)"
:color="getDateQBadgeColor(row.shipped)"
class="q-ma-none"
@ -114,6 +115,7 @@ onMounted(async () => {
<VnLv :label="t('globals.landed')">
<template #value>
<QBadge
text-color="black"
v-if="getDateQBadgeColor(row.landed)"
:color="getDateQBadgeColor(row.landed)"
class="q-ma-none"

View File

@ -8,6 +8,7 @@ import VnLv from 'src/components/ui/VnLv.vue';
import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
import CardSummary from 'components/ui/CardSummary.vue';
import VnUserLink from 'src/components/ui/VnUserLink.vue';
import VnTitle from 'src/components/common/VnTitle.vue';
const route = useRoute();
const { t } = useI18n();
@ -71,10 +72,10 @@ const filter = {
</template>
<template #body="{ entity: worker }">
<QCard class="vn-one">
<a class="header header-link" :href="workerUrl + `basic-data`">
{{ t('worker.summary.basicData') }}
<QIcon name="open_in_new" />
</a>
<VnTitle
:url="workerUrl + `basic-data`"
:text="t('worker.summary.basicData')"
/>
<VnLv :label="t('worker.card.name')" :value="worker.user.nickname" />
<VnLv
:label="t('worker.list.department')"
@ -111,9 +112,7 @@ const filter = {
<VnLv :label="t('worker.summary.locker')" :value="worker.locker" />
</QCard>
<QCard class="vn-one">
<div class="header header-link">
{{ t('worker.summary.userData') }}
</div>
<VnTitle :text="t('worker.summary.userData')" />
<VnLv :label="t('worker.summary.userId')" :value="worker.user.id" />
<VnLv :label="t('worker.card.name')" :value="worker.user.nickname" />
<VnLv :label="t('worker.summary.role')" :value="worker.user.role.name" />