feat: truncate long name
This commit is contained in:
parent
6d8b8600ac
commit
8badbc4a22
1 changed files with 8 additions and 17 deletions
|
|
@ -15,10 +15,8 @@ const props = withDefaults(
|
||||||
}>(),
|
}>(),
|
||||||
{
|
{
|
||||||
level: 0,
|
level: 0,
|
||||||
}
|
},
|
||||||
)
|
)
|
||||||
|
|
||||||
const MAX_NAME_LENGTH = 20
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
@ -39,14 +37,10 @@ const MAX_NAME_LENGTH = 20
|
||||||
level === 1
|
level === 1
|
||||||
? 'mdi-file-cabinet'
|
? 'mdi-file-cabinet'
|
||||||
: level === 2
|
: level === 2
|
||||||
? 'inbox'
|
? 'inbox'
|
||||||
: 'o_folder_open'
|
: 'o_folder_open'
|
||||||
"
|
|
||||||
:label="
|
|
||||||
folder.name.length > MAX_NAME_LENGTH
|
|
||||||
? folder.name.slice(0, MAX_NAME_LENGTH) + '...'
|
|
||||||
: folder.name
|
|
||||||
"
|
"
|
||||||
|
:label="folder.name"
|
||||||
class="text-overflow-handle"
|
class="text-overflow-handle"
|
||||||
v-model="folder.status"
|
v-model="folder.status"
|
||||||
>
|
>
|
||||||
|
|
@ -60,16 +54,13 @@ const MAX_NAME_LENGTH = 20
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss" scoped>
|
||||||
.q-item[aria-expanded='true'] {
|
:deep(.q-item[aria-expanded='true']) {
|
||||||
color: $primary;
|
color: $primary;
|
||||||
}
|
}
|
||||||
|
|
||||||
.q-item[aria-expanded='true'] .q-icon {
|
.text-overflow-handle,
|
||||||
color: $primary;
|
:deep(.q-item__label) {
|
||||||
}
|
|
||||||
|
|
||||||
.text-overflow-handle {
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue