github
/
nocodb
mirror of https://github.com/nocodb/nocodb
1
0
Fork 0
Code Issues Releases Wiki Activity
Browse Source

#1675 revert some extra formattin

pull/1714/head
Naman Anand 2 years ago
parent
e35a984682
commit
0bc9e2de09
3 changed files with 198 additions and 227 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 67
      packages/nc-gui/assets/style/style.css
  2. 356
      packages/nc-gui/components/project/spreadsheet/components/columnFilter.vue
  3. 2
      packages/nc-gui/components/project/spreadsheet/components/sortListMenu.vue

67
packages/nc-gui/assets/style/style.css
Unescape View File

@ -114,18 +114,23 @@ html {
overflow: hidden; overflow: hidden;
} }
[v-cloak] { [v-cloak] {
display: none !important; display: none !important;
} }
.v-btn { .v-btn {
margin: 0 2px; margin: 0 2px;
} }
html { html {
overflow-y: auto !important; overflow-y: auto !important;
} }
/* nested expansion panel bug */ /* nested expansion panel bug */
.v-expansion-panel-header { .v-expansion-panel-header {
@ -136,6 +141,7 @@ html {
min-height: 64px !important; min-height: 64px !important;
} }
/* Table validation message */ /* Table validation message */
/*table .v-input__control {*/ /*table .v-input__control {*/
/* position: relative;*/ /* position: relative;*/
@ -146,11 +152,13 @@ html {
/* bottom: -4px;*/ /* bottom: -4px;*/
/*}*/ /*}*/
/*table edit dialog buttons*/ /*table edit dialog buttons*/
.v-small-dialog__actions button span { .v-small-dialog__actions button span {
font-weight: bolder; font-weight: bolder;
} }
/*resizer*/ /*resizer*/
.vertical-resizer { .vertical-resizer {
@ -211,25 +219,15 @@ html {
background: linear-gradient(180deg, black, rgb(55, 55, 55)); background: linear-gradient(180deg, black, rgb(55, 55, 55));
} }
.yellow-orange-gradient { .yellow-orange-gradient {
background: -moz-linear-gradient( background: -moz-linear-gradient(left, rgba(241, 231, 103, 1) 0%, rgba(254, 182, 69, 1) 100%);
left, background: -webkit-linear-gradient(left, rgba(241, 231, 103, 1) 0%, rgba(254, 182, 69, 1) 100%);
rgba(241, 231, 103, 1) 0%, background: linear-gradient(to right, rgba(241, 231, 103, 1) 0%, rgba(254, 182, 69, 1) 100%);
rgba(254, 182, 69, 1) 100%
);
background: -webkit-linear-gradient(
left,
rgba(241, 231, 103, 1) 0%,
rgba(254, 182, 69, 1) 100%
);
background: linear-gradient(
to right,
rgba(241, 231, 103, 1) 0%,
rgba(254, 182, 69, 1) 100%
);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f1e767', endColorstr='#feb645', GradientType=1); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f1e767', endColorstr='#feb645', GradientType=1);
} }
.white-gradient { .white-gradient {
background: linear-gradient(45deg, white, lightskyblue); background: linear-gradient(45deg, white, lightskyblue);
} }
@ -250,6 +248,7 @@ html {
background: linear-gradient(70deg, #fcbb07, #fcbb07); background: linear-gradient(70deg, #fcbb07, #fcbb07);
} }
.img-animation { .img-animation {
animation-name: vibrate; animation-name: vibrate;
animation-duration: 1.5s; animation-duration: 1.5s;
@ -263,6 +262,7 @@ html {
@keyframes vibrate { @keyframes vibrate {
0% { 0% {
transform: translateY(10px); transform: translateY(10px);
} }
100% { 100% {
@ -270,21 +270,26 @@ html {
} }
} }
.search-overlay .v-overlay__content { .search-overlay .v-overlay__content {
height: 100%; height: 100%;
width: 100%; width: 100%;
} }
/* Draggable tree hover color */ /* Draggable tree hover color */
.theme--dark .vtl-tree-node:hover { .theme--dark .vtl-tree-node:hover {
background-color: rgb(94, 94, 94) !important; background-color: rgb(94, 94, 94) !important;
} }
.theme--light .vtl-tree-node:hover { .theme--light .vtl-tree-node:hover {
background-color: rgb(240, 240, 240) !important; background-color: rgb(240, 240, 240) !important;
} }
/*vue tree list icon font */ /*vue tree list icon font */
/*.sql-query-treeview .vtl-icon-folder:before {*/ /*.sql-query-treeview .vtl-icon-folder:before {*/
@ -304,55 +309,57 @@ html {
/*}*/ /*}*/
.sql-query-treeview .vtl-tree-node .vtl-caret { .sql-query-treeview .vtl-tree-node .vtl-caret{
width: 1rem; width:1rem;
} }
.sql-query-treeview .vtl-tree-node { .sql-query-treeview .vtl-tree-node{
padding-top: 5px !important; padding-top: 5px !important;
padding-bottom: 5px !important; padding-bottom: 5px !important;
} }
.sql-query-treeview .custom-run-icon { .sql-query-treeview .custom-run-icon{}
}
.sql-editor .v-expansion-panel-header { .sql-editor .v-expansion-panel-header {
min-height: 36px !important; min-height: 36px !important;
padding: 0 0 0 10px; padding: 0 0 0 10px;
} }
.sql-editor .v-expansion-panel-header--active { .sql-editor .v-expansion-panel-header--active {
min-height: 40px !important; min-height: 40px !important;
} }
.api-client .v-expansion-panel-header { .api-client .v-expansion-panel-header {
min-height: 36px !important; min-height: 36px !important;
padding: 0 0 0 10px; padding: 0 0 0 10px;
} }
.api-client .v-expansion-panel-header--active { .api-client .v-expansion-panel-header--active {
min-height: 40px !important; min-height: 40px !important;
} }
.api-treeview .vtl-node-content { .api-treeview .vtl-node-content{
max-width: calc(100% - 44px); max-width: calc(100% - 44px);
} }
/* for expansion panel content wrapper */ /* for expansion panel content wrapper */
.expansion-wrap-0 .v-expansion-panel-content__wrap { .expansion-wrap-0 .v-expansion-panel-content__wrap{
padding: 0; padding: 0;
} }
.sql-query-treeview .vtl-operation { .sql-query-treeview .vtl-operation{
margin-left: 2px !important; margin-left: 2px !important;;
} }
.sql-query-treeview .vtl-tree-node { .sql-query-treeview .vtl-tree-node{
display: flex; display: flex;
} }
.sql-query-treeview .vtl-node-content { .sql-query-treeview .vtl-node-content{
flex-grow: 1; flex-grow: 1;
} }
.ignore-height-style table .v-input__control { .ignore-height-style table .v-input__control {
height: auto !important; height: auto !important;
} }
.cursor-pointer { .cursor-pointer{
cursor: pointer; cursor: pointer;
} }
@ -361,4 +368,4 @@ html {
.menu-filter-dropdown { .menu-filter-dropdown {
max-height: 500px; max-height: 500px;
overflow-y: scroll; overflow-y: scroll;
} }

356
packages/nc-gui/components/project/spreadsheet/components/columnFilter.vue
Unescape View File

@ -1,32 +1,27 @@
<template> <template>
<div <div
class="backgroundColor pa-2 menu-filter-dropdown" class="backgroundColor pa-2 menu-filter-dropdown"
:style="{ width: nested ? '100%' : '530px' }" :style="{width:nested ? '100%' : '530px'}"
> >
<div class="grid" @click.stop> <div class="grid" @click.stop>
<template v-for="(filter, i) in filters" dense> <template v-for="(filter,i) in filters" dense>
<template v-if="filter.status !== 'delete'"> <template v-if="filter.status !== 'delete'">
<div <div v-if="filter.is_group" :key="i" style="grid-column: span 4; padding:6px" class="elevation-4 ">
v-if="filter.is_group" <div class="d-flex" style="gap:6px; padding: 0 6px">
:key="i"
style="grid-column: span 4; padding: 6px"
class="elevation-4"
>
<div class="d-flex" style="gap: 6px; padding: 0 6px">
<v-icon <v-icon
v-if="!filter.readOnly" v-if="!filter.readOnly"
:key="i + '_3'" :key="i + '_3'"
small small
class="nc-filter-item-remove-btn" class="nc-filter-item-remove-btn"
@click.stop="deleteFilter(filter, i)" @click.stop="deleteFilter(filter,i)"
> >
mdi-close-box mdi-close-box
</v-icon> </v-icon>
<span v-else :key="i + '_1'" /> <span v-else :key="i + '_1'" />
<v-select <v-select
v-model="filter.logical_op" v-model="filter.logical_op"
class="flex-shrink-1 flex-grow-0 elevation-0 caption" class="flex-shrink-1 flex-grow-0 elevation-0 caption "
:items="['and', 'or']" :items="['and' ,'or']"
solo solo
flat flat
dense dense
@ -35,7 +30,7 @@
@click.stop @click.stop
@change="saveOrUpdate(filter, i)" @change="saveOrUpdate(filter, i)"
> >
<template #item="{ item }"> <template #item="{item}">
<span class="caption font-weight-regular">{{ item }}</span> <span class="caption font-weight-regular">{{ item }}</span>
</template> </template>
</v-select> </v-select>
@ -61,7 +56,7 @@
:key="i + '_3'" :key="i + '_3'"
small small
class="nc-filter-item-remove-btn" class="nc-filter-item-remove-btn"
@click.stop="deleteFilter(filter, i)" @click.stop="deleteFilter(filter,i)"
> >
mdi-close-box mdi-close-box
</v-icon> </v-icon>
@ -70,15 +65,14 @@
v-if="!i" v-if="!i"
:key="i + '_2'" :key="i + '_2'"
class="caption d-flex align-center" class="caption d-flex align-center"
>{{ $t("labels.where") }}</span >{{ $t('labels.where') }}</span>
>
<v-select <v-select
v-else v-else
:key="i + '_4'" :key="i + '_4'"
v-model="filter.logical_op" v-model="filter.logical_op"
class="flex-shrink-1 flex-grow-0 elevation-0 caption" class="flex-shrink-1 flex-grow-0 elevation-0 caption "
:items="['and', 'or']" :items="['and' ,'or']"
solo solo
flat flat
dense dense
@ -87,7 +81,7 @@
@click.stop @click.stop
@change="filterUpdateCondition(filter, i)" @change="filterUpdateCondition(filter, i)"
> >
<template #item="{ item }"> <template #item="{item}">
<span class="caption font-weight-regular">{{ item }}</span> <span class="caption font-weight-regular">{{ item }}</span>
</template> </template>
</v-select> </v-select>
@ -108,7 +102,7 @@
@click.stop @click.stop
@change="saveOrUpdate(filter, i)" @change="saveOrUpdate(filter, i)"
> >
<template #item="{ item }"> <template #item="{item}">
<span <span
:class="`caption font-weight-regular nc-filter-fld-${item.title}`" :class="`caption font-weight-regular nc-filter-fld-${item.title}`"
> >
@ -119,12 +113,12 @@
<v-select <v-select
:key="'k' + i" :key="'k' + i"
v-model="filter.comparison_op" v-model="filter.comparison_op"
class="flex-shrink-1 flex-grow-0 caption nc-filter-operation-select" class="flex-shrink-1 flex-grow-0 caption nc-filter-operation-select"
:items="filterComparisonOp(filter)" :items="filterComparisonOp(filter)"
:placeholder="$t('labels.operation')" :placeholder="$t('labels.operation')"
solo solo
flat flat
style="max-width: 120px" style="max-width:120px"
dense dense
:disabled="filter.readOnly" :disabled="filter.readOnly"
hide-details hide-details
@ -132,18 +126,11 @@
@click.stop @click.stop
@change="filterUpdateCondition(filter, i)" @change="filterUpdateCondition(filter, i)"
> >
<template #item="{ item }"> <template #item="{item}">
<span class="caption font-weight-regular">{{ item.text }}</span> <span class="caption font-weight-regular">{{ item.text }}</span>
</template> </template>
</v-select> </v-select>
<span <span v-if="['null', 'notnull', 'empty', 'notempty'].includes(filter.comparison_op)" :key="'span' + i" />
v-if="
['null', 'notnull', 'empty', 'notempty'].includes(
filter.comparison_op
)
"
:key="'span' + i"
/>
<v-checkbox <v-checkbox
v-else-if="types[filter.field] === 'boolean'" v-else-if="types[filter.field] === 'boolean'"
:key="i + '_7'" :key="i + '_7'"
@ -170,20 +157,26 @@
</template> </template>
</div> </div>
<v-btn small class="elevation-0 grey--text my-3" @click.stop="addFilter"> <v-btn
<v-icon small color="grey"> mdi-plus </v-icon> small
class="elevation-0 grey--text my-3"
@click.stop="addFilter"
>
<v-icon small color="grey">
mdi-plus
</v-icon>
<!-- Add Filter --> <!-- Add Filter -->
{{ $t("activity.addFilter") }} {{ $t('activity.addFilter') }}
</v-btn> </v-btn>
<slot /> <slot />
</div> </div>
</template> </template>
<script> <script>
import { UITypes } from "~/components/project/spreadsheet/helpers/uiTypes"; import { UITypes } from '~/components/project/spreadsheet/helpers/uiTypes'
export default { export default {
name: "ColumnFilter", name: 'ColumnFilter',
props: { props: {
fieldList: [Array], fieldList: [Array],
meta: Object, meta: Object,
@ -192,298 +185,269 @@ export default {
viewId: String, viewId: String,
shared: Boolean, shared: Boolean,
webHook: Boolean, webHook: Boolean,
hookId: String, hookId: String
}, },
data: () => ({ data: () => ({
filters: [], filters: [],
opList: [ opList: [
"is equal", 'is equal', 'is not equal', 'is like', 'is not like',
"is not equal",
"is like",
"is not like",
// 'is empty', 'is not empty', // 'is empty', 'is not empty',
"is null", 'is null', 'is not null',
"is not null", '>',
">", '<',
"<", '>=',
">=", '<='
"<=",
], ],
comparisonOp: [ comparisonOp: [
{ {
text: "is equal", text: 'is equal',
value: "eq", value: 'eq'
}, },
{ {
text: "is not equal", text: 'is not equal',
value: "neq", value: 'neq'
}, },
{ {
text: "is like", text: 'is like',
value: "like", value: 'like'
}, },
{ {
text: "is not like", text: 'is not like',
value: "nlike", value: 'nlike'
}, },
{ {
text: "is empty", text: 'is empty',
value: "empty", value: 'empty',
ignoreVal: true, ignoreVal: true
}, },
{ {
text: "is not empty", text: 'is not empty',
value: "notempty", value: 'notempty',
ignoreVal: true, ignoreVal: true
}, },
{ {
text: "is null", text: 'is null',
value: "null", value: 'null',
ignoreVal: true, ignoreVal: true
}, },
{ {
text: "is not null", text: 'is not null',
value: "notnull", value: 'notnull',
ignoreVal: true, ignoreVal: true
}, },
{ {
text: ">", text: '>',
value: "gt", value: 'gt'
}, },
{ {
text: "<", text: '<',
value: "lt", value: 'lt'
}, },
{ {
text: ">=", text: '>=',
value: "gte", value: 'gte'
}, },
{ {
text: "<=", text: '<=',
value: "lte", value: 'lte'
}, }
], ]
}), }),
computed: { computed: {
columnsById() { columnsById() {
return (this.columns || []).reduce((o, c) => ({ ...o, [c.id]: c }), {}); return (this.columns || []).reduce((o, c) => ({ ...o, [c.id]: c }), {})
}, },
autoApply() { autoApply() {
return this.$store.state.windows.autoApplyFilter && !this.webHook; return this.$store.state.windows.autoApplyFilter && !this.webHook
}, },
columns() { columns() {
return ( return (this.meta && this.meta.columns.filter(c => c && (!c.colOptions || !c.system)))
this.meta &&
this.meta.columns.filter((c) => c && (!c.colOptions || !c.system))
);
}, },
types() { types() {
if (!this.meta || !this.meta.columns || !this.meta.columns.length) { if (!this.meta || !this.meta.columns || !this.meta.columns.length) {
return {}; return {}
} }
return this.meta.columns.reduce((obj, col) => { return this.meta.columns.reduce((obj, col) => {
switch (col.uidt) { switch (col.uidt) {
case UITypes.Number: case UITypes.Number:
case UITypes.Decimal: case UITypes.Decimal:
obj[col.title] = obj[col.column_name] = "number"; obj[col.title] = obj[col.column_name] = 'number'
break; break
case UITypes.Checkbox: case UITypes.Checkbox:
obj[col.title] = obj[col.column_name] = "boolean"; obj[col.title] = obj[col.column_name] = 'boolean'
break; break
default: default:
break; break
} }
return obj; return obj
}, {}); }, {})
}, }
}, },
watch: { watch: {
async viewId(v) { async viewId(v) {
if (v) { if (v) {
await this.loadFilter(); await this.loadFilter()
} }
}, },
filters: { filters: {
handler(v) { handler(v) {
this.$emit( this.$emit('input', v && v.filter(f => (f.fk_column_id && f.comparison_op) || f.is_group))
"input",
v &&
v.filter((f) => (f.fk_column_id && f.comparison_op) || f.is_group)
);
}, },
deep: true, deep: true
}, }
}, },
created() { created() {
this.loadFilter(); this.loadFilter()
}, },
methods: { methods: {
filterComparisonOp(f) { filterComparisonOp(f) {
return this.comparisonOp.filter((op) => { return this.comparisonOp.filter((op) => {
if ( if (f && f.fk_column_id && this.columnsById[f.fk_column_id] &&
f && this.columnsById[f.fk_column_id].uidt === UITypes.LinkToAnotherRecord &&
f.fk_column_id &&
this.columnsById[f.fk_column_id] &&
this.columnsById[f.fk_column_id].uidt ===
UITypes.LinkToAnotherRecord &&
this.columnsById[f.fk_column_id].uidt === UITypes.Lookup this.columnsById[f.fk_column_id].uidt === UITypes.Lookup
) { ) {
return !["notempty", "empty", "notnull", "null"].includes(op.value); return ![
'notempty',
'empty',
'notnull',
'null'
].includes(op.value)
} }
return true; return true
}); })
}, },
async applyChanges(nested = false, { hookId } = {}) { async applyChanges(nested = false, { hookId } = {}) {
for (const [i, filter] of Object.entries(this.filters)) { for (const [i, filter] of Object.entries(this.filters)) {
if (filter.status === "delete") { if (filter.status === 'delete') {
if (this.hookId || hookId) { if (this.hookId || hookId) {
await this.$api.dbTableFilter.delete(filter.id); await this.$api.dbTableFilter.delete(filter.id)
} else { } else {
await this.$api.dbTableFilter.delete(filter.id); await this.$api.dbTableFilter.delete(filter.id)
} }
} else if (filter.status === "update") { } else if (filter.status === 'update') {
if (filter.id) { if (filter.id) {
if (this.hookId || hookId) { if (this.hookId || hookId) {
await this.$api.dbTableFilter.update(filter.id, { await this.$api.dbTableFilter.update(filter.id, {
...filter, ...filter,
fk_parent_id: this.parentId, fk_parent_id: this.parentId
}); })
} else { } else {
await this.$api.dbTableFilter.update(filter.id, { await this.$api.dbTableFilter.update(filter.id, {
...filter, ...filter,
fk_parent_id: this.parentId, fk_parent_id: this.parentId
}); })
} }
} else if (this.hookId || hookId) { } else if (this.hookId || hookId) {
this.$set( this.$set(this.filters, i, (await this.$api.dbTableWebhookFilter.create(this.hookId || hookId, {
this.filters, ...filter,
i, fk_parent_id: this.parentId
await this.$api.dbTableWebhookFilter.create( })))
this.hookId || hookId,
{
...filter,
fk_parent_id: this.parentId,
}
)
);
} else { } else {
this.$set( this.$set(this.filters, i, (await this.$api.dbTableFilter.create(this.viewId, {
this.filters, ...filter,
i, fk_parent_id: this.parentId
await this.$api.dbTableFilter.create(this.viewId, { })))
...filter,
fk_parent_id: this.parentId,
})
);
} }
} }
} }
if (this.$refs.nestedFilter) { if (this.$refs.nestedFilter) {
for (const nestedFilter of this.$refs.nestedFilter) { for (const nestedFilter of this.$refs.nestedFilter) {
await nestedFilter.applyChanges(true); await nestedFilter.applyChanges(true)
} }
} }
this.loadFilter(); this.loadFilter()
if (!nested) { if (!nested) { this.$emit('updated') }
this.$emit("updated");
}
}, },
async loadFilter() { async loadFilter() {
let filters = []; let filters = []
if (this.viewId && this._isUIAllowed("filterSync")) { if (this.viewId && this._isUIAllowed('filterSync')) {
filters = this.parentId filters = this.parentId
? await this.$api.dbTableFilter.childrenRead(this.parentId) ? (await this.$api.dbTableFilter.childrenRead(this.parentId))
: await this.$api.dbTableFilter.read(this.viewId); : (await this.$api.dbTableFilter.read(this.viewId))
} }
if (this.hookId && this._isUIAllowed("filterSync")) { if (this.hookId && this._isUIAllowed('filterSync')) {
filters = this.parentId filters = this.parentId
? await this.$api.dbTableFilter.childrenRead(this.parentId) ? (await this.$api.dbTableFilter.childrenRead(this.parentId))
: await this.$api.dbTableWebhookFilter.read(this.hookId); : (await this.$api.dbTableWebhookFilter.read(this.hookId))
} }
this.filters = filters; this.filters = filters
}, },
addFilter() { addFilter() {
this.filters.push({ this.filters.push({
fk_column_id: null, fk_column_id: null,
comparison_op: "eq", comparison_op: 'eq',
value: "", value: '',
status: "update", status: 'update',
logical_op: "and", logical_op: 'and'
}); })
this.filters = this.filters.slice(); this.filters = this.filters.slice()
this.$tele.emit(`filter:add:trigger:${this.filters.length}`); this.$tele.emit(`filter:add:trigger:${this.filters.length}`)
}, },
addFilterGroup() { addFilterGroup() {
this.filters.push({ this.filters.push({
parentId: this.parentId, parentId: this.parentId,
is_group: true, is_group: true,
status: "update", status: 'update'
}); })
this.filters = this.filters.slice(); this.filters = this.filters.slice()
const index = this.filters.length - 1; const index = this.filters.length - 1
this.saveOrUpdate(this.filters[index], index); this.saveOrUpdate(this.filters[index], index)
}, },
filterUpdateCondition(filter, i) { filterUpdateCondition(filter, i) {
this.saveOrUpdate(filter, i); this.saveOrUpdate(filter, i)
this.$tele.emit( this.$tele.emit(`filter:condition:${filter.logical_op}:${filter.comparison_op}`)
`filter:condition:${filter.logical_op}:${filter.comparison_op}`
);
}, },
async saveOrUpdate(filter, i) { async saveOrUpdate(filter, i) {
if (this.shared || !this._isUIAllowed("filterSync")) { if (this.shared || !this._isUIAllowed('filterSync')) {
// this.$emit('input', this.filters.filter(f => f.fk_column_id && f.comparison_op)) // this.$emit('input', this.filters.filter(f => f.fk_column_id && f.comparison_op))
this.$emit("updated"); this.$emit('updated')
} else if (!this.autoApply) { } else if (!this.autoApply) {
filter.status = "update"; filter.status = 'update'
} else if (filter.id) { } else if (filter.id) {
await this.$api.dbTableFilter.update(filter.id, { await this.$api.dbTableFilter.update(filter.id, {
...filter, ...filter,
fk_parent_id: this.parentId, fk_parent_id: this.parentId
}); })
this.$emit("updated"); this.$emit('updated')
} else { } else {
this.$set( this.$set(this.filters, i, (await this.$api.dbTableFilter.create(this.viewId, {
this.filters, ...filter,
i, fk_parent_id: this.parentId
await this.$api.dbTableFilter.create(this.viewId, { })))
...filter,
fk_parent_id: this.parentId,
})
);
this.$emit("updated"); this.$emit('updated')
} }
}, },
async deleteFilter(filter, i) { async deleteFilter(filter, i) {
if (this.shared || !this._isUIAllowed("filterSync")) { if (this.shared || !this._isUIAllowed('filterSync')) {
this.filters.splice(i, 1); this.filters.splice(i, 1)
this.$emit("updated"); this.$emit('updated')
} else if (filter.id) { } else if (filter.id) {
if (!this.autoApply) { if (!this.autoApply) {
this.$set(filter, "status", "delete"); this.$set(filter, 'status', 'delete')
} else { } else {
await this.$api.dbTableFilter.delete(filter.id); await this.$api.dbTableFilter.delete(filter.id)
await this.loadFilter(); await this.loadFilter()
this.$emit("updated"); this.$emit('updated')
} }
} else { } else {
this.filters.splice(i, 1); this.filters.splice(i, 1)
this.$emit("updated"); this.$emit('updated')
} }
this.$tele.emit("filter:delete"); this.$tele.emit('filter:delete')
}, }
}, }
}; }
</script> </script>
<style scoped> <style scoped>
.grid { .grid {
display: grid; display: grid;
grid-template-columns: 22px 80px auto auto auto; grid-template-columns:22px 80px auto auto auto;
column-gap: 6px; column-gap: 6px;
row-gap: 6px; row-gap: 6px
} }
</style> </style>

2
packages/nc-gui/components/project/spreadsheet/components/sortListMenu.vue
Unescape View File

@ -28,7 +28,7 @@
</v-btn> </v-btn>
</v-badge> </v-badge>
</template> </template>
<div class="backgroundColor pa-2 menu-filter-dropdown" style="min-width: 330px;"> <div class="backgroundColor pa-2 menu-filter-dropdown" style="min-width: 330px">
<div class="sort-grid" @click.stop> <div class="sort-grid" @click.stop>
<template v-for="(sort,i) in sortList||[]" dense> <template v-for="(sort,i) in sortList||[]" dense>
<v-icon :key="i + 'icon'" class="nc-sort-item-remove-btn" small @click.stop="deleteSort(sort)"> <v-icon :key="i + 'icon'" class="nc-sort-item-remove-btn" small @click.stop="deleteSort(sort)">

Write Preview
Loading…
Cancel
Save