fix
This commit is contained in:
@@ -5,7 +5,7 @@ import { cloneDeep } from 'lodash'
|
|||||||
import getDictData from 'util/dic'
|
import getDictData from 'util/dic'
|
||||||
|
|
||||||
const initialValues = {
|
const initialValues = {
|
||||||
sort: 100
|
sort: 100,
|
||||||
}
|
}
|
||||||
export default class form extends Component {
|
export default class form extends Component {
|
||||||
state = {
|
state = {
|
||||||
@@ -13,8 +13,8 @@ export default class form extends Component {
|
|||||||
loading: true,
|
loading: true,
|
||||||
exist: false,
|
exist: false,
|
||||||
codes: {
|
codes: {
|
||||||
dicAreacodeType: []
|
areacodeType: [],
|
||||||
}
|
},
|
||||||
}
|
}
|
||||||
// 表单实例
|
// 表单实例
|
||||||
form = React.createRef()
|
form = React.createRef()
|
||||||
@@ -33,29 +33,28 @@ export default class form extends Component {
|
|||||||
* 填充数据
|
* 填充数据
|
||||||
* 可以在设置this.record之后对其作出数据结构调整
|
* 可以在设置this.record之后对其作出数据结构调整
|
||||||
* [异步,必要]
|
* [异步,必要]
|
||||||
* @param {*} params
|
* @param {*} params
|
||||||
*/
|
*/
|
||||||
async fillData(params) {
|
async fillData(params) {
|
||||||
|
|
||||||
this.record = cloneDeep(params.record)
|
this.record = cloneDeep(params.record)
|
||||||
//#region 从后端转换成前段所需格式
|
//#region 从后端转换成前段所需格式
|
||||||
|
|
||||||
const codes = await getDictData('dic_areacode_type')
|
const codes = await getDictData('areacode_type')
|
||||||
const exist = !!params.record;
|
const exist = !!params.record
|
||||||
this.setState({
|
this.setState({
|
||||||
codes,
|
codes,
|
||||||
exist
|
exist,
|
||||||
})
|
})
|
||||||
|
|
||||||
this.record = {
|
this.record = {
|
||||||
...this.record
|
...this.record,
|
||||||
}
|
}
|
||||||
//#endregion
|
//#endregion
|
||||||
|
|
||||||
this.form.current.setFieldsValue(this.record)
|
this.form.current.setFieldsValue(this.record)
|
||||||
|
|
||||||
this.setState({
|
this.setState({
|
||||||
loading: false
|
loading: false,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -63,7 +62,7 @@ export default class form extends Component {
|
|||||||
* 获取数据
|
* 获取数据
|
||||||
* 可以对postData进行数据结构调整
|
* 可以对postData进行数据结构调整
|
||||||
* [异步,必要]
|
* [异步,必要]
|
||||||
* @returns
|
* @returns
|
||||||
*/
|
*/
|
||||||
async getData() {
|
async getData() {
|
||||||
const form = this.form.current
|
const form = this.form.current
|
||||||
@@ -82,43 +81,55 @@ export default class form extends Component {
|
|||||||
|
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<Form
|
<Form initialValues={initialValues} ref={this.form} className="yo-form">
|
||||||
initialValues={initialValues}
|
|
||||||
ref={this.form}
|
|
||||||
className="yo-form"
|
|
||||||
>
|
|
||||||
<Spin spinning={this.state.loading} indicator={<AntIcon type="loading" />}>
|
<Spin spinning={this.state.loading} indicator={<AntIcon type="loading" />}>
|
||||||
<div className="yo-form-group">
|
<div className="yo-form-group">
|
||||||
{/* 表单控件 */}
|
{/* 表单控件 */}
|
||||||
<Form.Item label="区域类型" name="levelType" rules={[{ required: true, message: '请选择区域类型' }]}>
|
<Form.Item
|
||||||
<Select placeholder="请选择区域类型" suffixIcon={<AntIcon type="lock" v-if={this.state.exist} />}>
|
label="区域类型"
|
||||||
{
|
name="levelType"
|
||||||
this.state.codes.dicAreacodeType.map(item => {
|
rules={[{ required: true, message: '请选择区域类型' }]}
|
||||||
return <Select.Option
|
>
|
||||||
key={item.code}
|
<Select
|
||||||
value={+item.code}
|
placeholder="请选择区域类型"
|
||||||
>{item.value}</Select.Option>
|
suffixIcon={<AntIcon type="lock" v-if={this.state.exist} />}
|
||||||
})
|
>
|
||||||
}
|
{this.state.codes.areacodeType.map(item => {
|
||||||
|
return (
|
||||||
|
<Select.Option key={item.code} value={+item.code}>
|
||||||
|
{item.value}
|
||||||
|
</Select.Option>
|
||||||
|
)
|
||||||
|
})}
|
||||||
</Select>
|
</Select>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
<Form.Item label="区域名称" name="name" rules={[{ required: true, message: '请输入区域名称' }]}>
|
<Form.Item
|
||||||
|
label="区域名称"
|
||||||
|
name="name"
|
||||||
|
rules={[{ required: true, message: '请输入区域名称' }]}
|
||||||
|
>
|
||||||
<Input autoComplete="off" placeholder="请输入区域名称" />
|
<Input autoComplete="off" placeholder="请输入区域名称" />
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
<Form.Item label="区域编码" name="code" tooltip="用于系统内部使用,添加后不可更改">
|
<Form.Item
|
||||||
<Input disabled={this.state.exist} placeholder="请输入区域编码" suffix={this.state.exist && <AntIcon type="lock" />}>
|
label="区域编码"
|
||||||
</Input>
|
name="code"
|
||||||
|
tooltip="用于系统内部使用,添加后不可更改"
|
||||||
|
>
|
||||||
|
<Input
|
||||||
|
disabled={this.state.exist}
|
||||||
|
placeholder="请输入区域编码"
|
||||||
|
suffix={this.state.exist && <AntIcon type="lock" />}
|
||||||
|
></Input>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
<Form.Item label="行政编码" name="adCode" tooltip="国家规定的区划代码,可随实际情况更改而更改">
|
<Form.Item
|
||||||
<Input placeholder="请输入区域编码" >
|
label="行政编码"
|
||||||
</Input>
|
name="adCode"
|
||||||
|
tooltip="国家规定的区划代码,可随实际情况更改而更改"
|
||||||
|
>
|
||||||
|
<Input placeholder="请输入区域编码"></Input>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
<Form.Item label="排序" name="sort">
|
<Form.Item label="排序" name="sort">
|
||||||
<InputNumber
|
<InputNumber min={0} placeholder="请输入排序" className="w-100-p" />
|
||||||
min={0}
|
|
||||||
placeholder="请输入排序"
|
|
||||||
className="w-100-p"
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
<Form.Item label="备注" name="note">
|
<Form.Item label="备注" name="note">
|
||||||
<Input.TextArea placeholder="请输入备注" />
|
<Input.TextArea placeholder="请输入备注" />
|
||||||
@@ -129,4 +140,4 @@ export default class form extends Component {
|
|||||||
</Form>
|
</Form>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -64,6 +64,7 @@ export default class index extends Component {
|
|||||||
{
|
{
|
||||||
title: '机构类型',
|
title: '机构类型',
|
||||||
dataIndex: 'type',
|
dataIndex: 'type',
|
||||||
|
width: 120,
|
||||||
sorter: true,
|
sorter: true,
|
||||||
render: text => <>{this.bindCodeValue(text, 'org_type')}</>,
|
render: text => <>{this.bindCodeValue(text, 'org_type')}</>,
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -13,6 +13,8 @@ export default class index extends Component {
|
|||||||
|
|
||||||
focusUser: false,
|
focusUser: false,
|
||||||
focusPassword: false,
|
focusPassword: false,
|
||||||
|
|
||||||
|
btnDisabled: true,
|
||||||
}
|
}
|
||||||
|
|
||||||
backgroundImage = require(`assets/image/login-bg-0${Math.floor(Math.random() * 4)}.jpg`)
|
backgroundImage = require(`assets/image/login-bg-0${Math.floor(Math.random() * 4)}.jpg`)
|
||||||
@@ -49,15 +51,26 @@ export default class index extends Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
|
const { loading, focusUser, focusPassword, btnDisabled } = this.state
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="yo-login">
|
<div className="yo-login">
|
||||||
<img src={this.backgroundImage.default} alt="" />
|
<img src={this.backgroundImage.default} alt="" />
|
||||||
<div className="yo-login--placeholder">
|
<div className="yo-login--placeholder">
|
||||||
<Container mode="sm">
|
<Container mode="sm">
|
||||||
<Form ref={this.form} layout="vertical" onFinish={this.onLogin}>
|
<Form
|
||||||
|
ref={this.form}
|
||||||
|
layout="vertical"
|
||||||
|
onFinish={this.onLogin}
|
||||||
|
onValuesChange={(changedValues, values) => {
|
||||||
|
this.setState({
|
||||||
|
btnDisabled: !values.account || !values.password,
|
||||||
|
})
|
||||||
|
}}
|
||||||
|
>
|
||||||
<Form.Item
|
<Form.Item
|
||||||
name="account"
|
name="account"
|
||||||
className={!this.state.focusUser && 'yo-login--label'}
|
className={!focusUser && 'yo-login--label'}
|
||||||
colon={false}
|
colon={false}
|
||||||
label="用户名"
|
label="用户名"
|
||||||
>
|
>
|
||||||
@@ -76,7 +89,7 @@ export default class index extends Component {
|
|||||||
</Form.Item>
|
</Form.Item>
|
||||||
<Form.Item
|
<Form.Item
|
||||||
name="password"
|
name="password"
|
||||||
className={!this.state.focusPassword && 'yo-login--label'}
|
className={!focusPassword && 'yo-login--label'}
|
||||||
colon={false}
|
colon={false}
|
||||||
label="密码"
|
label="密码"
|
||||||
>
|
>
|
||||||
@@ -96,8 +109,8 @@ export default class index extends Component {
|
|||||||
</Form.Item>
|
</Form.Item>
|
||||||
<Form.Item className="mt-lg">
|
<Form.Item className="mt-lg">
|
||||||
<Button
|
<Button
|
||||||
disabled={this.form.user === '' || this.form.password === ''}
|
disabled={btnDisabled}
|
||||||
loading={this.state.loading}
|
loading={loading}
|
||||||
block
|
block
|
||||||
htmlType="submit"
|
htmlType="submit"
|
||||||
size="large"
|
size="large"
|
||||||
|
|||||||
Reference in New Issue
Block a user