|
|
@@ -3,6 +3,9 @@ import PropTypes from 'prop-types';
|
|
|
|
|
|
import { Modal, ModalHeader, ModalBody } from 'reactstrap';
|
|
|
|
|
|
+import PagePathAutoComplete from '../PagePathAutoComplete';
|
|
|
+
|
|
|
+
|
|
|
export default class LinkEditModal extends React.PureComponent {
|
|
|
|
|
|
constructor(props) {
|
|
|
@@ -72,11 +75,20 @@ export default class LinkEditModal extends React.PureComponent {
|
|
|
this.hide();
|
|
|
}
|
|
|
|
|
|
+ inputChangeHandler(inputChangeValue) {
|
|
|
+ this.setState({ linkInputValue: inputChangeValue });
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ submitHandler(submitValue) {
|
|
|
+ this.setState({ linkInputValue: submitValue });
|
|
|
+ }
|
|
|
+
|
|
|
render() {
|
|
|
return (
|
|
|
<Modal isOpen={this.state.show} toggle={this.cancel} size="lg">
|
|
|
<ModalHeader tag="h4" toggle={this.cancel} className="bg-primary text-light">
|
|
|
- Edit Links
|
|
|
+ Edit Links
|
|
|
</ModalHeader>
|
|
|
|
|
|
<ModalBody className="container">
|
|
|
@@ -94,9 +106,16 @@ export default class LinkEditModal extends React.PureComponent {
|
|
|
value={this.state.linkInputValue}
|
|
|
onChange={e => this.handleInputChange(e.target.value)}
|
|
|
/>
|
|
|
+
|
|
|
+ <PagePathAutoComplete
|
|
|
+ value={this.state.linkInputValue}
|
|
|
+ onInputChange={e => this.inputChangeHandler(e.target.value)}
|
|
|
+ onSubmit={e => this.submitHandler(e.target.value)}
|
|
|
+ />
|
|
|
+
|
|
|
<div className="input-group-append">
|
|
|
<button type="button" id="button-addon" className="btn btn-secondary" onClick={this.showLog}>
|
|
|
- Preview
|
|
|
+ Preview
|
|
|
</button>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -111,17 +130,17 @@ export default class LinkEditModal extends React.PureComponent {
|
|
|
<ul className="nav nav-tabs" role="tabist">
|
|
|
<li className="nav-item">
|
|
|
<a className="nav-link active" href="#Pukiwiki" role="tab" data-toggle="tab">
|
|
|
- Pukiwiki
|
|
|
+ Pukiwiki
|
|
|
</a>
|
|
|
</li>
|
|
|
<li className="nav-item">
|
|
|
<a className="nav-link" href="#Crowi" role="tab" data-toggle="tab">
|
|
|
- Crowi
|
|
|
+ Crowi
|
|
|
</a>
|
|
|
</li>
|
|
|
<li className="nav-item">
|
|
|
<a className="nav-link" href="#MD" role="tab" data-toggle="tab">
|
|
|
- MD
|
|
|
+ MD
|
|
|
</a>
|
|
|
</li>
|
|
|
</ul>
|
|
|
@@ -144,11 +163,11 @@ export default class LinkEditModal extends React.PureComponent {
|
|
|
<div className="custom-control custom-checkbox custom-checkbox-info">
|
|
|
<input className="custom-control-input" id="pukiwikiRelativePath" type="checkbox" checked={this.state.isUseRelativePath} />
|
|
|
<label className="custom-control-label" htmlFor="pukiwikiRelativePath" onClick={this.toggleIsUseRelativePath}>
|
|
|
- Use relative path
|
|
|
+ Use relative path
|
|
|
</label>
|
|
|
</div>
|
|
|
<button type="button" className="btn btn-primary ml-auto" onClick={this.save}>
|
|
|
- Done
|
|
|
+ Done
|
|
|
</button>
|
|
|
</div>
|
|
|
</form>
|
|
|
@@ -165,7 +184,7 @@ export default class LinkEditModal extends React.PureComponent {
|
|
|
</div>
|
|
|
<div className="d-flex">
|
|
|
<button type="button" className="btn btn-primary ml-auto" onClick={this.save}>
|
|
|
- Done
|
|
|
+ Done
|
|
|
</button>
|
|
|
</div>
|
|
|
</form>
|
|
|
@@ -184,11 +203,11 @@ export default class LinkEditModal extends React.PureComponent {
|
|
|
<div className="custom-control custom-checkbox custom-checkbox-info">
|
|
|
<input className="custom-control-input" id="mdRelativePath" type="checkbox" checked={this.state.isUseRelativePath} />
|
|
|
<label className="custom-control-label" htmlFor="mdRelativePath" onClick={this.toggleIsUseRelativePath}>
|
|
|
- Use relative path
|
|
|
+ Use relative path
|
|
|
</label>
|
|
|
</div>
|
|
|
<button type="button" className="btn btn-primary ml-auto" onClick={this.save}>
|
|
|
- Done
|
|
|
+ Done
|
|
|
</button>
|
|
|
</div>
|
|
|
</form>
|