You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
83 lines
2.4 KiB
React
83 lines
2.4 KiB
React
4 years ago
|
import React from 'react';
|
||
4 years ago
|
import { sortBy } from 'lodash';
|
||
|
import request from 'vj/utils/request';
|
||
4 years ago
|
|
||
3 years ago
|
export default class ObjectiveContainer extends React.PureComponent {
|
||
4 years ago
|
constructor(args) {
|
||
|
super(args);
|
||
|
this.state = {};
|
||
|
this.onChange = this.onChange.bind(this);
|
||
|
this.onSubmit = this.onSubmit.bind(this);
|
||
|
}
|
||
|
|
||
|
onChange(ev) {
|
||
|
this.setState({ [ev.target.name]: ev.target.value });
|
||
|
}
|
||
|
|
||
|
onSubmit(ev) {
|
||
|
ev.preventDefault();
|
||
|
const entries = sortBy(Object.entries(this.state).map((i) => [+i[0], i[1]]));
|
||
|
const total = entries[entries.length - 1][0];
|
||
|
const ans = new Array(total).fill('');
|
||
|
entries.forEach((i) => ans[i[0]] = i[1]); // eslint-disable-line
|
||
|
request
|
||
|
.post(this.props.target, {
|
||
|
lang: '_',
|
||
|
code: ans.join('\n'),
|
||
|
})
|
||
|
.then((res) => {
|
||
|
window.location.href = res.url;
|
||
|
})
|
||
|
.catch((e) => {
|
||
|
Notification.error(e.message);
|
||
|
});
|
||
|
}
|
||
|
|
||
4 years ago
|
Textbox(args, name) {
|
||
|
return (
|
||
|
<label htmlFor={`textbox${name}`}>
|
||
3 years ago
|
{name}. {args.desc.split('\n').map((i, index) => {
|
||
|
if (index) return <><br />{i}</>;
|
||
|
return i;
|
||
|
})}
|
||
4 years ago
|
<div name={`form_item_${name}`} className="textbox-container">
|
||
4 years ago
|
<input type="text" name={name} id={`textbox${name}`} className="textbox" onChange={this.onChange}></input>
|
||
4 years ago
|
</div>
|
||
|
</label>
|
||
|
);
|
||
|
}
|
||
|
|
||
|
Radio(args, name) {
|
||
|
return (
|
||
|
<>
|
||
3 years ago
|
{name}. {args.desc.split('\n').map((i, index) => {
|
||
|
if (index) return <><br />{i}</>;
|
||
|
return i;
|
||
|
})}
|
||
4 years ago
|
{args.choices.map((i) => (
|
||
4 years ago
|
<label className="radiobox" htmlFor={`radio${name}${i}`} key={i}>
|
||
|
<input type="radio" name={name} id={`radio${name}${i}`} value={i} onChange={this.onChange} /> {i} <br />
|
||
4 years ago
|
</label>
|
||
|
))}
|
||
|
</>
|
||
|
);
|
||
|
}
|
||
|
|
||
|
render() {
|
||
|
return (
|
||
4 years ago
|
<form onSubmit={this.onSubmit}>
|
||
4 years ago
|
{this.props.panel.map((i, name) => (
|
||
|
<div className="row">
|
||
|
<div className="medium-7 columns form__item end">
|
||
4 years ago
|
{i.choices ? this.Radio(i, name) : this.Textbox(i, name)}
|
||
4 years ago
|
</div>
|
||
|
</div>
|
||
|
))}
|
||
3 years ago
|
{document.getElementsByClassName('nav__item--round').length
|
||
|
? <input type="submit" disabled className="button rounded primary" value="登录后提交" />
|
||
|
: <input type="submit" className="button rounded primary" value="提交" />}
|
||
4 years ago
|
</form>
|
||
|
);
|
||
|
}
|
||
|
}
|