Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: 修复IP选择器表格模糊搜索分割符问题 & 自定义输入光标失效问题 #1614

Merged
merged 1 commit into from
Oct 19, 2021
Merged

fix: 修复IP选择器表格模糊搜索分割符问题 & 自定义输入光标失效问题 #1614

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
fix: 修复IP选择器表格模糊搜索分割符问题 & 自定义输入光标失效问题
  • Loading branch information
@HubuHito
HubuHito committed Oct 19, 2021
commit 09676d483bad4de61e831d663a1c6395ed52386e
3 changes: 1 addition & 2 deletions bcs-app/frontend/src/components/ip-selector/ip-selector-bcs.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -176,15 +176,14 @@
}
return treeData
}
const splitCode = ['\n', ' ', ',']
// 静态表格数据处理
const handleGetStaticTableData = async (params) => {
const { selections = [], current, limit, tableKeyword, accurate } = params
const bizHostsParams: any = {
limit,
offset: (current - 1) * limit,
fuzzy: !accurate,
ip_list: tableKeyword.split(splitCode).filter(ip => !!ip)
ip_list: tableKeyword.split(' ').filter(ip => !!ip)
}
const [node] = selections
state.curTreeNode = node
Expand Down
186 changes: 93 additions & 93 deletions bcs-app/frontend/src/components/ip-selector/ip-selector.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,74 @@
border-color: #f0f1f5;
background: #b2b5bd; }

.selector-content[data-v-3092d424] {
padding: 24px 24px 0 24px;
overflow: hidden;
height: 100%;
background: #fff; }

.selector-content .layout[data-v-3092d424] {
height: 100%; }

.selector-tab[data-v-f1ee4408] {
display: flex;
flex-direction: column; }

.selector-tab-header[data-v-f1ee4408] {
display: flex;
align-items: center;
border: 1px solid #dcdee5;
border-radius: 2px;
background: #fafbfd; }

.selector-tab-content[data-v-f1ee4408] {
flex: 1;
height: 0;
border: 1px solid #dcdee5; }

.selector-tab-horizontal[data-v-f1ee4408] {
display: flex;
flex-shrink: 0;
margin-bottom: -1px; }

.tab-item[data-v-f1ee4408] {
height: 42px;
display: flex;
align-items: center;
font-size: 14px;
color: #63656e;
padding: 0 24px;
border-right: 1px solid #dcdee5;
border-bottom: 1px solid #dcdee5;
cursor: pointer;
outline: 0; }

.tab-item.disabled[data-v-f1ee4408] {
color: #c4c6cc;
cursor: not-allowed; }

.tab-item.visibility[data-v-f1ee4408] {
visibility: hidden; }

.tab-item.active[data-v-f1ee4408] {
color: #313238;
background: #fff;
border-bottom: 0; }

.selector-tab-all[data-v-f1ee4408] {
font-size: 20px;
width: 32px;
height: 42px;
line-height: 42px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
cursor: pointer; }

.selector-tab-all i[data-v-f1ee4408] {
outline: 0; }

.ip-selector-theme {
padding: 0 !important; }

Expand Down Expand Up @@ -245,74 +313,6 @@
.drag[data-v-5af55c52]:hover {
cursor: col-resize; }

.selector-tab[data-v-f1ee4408] {
display: flex;
flex-direction: column; }

.selector-tab-header[data-v-f1ee4408] {
display: flex;
align-items: center;
border: 1px solid #dcdee5;
border-radius: 2px;
background: #fafbfd; }

.selector-tab-content[data-v-f1ee4408] {
flex: 1;
height: 0;
border: 1px solid #dcdee5; }

.selector-tab-horizontal[data-v-f1ee4408] {
display: flex;
flex-shrink: 0;
margin-bottom: -1px; }

.tab-item[data-v-f1ee4408] {
height: 42px;
display: flex;
align-items: center;
font-size: 14px;
color: #63656e;
padding: 0 24px;
border-right: 1px solid #dcdee5;
border-bottom: 1px solid #dcdee5;
cursor: pointer;
outline: 0; }

.tab-item.disabled[data-v-f1ee4408] {
color: #c4c6cc;
cursor: not-allowed; }

.tab-item.visibility[data-v-f1ee4408] {
visibility: hidden; }

.tab-item.active[data-v-f1ee4408] {
color: #313238;
background: #fff;
border-bottom: 0; }

.selector-tab-all[data-v-f1ee4408] {
font-size: 20px;
width: 32px;
height: 42px;
line-height: 42px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
cursor: pointer; }

.selector-tab-all i[data-v-f1ee4408] {
outline: 0; }

.selector-content[data-v-3092d424] {
padding: 24px 24px 0 24px;
overflow: hidden;
height: 100%;
background: #fff; }

.selector-content .layout[data-v-3092d424] {
height: 100%; }

.menu[data-v-135bacaa] {
font-size: 12px;
padding: 6px 0;
Expand All @@ -336,38 +336,55 @@
.menu.primary .menu-item[data-v-135bacaa]:hover {
background: #e1ecff; }

[data-v-d400cd16] .bk-textarea-wrapper {
[data-v-9564f676] .bk-textarea-wrapper {
height: 100%; }

[data-v-d400cd16] .bk-textarea-wrapper .bk-form-textarea {
[data-v-9564f676] .bk-textarea-wrapper .bk-form-textarea {
height: 100%; }

.custom-input[data-v-d400cd16] {
.custom-input[data-v-9564f676] {
display: flex;
color: #63656e; }

.custom-input-left[data-v-d400cd16] {
.custom-input-left[data-v-9564f676] {
display: flex;
flex-direction: column;
padding-bottom: 26px; }

.custom-input-left .ip-text[data-v-d400cd16] {
.custom-input-left .ip-text[data-v-9564f676] {
flex: 1; }

.custom-input-left .ip-parse[data-v-d400cd16] {
.custom-input-left .ip-parse[data-v-9564f676] {
margin-top: 16px;
font-size: 12px; }

.custom-input-left .err-tips[data-v-d400cd16] {
.custom-input-left .err-tips[data-v-9564f676] {
width: 100%;
color: #ea3636;
text-align: left;
margin-top: 2px; }

.custom-input-right[data-v-d400cd16] {
.custom-input-right[data-v-9564f676] {
flex: 1;
overflow: auto; }

.topo-table[data-v-910787bc]::before {
height: 0; }

.topo-table[data-v-910787bc] th {
background-color: #f5f6fa; }

.topo-table[data-v-910787bc] .selection-cell .cell {
padding-right: 0;
padding-left: 10px; }

.topo-table .column-string[data-v-910787bc] {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
text-align: left;
display: block; }

.ip-list[data-v-2dbb6d0c] {
height: 100%; }

Expand All @@ -391,23 +408,6 @@
.ip-list-search .search-input[data-v-2dbb6d0c] {
flex: 1; }

.topo-table[data-v-910787bc]::before {
height: 0; }

.topo-table[data-v-910787bc] th {
background-color: #f5f6fa; }

.topo-table[data-v-910787bc] .selection-cell .cell {
padding-right: 0;
padding-left: 10px; }

.topo-table .column-string[data-v-910787bc] {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
text-align: left;
display: block; }

.dynamic-topo[data-v-661929ef] {
display: flex;
color: #63656e; }
Expand Down
4 changes: 2 additions & 2 deletions bcs-app/frontend/src/components/ip-selector/ip-selector.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2777,7 +2777,7 @@
style: {
width: isNaN(_vm.leftPanelWidth) ? _vm.leftPanelWidth : _vm.leftPanelWidth + "px"
}
}, [_c('bk-input', {
}, [_c('bcs-input', {
staticClass: "ip-text",
attrs: {
"placeholder": _vm.$t('多个IP以回车为分隔符'),
Expand Down Expand Up @@ -2862,7 +2862,7 @@
var __vue_inject_styles__$8 = undefined;
/* scoped */

var __vue_scope_id__$8 = "data-v-d400cd16";
var __vue_scope_id__$8 = "data-v-9564f676";
/* module identifier */

var __vue_module_identifier__$8 = undefined;
Expand Down