make graph alone
This commit is contained in:
parent
d89b7fdeec
commit
c56bbcbf5c
@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link rel="icon" href="/favicon.svg">
|
||||
|
||||
@ -11,6 +11,7 @@
|
||||
--main-100: #ABE0F7;
|
||||
--main-50: #CDF5FF;
|
||||
--main-25: #E6FAFF;
|
||||
--main-10: #F5FDFF;
|
||||
|
||||
--c-white: #ffffff;
|
||||
--c-white-soft: #f8f8f8;
|
||||
|
||||
@ -72,9 +72,9 @@ const showRefs = computed(() => message.value.role=='received' && message.value.
|
||||
gap: 10px;
|
||||
|
||||
.item {
|
||||
background: var(--main-25);
|
||||
color: var(--main-800);
|
||||
border: 1px solid var(--main-100);
|
||||
background: var(--main-10);
|
||||
color: var(--main-600);
|
||||
border: 1px solid var(--main-50);
|
||||
padding: 2px 8px;
|
||||
border-radius: 8px;
|
||||
font-size: 14px;
|
||||
@ -91,7 +91,7 @@ const showRefs = computed(() => message.value.role=='received' && message.value.
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background: var(--main-100);
|
||||
background: var(--main-25);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -11,6 +11,8 @@ import {
|
||||
GithubOutlined,
|
||||
DatabaseOutlined,
|
||||
DatabaseFilled,
|
||||
GoldOutlined,
|
||||
GoldFilled,
|
||||
} from '@ant-design/icons-vue'
|
||||
import { themeConfig } from '@/assets/theme'
|
||||
import { useConfigStore } from '@/stores/config'
|
||||
@ -74,6 +76,9 @@ console.log(route)
|
||||
<RouterLink to="/database" class="nav-item" active-class="active">
|
||||
<component class="icon" :is="route.path.startsWith('/database') ? DatabaseFilled : DatabaseOutlined" />
|
||||
</RouterLink>
|
||||
<RouterLink to="/graph" class="nav-item" active-class="active">
|
||||
<component class="icon" :is="route.path.startsWith('/graph') ? GoldFilled: GoldOutlined" />
|
||||
</RouterLink>
|
||||
</div>
|
||||
<div class="fill" style="flex-grow: 1;"></div>
|
||||
<div class="github nav-item">
|
||||
|
||||
@ -30,6 +30,19 @@ const router = createRouter({
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/graph',
|
||||
name: 'graph',
|
||||
component: AppLayout,
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
name: 'Graph',
|
||||
component: () => import('../views/GraphView.vue'),
|
||||
meta: { keepAlive: true }
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/database',
|
||||
name: 'database',
|
||||
@ -45,12 +58,6 @@ const router = createRouter({
|
||||
path: ':database_id',
|
||||
name: 'databaseInfo',
|
||||
component: () => import('../views/DataBaseInfoView.vue'),
|
||||
},
|
||||
{
|
||||
path: 'graph',
|
||||
name: 'graph',
|
||||
component: () => import('../views/GraphView.vue'),
|
||||
meta: { keepAlive: true }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
<div class="conversations" :class="['conversations', { 'is-open': state.isSidebarOpen }]">
|
||||
<div class="actions">
|
||||
<!-- <div class="action new" @click="addNewConv"><FormOutlined /></div> -->
|
||||
<span style="font-weight: bold;">对话历史</span>
|
||||
<span style="font-weight: bold; user-select: none;">对话历史</span>
|
||||
<div class="action close" @click="state.isSidebarOpen = false"><MenuOutlined /></div>
|
||||
</div>
|
||||
<div class="conversation-list">
|
||||
|
||||
@ -49,7 +49,7 @@
|
||||
<!-- <button @click="deleteDatabase(database.collection_name)">删除</button> -->
|
||||
</div>
|
||||
</div>
|
||||
<h2>图数据库 <a-spin v-if="graphloading" :indicator="indicator" /></h2>
|
||||
<!-- <h2>图数据库 <a-spin v-if="graphloading" :indicator="indicator" /></h2>
|
||||
<p>基于 neo4j 构建的图数据库。</p>
|
||||
<div :class="{'graphloading': graphloading, 'databases': true}" v-if="graph">
|
||||
<div class="dbcard graphbase" @click="navigateToGraph">
|
||||
@ -64,9 +64,8 @@
|
||||
</div>
|
||||
</div>
|
||||
<p class="description">基于 neo4j 构建的图数据库。基于 neo4j 构建的图数据库。基于 neo4j 构建的图数据库。</p>
|
||||
<!-- <button @click="deleteDatabase(database.collection_name)">删除</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="database-empty" v-else>
|
||||
<a-empty>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="graph-container">
|
||||
<div class="graph-container" v-if="configStore.config.enable_knowledge_base">
|
||||
<div class="info">
|
||||
<h1>Neo4j 图数据库</h1>
|
||||
<p>基于 Neo4j 构建的图数据库。</p>
|
||||
@ -52,12 +52,24 @@
|
||||
<div class="main" id="container"></div>
|
||||
|
||||
</div>
|
||||
<div class="database-empty" v-else>
|
||||
<a-empty>
|
||||
<template #description>
|
||||
<span>
|
||||
前往 <router-link to="/setting" style="color: var(--main-color); font-weight: bold;">设置</router-link> 页面配置知识库。
|
||||
</span>
|
||||
</template>
|
||||
</a-empty>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { Graph } from "@antv/g6";
|
||||
import { computed, onMounted, reactive, ref } from 'vue';
|
||||
import { message } from "ant-design-vue";
|
||||
import { useConfigStore } from '@/stores/config';
|
||||
|
||||
const configStore = useConfigStore()
|
||||
|
||||
let graphInstance
|
||||
const fileList = ref([]);
|
||||
@ -253,7 +265,6 @@ const handleDrop = (event) => {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#container {
|
||||
background: #F7F7F7;
|
||||
margin: 20px 0;
|
||||
@ -262,8 +273,12 @@ const handleDrop = (event) => {
|
||||
height: calc(100% - 200px);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.database-empty {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
flex-direction: column;
|
||||
color: var(--c-text-light-1);
|
||||
}
|
||||
</style>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user