Use name of URL instead of path

This commit is contained in:
cuigh 2021-12-24 11:28:42 +08:00
parent dfb74deb5b
commit b55b53aa4b
26 changed files with 68 additions and 58 deletions

View File

@ -6,7 +6,7 @@
<template #icon> <template #icon>
<server-outline /> <server-outline />
</template> </template>
<x-anchor url="/swarm/nodes">{{ summary.nodeCount }}</x-anchor> <x-anchor :url="{ name: 'node_list' }">{{ summary.nodeCount }}</x-anchor>
</x-statistic> </x-statistic>
</n-gi> </n-gi>
<n-gi> <n-gi>
@ -14,7 +14,7 @@
<template #icon> <template #icon>
<globe-outline /> <globe-outline />
</template> </template>
<x-anchor url="/swarm/networks">{{ summary.networkCount }}</x-anchor> <x-anchor :url="{ name: 'network_list' }">{{ summary.networkCount }}</x-anchor>
</x-statistic> </x-statistic>
</n-gi> </n-gi>
<n-gi> <n-gi>
@ -22,7 +22,7 @@
<template #icon> <template #icon>
<image-outline /> <image-outline />
</template> </template>
<x-anchor url="/swarm/services">{{ summary.serviceCount }}</x-anchor> <x-anchor :url="{ name: 'service_list' }">{{ summary.serviceCount }}</x-anchor>
</x-statistic> </x-statistic>
</n-gi> </n-gi>
<n-gi> <n-gi>
@ -30,7 +30,7 @@
<template #icon> <template #icon>
<albums-outline /> <albums-outline />
</template> </template>
<x-anchor url="/swarm/stacks">{{ summary.stackCount }}</x-anchor> <x-anchor :url="{ name: 'stack_list' }">{{ summary.stackCount }}</x-anchor>
</x-statistic> </x-statistic>
</n-gi> </n-gi>
<!-- <n-gi> <!-- <n-gi>

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="model.name"> <x-page-header :subtitle="model.name">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/configs')"> <n-button secondary size="small" @click="$router.push({ name: 'config_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />
@ -108,7 +108,7 @@ const rules: any = {
const form = ref(); const form = ref();
const { submit, submiting } = useForm(form, () => configApi.save(model.value), () => { const { submit, submiting } = useForm(form, () => configApi.save(model.value), () => {
window.message.info(t('texts.action_success')); window.message.info(t('texts.action_success'));
router.push("/swarm/configs") router.push({ name: 'config_list' })
}) })
function newPair() { function newPair() {

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header> <x-page-header>
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/configs/new')"> <n-button secondary size="small" @click="$router.push({ name: 'config_new' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<add-icon /> <add-icon />
@ -59,7 +59,7 @@ const columns = [
title: t('fields.id'), title: t('fields.id'),
key: "id", key: "id",
fixed: "left" as const, fixed: "left" as const,
render: (c: Config) => renderLink(`/swarm/configs/${c.id}`, c.id), render: (c: Config) => renderLink({ name: 'config_detail', params: { id: c.id } }, c.id),
}, },
{ {
title: t('fields.name'), title: t('fields.name'),
@ -87,7 +87,7 @@ const columns = [
{ {
type: 'warning', type: 'warning',
text: t('buttons.edit'), text: t('buttons.edit'),
action: () => router.push(`/swarm/configs/${c.id}/edit`), action: () => router.push({ name: 'config_edit', params: { id: c.id } }),
}, },
]) ])
}, },

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="model.name || model.id"> <x-page-header :subtitle="model.name || model.id">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/configs')"> <n-button secondary size="small" @click="$router.push({ name: 'config_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />
@ -12,7 +12,7 @@
<n-button <n-button
secondary secondary
size="small" size="small"
@click="$router.push(`/swarm/configs/${model.id}/edit`)" @click="$router.push({ name: 'config_edit', params: { id: model.id } })"
>{{ t('buttons.edit') }}</n-button> >{{ t('buttons.edit') }}</n-button>
</template> </template>
</x-page-header> </x-page-header>

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="model.name"> <x-page-header :subtitle="model.name">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/local/containers')"> <n-button secondary size="small" @click="$router.push({ name: 'container_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />
@ -52,7 +52,12 @@
<x-code :code="raw" language="json" /> <x-code :code="raw" language="json" />
</n-tab-pane> </n-tab-pane>
<n-tab-pane name="logs" :tab="t('fields.logs')" display-directive="show:lazy"> <n-tab-pane name="logs" :tab="t('fields.logs')" display-directive="show:lazy">
<x-logs type="container" :node="node" :id="model.id" v-if="store.getters.allow('container.logs')"></x-logs> <x-logs
type="container"
:node="node"
:id="model.id"
v-if="store.getters.allow('container.logs')"
></x-logs>
<n-alert type="info" v-else>{{ t('texts.403') }}</n-alert> <n-alert type="info" v-else>{{ t('texts.403') }}</n-alert>
</n-tab-pane> </n-tab-pane>
<n-tab-pane name="exec" :tab="t('fields.execute')" display-directive="show:lazy"> <n-tab-pane name="exec" :tab="t('fields.execute')" display-directive="show:lazy">

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="model.id"> <x-page-header :subtitle="model.id">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/local/images')"> <n-button secondary size="small" @click="$router.push({ name: 'image_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="t('texts.records', { total: model.length }, model.length)"> <x-page-header :subtitle="t('texts.records', { total: model.length }, model.length)">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/networks/new')"> <n-button secondary size="small" @click="$router.push({ name: 'network_new' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<add-icon /> <add-icon />
@ -25,7 +25,7 @@
<tbody> <tbody>
<tr v-for="(r, index) of model" :key="r.name"> <tr v-for="(r, index) of model" :key="r.name">
<td> <td>
<x-anchor :url="`/swarm/networks/${r.name}`">{{ r.name }}</x-anchor> <x-anchor :url="{ name: 'network_detail', params: { name: r.name } }">{{ r.name }}</x-anchor>
</td> </td>
<td>{{ r.id }}</td> <td>{{ r.id }}</td>
<td> <td>

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header> <x-page-header>
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/networks')"> <n-button secondary size="small" @click="$router.push({ name: 'network_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />
@ -152,7 +152,7 @@ const rules: any = {
const form = ref(); const form = ref();
const { submit, submiting } = useForm(form, () => networkApi.save(model.value), () => { const { submit, submiting } = useForm(form, () => networkApi.save(model.value), () => {
window.message.info(t('texts.action_success')); window.message.info(t('texts.action_success'));
router.push("/swarm/networks") router.push({ name: 'network_list' })
}) })
function newConfig() { function newConfig() {

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="model.name"> <x-page-header :subtitle="model.name">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/networks')"> <n-button secondary size="small" @click="$router.push({ name: 'network_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />
@ -129,7 +129,9 @@
<tbody> <tbody>
<tr v-for="c in model.containers"> <tr v-for="c in model.containers">
<td> <td>
<x-anchor :url="`/local/containers/${c.id}`">{{ c.name }}</x-anchor> <x-anchor
:url="{ name: 'container_detail', params: { node: '-', id: c.id } }"
>{{ c.name }}</x-anchor>
</td> </td>
<td>{{ c.ipv4 }}</td> <td>{{ c.ipv4 }}</td>
<td>{{ c.ipv6 }}</td> <td>{{ c.ipv6 }}</td>

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="model.name ?? model.hostname"> <x-page-header :subtitle="model.name ?? model.hostname">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/nodes')"> <n-button secondary size="small" @click="$router.push({ name: 'node_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />
@ -98,7 +98,7 @@ const model = ref({} as Node);
const form = ref(); const form = ref();
const { submit, submiting } = useForm(form, () => nodeApi.save(model.value), () => { const { submit, submiting } = useForm(form, () => nodeApi.save(model.value), () => {
window.message.info(t('texts.action_success')); window.message.info(t('texts.action_success'));
router.push("/swarm/nodes") router.push({ name: 'node_list' })
}) })
function newLabel() { function newLabel() {

View File

@ -17,7 +17,7 @@
<tbody> <tbody>
<tr v-for="(r, index) of model" :key="r.id"> <tr v-for="(r, index) of model" :key="r.id">
<td> <td>
<x-anchor :url="`/swarm/nodes/${r.id}`">{{ r.name || r.hostname }}</x-anchor> <x-anchor :url="{ name: 'node_detail', params: { id: r.id } }">{{ r.name || r.hostname }}</x-anchor>
</td> </td>
<td> <td>
<n-tag <n-tag

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="node.name ?? node.hostname"> <x-page-header :subtitle="node.name ?? node.hostname">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/nodes')"> <n-button secondary size="small" @click="$router.push({ name: 'node_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />
@ -12,7 +12,7 @@
<n-button <n-button
secondary secondary
size="small" size="small"
@click="$router.push(`/swarm/nodes/${node.id}/edit`)" @click="$router.push({ name: 'node_edit', params: { id: node.id } })"
>{{ t('buttons.edit') }}</n-button> >{{ t('buttons.edit') }}</n-button>
</template> </template>
</x-page-header> </x-page-header>
@ -91,7 +91,7 @@
<tbody> <tbody>
<tr v-for="t in tasks"> <tr v-for="t in tasks">
<td> <td>
<x-anchor :url="`/swarm/tasks/${t.id}`">{{ t.id }}</x-anchor> <x-anchor :url="{ name: 'task_detail', params: { id: t.id } }">{{ t.id }}</x-anchor>
</td> </td>
<td> <td>
<n-tag <n-tag

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="model.name"> <x-page-header :subtitle="model.name">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/registries')"> <n-button secondary size="small" @click="$router.push({ name: 'registry_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />
@ -81,7 +81,7 @@ const rules: any = {
}; };
const { submit, submiting } = useForm(form, () => registryApi.save(model.value), () => { const { submit, submiting } = useForm(form, () => registryApi.save(model.value), () => {
window.message.info(t('texts.action_success')); window.message.info(t('texts.action_success'));
router.push("/swarm/registries") router.push({ name: 'registry_list' })
}) })
async function fetchData() { async function fetchData() {

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="t('texts.records', { total: model.length }, model.length)"> <x-page-header :subtitle="t('texts.records', { total: model.length }, model.length)">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/registries/new')"> <n-button secondary size="small" @click="$router.push({ name: 'registry_new' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<add-icon /> <add-icon />
@ -26,7 +26,7 @@
<tbody> <tbody>
<tr v-for="(r, index) of model" :key="r.id"> <tr v-for="(r, index) of model" :key="r.id">
<td> <td>
<x-anchor :url="`/swarm/registries/${r.id}`">{{ r.name }}</x-anchor> <x-anchor :url="{ name: 'registry_detail', params: { id: r.id } }">{{ r.name }}</x-anchor>
</td> </td>
<td>{{ r.url }}</td> <td>{{ r.url }}</td>
<td>{{ r.username }}</td> <td>{{ r.username }}</td>

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="model.name"> <x-page-header :subtitle="model.name">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/registries')"> <n-button secondary size="small" @click="$router.push({ name: 'registry_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />
@ -12,7 +12,7 @@
<n-button <n-button
secondary secondary
size="small" size="small"
@click="$router.push(`/swarm/registries/${model.id}/edit`)" @click="$router.push({ name: 'registry_edit', params: { id: model.id } })"
>{{ t('buttons.edit') }}</n-button> >{{ t('buttons.edit') }}</n-button>
</template> </template>
</x-page-header> </x-page-header>

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="model.name"> <x-page-header :subtitle="model.name">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/secrets')"> <n-button secondary size="small" @click="$router.push({ name: 'secret_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />
@ -129,7 +129,7 @@ const rules: any = {
const form = ref(); const form = ref();
const { submit, submiting } = useForm(form, () => secretApi.save(model.value), () => { const { submit, submiting } = useForm(form, () => secretApi.save(model.value), () => {
window.message.info(t('texts.action_success')); window.message.info(t('texts.action_success'));
router.push("/swarm/secrets") router.push({ name: 'secret_list' })
}) })
function newPair() { function newPair() {

View File

@ -1,12 +1,13 @@
<template> <template>
<x-page-header> <x-page-header>
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/secrets/new')"> <n-button secondary size="small" @click="$router.push({ name: 'secret_new' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<add-icon /> <add-icon />
</n-icon> </n-icon>
</template>{{ t('buttons.new') }} </template>
{{ t('buttons.new') }}
</n-button> </n-button>
</template> </template>
</x-page-header> </x-page-header>
@ -59,7 +60,7 @@ const columns = [
title: t('fields.id'), title: t('fields.id'),
key: "id", key: "id",
fixed: "left" as const, fixed: "left" as const,
render: (c: Secret) => renderLink(`/swarm/secrets/${c.id}`, c.id), render: (c: Secret) => renderLink({ name: 'secret_detail', params: { id: c.id } }, c.id),
}, },
{ {
title: t('fields.name'), title: t('fields.name'),
@ -82,12 +83,12 @@ const columns = [
type: 'error', type: 'error',
text: t('buttons.delete'), text: t('buttons.delete'),
action: () => deleteSecret(c.id, index), action: () => deleteSecret(c.id, index),
prompt: t('prompts.delete'), prompt: t('prompts.delete'),
}, },
{ {
type: 'warning', type: 'warning',
text: t('buttons.edit'), text: t('buttons.edit'),
action: () => router.push(`/swarm/secrets/${c.id}/edit`), action: () => router.push({ name: 'secret_edit', params: { id: c.id } }),
}, },
]) ])
}, },

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="model.name || model.id"> <x-page-header :subtitle="model.name || model.id">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/secrets')"> <n-button secondary size="small" @click="$router.push({ name: 'secret_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />
@ -12,7 +12,7 @@
<n-button <n-button
secondary secondary
size="small" size="small"
@click="$router.push(`/swarm/secrets/${model.id}/edit`)" @click="$router.push({ name: 'secret_edit', params: { id: model.id } })"
>{{ t('buttons.edit') }}</n-button> >{{ t('buttons.edit') }}</n-button>
</template> </template>
</x-page-header> </x-page-header>

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header> <x-page-header>
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/services/new')"> <n-button secondary size="small" @click="$router.push({ name: 'service_new' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<add-icon /> <add-icon />
@ -75,7 +75,7 @@ const columns = [
title: t('fields.name'), title: t('fields.name'),
key: "name", key: "name",
fixed: "left" as const, fixed: "left" as const,
render: (s: Service) => renderLink(`/swarm/services/${s.name}`, s.name), render: (s: Service) => renderLink({ name: 'service_detail', params: { name: s.name } }, s.name),
}, },
{ {
title: t('objects.image'), title: t('objects.image'),
@ -112,7 +112,7 @@ const columns = [
{ {
type: 'warning', type: 'warning',
text: t('buttons.edit'), text: t('buttons.edit'),
action: () => router.push(`/swarm/services/${s.name}/edit`), action: () => router.push({ name: 'service_edit', params: { name: s.name } }),
}, },
]) ])
}, },

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="service.name"> <x-page-header :subtitle="service.name">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/services')"> <n-button secondary size="small" @click="$router.push({ name: 'service_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />
@ -21,7 +21,7 @@
<n-button <n-button
secondary secondary
size="small" size="small"
@click="$router.push(`/swarm/services/${service.name}/edit`)" @click="$router.push({ name: 'service_edit', params: { name: service.name } })"
>{{ t('buttons.edit') }}</n-button> >{{ t('buttons.edit') }}</n-button>
</template> </template>
</x-page-header> </x-page-header>
@ -123,7 +123,7 @@
<tr v-for="label in service.endpoint?.vips"> <tr v-for="label in service.endpoint?.vips">
<td> <td>
<x-anchor <x-anchor
:url="`/swarm/networks/${label.name || label.id}`" :url="{ name: 'network_detail', params: { name: label.name || label.id } }"
>{{ label.name || label.id }}</x-anchor> >{{ label.name || label.id }}</x-anchor>
</td> </td>
<td>{{ label.ip }}</td> <td>{{ label.ip }}</td>

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="model.name"> <x-page-header :subtitle="model.name">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/stacks')"> <n-button secondary size="small" @click="$router.push({ name: 'stack_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />
@ -130,7 +130,7 @@ async function submit(e: Event) {
try { try {
await stackApi.save(model.value) await stackApi.save(model.value)
window.message.info(t('texts.action_success')); window.message.info(t('texts.action_success'));
router.push("/swarm/stacks") router.push({ name: 'stack_list' })
} finally { } finally {
submiting.value = false; submiting.value = false;
} }

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header> <x-page-header>
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/stacks/new')"> <n-button secondary size="small" @click="$router.push({ name: 'stack_new' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<add-icon /> <add-icon />
@ -29,12 +29,14 @@
<tbody> <tbody>
<tr v-for="(r, index) of model" :key="r.name"> <tr v-for="(r, index) of model" :key="r.name">
<td> <td>
<x-anchor :url="`/swarm/stacks/${r.name}`">{{ r.name }}</x-anchor> <x-anchor :url="{ name: 'stack_detail', params: { name: r.name } }">{{ r.name }}</x-anchor>
</td> </td>
<td> <td>
<n-space :size="4" v-if="r.services && r.services.length"> <n-space :size="4" v-if="r.services && r.services.length">
<n-tag size="small" type="primary" v-for="s in r.services"> <n-tag size="small" type="primary" v-for="s in r.services">
<x-anchor :url="`/swarm/services/${s}`">{{ s.substring(r.name.length + 1) }}</x-anchor> <x-anchor
:url="{ name: 'service_detail', params: { name: s } }"
>{{ s.substring(r.name.length + 1) }}</x-anchor>
</n-tag> </n-tag>
</n-space> </n-space>
</td> </td>

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="model.name || model.id"> <x-page-header :subtitle="model.name || model.id">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/stacks')"> <n-button secondary size="small" @click="$router.push({ name: 'stack_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />
@ -12,7 +12,7 @@
<n-button <n-button
secondary secondary
size="small" size="small"
@click="$router.push(`/swarm/stacks/${model.name}/edit`)" @click="$router.push({ name: 'stack_edit', params: { name: model.name } })"
>{{ t('buttons.edit') }}</n-button> >{{ t('buttons.edit') }}</n-button>
</template> </template>
</x-page-header> </x-page-header>

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="model.name || model.id"> <x-page-header :subtitle="model.name || model.id">
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/swarm/tasks')"> <n-button secondary size="small" @click="$router.push({ name: 'task_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header> <x-page-header>
<template #action> <template #action>
<n-button secondary size="small" @click="$router.push('/local/volumes')"> <n-button secondary size="small" @click="$router.push({ name: 'volume_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />
@ -103,7 +103,7 @@ const rules: any = {
const form = ref(); const form = ref();
const { submit, submiting } = useForm(form, () => volumeApi.save(model.value), () => { const { submit, submiting } = useForm(form, () => volumeApi.save(model.value), () => {
window.message.info(t('texts.action_success')); window.message.info(t('texts.action_success'));
router.push("/local/volumes") router.push({ name: 'volume_list' })
}) })
function newPair() { function newPair() {

View File

@ -1,7 +1,7 @@
<template> <template>
<x-page-header :subtitle="model.name"> <x-page-header :subtitle="model.name">
<template #action> <template #action>
<n-button size="small" @click="$router.push('/local/volumes')"> <n-button size="small" @click="$router.push({ name: 'volume_list' })">
<template #icon> <template #icon>
<n-icon> <n-icon>
<back-icon /> <back-icon />