Skip to content

T
TOSTUMI
Commit 9a619db7 authored by cellee's avatar cellee
Browse files
Options

添加小区重构 

Signed-off-by: cellee's avatarcellee <893264950@qq.com>
parent 58c0428b
Show whitespace changes
Inline Side-by-side
Showing with 298 additions and 94 deletions
src/pages/CommunityManagement/CellList/Adds.tsx
View file @ 9a619db7
import React from 'react';
import { LeftOutlined, EditOutlined } from '@ant-design/icons';
import { Form, Input, Button, Select, TimePicker } from 'antd';
import { LeftOutlined, EditOutlined, PlusCircleOutlined, UploadOutlined } from '@ant-design/icons';
import { Form, Input, Button, TimePicker, Checkbox, Upload, message } from 'antd';
// 样式
import './celllist.less';
const { RangePicker } = TimePicker;
const Adds = () => {
const plainOptions = [
{ label: '线上缴费', value: '0' },
{ label: '线下缴费', value: '1' },
];
const props = {
name: 'file',
action: 'https://www.mocky.io/v2/5cc8019d300000980a055e76',
headers: {
authorization: 'authorization-text',
},
onChange(info) {
if (info.file.status !== 'uploading') {
console.log(info.file, info.fileList);
}
if (info.file.status === 'done') {
message.success(`${info.file.name} file uploaded successfully`);
} else if (info.file.status === 'error') {
message.error(`${info.file.name} file upload failed.`);
}
},
};
function onChange(checkedValues) {
console.log('checked = ', checkedValues);
}
const onFinish = (values: any) => {
console.log('Success:', values);
// console.log('Success:', values);
message.error(`页面重构，后端接口处理中...`);
};
const goToReturn = () => {
// console.log(fileList)
history.back()
}
// 上传
return (
<div className="box">
{/* 头部 */}
<div className="back">
<Button onClick={() => {}}>
<LeftOutlined />
Back
</Button>
</div>
<div className="form">
<h3>
<EditOutlined />
&nbsp; 添加小区
<div className="back">
<Button onClick={goToReturn}>
<LeftOutlined />
Back
</Button>
</div>
</h3>
<Form
name="basic"
......@@ -42,40 +80,119 @@ const Adds = () => {
<li className="li">小区名字</li>
</div>
</Form.Item>
<Form.Item label="Working Hours" name="workingHours">
<Input />
<RangePicker />
</Form.Item>
<Form.Item label="Community Telephone" name="communityTelephone">
<Input />
<Input.Group compact>
<Form.Item
name={['communityTelephone', 'tel']}
noStyle
// rules={[{ required: true, message: 'Province is required' }]}
>
<Input style={{ marginRight: '10px', width: '160px' }} placeholder="Please enter Phone" />
</Form.Item>
<Button type="text">—</Button>
<Form.Item
name={['communityTelephone', 'email']}
noStyle
// rules={[{ required: true, message: 'Street is required' }]}
>
<Input style={{ marginLeft: '10px', width: '180px' }} placeholder="Please enter Email" />
</Form.Item>
</Input.Group>
</Form.Item>
<Form.Item label="Administrators" name="adminiStrators">
<Input />
<Input style={{ width: '160px' }} placeholder='Contacts' /> <Button type="text"><PlusCircleOutlined style={{ fontSize: '18px', color: '#08c' }} /></Button>
</Form.Item>
<Form.Item label="Property fee">
<RangePicker />
<Form.Item label="Property Fee" name="propertyFee" style={{ marginBottom: '0' }}>
<Checkbox.Group options={plainOptions} defaultValue={['1']} onChange={onChange} />
<div className='tip'>
<span>*</span>线上缴费会有服务费
</div>
</Form.Item>
<Form.Item label="Louba Timetable" name="loubaTimetable">
<Input />
<hr />
<Form.Item label="Louba Timetable" name="loubaTimetable" style={{ marginBottom: '0' }}>
<Upload {...props}>
<Button icon={<UploadOutlined />}>Click to Upload</Button>
</Upload>
<div className='tip'>
支持文件：.pdf,.jpg, .png
</div>
</Form.Item>
<Form.Item label="Property Guide" name="propertyGuide">
<Input />
<Form.Item label="Property Guide" name="propertyGuide" style={{ marginBottom: '0' }}>
<Upload {...props}>
<Button icon={<UploadOutlined />}>Click to Upload</Button>
</Upload>
<div className='tip'>
支持文件：.pdf,.jpg, .png
</div>
</Form.Item>
<Form.Item label="Period of Service" name="period">
<Input />
<Form.Item label="Period of Service" name="period" style={{ marginBottom: '0' }}>
<Upload {...props}>
<Button icon={<UploadOutlined />}>Click to Upload</Button>
</Upload>
<div className='tip'>
支持文件：.pdf,.jpg, .png
</div>
</Form.Item>
<hr />
<Form.Item label="Help Phone" name="helpPhone">
<Input />
<Input.Group compact>
<Form.Item
name={['helpPhone', 'tel']}
noStyle
>
<Input style={{ marginRight: '10px', width: '160px' }} placeholder="热线电话名称" />
</Form.Item>
<Form.Item
name={['helpPhone', 'email']}
noStyle
>
<Input style={{ marginRight: '10px', width: '180px' }} placeholder="热线电话" />
</Form.Item>
<Form.Item
name={['helpPhone', 'email2']}
noStyle
>
<Input style={{ marginRight: '10px', width: '180px' }} placeholder="服务起始时间" />
</Form.Item>
<Form.Item
name={['helpPhone', 'email3']}
noStyle
>
<Input style={{ marginRight: '10px', width: '180px' }} placeholder="服务结束时间" />
</Form.Item>
</Input.Group>
</Form.Item>
<Form.Item label=" " colon={false}>
<Button type="primary" htmlType="submit">
Submit
Conserve
</Button>
</Form.Item>
</Form>
</div>
</div>
);
};
......
src/pages/CommunityManagement/CellList/celllist.css
View file @ 9a619db7
......@@ -3,9 +3,71 @@
background: #fff;
margin-bottom: 20px;
}
.listbox {
width: 100%;
background-color: #ffffff;
padding: 10px;
}
.form {
padding: 20px;
border: 1px solid #efefef;
border-radius: 3px;
background: #fff;
box-shadow: 0 1px 1px #ccc;
}
.form h3 {
margin-bottom: 30px;
position: relative;
}
.form h3 .back {
position: absolute;
right: 0;
top: 0;
margin-bottom: 20px;
background: #fff;
}
.form .span,
.form .li {
display: inline-block;
min-width: 240px;
line-height: 30px;
background: #efefef;
font-size: 15px;
margin-top: -3px;
vertical-align: middle;
margin-left: 12px;
padding: 0 6px;
border-radius: 2px;
border: 1px solid #d9d9d9;
color: #999;
}
.form .li {
min-width: 140px;
margin-top: 15px;
margin-left: 0;
}
.form input,
.form .ant-upload-list {
width: 240px;
}
.form .ant-picker-range {
width: 240px;
}
.form .ant-picker-range input {
width: 100%;
}
.form .list {
display: inline-block;
}
.form .ant-checkbox-group {
line-height: 34px;
}
.form hr {
border: 0;
height: 1px;
background: #eee;
margin-bottom: 20px;
}
.form .tip {
padding: 15px 0;
}
src/pages/CommunityManagement/CellList/celllist.less
View file @ 9a619db7
......@@ -10,19 +10,22 @@
}
// 添加
.box{
.form{
padding: 20px;
border: 1px solid #efefef;
border-radius: 3px;
background: #fff;
box-shadow: 0 1px 1px #ccc;
h3{
margin-bottom: 30px;
position: relative;
.back{
position: absolute;
right: 0;
top: 0;
margin-bottom: 20px;
background: #fff;
}
.form{
h3{
margin-bottom: 30px;
}
.span,.li{
display: inline-block;
......@@ -36,15 +39,35 @@
padding: 0 6px;
border-radius: 2px;
border: 1px solid #d9d9d9;
color: #000;
color: #999;
}
.li{
min-width: 140px;
margin-top: 15px;
margin-left: 0;
}
input{
input,.ant-upload-list{
width: 240px;
}
.ant-picker-range{
width: 240px;
input{
width: 100%;
}
}
.list{
display: inline-block;
}
.ant-checkbox-group{
line-height: 34px;
}
hr{
border: 0;
height: 1px;
background: #eee;
margin-bottom: 20px;
}
.tip{
padding:15px 0;
}
}
src/pages/ContractManagement/ContractContent.tsx
View file @ 9a619db7
......@@ -250,8 +250,10 @@ const ContractContent = (props: any) => {
<div className='list2'>
<div className={styles.box8item2x1}>
<Form.Item
rules={[{ required: true, message: `${tipList[5]}` }]}
label="Contract Remarks"
name="contractRemindContent">
<TextArea autoSize={false} style={{ padding: 8, width: 600, height: 194 }}>
<TextArea autoSize={false} style={{ padding: 8, width: 600, height: 194 }} placeholder='remarks'>
</TextArea>
</Form.Item>
</div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment