feat: add loaded progress for list/hash/set/zset/stream
This commit is contained in:
parent
7934fc275a
commit
52490cb304
|
@ -280,6 +280,11 @@ const entries = computed(() => {
|
||||||
return `${len} / ${Math.max(len, props.length)}`
|
return `${len} / ${Math.max(len, props.length)}`
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const loadProgress = computed(() => {
|
||||||
|
const len = size(props.value)
|
||||||
|
return (len * 100) / Math.max(len, props.length)
|
||||||
|
})
|
||||||
|
|
||||||
const onAddRow = () => {
|
const onAddRow = () => {
|
||||||
dialogStore.openAddFieldsDialog(props.name, props.db, props.keyPath, props.keyCode, types.HASH)
|
dialogStore.openAddFieldsDialog(props.name, props.db, props.keyPath, props.keyCode, types.HASH)
|
||||||
}
|
}
|
||||||
|
@ -355,6 +360,16 @@ defineExpose({
|
||||||
{{ $t('interface.add_row') }}
|
{{ $t('interface.add_row') }}
|
||||||
</n-button>
|
</n-button>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- loaded progress -->
|
||||||
|
<n-progress
|
||||||
|
:border-radius="0"
|
||||||
|
:color="props.end ? '#0000' : themeVars.primaryColor"
|
||||||
|
:height="2"
|
||||||
|
:percentage="loadProgress"
|
||||||
|
:processing="props.loading"
|
||||||
|
:show-indicator="false"
|
||||||
|
status="success"
|
||||||
|
type="line" />
|
||||||
<div id="content-table" class="value-wrapper value-item-part flex-box-h flex-item-expand">
|
<div id="content-table" class="value-wrapper value-item-part flex-box-h flex-item-expand">
|
||||||
<!-- table -->
|
<!-- table -->
|
||||||
<n-data-table
|
<n-data-table
|
||||||
|
|
|
@ -257,6 +257,11 @@ const entries = computed(() => {
|
||||||
return `${len} / ${Math.max(len, props.length)}`
|
return `${len} / ${Math.max(len, props.length)}`
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const loadProgress = computed(() => {
|
||||||
|
const len = size(props.value)
|
||||||
|
return (len * 100) / Math.max(len, props.length)
|
||||||
|
})
|
||||||
|
|
||||||
const onAddValue = (value) => {
|
const onAddValue = (value) => {
|
||||||
dialogStore.openAddFieldsDialog(props.name, props.db, props.keyPath, props.keyCode, types.LIST)
|
dialogStore.openAddFieldsDialog(props.name, props.db, props.keyPath, props.keyCode, types.LIST)
|
||||||
}
|
}
|
||||||
|
@ -332,6 +337,16 @@ defineExpose({
|
||||||
{{ $t('interface.add_row') }}
|
{{ $t('interface.add_row') }}
|
||||||
</n-button>
|
</n-button>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- loaded progress -->
|
||||||
|
<n-progress
|
||||||
|
:border-radius="0"
|
||||||
|
:color="props.end ? '#0000' : themeVars.primaryColor"
|
||||||
|
:height="2"
|
||||||
|
:percentage="loadProgress"
|
||||||
|
:processing="props.loading"
|
||||||
|
:show-indicator="false"
|
||||||
|
status="success"
|
||||||
|
type="line" />
|
||||||
<div class="value-wrapper value-item-part flex-box-h flex-item-expand">
|
<div class="value-wrapper value-item-part flex-box-h flex-item-expand">
|
||||||
<!-- table -->
|
<!-- table -->
|
||||||
<n-data-table
|
<n-data-table
|
||||||
|
|
|
@ -254,6 +254,11 @@ const entries = computed(() => {
|
||||||
return `${len} / ${Math.max(len, props.length)}`
|
return `${len} / ${Math.max(len, props.length)}`
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const loadProgress = computed(() => {
|
||||||
|
const len = size(props.value)
|
||||||
|
return (len * 100) / Math.max(len, props.length)
|
||||||
|
})
|
||||||
|
|
||||||
const onAddValue = (value) => {
|
const onAddValue = (value) => {
|
||||||
dialogStore.openAddFieldsDialog(props.name, props.db, props.keyPath, props.keyCode, types.SET)
|
dialogStore.openAddFieldsDialog(props.name, props.db, props.keyPath, props.keyCode, types.SET)
|
||||||
}
|
}
|
||||||
|
@ -329,6 +334,16 @@ defineExpose({
|
||||||
{{ $t('interface.add_row') }}
|
{{ $t('interface.add_row') }}
|
||||||
</n-button>
|
</n-button>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- loaded progress -->
|
||||||
|
<n-progress
|
||||||
|
:border-radius="0"
|
||||||
|
:color="props.end ? '#0000' : themeVars.primaryColor"
|
||||||
|
:height="2"
|
||||||
|
:percentage="loadProgress"
|
||||||
|
:processing="props.loading"
|
||||||
|
:show-indicator="false"
|
||||||
|
status="success"
|
||||||
|
type="line" />
|
||||||
<div class="value-wrapper value-item-part flex-box-h flex-item-expand">
|
<div class="value-wrapper value-item-part flex-box-h flex-item-expand">
|
||||||
<!-- table -->
|
<!-- table -->
|
||||||
<n-data-table
|
<n-data-table
|
||||||
|
|
|
@ -145,6 +145,11 @@ const entries = computed(() => {
|
||||||
return `${len} / ${Math.max(len, props.length)}`
|
return `${len} / ${Math.max(len, props.length)}`
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const loadProgress = computed(() => {
|
||||||
|
const len = size(props.value)
|
||||||
|
return (len * 100) / Math.max(len, props.length)
|
||||||
|
})
|
||||||
|
|
||||||
const onAddRow = () => {
|
const onAddRow = () => {
|
||||||
dialogStore.openAddFieldsDialog(props.name, props.db, props.keyPath, props.keyCode, types.STREAM)
|
dialogStore.openAddFieldsDialog(props.name, props.db, props.keyPath, props.keyCode, types.STREAM)
|
||||||
}
|
}
|
||||||
|
@ -215,6 +220,16 @@ defineExpose({
|
||||||
{{ $t('interface.add_row') }}
|
{{ $t('interface.add_row') }}
|
||||||
</n-button>
|
</n-button>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- loaded progress -->
|
||||||
|
<n-progress
|
||||||
|
:border-radius="0"
|
||||||
|
:color="props.end ? '#0000' : themeVars.primaryColor"
|
||||||
|
:height="2"
|
||||||
|
:percentage="loadProgress"
|
||||||
|
:processing="props.loading"
|
||||||
|
:show-indicator="false"
|
||||||
|
status="success"
|
||||||
|
type="line" />
|
||||||
<div class="value-wrapper value-item-part flex-box-v flex-item-expand">
|
<div class="value-wrapper value-item-part flex-box-v flex-item-expand">
|
||||||
<n-data-table
|
<n-data-table
|
||||||
:bordered="false"
|
:bordered="false"
|
||||||
|
|
|
@ -291,6 +291,11 @@ const entries = computed(() => {
|
||||||
return `${len} / ${Math.max(len, props.length)}`
|
return `${len} / ${Math.max(len, props.length)}`
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const loadProgress = computed(() => {
|
||||||
|
const len = size(props.value)
|
||||||
|
return (len * 100) / Math.max(len, props.length)
|
||||||
|
})
|
||||||
|
|
||||||
const onAddRow = () => {
|
const onAddRow = () => {
|
||||||
dialogStore.openAddFieldsDialog(props.name, props.db, props.keyPath, props.keyCode, types.ZSET)
|
dialogStore.openAddFieldsDialog(props.name, props.db, props.keyPath, props.keyCode, types.ZSET)
|
||||||
}
|
}
|
||||||
|
@ -366,6 +371,16 @@ defineExpose({
|
||||||
{{ $t('interface.add_row') }}
|
{{ $t('interface.add_row') }}
|
||||||
</n-button>
|
</n-button>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- loaded progress -->
|
||||||
|
<n-progress
|
||||||
|
:border-radius="0"
|
||||||
|
:color="props.end ? '#0000' : themeVars.primaryColor"
|
||||||
|
:height="2"
|
||||||
|
:percentage="loadProgress"
|
||||||
|
:processing="props.loading"
|
||||||
|
:show-indicator="false"
|
||||||
|
status="success"
|
||||||
|
type="line" />
|
||||||
<div class="value-wrapper value-item-part flex-box-h flex-item-expand">
|
<div class="value-wrapper value-item-part flex-box-h flex-item-expand">
|
||||||
<!-- table -->
|
<!-- table -->
|
||||||
<n-data-table
|
<n-data-table
|
||||||
|
|
|
@ -59,7 +59,7 @@ const loadProgress = computed(() => {
|
||||||
if (db.maxKeys <= 0) {
|
if (db.maxKeys <= 0) {
|
||||||
return 100
|
return 100
|
||||||
}
|
}
|
||||||
return (db.keys * 100) / db.maxKeys
|
return (db.keys * 100) / Math.max(db.keys, db.maxKeys)
|
||||||
})
|
})
|
||||||
|
|
||||||
const onReload = async () => {
|
const onReload = async () => {
|
||||||
|
|
Loading…
Reference in New Issue