Skip to content

T
TOSTUMI
Commit 93a133a8 authored by cellee's avatar cellee
Browse files
Options

小区新增重构 

Signed-off-by: cellee's avatarcellee <893264950@qq.com>
parent ff46bff4
Show whitespace changes
Inline Side-by-side
Showing with 541 additions and 515 deletions
src/components/Form/PdfUpload.tsx
View file @ 93a133a8
/* /*
* @Author: your name * @Author: your name
* @Date: 2021-02-01 14:54:48 * @Date: 2021-02-01 14:54:48
* @LastEditTime: 2021-02-18 13:54:59 * @LastEditTime: 2021-02-18 16:48:37
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \tostumi\src\components\Form\PdfUpload.tsx * @FilePath: \tostumi\src\components\Form\PdfUpload.tsx
*/ */
import React, { useState } from 'react'; import React, { useState } from 'react';
import { Input, Upload, message, Button, Spin } from 'antd'; import { Input, Upload, message, Button, Modal, Pagination } from 'antd';
import { import {
LoadingOutlined, LoadingOutlined,
PlusOutlined, PlusOutlined,
...@@ -15,6 +15,8 @@ import { ...@@ -15,6 +15,8 @@ import {
FilePdfOutlined, FilePdfOutlined,
} from '@ant-design/icons'; } from '@ant-design/icons';
import PDF from 'react-pdf-js';
interface PriceInputProps { interface PriceInputProps {
value?: any; value?: any;
onChange?: any; onChange?: any;
...@@ -28,9 +30,12 @@ const PdfUpload: React.FC<PriceInputProps> = ({ value = {}, onChange, disabled, ...@@ -28,9 +30,12 @@ const PdfUpload: React.FC<PriceInputProps> = ({ value = {}, onChange, disabled,
const [idx, setIdx] = useState(0); // 点击的第几个 const [idx, setIdx] = useState(0); // 点击的第几个
const [imgList, setImgList] = useState([] as any); // 列表 const [imgList, setImgList] = useState([] as any); // 列表
const [PdfUrl, setPdfUrl] = useState(null); //地址 const [PdfUrl, setPdfUrl] = useState(null as any); //地址
const [ModalVisible, setModalVisible] = useState(false); //显示隐藏 const [ModalVisible, setModalVisible] = useState(false); //显示隐藏
const [numPages, setNumPages] = useState(1 as any); // 总页码数
const [pageNumber, setPageNumber] = useState(1); // 当前页码数
// 上传前检测 // 上传前检测
function beforeUpload(file: any) { function beforeUpload(file: any) {
const isJpgOrPng = file.type === 'application/pdf' || file.type === 'pdf'; const isJpgOrPng = file.type === 'application/pdf' || file.type === 'pdf';
...@@ -46,10 +51,11 @@ const PdfUpload: React.FC<PriceInputProps> = ({ value = {}, onChange, disabled, ...@@ -46,10 +51,11 @@ const PdfUpload: React.FC<PriceInputProps> = ({ value = {}, onChange, disabled,
// 上传成功怎么做 // 上传成功怎么做
const handleChange = (info: any) => { const handleChange = (info: any) => {
console.log(info); // console.log(info);
let { status, response } = info.file; let { status, response } = info.file;
// 加载中状态
if (status === 'uploading') { if (status === 'uploading') {
// setLoading();
let v = loading; let v = loading;
v[idx] = true; v[idx] = true;
setLoading([...v]); setLoading([...v]);
...@@ -58,8 +64,9 @@ const PdfUpload: React.FC<PriceInputProps> = ({ value = {}, onChange, disabled, ...@@ -58,8 +64,9 @@ const PdfUpload: React.FC<PriceInputProps> = ({ value = {}, onChange, disabled,
v[idx] = false; v[idx] = false;
setLoading([...v]); setLoading([...v]);
} }
// 上传成功后处理
if (status === 'done') { if (status === 'done') {
console.log('上传成功');
let { fileName, key, fileUrl } = response.data; let { fileName, key, fileUrl } = response.data;
let list = JSON.parse(JSON.stringify(imgList)); let list = JSON.parse(JSON.stringify(imgList));
let obj = { let obj = {
...@@ -73,9 +80,15 @@ const PdfUpload: React.FC<PriceInputProps> = ({ value = {}, onChange, disabled, ...@@ -73,9 +80,15 @@ const PdfUpload: React.FC<PriceInputProps> = ({ value = {}, onChange, disabled,
message.warning('The current category has been deleted'); message.warning('The current category has been deleted');
return false; return false;
} else { } else {
// 在判断输入框填了没 ，填了的话去掉提示
if (list[parseInt(key)].name !== '') {
list[parseInt(key)].tip = false;
}
// 否则添加进去 // 否则添加进去
list[parseInt(key)].fileList.push(obj); list[parseInt(key)].fileList.push(obj);
setImgList([...list]); setImgList([...list]);
onChange && onChange(list);
} }
} }
}; };
...@@ -83,15 +96,29 @@ const PdfUpload: React.FC<PriceInputProps> = ({ value = {}, onChange, disabled, ...@@ -83,15 +96,29 @@ const PdfUpload: React.FC<PriceInputProps> = ({ value = {}, onChange, disabled,
// 新增的按钮 // 新增的按钮
const add = () => { const add = () => {
let list = JSON.parse(JSON.stringify(imgList)); let list = JSON.parse(JSON.stringify(imgList));
let valve = false; // 控制阀
for (let i in list) {
if (list[i].name == '' || list[i].fileList.length == 0) {
list[i].tip = true;
valve = true;
} else {
list[i].tip = false;
}
}
if (!valve) {
let item = { let item = {
id: Math.floor(Math.random() * 100), id: Math.floor(Math.random() * 100),
name: '', name: '',
fileList: [], fileList: [],
tip: false, tip: false,
loading: false, message: 'Required',
message: '123',
}; };
list.push(item); list.push(item);
onChange && onChange(list);
}
setImgList([...list]); setImgList([...list]);
}; };
...@@ -99,7 +126,10 @@ const PdfUpload: React.FC<PriceInputProps> = ({ value = {}, onChange, disabled, ...@@ -99,7 +126,10 @@ const PdfUpload: React.FC<PriceInputProps> = ({ value = {}, onChange, disabled,
const del = (index: any) => { const del = (index: any) => {
let list = JSON.parse(JSON.stringify(imgList)); let list = JSON.parse(JSON.stringify(imgList));
list.splice(index, 1); list.splice(index, 1);
setImgList([...list]); setImgList([...list]);
onChange && onChange(list);
}; };
//携带数据 、 传递给后台加 key //携带数据 、 传递给后台加 key
...@@ -110,45 +140,110 @@ const PdfUpload: React.FC<PriceInputProps> = ({ value = {}, onChange, disabled, ...@@ -110,45 +140,110 @@ const PdfUpload: React.FC<PriceInputProps> = ({ value = {}, onChange, disabled,
// 点击预览 // 点击预览
const handlePreview = async (file: any) => { const handlePreview = async (file: any) => {
// console.log(file);
setPdfUrl(file); setPdfUrl(file);
setModalVisible(true); setModalVisible(true);
}; };
// 点击删除
const onRemove = (e: any) => {
let list = JSON.parse(JSON.stringify(imgList));
for (let i in list) {
let ary = list[i].fileList;
for (let v in ary) {
if (ary[v].name == e.name) {
ary.splice(v, 1);
}
}
}
setImgList([...list]);
onChange && onChange(list);
};
// 点击上传记录index // 点击上传记录index
const opens = (i: any) => { const opens = (i: any) => {
setIdx(i); setIdx(i);
}; };
// 上传pdf的图标
const icons = () => { const icons = () => {
return <FilePdfOutlined />; return <FilePdfOutlined />;
}; };
//隐藏框
const handleCancel = () => {
setModalVisible(false);
// 还原页码数
setNumPages(1);
setPageNumber(1);
};
// pdf 总页数
const onDocumentLoadSuccess = (pages: any) => {
setNumPages(pages);
};
// 切换pdf 总数
const onChangePage = (page: any) => {
setPageNumber(page);
};
// 输入框
const inpChange = (e: any) => {
let { id, value } = e.target;
let list = JSON.parse(JSON.stringify(imgList));
list[id].name = value;
// 在判断上传文件了没 ，上传了的话去掉提示
if (list[id].fileList.length > 0) {
list[id].tip = false;
}
// console.log(list);
setImgList([...list]);
onChange && onChange(list);
};
return ( return (
<> <>
{imgList.map((item: any, index: any) => { {imgList.map((item: any, index: any) => {
return ( return (
<div className="pdf" key={index}> <div className="pdf" key={index}>
<div className={item.tip ? 'inpt ant-form-item-has-error' : 'inpt'}> <div className={item.tip ? 'inpt ant-form-item-has-error' : 'inpt'}>
<Input placeholder="Basic usage" className="pdf-input" /> <Input
placeholder="Basic usage"
className="pdf-input"
onChange={inpChange}
id={index}
value={item.name}
/>
{item.tip ? <span className="tips">{item.message}</span> : null} {item.tip ? <span className="tips">{item.message}</span> : null}
</div> </div>
<div className={item.tip ? 'pdf-div ant-upload-list-item-error' : 'pdf-div'}> <div
className={item.tip ? 'pdf-div ant-upload-list-item-error' : 'pdf-div'}
onClick={() => opens(index)}
// key={Math.random()}
>
<Upload <Upload
className="avatar-uploader" className="avatar-uploader"
accept=".pdf" accept=".pdf"
action={action != null ? action : '/tos/community/pdf/upload'} action={action != null ? action : '/tos/community/pdf/upload'}
data={() => updeta(index)} // 携带数据 data={() => updeta(index)} // 携带数据
name="file" name="file"
listType="picture-card" listType="picture-card" // 展现方式
fileList={item.fileList} fileList={item.fileList}
onChange={handleChange} //上传文件改变时的状态
onPreview={handlePreview} // 预览 onPreview={handlePreview} // 预览
beforeUpload={beforeUpload} //上传前检测 beforeUpload={beforeUpload} //上传前检测
onChange={handleChange} onRemove={onRemove}
id={index} // id={index}
iconRender={icons}
iconRender={icons} // 上传成功后的图标
> >
{item.fileList && item.fileList.length >= 5 ? null : ( {item.fileList && item.fileList.length >= 5 ? null : (
<div onClick={() => opens(index)}> <div>
{loading[index] ? <LoadingOutlined /> : <PlusOutlined />} {loading[index] ? <LoadingOutlined /> : <PlusOutlined />}
{/* <PlusOutlined></PlusOutlined> */} {/* <PlusOutlined></PlusOutlined> */}
<div style={{ marginTop: 8 }}>Upload</div> <div style={{ marginTop: 8 }}>Upload</div>
...@@ -181,6 +276,30 @@ const PdfUpload: React.FC<PriceInputProps> = ({ value = {}, onChange, disabled, ...@@ -181,6 +276,30 @@ const PdfUpload: React.FC<PriceInputProps> = ({ value = {}, onChange, disabled,
)} )}
{/* 弹出层 */} {/* 弹出层 */}
<Modal
title={PdfUrl != null ? PdfUrl.name : 'File Preview'}
visible={ModalVisible}
width={650}
onCancel={handleCancel}
style={{ textAlign: 'center' }}
footer={null}
>
<>
<PDF
file={PdfUrl ? PdfUrl.url : null}
page={pageNumber}
scale={1}
onDocumentComplete={onDocumentLoadSuccess}
/>
<Pagination
style={{ textAlign: 'center', marginTop: 10, display: 'block' }}
simple
current={pageNumber}
total={numPages * 10}
onChange={onChangePage}
/>
</>
</Modal>
</> </>
); );
}; };
......
src/components/Form/zip.less
View file @ 93a133a8
...@@ -6,6 +6,7 @@ ...@@ -6,6 +6,7 @@
} }
// pdf上传 // pdf上传
.pdf { .pdf {
margin-bottom: 15px; margin-bottom: 15px;
display: flex; display: flex;
...@@ -58,3 +59,11 @@ ...@@ -58,3 +59,11 @@
height: 80px; height: 80px;
border-radius: 2px; border-radius: 2px;
} }
.ant-form-item-has-error {
.pdf-div {
.ant-upload {
border-color: #f00;
}
}
}
src/pages/CommunityManagement/CellList/Adds.tsx
View file @ 93a133a8
...@@ -8,7 +8,6 @@ import { ...@@ -8,7 +8,6 @@ import {
Button, Button,
TimePicker, TimePicker,
Checkbox, Checkbox,
Upload,
message, message,
Spin, Spin,
Modal, Modal,
...@@ -23,8 +22,9 @@ import { village } from '@/utils/tip'; ...@@ -23,8 +22,9 @@ import { village } from '@/utils/tip';
import moment from 'moment'; import moment from 'moment';
import { getNumber } from '@/utils/string'; // 正则 import { getNumber } from '@/utils/string'; // 正则
import FileViewer from 'react-file-viewer'; import PictureOptionsRow from '@/components/PictureOptions/PictureOptionsRow'; // banner 上传
import PDF from 'react-pdf-js'; import Facilities from '@/components/Form/ZipCode'; // 小区邮编地址名称
import PdfUpload from '@/components/Form/PdfUpload'; // 多图上传
const { RangePicker } = TimePicker; const { RangePicker } = TimePicker;
...@@ -37,23 +37,22 @@ const Adds = (props: any) => { ...@@ -37,23 +37,22 @@ const Adds = (props: any) => {
const [PropertyFee, setPropertyFee] = useState(['1']); // 表单物业费提交值 const [PropertyFee, setPropertyFee] = useState(['1']); // 表单物业费提交值
const [loubaUpload, setLouba] = useState([] as any); // 楼巴上传列表
const [guideUpload, setGuide] = useState([] as any); // 物业办事指南列表
const [periodUpload, setPeriod] = useState([] as any); // 保质期服务列表
// 监听用户填写小区名 以及后续禁止输入 提示信息 // 监听用户填写小区名 以及后续禁止输入 提示信息
const [codename, setCodeName] = useState(''); const [codename, setCodeName] = useState(null);
const [codeStrat, setcodeStrat] = useState(false);
const [tipMain, setTipMain] = useState(''); const [tips, setTips] = useState([false, false, false]); // 三个自定义上传的提示
const [previewVisible, setpreviewVisible] = useState(false); // 预览弹窗显示隐藏 // const [codeStrat, setcodeStrat] = useState(false);
const [previewImage, setpreviewImage] = useState({} as any); // 预览图片信息 // const [tipMain, setTipMain] = useState('');
//pdf 页码内容 // const [previewVisible, setpreviewVisible] = useState(false); // 预览弹窗显示隐藏
const [numPages, setNumPages] = useState(1 as any); // 总页码数 // const [previewImage, setpreviewImage] = useState({} as any); // 预览图片信息
const [pageNumber, setPageNumber] = useState(1); // 当前页码数
const [imgLoad, setimgLoad] = useState(false); //图片上传 load状态 // //pdf 页码内容
// const [numPages, setNumPages] = useState(1 as any); // 总页码数
// const [pageNumber, setPageNumber] = useState(1); // 当前页码数
// const [imgLoad, setimgLoad] = useState(false); //图片上传 load状态
// 赋值 // 赋值
useEffect(() => { useEffect(() => {
...@@ -90,13 +89,13 @@ const Adds = (props: any) => { ...@@ -90,13 +89,13 @@ const Adds = (props: any) => {
}, },
}); });
// 上传 // 上传
setLouba(Data.balouscheduleUrl ? [backUpload(Data.balouscheduleUrl, Data.id)] : []); // setLouba(Data.balouscheduleUrl ? [backUpload(Data.balouscheduleUrl, Data.id)] : []);
setGuide(Data.serviceGuideUrl ? [backUpload(Data.serviceGuideUrl, Data.id)] : []); // setGuide(Data.serviceGuideUrl ? [backUpload(Data.serviceGuideUrl, Data.id)] : []);
// setPeriod(Data.lifeServiceUrl ? [backUpload(Data.lifeServiceUrl, Data.id)] : []); // setPeriod(Data.lifeServiceUrl ? [backUpload(Data.lifeServiceUrl, Data.id)] : []);
// 小区名 -- 上传需要 // 小区名 -- 上传需要
setCodeName(Data.residentialName); setCodeName(Data.residentialName);
setcodeStrat(true); // setcodeStrat(true);
setTipMain('Binding Content Already Exists, Cannot Be Modified！'); // setTipMain('Binding Content Already Exists, Cannot Be Modified！');
} else { } else {
// console.log('新建'); // console.log('新建');
} }
...@@ -131,104 +130,6 @@ const Adds = (props: any) => { ...@@ -131,104 +130,6 @@ const Adds = (props: any) => {
} }
}, [imgUrl]); }, [imgUrl]);
// 编辑 返回上传格式 和 地址
function backUpload(str: any, index: number, url?: any) {
let a = {
uid: str + index,
name: str,
status: 'done',
type: str.match(/\.([^\.]+)$/)[1].toLowerCase(),
url: 'Transfer', // 需要调取接口
};
return a;
}
// 上传设置
const uploads = {
name: 'file',
accept: '.jpg,.png,.pdf',
action: '/tos/image/upload',
data: { imageType: 'tosCreateCommunity', extends: codename },
};
// 文件上传判断
function beforeUpload(file: any) {
// 文件大小判断
const isLt2M = file.size / 1024 / 1024 < 2;
if (!isLt2M) {
message.error('File must be less than or equal to 2MB!');
}
return isLt2M;
}
// 上传返回格式
function BackFormat(name: any, url: any) {
let imgs = [
{
uid: '-1',
name: name,
status: 'done',
type: name.match(/\.([^\.]+)$/)[1].toLowerCase(),
url: url,
},
];
return imgs;
}
// 楼巴上传
const upload1 = {
onChange({ file }: any) {
file.status === 'uploading' ? setimgLoad(true) : setimgLoad(false);
if (file.status === 'done') {
let data = file.response.data;
setLouba(BackFormat(data.imageName, data.url));
setcodeStrat(true);
setTipMain('Binding Content Already Exists, Cannot Be Modified！');
}
// 结果
uploadMsg(file);
},
};
// 指南上传
const upload2 = {
onChange({ file, fileList }: any) {
file.status === 'uploading' ? setimgLoad(true) : setimgLoad(false);
if (file.status === 'done') {
let data = file.response.data;
setGuide(BackFormat(data.imageName, data.url));
setcodeStrat(true);
setTipMain('Binding Content Already Exists, Cannot Be Modified！');
}
// 结果
uploadMsg(file);
},
};
// 保质期上传
// const upload3 = {
// onChange({ file }: any) {
// file.status === 'uploading' ? setimgLoad(true) : setimgLoad(false);
// if (file.status === 'done') {
// let data = file.response.data;
// setPeriod(BackFormat(data.imageName, data.url));
// setcodeStrat(true);
// setTipMain('Binding Content Already Exists, Cannot Be Modified！');
// }
// // 结果
// uploadMsg(file);
// },
// };
// 上传提示
function uploadMsg(file: any) {
if (file.status === 'done') {
// message.success(`${file.name} File Uploaded Successfully`);
} else if (file.status === 'error') {
message.error(`${file.name} File Upload Failed.`);
}
}
// 多选选择改变值 // 多选选择改变值
function onChange(checkedValues: any) { function onChange(checkedValues: any) {
// 修改选择值 // 修改选择值
...@@ -244,78 +145,98 @@ const Adds = (props: any) => { ...@@ -244,78 +145,98 @@ const Adds = (props: any) => {
} }
} }
// 表单验证 // 提取pdf地址文件名出来
const onFinish = (values: any) => { const pickUp = (list: any) => {
let { residentialZipCode } = values.des; let newArr = [];
let tel = values.info.tel; // 如果存在
if (values.residentialManagerUserName.length < 2) { if (list) {
message.error('Please Enter 2-digit Administrator Name！'); //循环一次
} else if (residentialZipCode.length < 6) { for (let i in list) {
message.error('Please Enter The Correct Name！'); // 判断有没有错误
} else if (tel.length != 8 && tel.length != 11) { if (list[i].name == '' || list[i].fileList.length == 0) {
message.error('Incorrect Contact Information！'); return '错误';
} else {
let name = list[i].name;
let page = list[i].fileList;
//再循环拼接
for (let v in page) {
name += '&' + page[v].name;
}
newArr.push(name);
}
}
return newArr;
} else { } else {
onUpDate(values); return null;
} }
}; };
// 表单提交 // 表单提交
function onUpDate(values: any) { function onFinish(values: any) {
// 额外判断 let mainPdfList = pickUp(values.mainPdfList);
let obj: any = new Object(); let essentialPdfList = pickUp(values.essentialPdfList);
obj.propertyFee = PropertyFee; if (mainPdfList == '错误') {
let a = tips;
a[0] = true;
setTips([...a]);
return false;
} else if (essentialPdfList == '错误') {
let b = tips;
b[1] = true;
setTips([...b]);
return false;
}
// 小区信息; // 小区信息;
let { residentialZipCode, residentialAddress, residentialName } = values.des; let { residentialZipCode, residentialAddress, residentialName } = values.des;
values.residentialZipCode = `SINGAPORE ${residentialZipCode}`;
values.residentialAddress = residentialAddress;
values.residentialName = residentialName;
obj.residentialZipCode = `SINGAPORE ${residentialZipCode}`; // 支付方式
obj.residentialAddress = residentialAddress; values.propertyFee = PropertyFee.join('');
obj.residentialName = residentialName;
// 小区时间与管理员 // 小区时间与管理员
obj.residentialManagerUserName = undeFi(values.residentialManagerUserName); values.residentialManagerUserName = undeFi(values.residentialManagerUserName);
obj.residentialStartWorking = values.workingHours[0].format('HH:mm'); values.residentialStartWorking = values.workingHours[0].format('HH:mm');
obj.residentialEndWorking = values.workingHours[1].format('HH:mm'); values.residentialEndWorking = values.workingHours[1].format('HH:mm');
obj.residentialPhone = values.info.tel;
obj.residentialEmail = values.info.email;
// 上传内容 // 上传内容
values.bannerUrl = values.bannerUrl ? values.bannerUrl.join('') : null;
obj.balouscheduleUrl = undeFi(loubaUpload.map((item: any) => item.name)[0]); values.mainPdfList = pickUp(values.mainPdfList);
obj.serviceGuideUrl = undeFi(guideUpload.map((item: any) => item.name)[0]); values.essentialPdfList = pickUp(values.essentialPdfList);
// obj.lifeServiceUrl = undeFi(periodUpload.map((item: any) => item.name)[0]); // values.formsPdfList = pickUp(values.formsPdfList);
// 小区热线 // 小区热线
// 表单结构存在数据不存在情况， 所以要多判断一次 let { residentialHotline, residentialHotlineName, time } = values.help;
if (values.help) {
obj.residentialHotlineName = values.help.residentialHotlineName // 没选的话就上面小区联系人和方式
? undeFi(values.help.residentialHotlineName) values.residentialHotline = residentialHotline
: 'Community Hotline'; ? undeFi(residentialHotline)
obj.residentialHotline = values.help.residentialHotline : values.residentialPhone;
? undeFi(values.help.residentialHotline) values.residentialHotlineName = residentialHotlineName
: values.info.tel; ? undeFi(residentialHotlineName)
// 编辑的时候 为空 判断 : values.residentialManagerUserName;
if (values.help.time) {
obj.residentialHotlineServieStartTime = undeFi(values.help.time[0]).format('HH:mm'); // 没选的话就上面小区时间
obj.residentialHotlineServieEndTime = undeFi(values.help.time[1]).format('HH:mm'); if (time) {
} else { values.residentialHotlineServieStartTime = undeFi(time[0].format('HH:mm'));
obj.residentialHotlineServieStartTime = values.workingHours[0].format('HH:mm'); values.residentialHotlineServieEndTime = undeFi(time[1].format('HH:mm'));
obj.residentialHotlineServieEndTime = values.workingHours[1].format('HH:mm');
}
} else { } else {
obj.residentialHotlineName = values.info.tel; values.residentialHotlineServieStartTime = values.workingHours[0].format('HH:mm');
obj.residentialHotline = values.info.tel; values.residentialHotlineServieEndTime = values.workingHours[1].format('HH:mm');
obj.residentialHotlineServieStartTime = values.workingHours[0].format('HH:mm');
obj.residentialHotlineServieEndTime = values.workingHours[1].format('HH:mm');
} }
delete values.des;
delete values.help;
delete values.workingHours;
if (Data) { if (Data) {
obj.id = Data.id; values.id = Data.id;
} }
console.log(values); console.log(values);
console.log(obj);
// 上传 // 上传
RA(29, obj, 'CellList', dispatch); RA(63, values, 'CellList', dispatch);
} }
// 返回 // 返回
...@@ -323,10 +244,11 @@ const Adds = (props: any) => { ...@@ -323,10 +244,11 @@ const Adds = (props: any) => {
history.go(-1); history.go(-1);
}; };
// 小区名输入监听ant // 小区名输入监听赋值
function insdInp(value: string) { function insdInp(value: any) {
if (value.trim() != '') {
setCodeName(value); setCodeName(value);
return value; }
} }
// 正则手机号 // 正则手机号
...@@ -339,55 +261,28 @@ const Adds = (props: any) => { ...@@ -339,55 +261,28 @@ const Adds = (props: any) => {
e.target.value = keyup_tool(e.target.value); e.target.value = keyup_tool(e.target.value);
}; };
// 上传按钮 // 邮编小区名字验证
const uploadButton = ( const checkPrice = (_: any, value: any) => {
<div> if (!value) {
{imgLoad ? <LoadingOutlined /> : <PlusOutlined />} return Promise.reject('Please fill in the basic information !');
<div style={{ marginTop: 8 }}>Upload</div> }
</div> if (!value.residentialZipCode || value.residentialZipCode.trim() == '') {
); return Promise.reject('Please enter the postcode !');
} else if (value.residentialZipCode.length < 6 || !/^\d+$/.test(value.residentialZipCode)) {
// 文件预览 return Promise.reject('Wrong zip code !');
const handlePreview = async (file: any) => { } else if (
if (file.url == 'Transfer') { !value.residentialAddress ||
// 这是编辑的预览， 需要发送一个请求 value.residentialAddress.trim() == '' ||
let msg = { value.residentialAddress.length < 2
// userToken: '', ) {
// type: ans.substr(ans.lastIndexOf('.') + 1), return Promise.reject('Please enter the address of the community !');
type: 'tosCommunityFileService', } else if (!value.residentialName || value.residentialName.trim() == '') {
fileName: file.name, return Promise.reject('Please enter the community name !');
extends: Data.residentialName,
};
RA(47, msg, module, dispatch);
} else { } else {
setpreviewImage(file); return Promise.resolve();
setpreviewVisible(true);
} }
}; };
// 点击移除图片
const handRemove = (key: any) => {
key == 1 ? setLouba([]) : key == 2 ? setGuide([]) : setPeriod([]);
};
// 点击遮罩回调
const handleCancel = () => {
setpreviewVisible(false);
// 每次关闭预览都要清掉弹窗图片信息 -- 防止编辑打开页面直接弹出窗口
setpreviewImage({});
dispatch({ type: module + '/urlRemove' });
};
// pdf 总页数
const onDocumentLoadSuccess = (pages: any) => {
setNumPages(pages);
};
// 切换pdf 总数
const onChangePage = (page: any) => {
setPageNumber(page);
};
return ( return (
<> <>
<Spin spinning={loading} tip="loading..." size="large"> <Spin spinning={loading} tip="loading..." size="large">
...@@ -411,49 +306,21 @@ const Adds = (props: any) => { ...@@ -411,49 +306,21 @@ const Adds = (props: any) => {
labelAlign="left" labelAlign="left"
scrollToFirstError={true} scrollToFirstError={true}
> >
{/* 小区邮编、地址和名称 */}
<Form.Item <Form.Item
label="Community Name"
name="des" name="des"
rules={[{ required: false }]} label="Community Name"
rules={[{ validator: checkPrice }]}
style={{ marginBottom: 15 }}
className="must" className="must"
> >
<Input.Group compact> <Facilities
<Form.Item name={['des', 'residentialZipCode']} noStyle rules={village[0] as any}> insdInps={(value: any) => {
<Input insdInp(value);
style={{ marginRight: '10px', width: 120 }} }}
placeholder="6 Postcode"
maxLength={6}
onKeyUp={keyup_communityManagerFee}
/>
</Form.Item>
<Form.Item name={['des', 'residentialAddress']} noStyle rules={village[1] as any}>
<Input
style={{ width: '360px' }}
placeholder="Please enter community adds"
disabled={codeStrat}
/>
</Form.Item>
<div className="li">
<Form.Item
name={['des', 'residentialName']}
normalize={insdInp}
noStyle
rules={village[2] as any}
>
<Input
style={{ marginRight: '10px', width: '260px' }}
placeholder="Please enter community name"
disabled={codeStrat}
/> />
</Form.Item> </Form.Item>
{/* 不可修改提示 */} {/* 小区时间 */}
<span className="redFs">{tipMain}</span>
</div>
</Input.Group>
</Form.Item>
<Form.Item label="Working Hours" name="workingHours" rules={village[3] as any}> <Form.Item label="Working Hours" name="workingHours" rules={village[3] as any}>
<RangePicker <RangePicker
minuteStep={60} minuteStep={60}
...@@ -461,40 +328,32 @@ const Adds = (props: any) => { ...@@ -461,40 +328,32 @@ const Adds = (props: any) => {
placeholder={['Start Time', 'End Time']} placeholder={['Start Time', 'End Time']}
/> />
</Form.Item> </Form.Item>
{/* 小区联系方式 */}
<Form.Item <Form.Item
name="residentialPhone"
label="Community Telephone" label="Community Telephone"
name="info" rules={village[4] as any}
rules={[{ required: false }]}
className="must"
> >
<Input.Group compact>
<Form.Item name={['info', 'tel']} noStyle rules={village[4] as any}>
<Input <Input
style={{ marginRight: '10px', width: '160px' }} style={{ marginRight: '10px', width: '240px' }}
placeholder="Please enter phone" placeholder="Please enter phone"
maxLength={11} maxLength={11}
onKeyUp={keyup_communityManagerFee} onKeyUp={keyup_communityManagerFee}
/> />
</Form.Item> </Form.Item>
<Button type="text">-</Button> {/* 小区邮箱 */}
<Form.Item name={['info', 'email']} noStyle rules={village[5] as any}> <Form.Item name="residentialEmail" label="Community Mailbox" rules={village[5] as any}>
<Input <Input style={{ width: '240px' }} placeholder="Please enter email" />
style={{ marginLeft: '10px', width: '180px' }}
placeholder="Please enter email"
/>
</Form.Item> </Form.Item>
</Input.Group> {/* 小区管理员 */}
</Form.Item>
<Form.Item <Form.Item
label="Administrator" label="Administrator"
name="residentialManagerUserName" name="residentialManagerUserName"
rules={village[6] as any} rules={village[6] as any}
> >
<Input style={{ width: '160px' }} placeholder="Name" maxLength={30} /> <Input style={{ width: '240px' }} placeholder="Please enter name" maxLength={30} />
</Form.Item> </Form.Item>
{/* 小区缴费方式 */}
<Form.Item label="Property Fee" name="propertyFee" style={{ marginBottom: '0' }}> <Form.Item label="Property Fee" name="propertyFee" style={{ marginBottom: '0' }}>
<Checkbox onChange={onChange} disabled> <Checkbox onChange={onChange} disabled>
Online Payment Online Payment
...@@ -503,80 +362,75 @@ const Adds = (props: any) => { ...@@ -503,80 +362,75 @@ const Adds = (props: any) => {
Offline Payment Offline Payment
</Checkbox> </Checkbox>
</Form.Item> </Form.Item>
<hr /> <hr />
{/* 上传部分 */} {/* banner上传部分 */}
<Form.Item <Form.Item
label="Shuttle Bus Timetable" name={'bannerUrl'}
name="balouscheduleFile" label="Banner:"
style={{ marginBottom: '0', minHeight: 159 }} colon={false}
> style={{
<Upload marginBottom: 8,
{...uploads} }}
{...upload1}
fileList={loubaUpload}
beforeUpload={beforeUpload}
listType="picture-card"
disabled={codename == '' ? true : false}
onPreview={() => handlePreview(loubaUpload[0])} // 预览
onRemove={() => handRemove(1)} //移除
> >
{loubaUpload.length >= 1 ? null : uploadButton} <PictureOptionsRow
</Upload> action="/tos/image/upload"
<div className="tip"> data={{
<span>Support Files：.jpg, .png, .pdf</span> imageType: 'communityBannerImage',
</div> // extends: codename,
}}
limitNums={1}
// imgs={ImageSrc}
/>
</Form.Item> </Form.Item>
{/* 第一个上传 */}
{/* 上传部分 */}
<Form.Item <Form.Item
label="Property Guide" name={'mainPdfList'}
name="serviceGuideFile" label="Maintenance Schedule:"
style={{ marginBottom: '0', minHeight: 159 }} colon={false}
style={{
marginBottom: tips[0] ? 4 : 14,
}}
> >
<Upload <PdfUpload
{...uploads} action="/tos/community/pdf/upload"
{...upload2} data={{
fileList={guideUpload} type: 'tosCommunityPdf',
beforeUpload={beforeUpload} extends: codename,
listType="picture-card" }}
disabled={codename == '' ? true : false} ></PdfUpload>
onPreview={() => handlePreview(guideUpload[0])} // 预览
onRemove={() => handRemove(2)} //移除
>
{guideUpload.length >= 1 ? null : uploadButton}
</Upload>
<div className="tip">
<span>Support Files：.jpg, .png, .pdf</span>
</div>
</Form.Item> </Form.Item>
{tips[0] ? (
{/* 上传部分 */} <p style={{ margin: '6px 0 10px 160px', color: '#f00' }}>
{/* <Form.Item Please complete or delete the incomplete part !
label="Warranty Period Service" </p>
name="lifeServiceFile" ) : (
style={{ marginBottom: '0', minHeight: 159 }} ''
> )}
<Upload {/* 第二个上传 */}
{...uploads} <Form.Item
{...upload3} name={'essentialPdfList'}
fileList={periodUpload} label=" Essential Information:"
beforeUpload={beforeUpload} colon={false}
listType="picture-card" style={{
disabled={codename == '' ? true : false} marginBottom: tips[1] ? 4 : 14,
onPreview={() => handlePreview(periodUpload[0])} // 预览 }}
onRemove={() => handRemove(3)} //移除
> >
{periodUpload.length >= 1 ? null : uploadButton} <PdfUpload
</Upload> action="/tos/community/pdf/upload"
<div className="tip"> data={{
<span>Support Files：.jpg, .png, .pdf</span> type: 'tosCommunityPdf',
</div> extends: codename,
</Form.Item> */} }}
></PdfUpload>
</Form.Item>{' '}
{tips[1] ? (
<p style={{ margin: '6px 0 10px 160px', color: '#f00' }}>
Please complete or delete the incomplete part !
</p>
) : (
''
)}
<hr /> <hr />
{/* 帮助中心 */} {/* 帮助中心 */}
<Form.Item label="Help Center" name="help"> <Form.Item label="Help Center" name="help">
<Input.Group compact> <Input.Group compact>
...@@ -596,7 +450,6 @@ const Adds = (props: any) => { ...@@ -596,7 +450,6 @@ const Adds = (props: any) => {
</Form.Item> </Form.Item>
</Input.Group> </Input.Group>
</Form.Item> </Form.Item>
<hr /> <hr />
{/* 提交 */} {/* 提交 */}
<Form.Item label="" colon={false}> <Form.Item label="" colon={false}>
...@@ -606,49 +459,6 @@ const Adds = (props: any) => { ...@@ -606,49 +459,6 @@ const Adds = (props: any) => {
</Form.Item> </Form.Item>
</Form> </Form>
</div> </div>
{/* 附件预览 */}
<Modal
title={previewImage != null ? previewImage.name : 'File Preview'}
visible={previewVisible}
width={800}
onCancel={handleCancel}
style={{ textAlign: 'center' }}
footer={null}
>
{previewImage != null ? (
previewImage.type == 'pdf' ? (
// pdf 换一种
<>
<PDF
file={previewImage.url}
page={pageNumber}
scale={1.25}
onDocumentComplete={onDocumentLoadSuccess}
/>
<Pagination
style={{ textAlign: 'center', marginTop: 10, display: 'block' }}
simple
defaultCurrent={pageNumber}
total={numPages * 10}
onChange={onChangePage}
/>
</>
) : previewImage.type == 'jpg' || previewImage.type == 'png' ? (
// 图片用指定格式
<Image
src={previewImage.url}
preview={false}
style={{ margin: '0 auto', textAlign: 'center' }}
/>
) : (
<FileViewer fileType={previewImage.type} filePath={previewImage.url} />
)
) : (
''
)}
</Modal>
</Spin> </Spin>
</> </>
); );
...@@ -657,7 +467,6 @@ const Adds = (props: any) => { ...@@ -657,7 +467,6 @@ const Adds = (props: any) => {
// export default Adds; // export default Adds;
function map(state: any) { function map(state: any) {
// console.log(state); // console.log(state);
const Data = state.CellList.DataSave; const Data = state.CellList.DataSave;
const { imgUrl, Result } = state.CellList; const { imgUrl, Result } = state.CellList;
const loading = state.loading.models.CellList ? state.loading.models.CellList : false; const loading = state.loading.models.CellList ? state.loading.models.CellList : false;
......
src/pages/CommunityManagement/CellList/Adds2.tsx → src/pages/CommunityManagement/CellList/Adds3.tsx
View file @ 93a133a8
...@@ -8,6 +8,7 @@ import { ...@@ -8,6 +8,7 @@ import {
Button, Button,
TimePicker, TimePicker,
Checkbox, Checkbox,
Upload,
message, message,
Spin, Spin,
Modal, Modal,
...@@ -22,10 +23,7 @@ import { village } from '@/utils/tip'; ...@@ -22,10 +23,7 @@ import { village } from '@/utils/tip';
import moment from 'moment'; import moment from 'moment';
import { getNumber } from '@/utils/string'; // 正则 import { getNumber } from '@/utils/string'; // 正则
import PictureOptionsRow from '@/components/PictureOptions/PictureOptionsRow'; // banner 上传 import FileViewer from 'react-file-viewer';
import Facilities from '@/components/Form/ZipCode'; // 小区邮编地址名称
import PdfUpload from '@/components/Form/PdfUpload'; // 多图上传
import PDF from 'react-pdf-js'; import PDF from 'react-pdf-js';
const { RangePicker } = TimePicker; const { RangePicker } = TimePicker;
...@@ -39,8 +37,12 @@ const Adds = (props: any) => { ...@@ -39,8 +37,12 @@ const Adds = (props: any) => {
const [PropertyFee, setPropertyFee] = useState(['1']); // 表单物业费提交值 const [PropertyFee, setPropertyFee] = useState(['1']); // 表单物业费提交值
const [loubaUpload, setLouba] = useState([] as any); // 楼巴上传列表
const [guideUpload, setGuide] = useState([] as any); // 物业办事指南列表
const [periodUpload, setPeriod] = useState([] as any); // 保质期服务列表
// 监听用户填写小区名 以及后续禁止输入 提示信息 // 监听用户填写小区名 以及后续禁止输入 提示信息
const [codename, setCodeName] = useState(null); const [codename, setCodeName] = useState('');
const [codeStrat, setcodeStrat] = useState(false); const [codeStrat, setcodeStrat] = useState(false);
const [tipMain, setTipMain] = useState(''); const [tipMain, setTipMain] = useState('');
...@@ -88,8 +90,8 @@ const Adds = (props: any) => { ...@@ -88,8 +90,8 @@ const Adds = (props: any) => {
}, },
}); });
// 上传 // 上传
// setLouba(Data.balouscheduleUrl ? [backUpload(Data.balouscheduleUrl, Data.id)] : []); setLouba(Data.balouscheduleUrl ? [backUpload(Data.balouscheduleUrl, Data.id)] : []);
// setGuide(Data.serviceGuideUrl ? [backUpload(Data.serviceGuideUrl, Data.id)] : []); setGuide(Data.serviceGuideUrl ? [backUpload(Data.serviceGuideUrl, Data.id)] : []);
// setPeriod(Data.lifeServiceUrl ? [backUpload(Data.lifeServiceUrl, Data.id)] : []); // setPeriod(Data.lifeServiceUrl ? [backUpload(Data.lifeServiceUrl, Data.id)] : []);
// 小区名 -- 上传需要 // 小区名 -- 上传需要
setCodeName(Data.residentialName); setCodeName(Data.residentialName);
...@@ -179,7 +181,7 @@ const Adds = (props: any) => { ...@@ -179,7 +181,7 @@ const Adds = (props: any) => {
file.status === 'uploading' ? setimgLoad(true) : setimgLoad(false); file.status === 'uploading' ? setimgLoad(true) : setimgLoad(false);
if (file.status === 'done') { if (file.status === 'done') {
let data = file.response.data; let data = file.response.data;
// setLouba(BackFormat(data.imageName, data.url)); setLouba(BackFormat(data.imageName, data.url));
setcodeStrat(true); setcodeStrat(true);
setTipMain('Binding Content Already Exists, Cannot Be Modified！'); setTipMain('Binding Content Already Exists, Cannot Be Modified！');
} }
...@@ -188,6 +190,36 @@ const Adds = (props: any) => { ...@@ -188,6 +190,36 @@ const Adds = (props: any) => {
}, },
}; };
// 指南上传
const upload2 = {
onChange({ file, fileList }: any) {
file.status === 'uploading' ? setimgLoad(true) : setimgLoad(false);
if (file.status === 'done') {
let data = file.response.data;
setGuide(BackFormat(data.imageName, data.url));
setcodeStrat(true);
setTipMain('Binding Content Already Exists, Cannot Be Modified！');
}
// 结果
uploadMsg(file);
},
};
// 保质期上传
// const upload3 = {
// onChange({ file }: any) {
// file.status === 'uploading' ? setimgLoad(true) : setimgLoad(false);
// if (file.status === 'done') {
// let data = file.response.data;
// setPeriod(BackFormat(data.imageName, data.url));
// setcodeStrat(true);
// setTipMain('Binding Content Already Exists, Cannot Be Modified！');
// }
// // 结果
// uploadMsg(file);
// },
// };
// 上传提示 // 上传提示
function uploadMsg(file: any) { function uploadMsg(file: any) {
if (file.status === 'done') { if (file.status === 'done') {
...@@ -212,15 +244,29 @@ const Adds = (props: any) => { ...@@ -212,15 +244,29 @@ const Adds = (props: any) => {
} }
} }
// 表单验证
const onFinish = (values: any) => {
let { residentialZipCode } = values.des;
let tel = values.info.tel;
if (values.residentialManagerUserName.length < 2) {
message.error('Please Enter 2-digit Administrator Name！');
} else if (residentialZipCode.length < 6) {
message.error('Please Enter The Correct Name！');
} else if (tel.length != 8 && tel.length != 11) {
message.error('Incorrect Contact Information！');
} else {
onUpDate(values);
}
};
// 表单提交 // 表单提交
function onFinish(values: any) { function onUpDate(values: any) {
console.log(values);
// 额外判断 // 额外判断
let obj: any = new Object(); let obj: any = new Object();
obj.propertyFee = PropertyFee; obj.propertyFee = PropertyFee;
// 小区信息; // 小区信息;
let { residentialZipCode, residentialAddress, residentialName } = values; let { residentialZipCode, residentialAddress, residentialName } = values.des;
obj.residentialZipCode = `SINGAPORE ${residentialZipCode}`; obj.residentialZipCode = `SINGAPORE ${residentialZipCode}`;
obj.residentialAddress = residentialAddress; obj.residentialAddress = residentialAddress;
...@@ -230,13 +276,13 @@ const Adds = (props: any) => { ...@@ -230,13 +276,13 @@ const Adds = (props: any) => {
obj.residentialManagerUserName = undeFi(values.residentialManagerUserName); obj.residentialManagerUserName = undeFi(values.residentialManagerUserName);
obj.residentialStartWorking = values.workingHours[0].format('HH:mm'); obj.residentialStartWorking = values.workingHours[0].format('HH:mm');
obj.residentialEndWorking = values.workingHours[1].format('HH:mm'); obj.residentialEndWorking = values.workingHours[1].format('HH:mm');
obj.residentialPhone = values.tel; obj.residentialPhone = values.info.tel;
obj.residentialEmail = values.email; obj.residentialEmail = values.info.email;
// 上传内容 // 上传内容
// obj.balouscheduleUrl = undeFi(loubaUpload.map((item: any) => item.name)[0]); obj.balouscheduleUrl = undeFi(loubaUpload.map((item: any) => item.name)[0]);
// obj.serviceGuideUrl = undeFi(guideUpload.map((item: any) => item.name)[0]); obj.serviceGuideUrl = undeFi(guideUpload.map((item: any) => item.name)[0]);
// obj.lifeServiceUrl = undeFi(periodUpload.map((item: any) => item.name)[0]); // obj.lifeServiceUrl = undeFi(periodUpload.map((item: any) => item.name)[0]);
// 小区热线 // 小区热线
...@@ -269,7 +315,7 @@ const Adds = (props: any) => { ...@@ -269,7 +315,7 @@ const Adds = (props: any) => {
console.log(values); console.log(values);
console.log(obj); console.log(obj);
// 上传 // 上传
// RA(29, obj, 'CellList', dispatch); RA(29, obj, 'CellList', dispatch);
} }
// 返回 // 返回
...@@ -277,11 +323,10 @@ const Adds = (props: any) => { ...@@ -277,11 +323,10 @@ const Adds = (props: any) => {
history.go(-1); history.go(-1);
}; };
// 小区名输入监听赋值 // 小区名输入监听ant
function insdInp(value: any) { function insdInp(value: string) {
if (value.trim() != '') {
setCodeName(value); setCodeName(value);
} return value;
} }
// 正则手机号 // 正则手机号
...@@ -322,7 +367,7 @@ const Adds = (props: any) => { ...@@ -322,7 +367,7 @@ const Adds = (props: any) => {
// 点击移除图片 // 点击移除图片
const handRemove = (key: any) => { const handRemove = (key: any) => {
// key == 1 ? setLouba([]) : key == 2 ? setGuide([]) : setPeriod([]); key == 1 ? setLouba([]) : key == 2 ? setGuide([]) : setPeriod([]);
}; };
// 点击遮罩回调 // 点击遮罩回调
...@@ -343,28 +388,6 @@ const Adds = (props: any) => { ...@@ -343,28 +388,6 @@ const Adds = (props: any) => {
setPageNumber(page); setPageNumber(page);
}; };
// 邮编小区名字验证
const checkPrice = (_: any, value: any) => {
if (!value) {
return Promise.reject('Please fill in the basic information !');
}
if (!value.residentialZipCode || value.residentialZipCode.trim() == '') {
return Promise.reject('Please enter the postcode !');
} else if (value.residentialZipCode.length < 6 || !/^\d+$/.test(value.residentialZipCode)) {
return Promise.reject('Wrong zip code !');
} else if (
!value.residentialAddress ||
value.residentialAddress.trim() == '' ||
value.residentialAddress.length < 2
) {
return Promise.reject('Please enter the address of the community !');
} else if (!value.residentialName || value.residentialName.trim() == '') {
return Promise.reject('Please enter the community name !');
} else {
return Promise.resolve();
}
};
return ( return (
<> <>
<Spin spinning={loading} tip="loading..." size="large"> <Spin spinning={loading} tip="loading..." size="large">
...@@ -388,22 +411,49 @@ const Adds = (props: any) => { ...@@ -388,22 +411,49 @@ const Adds = (props: any) => {
labelAlign="left" labelAlign="left"
scrollToFirstError={true} scrollToFirstError={true}
> >
{/* 小区邮编、地址和名称 */}
<Form.Item <Form.Item
name="des"
label="Community Name" label="Community Name"
rules={[{ validator: checkPrice }]} name="des"
style={{ marginBottom: 15 }} rules={[{ required: false }]}
className="must" className="must"
> >
<Facilities <Input.Group compact>
insdInps={(value: any) => { <Form.Item name={['des', 'residentialZipCode']} noStyle rules={village[0] as any}>
insdInp(value); <Input
}} style={{ marginRight: '10px', width: 120 }}
placeholder="6 Postcode"
maxLength={6}
onKeyUp={keyup_communityManagerFee}
/>
</Form.Item>
<Form.Item name={['des', 'residentialAddress']} noStyle rules={village[1] as any}>
<Input
style={{ width: '360px' }}
placeholder="Please enter community adds"
disabled={codeStrat}
/> />
</Form.Item> </Form.Item>
{/* 小区时间 */} <div className="li">
<Form.Item
name={['des', 'residentialName']}
normalize={insdInp}
noStyle
rules={village[2] as any}
>
<Input
style={{ marginRight: '10px', width: '260px' }}
placeholder="Please enter community name"
disabled={codeStrat}
/>
</Form.Item>
{/* 不可修改提示 */}
<span className="redFs">{tipMain}</span>
</div>
</Input.Group>
</Form.Item>
<Form.Item label="Working Hours" name="workingHours" rules={village[3] as any}> <Form.Item label="Working Hours" name="workingHours" rules={village[3] as any}>
<RangePicker <RangePicker
minuteStep={60} minuteStep={60}
...@@ -412,35 +462,39 @@ const Adds = (props: any) => { ...@@ -412,35 +462,39 @@ const Adds = (props: any) => {
/> />
</Form.Item> </Form.Item>
{/* 小区联系方式 */}
<Form.Item <Form.Item
name="residentialPhone"
label="Community Telephone" label="Community Telephone"
rules={village[4] as any} name="info"
rules={[{ required: false }]}
className="must"
> >
<Input.Group compact>
<Form.Item name={['info', 'tel']} noStyle rules={village[4] as any}>
<Input <Input
style={{ marginRight: '10px', width: '240px' }} style={{ marginRight: '10px', width: '160px' }}
placeholder="Please enter phone" placeholder="Please enter phone"
maxLength={11} maxLength={11}
onKeyUp={keyup_communityManagerFee} onKeyUp={keyup_communityManagerFee}
/> />
</Form.Item> </Form.Item>
<Button type="text">-</Button>
{/* 小区邮箱 */} <Form.Item name={['info', 'email']} noStyle rules={village[5] as any}>
<Form.Item name="residentialEmail" label="Community Mailbox" rules={village[5] as any}> <Input
<Input style={{ width: '240px' }} placeholder="Please enter email" /> style={{ marginLeft: '10px', width: '180px' }}
placeholder="Please enter email"
/>
</Form.Item>
</Input.Group>
</Form.Item> </Form.Item>
{/* 小区管理员 */}
<Form.Item <Form.Item
label="Administrator" label="Administrator"
name="residentialManagerUserName" name="residentialManagerUserName"
rules={village[6] as any} rules={village[6] as any}
> >
<Input style={{ width: '240px' }} placeholder="Please enter name" maxLength={30} /> <Input style={{ width: '160px' }} placeholder="Name" maxLength={30} />
</Form.Item> </Form.Item>
{/* 小区缴费方式 */}
<Form.Item label="Property Fee" name="propertyFee" style={{ marginBottom: '0' }}> <Form.Item label="Property Fee" name="propertyFee" style={{ marginBottom: '0' }}>
<Checkbox onChange={onChange} disabled> <Checkbox onChange={onChange} disabled>
Online Payment Online Payment
...@@ -453,39 +507,73 @@ const Adds = (props: any) => { ...@@ -453,39 +507,73 @@ const Adds = (props: any) => {
<hr /> <hr />
{/* 上传部分 */} {/* 上传部分 */}
<Form.Item name={'banner'} label="Banner:" colon={false}> <Form.Item
<PictureOptionsRow label="Shuttle Bus Timetable"
action="/tos/image/upload" name="balouscheduleFile"
data={{ style={{ marginBottom: '0', minHeight: 159 }}
imageType: 'communityBannerImage', >
// extends: codename, <Upload
}} {...uploads}
limitNums={1} {...upload1}
// imgs={ImageSrc} fileList={loubaUpload}
/> beforeUpload={beforeUpload}
listType="picture-card"
disabled={codename == '' ? true : false}
onPreview={() => handlePreview(loubaUpload[0])} // 预览
onRemove={() => handRemove(1)} //移除
>
{loubaUpload.length >= 1 ? null : uploadButton}
</Upload>
<div className="tip">
<span>Support Files：.jpg, .png, .pdf</span>
</div>
</Form.Item> </Form.Item>
{/* 第一个上传 */} {/* 上传部分 */}
<Form.Item name={'banner2'} label="Maintenance Schedule:" colon={false}> <Form.Item
<PdfUpload label="Property Guide"
action="/tos/community/pdf/upload" name="serviceGuideFile"
data={{ style={{ marginBottom: '0', minHeight: 159 }}
type: 'tosCommunityPdf', >
extends: codename, <Upload
}} {...uploads}
></PdfUpload> {...upload2}
fileList={guideUpload}
beforeUpload={beforeUpload}
listType="picture-card"
disabled={codename == '' ? true : false}
onPreview={() => handlePreview(guideUpload[0])} // 预览
onRemove={() => handRemove(2)} //移除
>
{guideUpload.length >= 1 ? null : uploadButton}
</Upload>
<div className="tip">
<span>Support Files：.jpg, .png, .pdf</span>
</div>
</Form.Item> </Form.Item>
{/* 第二个上传 */} {/* 上传部分 */}
<Form.Item name={'banner3'} label=" Essential Information:" colon={false}> {/* <Form.Item
<PdfUpload label="Warranty Period Service"
action="/tos/community/pdf/upload" name="lifeServiceFile"
data={{ style={{ marginBottom: '0', minHeight: 159 }}
type: 'tosCommunityPdf', >
extends: codename, <Upload
}} {...uploads}
></PdfUpload> {...upload3}
</Form.Item> fileList={periodUpload}
beforeUpload={beforeUpload}
listType="picture-card"
disabled={codename == '' ? true : false}
onPreview={() => handlePreview(periodUpload[0])} // 预览
onRemove={() => handRemove(3)} //移除
>
{periodUpload.length >= 1 ? null : uploadButton}
</Upload>
<div className="tip">
<span>Support Files：.jpg, .png, .pdf</span>
</div>
</Form.Item> */}
<hr /> <hr />
...@@ -555,7 +643,7 @@ const Adds = (props: any) => { ...@@ -555,7 +643,7 @@ const Adds = (props: any) => {
style={{ margin: '0 auto', textAlign: 'center' }} style={{ margin: '0 auto', textAlign: 'center' }}
/> />
) : ( ) : (
'' <FileViewer fileType={previewImage.type} filePath={previewImage.url} />
) )
) : ( ) : (
'' ''
...@@ -568,7 +656,7 @@ const Adds = (props: any) => { ...@@ -568,7 +656,7 @@ const Adds = (props: any) => {
// export default Adds; // export default Adds;
function map(state: any) { function map(state: any) {
console.log(state); // console.log(state);
const Data = state.CellList.DataSave; const Data = state.CellList.DataSave;
const { imgUrl, Result } = state.CellList; const { imgUrl, Result } = state.CellList;
......
src/utils/params.ts
View file @ 93a133a8
/* /*
* @Author: your name * @Author: your name
* @Date: 2020-11-19 20:34:18 * @Date: 2020-11-19 20:34:18
* @LastEditTime: 2021-01-28 15:34:25 * @LastEditTime: 2021-02-18 16:50:47
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \tostumi\src\utils\params.ts * @FilePath: \tostumi\src\utils\params.ts
...@@ -95,4 +95,5 @@ export const requestList = [ ...@@ -95,4 +95,5 @@ export const requestList = [
['/tos/community/facilities/get/detail', '60 获取小区设施详情', {}], ['/tos/community/facilities/get/detail', '60 获取小区设施详情', {}],
['/tos/bookingService/delete', '61 设施删除', {}], ['/tos/bookingService/delete', '61 设施删除', {}],
['/tos/community/download/excel', '62 关闭小区后获取当前小区预约需要退费的表格', {}], ['/tos/community/download/excel', '62 关闭小区后获取当前小区预约需要退费的表格', {}],
['/tos/tosCommunity/saveCommunity', '63 新建小区PDF版本', {}],
]; ];
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