Skip to content

Commit fa67bd8

Browse files
author
春秋一语
authored
Merge pull request #489 from chunqiuyiyu/dashboard-dev-search
Add search filter icons
2 parents f2c461b + 65ffd8a commit fa67bd8

File tree

5 files changed

+62
-23
lines changed

5 files changed

+62
-23
lines changed

‎app/commons/Search/action.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -33,9 +33,9 @@ function searchPattern() {
3333
}
3434

3535
function commonSearch() {
36-
if(!state.searched.end && !state.ws.first) {
37-
api.searchInterrupt(state.searched.taskId);
38-
}
36+
// if(!state.searched.end && !state.ws.first) {
37+
// // api.searchInterrupt(state.searched.taskId);
38+
// }
3939
if(state.searched.taskId != null) {
4040
state.searched.former.taskId = state.searched.taskId
4141
state.searched.former.results = state.searched.results.splice(0, state.searched.results.length);

‎app/components/Search/icons.jsx‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import { Component } from "react"
2+
3+
const Aa = (props) => (
4+
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 22 22">
5+
<g fill="none" fillRule="evenodd">
6+
<rect width="22" height="22" rx="2"/>
7+
<text fill={props.fill} fontFamily="PingFangSC-Regular, PingFang SC" fontSize="12">
8+
<tspan x="4" y="15">Aa</tspan>
9+
</text>
10+
<path fill={props.fill} d="M7.372,6.432 L8.512,6.432 L11.884,15 L10.816,15 L9.904,12.6 L5.968,12.6 L5.056,15 L4,15 L7.372,6.432 Z M6.28,11.772 L9.592,11.772 L7.972,7.488 L7.924,7.488 L6.28,11.772 Z M15.328,8.628 C16.216,8.628 16.864,8.856 17.296,9.324 C17.656,9.732 17.848,10.296 17.848,11.016 L17.848,15 L16.948,15 L16.948,13.956 C16.708,14.292 16.384,14.568 16,14.784 C15.544,15.036 15.028,15.168 14.452,15.168 C13.828,15.168 13.336,15.012 12.964,14.7 C12.58,14.376 12.388,13.956 12.388,13.452 C12.388,12.744 12.664,12.216 13.24,11.856 C13.744,11.52 14.464,11.34 15.4,11.328 L16.888,11.304 L16.888,10.98 C16.888,9.936 16.348,9.42 15.268,9.42 C14.812,9.42 14.44,9.504 14.152,9.696 C13.828,9.888 13.624,10.188 13.528,10.584 L12.58,10.512 C12.712,9.864 13.036,9.372 13.54,9.06 C13.996,8.772 14.584,8.628 15.328,8.628 Z M16.888,12.024 L15.46,12.048 C14.068,12.072 13.372,12.528 13.372,13.428 C13.372,13.716 13.48,13.944 13.72,14.136 C13.96,14.316 14.272,14.412 14.656,14.412 C15.244,14.412 15.76,14.22 16.216,13.836 C16.66,13.464 16.888,13.032 16.888,12.552 L16.888,12.024 Z"/>
11+
</g>
12+
</svg>)
13+
14+
15+
const Word = (props) => (
16+
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 22 22">
17+
<g fill="none" fillRule="evenodd">
18+
<rect width="22" height="22" rx="2"/>
19+
<path fill={props.fill} d="M5.81,7.86 L6.76,7.86 L9.57,15 L8.68,15 L7.92,13 L4.64,13 L3.88,15 L3,15 L5.81,7.86 Z M4.9,12.31 L7.66,12.31 L6.31,8.74 L6.27,8.74 L4.9,12.31 Z M10.29,7.86 L13.48,7.86 C14.14,7.86 14.67,8.02 15.06,8.34 C15.44,8.66 15.63,9.1 15.63,9.66 C15.63,10.06 15.52,10.41 15.31,10.7 C15.09,10.96 14.8,11.15 14.44,11.27 C14.91,11.35 15.27,11.55 15.53,11.85 C15.79,12.15 15.93,12.53 15.93,13.01 C15.93,13.71 15.68,14.23 15.19,14.57 C14.77,14.85 14.19,15 13.46,15 L10.29,15 L10.29,7.86 Z M11.11,8.55 L11.11,10.98 L13.28,10.98 C13.78,10.98 14.16,10.87 14.42,10.67 C14.68,10.46 14.82,10.15 14.82,9.74 C14.82,9.34 14.69,9.04 14.43,8.84 C14.17,8.64 13.79,8.55 13.29,8.55 L11.11,8.55 Z M11.11,11.66 L11.11,14.31 L13.39,14.31 C13.89,14.31 14.28,14.21 14.58,14.03 C14.93,13.81 15.11,13.46 15.11,13 C15.11,12.54 14.95,12.2 14.65,11.98 C14.36,11.76 13.94,11.66 13.39,11.66 L11.11,11.66 Z M17.12,7.86 L17.93,7.86 L17.93,15 L17.12,15 L17.12,7.86 Z"/>
20+
<path stroke={props.fill} strokeLinecap="square" d="M4 5.68L17.5 5.68M4 17.68L17.5 17.68"/>
21+
</g>
22+
</svg>)
23+
24+
const Reg = (props) => (
25+
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 22 22">
26+
<g fill="none" fillRule="evenodd">
27+
<rect width="22" height="22" rx="2"/>
28+
<path fill={props.fill} fillRule="nonzero" d="M4.7166756,10.9866071 C5.08489193,11.1651795 5.34861046,11.3660703 5.50783912,11.5892857 C5.66706783,11.8125011 5.74668097,12.1339265 5.74668097,12.5535714 L5.74668097,15.3526786 C5.74668097,15.6116084 5.80639082,15.7924102 5.92581234,15.8950893 C6.04523383,15.9977684 6.25421835,16.0491071 6.55277212,16.0491071 L6.9558177,16.0491071 C7.09514279,16.0491071 7.20958668,16.082589 7.29915282,16.1495536 C7.38871894,16.2165182 7.43350132,16.3437491 7.43350132,16.53125 C7.43350132,16.6741079 7.38623104,16.787946 7.29168901,16.8727679 C7.19714697,16.9575897 7.08519101,17 6.9558177,17 L6.06016087,17 C5.57252302,17 5.21177597,16.9084831 4.97790884,16.7254464 C4.74404172,16.5424098 4.62710992,16.2187523 4.62710992,15.7544643 L4.62710992,12.9151786 C4.62710992,12.0491028 4.27382658,11.5803575 3.56724933,11.5089286 C3.40802065,11.4910713 3.27367347,11.4419647 3.16420375,11.3616071 C3.05473404,11.2812496 3,11.1651793 3,11.0133929 C3,10.8616064 3.05970985,10.743304 3.17913137,10.6584821 C3.29855287,10.5736603 3.4428517,10.5223215 3.61203217,10.5044643 C3.99020027,10.4598212 4.25391882,10.3058049 4.4031957,10.0424107 C4.55247259,9.77901653 4.62710992,9.37946695 4.62710992,8.84375 L4.62710992,6.33928571 C4.62710992,5.91071214 4.76643292,5.5803583 5.0450831,5.34821428 C5.3237333,5.11607026 5.6720408,5 6.09001608,5 L6.9558177,5 C7.08519101,5 7.2021228,5.03348181 7.30661662,5.10044642 C7.41111043,5.16741104 7.46335657,5.29464192 7.46335657,5.48214285 C7.48326016,5.65178656 7.44345358,5.77232106 7.34393565,5.84374999 C7.24441773,5.91517893 7.11504637,5.95089285 6.9558177,5.95089285 L6.52291688,5.95089285 C6.23431491,5.95089285 6.03279415,6.00446374 5.91834853,6.11160713 C5.8039029,6.21875053 5.74668097,6.42856985 5.74668097,6.74107141 L5.74668097,9.44642857 C5.74668097,10.1160748 5.40334927,10.6294625 4.7166756,10.9866071 Z M17.2833244,10.9866071 C16.5966507,10.6294625 16.253319,10.1160748 16.253319,9.44642857 L16.253319,6.74107141 C16.253319,6.42856985 16.1960971,6.21875053 16.0816515,6.11160713 C15.9672059,6.00446374 15.7656851,5.95089285 15.4770831,5.95089285 L15.0441823,5.95089285 C14.8849536,5.95089285 14.7555823,5.91517893 14.6560643,5.84374999 C14.5565464,5.77232106 14.5167398,5.65178656 14.5366434,5.48214285 C14.5366434,5.29464192 14.5888896,5.16741104 14.6933834,5.10044642 C14.7978772,5.03348181 14.914809,5 15.0441823,5 L15.9099839,5 C16.3279592,5 16.6762667,5.11607026 16.9549169,5.34821428 C17.2335671,5.5803583 17.3728901,5.91071214 17.3728901,6.33928571 L17.3728901,8.84375 C17.3728901,9.37946695 17.4475274,9.77901653 17.5968043,10.0424107 C17.7460812,10.3058049 18.0097997,10.4598212 18.3879678,10.5044643 C18.5571483,10.5223215 18.7014471,10.5736603 18.8208686,10.6584821 C18.9402901,10.743304 19,10.8616064 19,11.0133929 C19,11.1651793 18.945266,11.2812496 18.8357963,11.3616071 C18.7263265,11.4419647 18.5919794,11.4910713 18.4327507,11.5089286 C17.7261734,11.5803575 17.3728901,12.0491028 17.3728901,12.9151786 L17.3728901,15.7544643 C17.3728901,16.2187523 17.2559583,16.5424098 17.0220912,16.7254464 C16.788224,16.9084831 16.427477,17 15.9398391,17 L15.0441823,17 C14.914809,17 14.802853,16.9575897 14.708311,16.8727679 C14.613769,16.787946 14.5664987,16.6741079 14.5664987,16.53125 C14.5664987,16.3437491 14.6112811,16.2165182 14.7008472,16.1495536 C14.7904133,16.082589 14.9048572,16.0491071 15.0441823,16.0491071 L15.4472279,16.0491071 C15.7457817,16.0491071 15.9547662,15.9977684 16.0741877,15.8950893 C16.1936092,15.7924102 16.253319,15.6116084 16.253319,15.3526786 L16.253319,12.5535714 C16.253319,12.1339265 16.3329322,11.8125011 16.4921609,11.5892857 C16.6513895,11.3660703 16.9151081,11.1651795 17.2833244,10.9866071 Z"/>
29+
<path fill={props.fill} d="M7.49395136,16.3772144 L7.48942586,16.3754715 L11.1664655,5.68604408 L11.1670728,5.68627796 C11.269641,5.38810472 11.5754578,5.23214698 11.8623359,5.34263612 C12.1492139,5.45312524 12.3012263,5.78541282 12.1986581,6.08358606 L12.2053428,6.08616062 L8.52830313,16.775588 L8.52377765,16.773845 C8.39915895,17.0252054 8.11130121,17.1453342 7.84777197,17.0438377 C7.58424273,16.9423412 7.43671304,16.6545259 7.49395136,16.3772144 Z" transform="rotate(-6 9.856 11.193)"/>
30+
<path fill={props.fill} d="M13.5000371,8.44794615 L12.9000048,8.88763167 C12.6018035,9.10614456 12.4450739,8.99575799 12.5495912,8.64225418 L12.7703439,7.89561344 L12.1835499,7.43694471 C11.8919277,7.2089976 11.9544706,7.01942828 12.3237202,7.01352216 L13.0490619,7.00192037 L13.2917105,6.2626917 C13.4067661,5.9121751 13.5934794,5.9126972 13.7083636,6.2626917 L13.9510123,7.00192037 L14.676354,7.01352216 C15.0453901,7.01942488 15.1081278,7.20901224 14.8165243,7.43694471 L14.2297303,7.89561344 L14.4504829,8.64225418 C14.5551562,8.99628534 14.3982515,9.10613056 14.1000694,8.88763167 L13.5000371,8.44794615 Z"/>
31+
</g>
32+
</svg>
33+
34+
)
35+
export { Aa, Word, Reg }
36+
37+

‎app/components/Search/search.jsx‎

Lines changed: 18 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,9 @@ import cx from 'classnames'
66
import { openFile } from 'commands/commandBindings/file'
77
import * as delegate from 'commons/Search/action'
88
import icons from 'file-icons-js'
9+
import { Aa, Word, Reg } from './icons'
10+
11+
const hoverColor = '#337ab7'
912

1013
export class SearchResultItem extends Component {
1114
constructor(props) {
@@ -123,6 +126,8 @@ class SearchPanel extends Component {
123126
path={searchChunk.path}
124127
result={searchChunk.results}/>);
125128
})
129+
130+
number = number > 100 ? '100+' : number
126131
return (
127132
<div className='search-result-list'>
128133
<div>{i18n`panel.result.tip${{ files, number }}`}</div>
@@ -142,6 +147,10 @@ class SearchPanel extends Component {
142147

143148
render () {
144149
const { caseSensitive, word, isPattern } = state.searching
150+
const currentTheme = themes['@current']
151+
const { locals } = currentTheme.default ? currentTheme.default
152+
: currentTheme
153+
const textColor = themeVariables.get('textColor') || locals.textColor
145154

146155
return (
147156
<div className='search-panel'>
@@ -161,13 +170,19 @@ class SearchPanel extends Component {
161170
<div className='search-checkbox'>
162171
<span title={i18n.get('panel.checkbox.case')}
163172
onClick={() => this.caseSensitive(caseSensitive)}
164-
className={caseSensitive ? 'active' : ''}>{'Aa'}</span>
173+
>
174+
<Aa fill={ caseSensitive ? hoverColor : textColor} />
175+
</span>
165176
<span title={i18n.get('panel.checkbox.word')}
166177
onClick={() => this.word(word)}
167-
className={word ? 'active' : ''}>{'Al'}</span>
178+
>
179+
<Word fill={ word ? hoverColor : textColor} />
180+
</span>
168181
<span title={i18n.get('panel.checkbox.pattern')}
169182
onClick={() => this.pattern(isPattern)}
170-
className={isPattern ? 'active' : ''}>{'.*'}</span>
183+
>
184+
<Reg fill={ isPattern ? hoverColor : textColor} />
185+
</span>
171186
</div>
172187
</div>
173188
{this.renderResult()}

‎app/config.js‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -74,8 +74,5 @@ autorun(() => {
7474
}
7575
})
7676

77-
config.baseURL = 'http://dev.coding.ide/backend'
78-
config.wsURL = 'http://dev.coding.ide/ide-ws'
79-
8077
window.config = config
8178
export default config

‎app/styles/core-ui/Search.styl‎

Lines changed: 4 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -8,35 +8,25 @@
88
}
99
.search-panel-input {
1010
margin-bottom: 10px;
11+
position: relative;
1112
// display: flex
1213
.search-controls {
1314
border: none
1415
}
1516
.search-checkbox {
1617
margin-right: inherit;
1718
position: inherit;
18-
top: 43px;
19+
top: 6px;
1920
display: inline-block;
2021
position: absolute;
21-
right: 15px;
22+
right: 8px;
2223

23-
.active {
24-
color: #337ab7;
25-
font-weight: bold;
26-
}
27-
2824
span {
2925
width: 22px;
3026
height: 22px;
31-
padding: 3px;
3227
display: inline-block;
3328
cursor: default;
34-
35-
36-
&:hover {
37-
color: #337ab7;
38-
font-weight: bold;
39-
}
29+
user-select: none;
4030
}
4131
}
4232
}

0 commit comments

Comments
 (0)