feat:跳转前判断是否有http

This commit is contained in:
fanxb 2019-12-30 22:56:09 +08:00
parent a9aa3614b4
commit ef9e6c06dd
2 changed files with 93 additions and 25 deletions

View File

@ -63,21 +63,35 @@ class Search extends React.Component {
this.setState({ resultList: [] });
return;
}
httpUtil.get("/bookmark/searchUserBookmark?content=" + encodeURIComponent(content)).then(res => this.setState({ resultList: res }));
httpUtil
.get(
"/bookmark/searchUserBookmark?content=" + encodeURIComponent(content)
)
.then(res => this.setState({ resultList: res }));
}
/**
* 处理跳转到搜索引擎或者对应的书签
*/
enter() {
const { currentIndex, currentOptionIndex, resultList, content } = this.state;
const {
currentIndex,
currentOptionIndex,
resultList,
content
} = this.state;
if (currentOptionIndex === 0 && resultList.length > 0) {
window.open(resultList[currentIndex].url);
let url = resultList[currentIndex].url;
window.open(url.startsWith("http") ? url : "http://" + url);
}
if (currentOptionIndex === 1) {
window.open("https://www.baidu.com/s?ie=UTF-8&wd=" + encodeURIComponent(content));
window.open(
"https://www.baidu.com/s?ie=UTF-8&wd=" + encodeURIComponent(content)
);
} else if (currentOptionIndex === 2) {
window.open("https://www.google.com/search?q=" + encodeURIComponent(content));
window.open(
"https://www.google.com/search?q=" + encodeURIComponent(content)
);
}
}
@ -123,7 +137,12 @@ class Search extends React.Component {
* 渲染结果列表
*/
renderResults() {
const { resultList, currentIndex, currentOptionIndex, isFocus } = this.state;
const {
resultList,
currentIndex,
currentOptionIndex,
isFocus
} = this.state;
if (currentOptionIndex !== 0 || !isFocus) {
return;
}
@ -132,25 +151,37 @@ class Search extends React.Component {
<div className={styles.resultList}>
{resultList.map((item, index) => (
<div
className={`${styles.item} ${index === currentIndex ? styles.checked : ""}`}
className={`${styles.item} ${
index === currentIndex ? styles.checked : ""
}`}
key={item.bookmarkId}
onClick={() => window.open(item.url)}
>
<span style={{ fontWeight: 600 }}>{item.name}&emsp;</span>
<span style={{ fontSize: "0.8em", fontWeight: 400 }}>{item.url}</span>
<span style={{ fontSize: "0.8em", fontWeight: 400 }}>
{item.url}
</span>
</div>
))}
</div>
);
} else {
return <Empty className={styles.resultList} image={Empty.PRESENTED_IMAGE_SIMPLE} />;
return (
<Empty
className={styles.resultList}
image={Empty.PRESENTED_IMAGE_SIMPLE}
/>
);
}
}
render() {
const { content, options, currentOptionIndex } = this.state;
const prefix = (
<Select value={options[currentOptionIndex]} onChange={this.valueIndexChange.bind(this)}>
<Select
value={options[currentOptionIndex]}
onChange={this.valueIndexChange.bind(this)}
>
{options.map((item, index) => (
<Select.Option key={index} value={index}>
{item}
@ -171,7 +202,9 @@ class Search extends React.Component {
onChange={this.contentChange.bind(this)}
onKeyDown={this.keyUp.bind(this)}
onFocus={() => this.setState({ isFocus: true })}
onBlur={() => setTimeout(() => this.setState({ isFocus: false }), 600)}
onBlur={() =>
setTimeout(() => this.setState({ isFocus: false }), 600)
}
/>
{this.renderResults()}
</div>

View File

@ -22,9 +22,11 @@ function mapDispatchToProps(dispatch) {
addNode: (item, e) => dispatch(action.addNode(item, e)),
editNode: (item, e) => dispatch(action.editNode(item, e)),
changeIsInit: value => dispatch(action.changeIsInit(value)),
changeCheckedKeys: (keys, nodes) => dispatch(action.changeCheckedKeys(keys, nodes)),
changeCheckedKeys: (keys, nodes) =>
dispatch(action.changeCheckedKeys(keys, nodes)),
changeExpandedKeys: keys => dispatch(action.changeExpandedKeys(keys)),
changeCurrentClickItem: item => dispatch(action.changeCurrentClickItem(item)),
changeCurrentClickItem: item =>
dispatch(action.changeCurrentClickItem(item)),
changeLoadedKeys: keys => dispatch(action.changeLoadedKeys(keys))
};
}
@ -78,7 +80,9 @@ class OverView extends React.Component {
const { expandedKeys, changeExpandedKeys } = this.props;
const item = e.node.props.dataRef;
if (item.type === 0) {
window.open(item.url);
window.open(
item.url.startsWith("http") ? item.url : "http://" + item.url
);
} else {
const id = item.bookmarkId.toString();
const index = expandedKeys.indexOf(id);
@ -88,7 +92,16 @@ class OverView extends React.Component {
}
render() {
const { isEdit, setIsEdit, treeData, addNode, isInit, expandedKeys, checkedKeys, loadedKeys } = this.props;
const {
isEdit,
setIsEdit,
treeData,
addNode,
isInit,
expandedKeys,
checkedKeys,
loadedKeys
} = this.props;
const { isLoading } = this.state;
const { changeExpandedKeys } = this.props;
return (
@ -98,23 +111,46 @@ class OverView extends React.Component {
<div className={styles.header}>
<div className={styles.left}>
<span className={styles.myTree}>我的书签树</span>
<Button size="small" type="primary" icon="plus" shape="circle" onClick={addNode.bind(this, null)} />
<Button
size="small"
type="primary"
icon="plus"
shape="circle"
onClick={addNode.bind(this, null)}
/>
{expandedKeys.length > 0 ? (
<Button type="primary" size="small" onClick={changeExpandedKeys.bind(this, [])}>
<Button
type="primary"
size="small"
onClick={changeExpandedKeys.bind(this, [])}
>
收起
</Button>
) : null}
<a className={styles.help} href="https://github.com/FleyX/bookmark/blob/master/README.md">使用帮助</a>
<a
className={styles.help}
href="https://github.com/FleyX/bookmark/blob/master/README.md"
>
使用帮助
</a>
</div>
<div className={styles.right}>
{isEdit ? (
<React.Fragment>
<Button size="small" type="danger" onClick={batchDelete.bind(this)}>
<Button
size="small"
type="danger"
onClick={batchDelete.bind(this)}
>
删除选中
</Button>
</React.Fragment>
) : null}
<Button size="small" type="primary" onClick={setIsEdit.bind(this, !isEdit)}>
<Button
size="small"
type="primary"
onClick={setIsEdit.bind(this, !isEdit)}
>
{isEdit ? "完成" : "编辑"}
</Button>
</div>
@ -136,7 +172,9 @@ class OverView extends React.Component {
>
{renderTreeNodes.call(this, treeData)}
</Tree>
{isInit && treeData.length === 0 ? <Empty description="还没有数据" /> : null}
{isInit && treeData.length === 0 ? (
<Empty description="还没有数据" />
) : null}
</Spin>
<AddModal />
</div>
@ -145,7 +183,4 @@ class OverView extends React.Component {
}
}
export default connect(
mapStateToProps,
mapDispatchToProps
)(OverView);
export default connect(mapStateToProps, mapDispatchToProps)(OverView);