#6825 - VnTable V1 #396

Merged
alexm merged 73 commits from 6825-vnTable into dev 2024-06-20 13:08:55 +00:00
2 changed files with 37 additions and 27 deletions
Showing only changes of commit c4441eed1f - Show all commits

View File

@ -111,17 +111,19 @@ function alignRow() {
</div>
<div
v-if="columnFilter !== false && column.field != 'tableActions'"
class="row no-wrap full-width"
class="row no-wrap"
:class="alignRow()"
>
<VnTableColumn
:column="$props.column"
:row="{}"
default="input"
v-model="model"
:components="components"
component-prop="columnFilter"
/>
<span :class="$props.column.component != 'checkbox' ? 'full-width' : alignRow()">
<VnTableColumn
:column="$props.column"
alexm marked this conversation as resolved Outdated

No creo que se definan mas posiciones o posiciones "custom", sino considerar cambiar por un switch o un objeto.

No creo que se definan mas posiciones o posiciones "custom", sino considerar cambiar por un switch o un objeto.
Outdated
Review

No soy demasiado fan de swtich la vd, pero cambiado

    if ($props.column.align == 'left') return 'justify-start items-start';
    if ($props.column.align == 'right') return 'justify-end items-end';
    return 'flex-center';

a

    switch ($props.column.align) {
        case 'left':
            return 'justify-start items-start';
        case 'right':
            return 'justify-end items-end';
        default:
            return 'flex-center';
    }
No soy demasiado fan de swtich la vd, pero cambiado ``` if ($props.column.align == 'left') return 'justify-start items-start'; if ($props.column.align == 'right') return 'justify-end items-end'; return 'flex-center'; ``` a ``` switch ($props.column.align) { case 'left': return 'justify-start items-start'; case 'right': return 'justify-end items-end'; default: return 'flex-center'; } ```
:row="{}"
default="input"
v-model="model"
:components="components"
component-prop="columnFilter"
/>
</span>
</div>
<div v-else-if="showTitle" style="height: 45px"><!-- fixme! --></div>
</template>

View File

@ -240,7 +240,10 @@ defineExpose({
</template>
<template #body-cell="{ col, row }">
<!-- Columns -->
<QTd class="no-padding" :class="`text-${col.align ?? 'left'}`">
<QTd
class="no-padding no-margin"
:class="`text-${col.align ?? 'left'}`"
>
<VnTableColumn
:column="col"
:row="row"
alexm marked this conversation as resolved
Review

👀

👀
@ -366,6 +369,13 @@ defineExpose({
</FormModelPopup>
</QDialog>
</template>
<i18n>
en:
status: Status
es:
status: Estados
</i18n>
<style lang="scss">
.bg-chip-secondary {
background-color: var(--vn-page-color);
@ -438,23 +448,6 @@ defineExpose({
}
}
alexm marked this conversation as resolved Outdated

scrollbar en app.scss

/* ===== Scrollbar CSS ===== /
/
Firefox */

  • {
    scrollbar-width: auto;
    scrollbar-color: $primary;
    }

/* Chrome, Edge, and Safari */
*::-webkit-scrollbar {
width: 10px;
height: 10px;
}

*::-webkit-scrollbar-thumb {
background-color: $primary;
border-radius: 10px;
}

scrollbar en app.scss /* ===== Scrollbar CSS ===== */ /* Firefox */ * { scrollbar-width: auto; scrollbar-color: $primary; } /* Chrome, Edge, and Safari */ *::-webkit-scrollbar { width: 10px; height: 10px; } *::-webkit-scrollbar-thumb { background-color: $primary; border-radius: 10px; }
// WIP TRANSITIONS
// .grid-item {
// background-color: red;
// transition: all 500ms ease;
// }
// .grid-move {
// background-color: #6b7280 !important;
// transform: scale(0.9);
// }
.divisor-line {
height: 1px;
background-color: var(--vn-section-color);
border: none;
}
.q-table th {
padding: 0;
}
@ -470,6 +463,21 @@ defineExpose({
.q-table__top {
top: 0;
}
tbody {
.q-checkbox {
display: flex;
margin-bottom: 9px;
& .q-checkbox__label {
margin-left: 31px;
color: var(--vn-text-color);
}
& .q-checkbox__inner {
position: absolute;
left: 0;
color: var(--vn-label-color);
}
}
}
}
.vn-label-value {