提交 95e6affa authored 作者: wangjiahao's avatar wangjiahao

feat:仪表板支持搜索,同时支持全部和目录两种分类搜索

上级 027d232b
......@@ -130,6 +130,8 @@ export default {
re_login: 'Login again'
},
commons: {
search: 'Search',
folder: 'Folder',
no_target_permission: 'No permission',
success: 'Success',
switch_lang: 'Switch Language Success',
......
......@@ -130,6 +130,8 @@ export default {
re_login: '重新登陸'
},
commons: {
search: '搜索',
folder: '目录',
no_target_permission: '沒有權限',
success: '成功',
switch_lang: '切換語言成功',
......
......@@ -130,6 +130,8 @@ export default {
re_login: '重新登录'
},
commons: {
search: '搜索',
folder: '目录',
no_target_permission: '没有权限',
success: '成功',
switch_lang: '切换语言成功',
......
<template xmlns:el-col="http://www.w3.org/1999/html">
<el-col style="padding: 0 5px 0 5px;">
<el-col>
<el-row style="margin-bottom: 10px">
<el-col :span="16">
<el-input
v-model="filterText"
size="mini"
:placeholder="$t('commons.search')"
prefix-icon="el-icon-search"
clearable
/>
</el-col>
<el-col :span="8">
<el-dropdown>
<el-button size="mini" type="primary">
{{ searchMap[searchType] }}<i class="el-icon-arrow-down el-icon--right" />
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item @click.native="searchTypeClick('all')">全部</el-dropdown-item>
<el-dropdown-item @click.native="searchTypeClick('folder')">目录</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<!-- <el-select-->
<!-- v-model="searchType"-->
<!-- default-first-option-->
<!-- size="mini"-->
<!-- >-->
<!-- <el-option-->
<!-- v-for="item in searchTypeList"-->
<!-- :key="item.value"-->
<!-- :label="item.label"-->
<!-- :value="item.value"-->
<!-- />-->
<!-- </el-select>-->
</el-col>
</el-row>
<el-row>
<span class="header-title">{{ $t('panel.default_panel') }}</span>
<div class="block">
......@@ -11,6 +46,7 @@
node-key="id"
:highlight-current="activeTree==='system'"
:expand-on-click-node="true"
:filter-node-method="filterNode"
@node-click="nodeClick"
>
<span slot-scope="{ node, data }" class="custom-tree-node father">
......@@ -59,6 +95,7 @@
node-key="id"
:highlight-current="activeTree==='self'"
:expand-on-click-node="true"
:filter-node-method="filterNode"
@node-click="nodeClick"
>
<span slot-scope="{ node, data }" class="custom-tree-node-list father">
......@@ -294,7 +331,14 @@ export default {
moveDialogTitle: '',
moveInfo: {},
tGroup: {},
tGroupData: [] // 所有目录
tGroupData: [], // 所有目录
searchPids: [], // 查询命中的pid
filterText: '',
searchType: 'all',
searchMap: {
all: this.$t('commons.all'),
folder: this.$t('commons.folder')
}
}
},
computed: {
......@@ -311,6 +355,16 @@ export default {
if (newVal === 'PanelMain' && this.lastActiveNode && this.lastActiveNodeData) {
this.activeNodeAndClickOnly(this.lastActiveNodeData)
}
},
filterText(val) {
this.searchPids = []
this.$refs.default_panel_tree.filter(val)
this.$refs.panel_list_tree.filter(val)
},
searchType(val) {
this.searchPids = []
this.$refs.default_panel_tree.filter(this.filterText)
this.$refs.panel_list_tree.filter(this.filterText)
}
},
mounted() {
......@@ -710,6 +764,24 @@ export default {
targetGroup(val) {
this.tGroup = val
this.groupMoveConfirmDisabled = false
},
filterNode(value, data) {
if (!value) return true
if (this.searchType === 'folder') {
if (data.nodeType === 'folder' && data.label.indexOf(value) !== -1) {
this.searchPids.push(data.id)
return true
}
if (this.searchPids.indexOf(data.pid) !== -1) {
return true
}
} else {
return data.label.indexOf(value) !== -1
}
return false
},
searchTypeClick(searchTypeInfo) {
this.searchType = searchTypeInfo
}
}
}
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论