/*
|
* @Company: hugeInfo
|
* @Author: lwh
|
* @Date: 2022-09-13 16:01:52
|
* @LastEditTime: 2023-03-07 21:30:09
|
* @LastEditors: lwh
|
* @Version: 1.0.0
|
* @Description: 居民迁出or整户迁出弹窗组件
|
*/
|
import React, { useState, useEffect } from 'react';
|
import { Button, Checkbox, Form, Space, TextareaItem, Toast } from 'dingtalk-design-mobile';
|
import { CloseBoldOutlined, DownArrow2Outlined } from 'dd-icons';
|
import obj from '../../utils/selectOption';
|
import MyModal from '../MyModal';
|
|
const OutPersonMsg = ({ data, visible, onClose, onSave }) => {
|
const [roomMsg, setRoomMsg] = useState(data);
|
const [outReason, setOutReason] = useState(obj.outReason.map((item) => ({ ...item, checked: item.value === '01' ? true : false })));
|
|
useEffect(() => {
|
setRoomMsg(data);
|
}, [data]);
|
|
return (
|
<MyModal bodyClass="taskHandle-returnModal" visible={visible} onClose={onClose}>
|
<div className="taskHandle-returnModal-title h7">迁出原因</div>
|
<div style={{ padding: "12px 16px" }}>
|
<div>
|
{outReason.map((item, index) => (
|
<div className="person-detail-modal-checkbox-l" key={index}>
|
<Checkbox
|
name={item.value}
|
checked={item.checked || false}
|
onChange={(e) => {
|
setOutReason(outReason.map((i) => ({ ...i, checked: i.value == item.value ? true : false })));
|
setRoomMsg({ ...roomMsg, outReason: item.value, outReasonDesc: item.label });
|
}}
|
className="person-detail-modal-checkbox"
|
/>
|
<span className="person-detail-modal-checkbox-text">{item.label}</span>
|
</div>
|
))}
|
</div>
|
<div>
|
{roomMsg.outReason == '99' && (
|
<Form.Item
|
position="brief"
|
className="person-detail-modal-input"
|
label={
|
<Space align="center">
|
<span style={{ fontSize: '16px' }}>迁出原因</span>
|
<span className="public-tag4">必填</span>
|
</Space>
|
}
|
>
|
<TextareaItem
|
onChange={(value) => setRoomMsg({ ...roomMsg, outContent: value })}
|
value={roomMsg.outContent}
|
className="render-form-view-input-brief"
|
placeholder="请输入"
|
rows={5}
|
/>
|
</Form.Item>
|
)}
|
</div>
|
</div>
|
<div className="myModal-action">
|
<div onClick={onClose} className="myModal-action-item1">
|
我再想想
|
</div>
|
<div onClick={() => onSave(roomMsg)} className="myModal-action-item2">
|
确定迁出
|
</div>
|
</div>
|
</MyModal>
|
);
|
};
|
|
export default OutPersonMsg;
|
