hanyuqing
/
KGPython
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

all

hanyuqing
hanyuqing 3 months ago
parent
d55d9374bf
commit
0f038da65b
2 changed files with 91 additions and 65 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 52
      vue/src/system/KGData.vue
  2. 104
      vue/src/system/Profile.vue

52
vue/src/system/KGData.vue
View File

@ -27,7 +27,7 @@
<div class="stat-inner"> <div class="stat-inner">
<div class="stat-label">今日新增</div> <div class="stat-label">今日新增</div>
<div class="stat-value">{{ stats.todayNodes.toLocaleString() }}</div> <div class="stat-value">{{ stats.todayNodes.toLocaleString() }}</div>
<div class="stat-desc">24小时内系统自动爬取及人工审核增量</div> <div class="stat-desc">24小时内系统人工审核增量</div>
</div> </div>
</div> </div>
</div> </div>
@ -83,7 +83,7 @@
</div> </div>
<div class="table-shadow-wrapper table-compact"> <div class="table-shadow-wrapper table-compact">
<el-table v-loading="loading" :data="nodeData" class="ref-table" height="calc(100vh - 560px)"> <el-table v-loading="loading" :data="nodeData" class="ref-table" height="calc(100vh - 530px)">
<el-table-column prop="nodeId" label="节点ID" width="180" align="center" show-overflow-tooltip/> <el-table-column prop="nodeId" label="节点ID" width="180" align="center" show-overflow-tooltip/>
<el-table-column label="实体类型" width="160" align="center"> <el-table-column label="实体类型" width="160" align="center">
<template #default="scope"> <template #default="scope">
@ -438,29 +438,37 @@ onMounted(() => {
<style scoped> <style scoped>
.knowledge-graph-data-container { background-color: #f4f7fa; display: flex; height: 100vh; width: 100vw; } .knowledge-graph-data-container { background-color: #f4f7fa; display: flex; height: 100vh; width: 100vw; }
.main-body { flex: 1; padding: 25px 40px; overflow-y: auto; } .main-body { flex: 1; padding: 25px 40px; overflow: auto;height: 100vh; }
.page-header { display: flex; align-items: center; margin-bottom: 25px; } .page-header { display: flex; align-items: center; margin-bottom: 25px; }
.header-decorator { width: 10px; height: 26px; background-color: #165dff; border-radius: 5px; margin-right: 15px; } .header-decorator { width: 10px; height: 22px; background-color: #165dff; border-radius: 5px; margin-right: 10px; }
.header-title { font-size: 26px; font-weight: bold; color: #165dff; margin: 0; } .header-title { font-size: 22px; font-weight: bold; color: #165dff; margin: 0; }
.stat-container { display: flex; gap: 80px; margin-bottom: 30px; } .stat-container { display: flex; gap: 5%; margin-bottom: 30px; }
.custom-stat-card { flex: 1; max-width: 280px; height: 200px; background: #ffffff; border-radius: 30px; padding: 0 35px; box-shadow: 0 0 40px 0px rgba(22, 93, 255, 0.12); border: 1px solid #ffffff; display: flex; align-items: center; transition: transform 0.3s ease; } .custom-stat-card { flex: 1; max-width: 25%; height: 200px; background: #ffffff; border-radius: 40px; padding: 0 35px; box-shadow: 2px -1px 14px 9px #EBF1FF; border: 1px solid #ffffff; display: flex; align-items: center; transition: transform 0.3s ease; }
.stat-inner { display: flex; flex-direction: column; align-items: flex-start; width: 100%; } .stat-inner { display: flex; flex-direction: column; align-items: flex-start; width: 100%; }
.stat-label { color: #636364; font-size: 21px; font-weight: 600; margin-bottom: 15px; } .stat-label { color: #636364; font-size: 21px; margin-bottom: 15px; }
.stat-value { color: #165dff; font-size: 48px; font-weight: 800; margin-bottom: 15px; line-height: 1; } .stat-value { color: #165dff; font-size: 48px; font-weight: 800; margin-bottom: 15px; line-height: 1; }
.stat-desc { color: #999; font-size: 14px; line-height: 1.4; } .stat-desc { color: #999; font-size: 14px; line-height: 1.4; }
.data-content-wrapper { margin-top: 20px; display: flex; flex-direction: column; } .data-content-wrapper { margin-top: 20px; display: flex; flex-direction: column; }
.custom-folder-tabs { display: flex; padding-left: 60px; } .custom-folder-tabs { display: flex; padding-left: 40px; }
.folder-tab-item { padding: 8px 20px; font-size: 12px; color: #86909c; cursor: pointer; background-color: #ecf2ff; border: 1px solid #dcdfe6; border-bottom: none; border-radius: 8px 8px 0 0; } .folder-tab-item { padding: 8px 20px; font-size: 12px; color: #86909c; cursor: pointer; background-color: #ecf2ff; border: 1px solid #dcdfe6; border-bottom: none; border-radius: 8px 8px 0 0; }
.folder-tab-item.active { background-color: #f1f6ff !important; color: #2869ff; font-weight: bold; border: 2px solid #6896ff; border-bottom: 2px solid #ffffff; margin-bottom: -1px; z-index: 3; } .folder-tab-item.active { background-color: #f1f6ff !important; color: #2869ff; font-weight: bold; border: 2px solid #6896ff; border-bottom: 2px solid #ffffff; margin-bottom: -1px; z-index: 3; }
.data-card-container { background: #ffffff; border-radius: 30px; padding: 40px 20px; box-shadow: 0 0 40px 0px rgba(22, 93, 255, 0.15); border: 1px solid #eff4ff; position: relative; z-index: 2; min-height: 300px; } .data-card-container { background: #ffffff; border-radius: 30px; padding: 20px 20px; box-shadow: 2px -1px 14px 4px #E1EAFF; border: 1px solid #eff4ff; position: relative; z-index: 4; min-height: 380px; }
.filter-bar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; } .filter-bar { display: flex; justify-content: flex-end; align-items: center; margin-bottom: 20px; }
.filter-inputs { display: flex; gap: 35px; flex-wrap: nowrap; } .filter-inputs { display: flex; gap: 35px; flex-wrap: nowrap;margin-right: 20px; }
.input-group-inline { display: flex; align-items: center; gap: 12px; flex-shrink: 0; white-space: nowrap; } .input-group-inline { display: flex; align-items: center; gap: 12px; flex-shrink: 0; white-space: nowrap; }
.filter-label-text { font-size: 14px; color: #165dff; font-weight: 600; flex-shrink: 0; } .filter-label-text { font-size: 14px; color: #165dff; font-weight: 600; flex-shrink: 0; }
.search-input, .search-select { width: 200px !important; } .search-input,.input-group-inline :deep(.el-input) { width: 200px !important;box-shadow: 0 0 0 2px #EBF0FF;border: none;border-radius: 5px; }
.search-input, .search-select { width: 200px !important;box-shadow: 0 0 0 2px #EBF0FF;border: none;border-radius: 5px; }
.input-group-inline :deep(.el-select__wrapper){
box-shadow: none !important;
}
:deep(.el-autocomplete .el-input__wrapper){
box-shadow: none !important;
}
.btn-search-ref { background: #165dff !important; border-radius: 8px; height: 38px; } .btn-search-ref { background: #165dff !important; border-radius: 8px; height: 38px; }
.btn-orange { background: #ffb142 !important; color: white !important; border-radius: 8px; height: 38px; border: none !important; } .btn-orange { background: #ffb142 !important; color: white !important; border-radius: 8px; height: 38px; border: none !important; }
.table-compact { border-radius: 16px; box-shadow: 0 4px 20px rgba(22, 93, 255, 0.08); overflow: hidden; } .table-compact { box-shadow: 0 4px 20px rgba(22, 93, 255, 0.08); overflow: hidden; }
.ref-table :deep(.el-table__header) th { background-color: #e8f0ff !important; color: #2869ff; font-weight: 700; } .ref-table :deep(.el-table__header) th { background-color: #e8f0ff !important; color: #2869ff; font-weight: 700; }
.op-group { display: flex; gap: 8px; justify-content: center; } .op-group { display: flex; gap: 8px; justify-content: center; }
.ref-op-btn { border: none !important; color: white !important; padding: 6px 14px !important; border-radius: 8px !important; } .ref-op-btn { border: none !important; color: white !important; padding: 6px 14px !important; border-radius: 8px !important; }
@ -475,5 +483,21 @@ onMounted(() => {
.btn-cancel { background-color: #e6e6e6 !important; border: none !important; color: #444 !important; padding: 10px 25px !important; font-weight: 500; } .btn-cancel { background-color: #e6e6e6 !important; border: none !important; color: #444 !important; padding: 10px 25px !important; font-weight: 500; }
.btn-confirm { background-color: #165dff !important; border: none !important; padding: 10px 25px !important; font-weight: 500; } .btn-confirm { background-color: #165dff !important; border: none !important; padding: 10px 25px !important; font-weight: 500; }
.animate-fade { animation: fadeIn 0.4s ease-out; } .animate-fade { animation: fadeIn 0.4s ease-out; }
.pagination-custom-text{color: #86909c}
:deep(.el-select__placeholder){color: #86909c}
:deep(.el-pagination__sizes .el-select__wrapper){box-shadow: 0 0 0 2px #EBF0FF;}
:deep(.el-pagination.is-background .el-pager li.is-active){background-color: #165DFF;}
/* 当前激活页码（无论是否 hover）始终是蓝色 */
:deep(.el-pager li.is-active) {
color: #fff !important;
}
:deep(.el-pager li:not(.is-active):hover) {
color: #165DFF !important;
}
:deep(.el-pagination .btn-next:hover){color: #165DFF !important;}
:deep(.el-pagination .btn-prev:hover){color: #165DFF !important;}
.pagination-footer :deep(.el-pagination .el-input__inner){box-shadow: 0 0 0 2px #EBF0FF;border-radius: 5px; }
.pagination-footer :deep(.el-input__wrapper){ box-shadow: none !important;}
@keyframes fadeIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } } @keyframes fadeIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
</style> </style>

104
vue/src/system/Profile.vue
View File

@ -61,38 +61,42 @@
required required
> >
</div> </div>
<div style="display: flex">
<div class="form-group"> <div class="form-group">
<label for="newPassword" class="form-label">新密码</label> <label for="newPassword" class="form-label">新密码</label>
<input <input
type="password" type="password"
id="newPassword" id="newPassword"
v-model="passwordForm.newPassword" v-model="passwordForm.newPassword"
class="form-input" class="form-input"
placeholder="请设置新密码(8-16位，含字母+数字)" placeholder="请设置新密码(8-16位，含字母+数字)"
required required style=" width: 97%;"
> >
<div class="form-label" style="text-align: left;margin-top: 7px;font-size: 12px;font-weight: 500">密码要求:8-16位，包含字母和数字，不允许空格</div> <div class="form-label" style="text-align: left;margin-top: 5px;font-size: 13px;font-weight: 500">密码要求:8-16位，包含字母和数字，不允许空格</div>
</div>
<div class="form-group">
<label for="confirmPassword" class="form-label">确认新密码</label>
<input style=" width: 100%;"
type="password"
id="confirmPassword"
v-model="passwordForm.confirmPassword"
class="form-input"
placeholder="请再次输入新密码"
required
>
<p v-if="passwordMismatch" class="error-text">两次输入的密码不一致</p>
</div>
</div> </div>
<div class="form-group">
<label for="confirmPassword" class="form-label">确认新密码</label>
<input
type="password"
id="confirmPassword"
v-model="passwordForm.confirmPassword"
class="form-input"
placeholder="请再次输入新密码"
required
>
<p v-if="passwordMismatch" class="error-text">两次输入的密码不一致</p>
</div>
<div class="form-actions"> <div class="form-actions">
<button type="submit" class="save-button" :disabled="passwordSaving || passwordMismatch"> <button type="submit" class="save-button" :disabled="passwordSaving || passwordMismatch">
<span v-if="!passwordSaving">修改密码</span> 保存新密码
<span v-else>修改中...</span> </button>
<button type="submit" class="reset" :disabled="passwordSaving || passwordMismatch">
重置表单
</button> </button>
</div> </div>
</form> </form>
@ -476,8 +480,8 @@ onMounted(async () => {
.avatar-container { .avatar-container {
position: relative; position: relative;
width: 120px; width: 140px;
height: 120px; height: 140px;
margin-bottom: 1rem; margin-bottom: 1rem;
} }
@ -553,14 +557,6 @@ onMounted(async () => {
color: #10b981; color: #10b981;
} }
/* 信息区域样式 */
.info-section {
margin-bottom: 1.5rem;
}
.section-title { .section-title {
font-size: 17px; font-size: 17px;
margin-bottom: 10px; margin-bottom: 10px;
@ -587,7 +583,7 @@ onMounted(async () => {
.profile-form, .password-form { .profile-form, .password-form {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 1rem; gap: 13px;
margin-top: 15px; margin-top: 15px;
} }
@ -598,7 +594,7 @@ onMounted(async () => {
} }
.form-label { .form-label {
font-size: 0.875rem; font-size: 15px;
text-align: left; text-align: left;
font-weight: bold; font-weight: bold;
color: #8d929a; color: #8d929a;
@ -633,36 +629,42 @@ onMounted(async () => {
.form-actions { .form-actions {
text-align: left; text-align: left;
margin-top: 1rem; margin-top: -2px;
} }
.save-button { .save-button {
background-color: #3b82f6; background-color: #1558F6;
color: white; color: white;
border: none; border: none;
border-radius: 0.375rem;
padding: 0.625rem 1.25rem; padding: 0.625rem 1.25rem;
font-size: 0.875rem; font-size: 0.875rem;
font-weight: 500; font-weight: 500;
cursor: pointer; cursor: pointer;
transition: background-color 0.2s; transition: background-color 0.2s;
min-width: 120px; min-width: 120px;
border-radius: 7px;
margin-right: 15px;
} }
.save-button:hover:not(:disabled) { .reset {
background-color: #2563eb; background-color: #F5F8FF;
} color: #8d929a;
padding: 0.625rem 1.25rem;
.save-button:disabled { font-size: 0.875rem;
background-color: #9ca3af; font-weight: 500;
cursor: not-allowed; cursor: pointer;
transition: background-color 0.2s;
min-width: 120px;
border-radius: 7px;
border: 2px solid #EBF1FF;
} }
/* 错误和成功消息样式 */ /* 错误和成功消息样式 */
.error-text { .error-text {
color: #ef4444; color: #ef4444;
font-size: 0.75rem; text-align: left;
margin-top: 0.25rem; margin-top: 5px;
font-size: 13px;
font-weight: 500;
} }
.success-message, .error-message { .success-message, .error-message {

Write Preview
Loading…
Cancel
Save