Build lightweight AI agent admin

web/apps/web-ele/src/components/database-tree-node-label/index.ts

@@ -0,0 +1 @@
+export { default as DatabaseTreeNodeLabel } from './index.vue';

web/apps/web-ele/src/components/database-tree-node-label/index.vue

@@ -0,0 +1,33 @@
+<script lang="ts" setup>
+import type { TreeNodeType } from '#/utils/database-tree/types';
+
+import { computed } from 'vue';
+
+import { $t } from '@vben/locales';
+
+import { ElTag } from 'element-plus';
+
+defineOptions({ name: 'DatabaseTreeNodeLabel' });
+
+const props = defineProps<{
+  dbName?: string;
+  isSystem?: boolean;
+  label: string;
+  type: string | TreeNodeType;
+}>();
+
+const showSystemTag = computed(
+  () =>
+    props.type === 'connection' &&
+    (props.isSystem === true || props.dbName === 'default'),
+);
+</script>
+
+<template>
+  <div class="flex items-center">
+    <span class="text-sm">{{ label }}</span>
+    <ElTag v-if="showSystemTag" class="ml-1" size="small" type="warning">
+      {{ $t('database-manager.systemDatabase') }}
+    </ElTag>
+  </div>
+</template>