|
|
@@ -9,7 +9,6 @@
|
|
|
<div class="action-buttons">
|
|
|
<el-select v-model="queryParams.status" placeholder="所有状态" clearable style="width: 120px; margin-right: 12px" @change="handleSearch">
|
|
|
<el-option label="正常" value="normal" />
|
|
|
- <el-option label="测试" value="test" />
|
|
|
<el-option label="已禁用" value="disabled" />
|
|
|
</el-select>
|
|
|
<el-input
|
|
|
@@ -19,11 +18,10 @@
|
|
|
clearable
|
|
|
@keyup.enter="handleSearch"
|
|
|
@clear="handleSearch"
|
|
|
- >
|
|
|
- <template #prefix>
|
|
|
- <el-icon><Search /></el-icon>
|
|
|
- </template>
|
|
|
- </el-input>
|
|
|
+ />
|
|
|
+ <el-button type="primary" @click="handleSearch">
|
|
|
+ <el-icon><Search /></el-icon> 查询
|
|
|
+ </el-button>
|
|
|
<el-button type="primary" @click="handleAdd">
|
|
|
<el-icon><Plus /></el-icon> 新建知识库
|
|
|
</el-button>
|
|
|
@@ -47,6 +45,8 @@
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column prop="collection_name" label="知识库表名" min-width="150" />
|
|
|
+
|
|
|
+ <el-table-column prop="document_count" label="文档数量" width="100" />
|
|
|
|
|
|
<el-table-column prop="status" label="状态" width="100">
|
|
|
<template #default="{ row }">
|
|
|
@@ -54,20 +54,22 @@
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
|
|
|
+ <el-table-column prop="created_by" label="创建人" width="100" />
|
|
|
+
|
|
|
<el-table-column prop="created_at" label="创建时间" width="160">
|
|
|
<template #default="{ row }">
|
|
|
{{ formatTime(row.created_at) }}
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
|
|
|
+ <el-table-column prop="updated_by" label="修改人" width="100" />
|
|
|
+
|
|
|
<el-table-column prop="updated_at" label="修改时间" width="160">
|
|
|
<template #default="{ row }">
|
|
|
{{ formatTime(row.updated_at) }}
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
|
|
|
- <el-table-column prop="document_count" label="文档数量" width="100" />
|
|
|
-
|
|
|
<el-table-column label="操作" width="180" fixed="right">
|
|
|
<template #default="{ row }">
|
|
|
<el-tooltip content="查看" placement="top">
|
|
|
@@ -80,8 +82,8 @@
|
|
|
<el-icon><Edit /></el-icon>
|
|
|
</el-button>
|
|
|
</el-tooltip>
|
|
|
- <el-tooltip content="同步到Milvus" placement="top">
|
|
|
- <el-button link type="warning" @click="handleSync(row)">
|
|
|
+ <el-tooltip :content="row.is_synced ? '已同步' : '同步到Milvus'" placement="top">
|
|
|
+ <el-button link type="warning" @click="handleSync(row)" :disabled="row.is_synced">
|
|
|
<el-icon><Refresh /></el-icon>
|
|
|
</el-button>
|
|
|
</el-tooltip>
|
|
|
@@ -128,111 +130,106 @@
|
|
|
<el-dialog
|
|
|
v-model="dialogVisible"
|
|
|
:title="dialogType === 'create' ? '新建知识库' : '编辑知识库'"
|
|
|
- width="500px"
|
|
|
+ width="700px"
|
|
|
@close="resetForm"
|
|
|
+ class="kb-dialog"
|
|
|
>
|
|
|
- <el-form ref="formRef" :model="formData" :rules="rules" label-width="100px">
|
|
|
- <el-form-item label="名称" prop="name">
|
|
|
- <el-input v-model="formData.name" placeholder="请输入知识库名称" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="集合名称" prop="collection_name" v-if="dialogType === 'create'">
|
|
|
- <el-input v-model="formData.collection_name" placeholder="请输入Milvus集合名称(英文)" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="描述" prop="description">
|
|
|
- <el-input v-model="formData.description" type="textarea" rows="3" placeholder="请输入描述信息" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="维度" prop="dimension" v-if="dialogType === 'create'">
|
|
|
- <el-input-number v-model="formData.dimension" :min="1" :step="1" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="自定义Schema" v-if="dialogType === 'create'">
|
|
|
- <div class="metadata-fields-container">
|
|
|
- <div v-for="(schema, index) in formData.custom_schemas" :key="index" class="metadata-field-row">
|
|
|
- <div class="field-inputs">
|
|
|
- <el-row :gutter="10">
|
|
|
- <el-col :span="6">
|
|
|
- <el-form-item :prop="'custom_schemas.' + index + '.field_name'" :rules="[
|
|
|
- { required: true, message: '请输入字段名', trigger: 'blur' },
|
|
|
- { pattern: /^[a-zA-Z_][a-zA-Z0-9_]*$/, message: '以字母/下划线开头', trigger: 'blur' }
|
|
|
- ]" style="margin-bottom: 0;">
|
|
|
- <el-input v-model="schema.field_name" placeholder="Schema字段名(英文)" />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="6">
|
|
|
- <el-select v-model="schema.field_type" placeholder="Schema类型">
|
|
|
- <el-option label="INT64" value="INT64" />
|
|
|
- <el-option label="INT32" value="INT32" />
|
|
|
- <el-option label="FLOAT" value="FLOAT" />
|
|
|
- <el-option label="VARCHAR" value="VARCHAR" />
|
|
|
- <el-option label="BOOL" value="BOOL" />
|
|
|
- <el-option label="JSON" value="JSON" />
|
|
|
- </el-select>
|
|
|
- </el-col>
|
|
|
- <el-col :span="6">
|
|
|
- <el-input v-model="schema.description" placeholder="Schema描述" />
|
|
|
- </el-col>
|
|
|
- <el-col :span="6" v-if="schema.field_type === 'VARCHAR'">
|
|
|
- <el-input-number v-model="schema.max_length" :min="1" placeholder="Max Len" style="width: 100%" />
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </div>
|
|
|
- <el-button
|
|
|
- type="danger"
|
|
|
- link
|
|
|
- :icon="Delete"
|
|
|
- @click="removeCustomSchema(index)"
|
|
|
- class="delete-btn"
|
|
|
- />
|
|
|
- </div>
|
|
|
- <div class="add-field-btn">
|
|
|
- <el-button type="success" link :icon="Plus" @click="addCustomSchema">添加Schema字段</el-button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </el-form-item>
|
|
|
+ <el-form ref="formRef" :model="formData" :rules="rules" label-width="110px" class="kb-form">
|
|
|
+ <div class="form-section">
|
|
|
+ <div class="section-title">基本信息</div>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="知识库名称" prop="name">
|
|
|
+ <el-input v-model="formData.name" placeholder="请输入知识库名称" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="集合名称" prop="collection_name" v-if="dialogType === 'create'">
|
|
|
+ <el-input v-model="formData.collection_name" placeholder="Milvus集合名(英文)" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="集合名称" v-else>
|
|
|
+ <el-input v-model="formData.collection_name" disabled />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-form-item label="描述" prop="description">
|
|
|
+ <el-input
|
|
|
+ v-model="formData.description"
|
|
|
+ type="textarea"
|
|
|
+ rows="3"
|
|
|
+ placeholder="请输入关于此知识库的详细描述..."
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12" v-if="dialogType === 'create'">
|
|
|
+ <el-form-item label="向量维度" prop="dimension">
|
|
|
+ <el-input-number v-model="formData.dimension" :min="1" :step="1" style="width: 100%" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="状态" prop="status">
|
|
|
+ <el-radio-group v-model="formData.status">
|
|
|
+ <el-radio-button label="normal">正常</el-radio-button>
|
|
|
+ <el-radio-button label="disabled">禁用</el-radio-button>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
|
|
|
- <el-form-item label="元数据字段" v-if="dialogType === 'create'">
|
|
|
+ <div class="form-section">
|
|
|
+ <div class="section-header">
|
|
|
+ <div class="section-title">元数据字段定义</div>
|
|
|
+ <div class="section-desc">定义文档的额外属性,用于精确检索过滤</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
<div class="metadata-fields-container">
|
|
|
- <div v-for="(field, index) in formData.metadata_fields" :key="index" class="metadata-field-row">
|
|
|
- <div class="field-inputs">
|
|
|
- <el-row :gutter="10">
|
|
|
- <el-col :span="6">
|
|
|
- <el-input v-model="field.field_zh_name" placeholder="中文名称" />
|
|
|
- </el-col>
|
|
|
- <el-col :span="6">
|
|
|
- <el-input v-model="field.field_en_name" placeholder="英文名称" />
|
|
|
- </el-col>
|
|
|
- <el-col :span="5">
|
|
|
+ <div v-for="(field, index) in formData.metadata_fields" :key="index" class="metadata-field-card">
|
|
|
+ <div class="field-header">
|
|
|
+ <span class="field-index">字段 {{ index + 1 }}</span>
|
|
|
+ <el-button
|
|
|
+ v-if="formData.metadata_fields.length > 1"
|
|
|
+ type="danger"
|
|
|
+ link
|
|
|
+ :icon="Delete"
|
|
|
+ @click="removeMetadataField(index)"
|
|
|
+ size="small"
|
|
|
+ >删除</el-button>
|
|
|
+ </div>
|
|
|
+ <el-row :gutter="15">
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-form-item label-width="0" style="margin-bottom: 12px;">
|
|
|
+ <el-input v-model="field.field_zh_name" placeholder="中文名称 (如: 年份)" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-form-item label-width="0" style="margin-bottom: 12px;">
|
|
|
+ <el-input v-model="field.field_en_name" placeholder="英文标识 (如: year)" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5">
|
|
|
+ <el-form-item label-width="0" style="margin-bottom: 12px;">
|
|
|
<el-select v-model="field.field_type" placeholder="类型">
|
|
|
<el-option label="文本" value="text" />
|
|
|
<el-option label="数字" value="num" />
|
|
|
</el-select>
|
|
|
- </el-col>
|
|
|
- <el-col :span="7">
|
|
|
- <el-input v-model="field.remark" placeholder="备注" />
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </div>
|
|
|
- <!-- 元数据字段现在默认必须存在至少一个,但也允许用户删除 -->
|
|
|
- <el-button
|
|
|
- v-if="formData.metadata_fields.length > 1"
|
|
|
- type="danger"
|
|
|
- link
|
|
|
- :icon="Delete"
|
|
|
- @click="removeMetadataField(index)"
|
|
|
- class="delete-btn"
|
|
|
- />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="7">
|
|
|
+ <el-form-item label-width="0" style="margin-bottom: 12px;">
|
|
|
+ <el-input v-model="field.remark" placeholder="备注说明" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
</div>
|
|
|
+
|
|
|
<div class="add-field-btn">
|
|
|
- <el-button type="primary" link :icon="Plus" @click="addMetadataField">添加元数据字段</el-button>
|
|
|
+ <el-button type="primary" plain :icon="Plus" @click="addMetadataField" style="width: 100%">添加元数据字段</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="状态" prop="status">
|
|
|
- <el-radio-group v-model="formData.status">
|
|
|
- <el-radio label="normal">正常</el-radio>
|
|
|
- <el-radio label="test">测试</el-radio>
|
|
|
- <el-radio label="disabled">禁用</el-radio>
|
|
|
- </el-radio-group>
|
|
|
- </el-form-item>
|
|
|
+ </div>
|
|
|
</el-form>
|
|
|
<template #footer>
|
|
|
<span class="dialog-footer">
|
|
|
@@ -251,6 +248,7 @@ import { ElMessage, ElMessageBox } from 'element-plus'
|
|
|
import type { FormInstance, FormRules } from 'element-plus'
|
|
|
import {
|
|
|
getKnowledgeBases,
|
|
|
+ getKnowledgeBaseMetadata,
|
|
|
createKnowledgeBase,
|
|
|
updateKnowledgeBase,
|
|
|
updateKnowledgeBaseStatus,
|
|
|
@@ -289,8 +287,7 @@ const formData = reactive({
|
|
|
description: '',
|
|
|
dimension: 768,
|
|
|
status: 'normal',
|
|
|
- metadata_fields: [{ field_zh_name: '', field_en_name: '', field_type: 'text', remark: '' }],
|
|
|
- custom_schemas: [] as any[]
|
|
|
+ metadata_fields: [{ field_zh_name: '', field_en_name: '', field_type: 'text', remark: '' }]
|
|
|
})
|
|
|
|
|
|
const rules: FormRules = {
|
|
|
@@ -346,21 +343,35 @@ const handleAdd = () => {
|
|
|
formData.name = ''
|
|
|
formData.collection_name = ''
|
|
|
formData.description = ''
|
|
|
- formData.dimension = 768
|
|
|
+ formData.dimension = 768
|
|
|
formData.status = 'normal'
|
|
|
formData.metadata_fields = [{ field_zh_name: '', field_en_name: '', field_type: 'text', remark: '' }]
|
|
|
- formData.custom_schemas = []
|
|
|
dialogVisible.value = true
|
|
|
}
|
|
|
-
|
|
|
-const handleEdit = (row: KnowledgeBase) => {
|
|
|
+const handleEdit = async (row: KnowledgeBase) => {
|
|
|
dialogType.value = 'edit'
|
|
|
formData.id = row.id
|
|
|
formData.name = row.name
|
|
|
formData.collection_name = row.collection_name
|
|
|
formData.description = row.description || ''
|
|
|
formData.status = row.status
|
|
|
- // dimension cannot be changed
|
|
|
+
|
|
|
+ // 加载元数据字段,允许编辑
|
|
|
+ try {
|
|
|
+ const res = await getKnowledgeBaseMetadata(row.id)
|
|
|
+ if (res.code === 0 && res.data) {
|
|
|
+ // res.data.metadata_fields 是从 t_samp_metadata 获取的
|
|
|
+ if (res.data.metadata_fields && res.data.metadata_fields.length > 0) {
|
|
|
+ formData.metadata_fields = res.data.metadata_fields
|
|
|
+ } else {
|
|
|
+ formData.metadata_fields = [{ field_zh_name: '', field_en_name: '', field_type: 'text', remark: '' }]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error("加载元数据失败", error)
|
|
|
+ formData.metadata_fields = [{ field_zh_name: '', field_en_name: '', field_type: 'text', remark: '' }]
|
|
|
+ }
|
|
|
+
|
|
|
dialogVisible.value = true
|
|
|
}
|
|
|
|
|
|
@@ -374,11 +385,78 @@ const handleSync = async (row: KnowledgeBase) => {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-const handleView = (row: KnowledgeBase) => {
|
|
|
- ElMessage.info(`查看知识库: ${row.name}`)
|
|
|
+const handleView = async (row: KnowledgeBase) => {
|
|
|
+ // 复用编辑时的逻辑加载元数据,但不打开编辑弹窗
|
|
|
+ try {
|
|
|
+ const res = await getKnowledgeBaseMetadata(row.id)
|
|
|
+ let metadataInfo = ''
|
|
|
+ let schemaInfo = ''
|
|
|
+
|
|
|
+ if (res.code === 0 && res.data) {
|
|
|
+ if (res.data.metadata_fields && res.data.metadata_fields.length > 0) {
|
|
|
+ metadataInfo = res.data.metadata_fields.map((f: any) =>
|
|
|
+ `<li>${f.field_zh_name} (${f.field_en_name}): ${f.field_type === 'text' ? '文本' : '数字'} - ${f.remark || '无备注'}</li>`
|
|
|
+ ).join('')
|
|
|
+ }
|
|
|
+
|
|
|
+ if (res.data.custom_schemas && res.data.custom_schemas.length > 0) {
|
|
|
+ schemaInfo = res.data.custom_schemas.map((s: any) =>
|
|
|
+ `<li>${s.field_name}: ${s.field_type} ${s.max_length ? `(Max: ${s.max_length})` : ''} - ${s.description || '无描述'}</li>`
|
|
|
+ ).join('')
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ const content = `
|
|
|
+ <div style="text-align: left;">
|
|
|
+ <p><strong>名称:</strong> ${row.name}</p>
|
|
|
+ <p><strong>集合:</strong> ${row.collection_name}</p>
|
|
|
+ <p><strong>描述:</strong> ${row.description || '暂无'}</p>
|
|
|
+ <p><strong>状态:</strong> ${getStatusText(row.status)}</p>
|
|
|
+ <p><strong>文档数:</strong> ${row.document_count}</p>
|
|
|
+ <p><strong>创建时间:</strong> ${formatTime(row.created_at)}</p>
|
|
|
+ <br>
|
|
|
+ <p><strong>自定义 Schema (Milvus):</strong></p>
|
|
|
+ <ul>
|
|
|
+ <li>pk: INT64 (主键)</li>
|
|
|
+ <li>text: VARCHAR (65535) - 内容</li>
|
|
|
+ <li>vector: FLOAT_VECTOR (768) - 向量列</li>
|
|
|
+ <li>sparse: BM25 - 关键字检索</li>
|
|
|
+ <li>document_id: VARCHAR (128) - 文档ID</li>
|
|
|
+ <li>parent_id: VARCHAR (128) - 父段ID</li>
|
|
|
+ <li>index: INT64 - 索引序号</li>
|
|
|
+ <li>tag_list: VARCHAR (2048) - 标签</li>
|
|
|
+ <li>permission: JSON - 权限</li>
|
|
|
+ <li>metadata: JSON - 元数据</li>
|
|
|
+ <li>is_deleted: BOOL - 删除标志</li>
|
|
|
+ <li>created_by: VARCHAR (128) - 创建人</li>
|
|
|
+ <li>created_time: INT64 - 创建时间</li>
|
|
|
+ <li>updated_by: VARCHAR (128) - 修改人</li>
|
|
|
+ <li>updated_time: INT64 - 修改时间</li>
|
|
|
+ </ul>
|
|
|
+ <br>
|
|
|
+ <p><strong>元数据字段 (Metadata):</strong></p>
|
|
|
+ <ul>${metadataInfo || '<li>无元数据字段</li>'}</ul>
|
|
|
+ </div>
|
|
|
+ `
|
|
|
+
|
|
|
+ ElMessageBox.alert(content, '知识库详情', {
|
|
|
+ dangerouslyUseHTMLString: true,
|
|
|
+ confirmButtonText: '关闭',
|
|
|
+ customStyle: { maxWidth: '600px' }
|
|
|
+ })
|
|
|
+ } catch (error) {
|
|
|
+ console.error("加载详情失败", error)
|
|
|
+ ElMessage.error("获取详情失败")
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
const handleDelete = (row: KnowledgeBase) => {
|
|
|
+ // 预先检查,提升用户体验
|
|
|
+ if (row.document_count > 0) {
|
|
|
+ ElMessage.warning(`知识库 "${row.name}" 中仍有 ${row.document_count} 条文档,请先清空文档后再删除`)
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
ElMessageBox.confirm(
|
|
|
`确定要删除知识库 "${row.name}" 吗?此操作不可恢复,且会删除对应的Milvus集合。`,
|
|
|
'警告',
|
|
|
@@ -413,14 +491,6 @@ const handleCommand = async (command: string, row: KnowledgeBase) => {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-const addCustomSchema = () => {
|
|
|
- formData.custom_schemas.push({ field_name: '', field_type: 'VARCHAR', max_length: 256, is_primary: false, description: '' })
|
|
|
-}
|
|
|
-
|
|
|
-const removeCustomSchema = (index: number) => {
|
|
|
- formData.custom_schemas.splice(index, 1)
|
|
|
-}
|
|
|
-
|
|
|
const addMetadataField = () => {
|
|
|
formData.metadata_fields.push({ field_zh_name: '', field_en_name: '', field_type: 'text', remark: '' })
|
|
|
}
|
|
|
@@ -441,15 +511,15 @@ const handleSubmit = async () => {
|
|
|
collection_name: formData.collection_name,
|
|
|
description: formData.description,
|
|
|
dimension: formData.dimension,
|
|
|
- metadata_fields: formData.metadata_fields.filter(f => f.field_zh_name && f.field_en_name),
|
|
|
- custom_schemas: formData.custom_schemas.filter(s => s.field_name)
|
|
|
+ metadata_fields: formData.metadata_fields.filter(f => f.field_zh_name && f.field_en_name)
|
|
|
})
|
|
|
ElMessage.success('创建成功')
|
|
|
} else {
|
|
|
await updateKnowledgeBase(formData.id, {
|
|
|
name: formData.name,
|
|
|
description: formData.description,
|
|
|
- status: formData.status
|
|
|
+ status: formData.status,
|
|
|
+ metadata_fields: formData.metadata_fields.filter(f => f.field_zh_name && f.field_en_name)
|
|
|
})
|
|
|
ElMessage.success('更新成功')
|
|
|
}
|
|
|
@@ -583,25 +653,72 @@ onMounted(() => {
|
|
|
font-size: 13px;
|
|
|
}
|
|
|
|
|
|
-.metadata-fields-container {
|
|
|
- width: 100%;
|
|
|
+.kb-dialog :deep(.el-dialog__body) {
|
|
|
+ padding: 20px 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.kb-form {
|
|
|
+ padding-right: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.form-section {
|
|
|
+ margin-bottom: 24px;
|
|
|
+}
|
|
|
+
|
|
|
+.section-title {
|
|
|
+ font-size: 15px;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #303133;
|
|
|
+ margin-bottom: 16px;
|
|
|
+ padding-left: 10px;
|
|
|
+ border-left: 3px solid #409eff;
|
|
|
+}
|
|
|
+
|
|
|
+.section-header {
|
|
|
+ display: flex;
|
|
|
+ align-items: baseline;
|
|
|
+ margin-bottom: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.section-desc {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #909399;
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.metadata-field-card {
|
|
|
+ background-color: #f8f9fa;
|
|
|
+ border-radius: 4px;
|
|
|
+ border: 1px solid #e4e7ed;
|
|
|
+ padding: 12px 16px;
|
|
|
+ margin-bottom: 12px;
|
|
|
}
|
|
|
|
|
|
-.metadata-field-row {
|
|
|
+.field-header {
|
|
|
display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
align-items: center;
|
|
|
margin-bottom: 10px;
|
|
|
}
|
|
|
|
|
|
-.field-inputs {
|
|
|
- flex: 1;
|
|
|
+.field-index {
|
|
|
+ font-size: 12px;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #606266;
|
|
|
+ background-color: #e6e8eb;
|
|
|
+ padding: 2px 6px;
|
|
|
+ border-radius: 2px;
|
|
|
}
|
|
|
|
|
|
-.delete-btn {
|
|
|
- margin-left: 10px;
|
|
|
+.add-field-btn {
|
|
|
+ margin-top: 10px;
|
|
|
}
|
|
|
|
|
|
-.add-field-btn {
|
|
|
- margin-top: 5px;
|
|
|
+.metadata-fields-container {
|
|
|
+ padding: 0 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.delete-btn {
|
|
|
+ margin-left: 10px;
|
|
|
}
|
|
|
</style>
|