巴林闲侠
2 years ago
17 changed files with 661 additions and 79 deletions
After Width: | Height: | Size: 1.9 KiB |
After Width: | Height: | Size: 1.3 KiB |
After Width: | Height: | Size: 561 B |
@ -0,0 +1,80 @@ |
|||
import React, { useState, useEffect, useRef } from "react"; |
|||
import { connect } from "react-redux"; |
|||
import { Button, Form, Modal, } from "@douyinfe/semi-ui"; |
|||
|
|||
const ApplyModal = ({ close, modalName, visible }) => { |
|||
const form = useRef(); |
|||
|
|||
|
|||
const handleOk = () => { |
|||
form.current |
|||
.validate() |
|||
.then((values) => { |
|||
console.log(values); |
|||
// close() |
|||
}) |
|||
|
|||
} |
|||
|
|||
return <Modal |
|||
title={modalName ? "修改应用" : "创建应用"} |
|||
visible={visible} |
|||
width={610} |
|||
onCancel={() => close()} |
|||
onOk={handleOk} |
|||
> |
|||
<Form |
|||
allowEmpty |
|||
labelPosition="left" |
|||
labelAlign="left" |
|||
labelWidth="90px" |
|||
onValueChange={(values) => console.log(values)} |
|||
getFormApi={(formApi) => (form.current = formApi)} |
|||
> |
|||
<Form.Input |
|||
maxLength="36" |
|||
field="name" |
|||
label="应用名称:" |
|||
allowEmpty={false} |
|||
|
|||
initValue={'' || ""} |
|||
placeholder="建议命名方式: [应用名 + 应用场景] 如:智慧昌南-消防,不超过15个字符" |
|||
style={{ width: 466 }} |
|||
rules={[ |
|||
{ |
|||
required: true, |
|||
message: "建议命名方式: [应用名 + 应用场景] 如:智慧昌南-消防,不超过15个字符", |
|||
}, |
|||
]} |
|||
/> |
|||
<Form.Select |
|||
label="设备厂家:" |
|||
field="venderId" |
|||
initValue={'' || null} |
|||
placeholder="请选择应用类型" |
|||
allowEmpty={false} |
|||
style={{ width: 150 }} |
|||
rules={[{ required: true, message: "请选择应用类型" }]} |
|||
> |
|||
{[{ name: 'web', id: 'web' }, { name: 'app', id: 'app' }, { name: '小程序', id: '小程序' }, { name: '其他', id: '其他' }].map((item, index) => ( |
|||
<Form.Select.Option key={index} value={item.id}> |
|||
{item.name} |
|||
</Form.Select.Option> |
|||
))} |
|||
</Form.Select> |
|||
</Form> |
|||
</Modal> |
|||
} |
|||
|
|||
|
|||
function mapStateToProps (state) { |
|||
const { auth, global, members } = state; |
|||
return { |
|||
loading: members.isRequesting, |
|||
user: auth.user, |
|||
actions: global.actions, |
|||
global: global, |
|||
members: members.data, |
|||
}; |
|||
} |
|||
export default connect(mapStateToProps)(ApplyModal); |
Loading…
Reference in new issue