|
|
@@ -6,77 +6,75 @@
|
|
|
<el-tab-pane label="中心知识库" name="中心知识库"></el-tab-pane>
|
|
|
<el-tab-pane label="部门知识库" name="部门知识库"></el-tab-pane>
|
|
|
</el-tabs>
|
|
|
- <el-row :gutter="20" class="h100">
|
|
|
- <el-col :xs="6" :sm="6" :md="6" :lg="4" :xl="4" class="left-container">
|
|
|
- <div class="h100 pr10">
|
|
|
- <el-tabs v-model="state.activeName" stretch @tab-change="resetNode">
|
|
|
- <el-tab-pane label="部门" name="0">
|
|
|
- <el-input v-model="filterOrg" placeholder="请输入部门名称" class="input-with-select mt10 mb10" clearable @input="onQueryChanged"> </el-input>
|
|
|
- </el-tab-pane>
|
|
|
- <el-tab-pane label="知识分类" name="1">
|
|
|
- <el-input v-model="filterType" placeholder="请输入知识分类名称" class="input-with-select mt10 mb10" clearable> </el-input>
|
|
|
- </el-tab-pane>
|
|
|
- <el-tab-pane label="热点" name="2">
|
|
|
- <el-input v-model="filterHot" placeholder="请输入热点名称" class="input-with-select mt10 mb10" clearable> </el-input>
|
|
|
- </el-tab-pane>
|
|
|
- </el-tabs>
|
|
|
- <el-scrollbar style="height: calc(100% - 100px);'" ref="scrollBarRef">
|
|
|
- <el-tree-v2
|
|
|
- v-show="state.activeName === '0'"
|
|
|
- :data="state.orgData"
|
|
|
- highlight-current
|
|
|
- :expand-on-click-node="false"
|
|
|
- :props="{ children: 'children', label: 'name' }"
|
|
|
- @node-click="handleNodeClick"
|
|
|
- ref="orgRef"
|
|
|
- :filter-method="filterNode"
|
|
|
- :item-size="40"
|
|
|
- :height="treeHeight"
|
|
|
- empty-text="暂无组织数据"
|
|
|
- >
|
|
|
- <template #default="{ node }">
|
|
|
- <span :title="node.label">{{ node.label }}</span>
|
|
|
- </template>
|
|
|
- </el-tree-v2>
|
|
|
- <el-tree
|
|
|
- :data="state.knowledgeOptions"
|
|
|
- highlight-current
|
|
|
- :expand-on-click-node="false"
|
|
|
- :props="{ children: 'children', label: 'name' }"
|
|
|
- @node-click="handleNodeClick"
|
|
|
- ref="typeRef"
|
|
|
- v-loading="state.loading"
|
|
|
- :filter-node-method="filterNodeType"
|
|
|
- node-key="id"
|
|
|
- :style="state.activeName === '1' ? 'min-width: 100%; display: inline-block' : 'display:none'"
|
|
|
- :default-expanded-keys="state.defaultExpandedTypeKeys"
|
|
|
- >
|
|
|
- </el-tree>
|
|
|
- <el-tree
|
|
|
- filterable
|
|
|
- highlight-current
|
|
|
- placeholder="请选择热点分类"
|
|
|
- :props="HotspotProps"
|
|
|
- @node-click="handleNodeClick"
|
|
|
- lazy
|
|
|
- :load="load"
|
|
|
- node-key="id"
|
|
|
- ref="hotRef"
|
|
|
- :filter-node-method="filterNodeHot"
|
|
|
- :expand-on-click-node="false"
|
|
|
- :style="state.activeName === '2' ? 'min-width: 100%; display: inline-block' : 'display:none'"
|
|
|
- >
|
|
|
- <template #default="{ data }">
|
|
|
- <span :title="data.hotSpotName">
|
|
|
- {{ data.hotSpotName }}
|
|
|
- </span>
|
|
|
- </template>
|
|
|
- </el-tree>
|
|
|
- </el-scrollbar>
|
|
|
- </div>
|
|
|
- </el-col>
|
|
|
-
|
|
|
- <el-col :xs="12" :sm="12" :md="14" :lg="14" :xl="14" class="center-container">
|
|
|
+ <splitpanes class="h100" Vertical>
|
|
|
+ <pane min-size="16" max-size="25" size="16" class="left-container">
|
|
|
+ <el-tabs v-model="state.activeName" stretch @tab-change="resetNode">
|
|
|
+ <el-tab-pane label="部门" name="0">
|
|
|
+ <el-input v-model="filterOrg" placeholder="请输入部门名称" class="input-with-select mt10 mb10" clearable @input="onQueryChanged">
|
|
|
+ </el-input>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="知识分类" name="1">
|
|
|
+ <el-input v-model="filterType" placeholder="请输入知识分类名称" class="input-with-select mt10 mb10" clearable> </el-input>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="热点" name="2">
|
|
|
+ <el-input v-model="filterHot" placeholder="请输入热点名称" class="input-with-select mt10 mb10" clearable> </el-input>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ <el-scrollbar style="height: calc(100% - 100px);'" ref="scrollBarRef">
|
|
|
+ <el-tree-v2
|
|
|
+ v-show="state.activeName === '0'"
|
|
|
+ :data="state.orgData"
|
|
|
+ highlight-current
|
|
|
+ :expand-on-click-node="false"
|
|
|
+ :props="{ children: 'children', label: 'name' }"
|
|
|
+ @node-click="handleNodeClick"
|
|
|
+ ref="orgRef"
|
|
|
+ :filter-method="filterNode"
|
|
|
+ :item-size="40"
|
|
|
+ :height="treeHeight"
|
|
|
+ empty-text="暂无组织数据"
|
|
|
+ >
|
|
|
+ <template #default="{ node }">
|
|
|
+ <span :title="node.label">{{ node.label }}</span>
|
|
|
+ </template>
|
|
|
+ </el-tree-v2>
|
|
|
+ <el-tree
|
|
|
+ :data="state.knowledgeOptions"
|
|
|
+ highlight-current
|
|
|
+ :expand-on-click-node="false"
|
|
|
+ :props="{ children: 'children', label: 'name' }"
|
|
|
+ @node-click="handleNodeClick"
|
|
|
+ ref="typeRef"
|
|
|
+ v-loading="state.loading"
|
|
|
+ :filter-node-method="filterNodeType"
|
|
|
+ node-key="id"
|
|
|
+ :style="state.activeName === '1' ? 'min-width: 100%; display: inline-block' : 'display:none'"
|
|
|
+ :default-expanded-keys="state.defaultExpandedTypeKeys"
|
|
|
+ >
|
|
|
+ </el-tree>
|
|
|
+ <el-tree
|
|
|
+ filterable
|
|
|
+ highlight-current
|
|
|
+ placeholder="请选择热点分类"
|
|
|
+ :props="HotspotProps"
|
|
|
+ @node-click="handleNodeClick"
|
|
|
+ lazy
|
|
|
+ :load="load"
|
|
|
+ node-key="id"
|
|
|
+ ref="hotRef"
|
|
|
+ :filter-node-method="filterNodeHot"
|
|
|
+ :expand-on-click-node="false"
|
|
|
+ :style="state.activeName === '2' ? 'min-width: 100%; display: inline-block' : 'display:none'"
|
|
|
+ >
|
|
|
+ <template #default="{ data }">
|
|
|
+ <span :title="data.hotSpotName">
|
|
|
+ {{ data.hotSpotName }}
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-tree>
|
|
|
+ </el-scrollbar>
|
|
|
+ </pane>
|
|
|
+ <pane class="center-container">
|
|
|
<div class="input-box">
|
|
|
<el-select v-model="state.queryParams.RetrievalType" placeholder="请选择" style="width: 120px" @change="queryList">
|
|
|
<el-option label="全文" :value="0" />
|
|
|
@@ -157,9 +155,8 @@
|
|
|
v-model:limit="state.queryParams.PageSize"
|
|
|
@pagination="queryList"
|
|
|
/>
|
|
|
- </el-col>
|
|
|
-
|
|
|
- <el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6" class="right-container">
|
|
|
+ </pane>
|
|
|
+ <pane min-size="20" max-size="30" size="20" class="right-container">
|
|
|
<p class="flex-center-between pt10">
|
|
|
<span class="font16">常用知识前10</span>
|
|
|
<el-button link type="primary" @click="querySearchNum"><SvgIcon name="ele-Refresh" class="mr4" /> 刷新</el-button>
|
|
|
@@ -184,8 +181,8 @@
|
|
|
<Empty />
|
|
|
</template>
|
|
|
</div>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
+ </pane>
|
|
|
+ </splitpanes>
|
|
|
</el-card>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -201,6 +198,8 @@ import { getOrgList } from '/@/api/system/organize';
|
|
|
import { treeList } from '/@/api/knowledge/type';
|
|
|
import { formatDate } from '/@/utils/formatTime';
|
|
|
import { throttle } from '/@/utils/tools';
|
|
|
+import { Splitpanes, Pane } from 'splitpanes';
|
|
|
+import 'splitpanes/dist/splitpanes.css';
|
|
|
|
|
|
const state = reactive<any>({
|
|
|
queryParams: {
|
|
|
@@ -240,12 +239,12 @@ const load = async (node: any, resolve: any) => {
|
|
|
const filterOrg = ref('');
|
|
|
const orgRef = ref<RefType>();
|
|
|
const onQueryChanged = (query: string) => {
|
|
|
- if (query) {
|
|
|
- orgRef.value!.filter(query);
|
|
|
- } else {
|
|
|
- orgRef.value!.filter(query);
|
|
|
- orgRef.value?.setExpandedKeys([]);
|
|
|
- }
|
|
|
+ if (query) {
|
|
|
+ orgRef.value!.filter(query);
|
|
|
+ } else {
|
|
|
+ orgRef.value!.filter(query);
|
|
|
+ orgRef.value?.setExpandedKeys([]);
|
|
|
+ }
|
|
|
};
|
|
|
const filterNode = (value: string, data: any) => {
|
|
|
if (!value) return true;
|
|
|
@@ -427,11 +426,9 @@ onActivated(() => {
|
|
|
<style scoped lang="scss">
|
|
|
.knowledge-retrieval-container {
|
|
|
.left-container {
|
|
|
- border-right: 1px solid var(--el-border-color);
|
|
|
height: 100%;
|
|
|
}
|
|
|
.center-container {
|
|
|
- border-right: 1px solid var(--el-border-color);
|
|
|
height: 100%;
|
|
|
.input-box {
|
|
|
display: flex;
|
zhangchong