Skip to content

T
TOSTUMI
Commit 516960d3 authored by cellee's avatar cellee
Browse files
Options

设施管理界面重做，修复小区新增编辑bug，修复小区公告bug 

Signed-off-by: cellee's avatarcellee <893264950@qq.com>
parent 03026ae7
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1661 additions and 749 deletions
src/components/BackButton/BackButton.tsx
View file @ 516960d3
...@@ -30,7 +30,9 @@ const BackButton = (props: any) => { ...@@ -30,7 +30,9 @@ const BackButton = (props: any) => {
return ( return (
<> <>
{url != null ? ( {url != null ? (
<Button onClick={goToReturnByParam}>Back</Button> <Button onClick={goToReturnByParam}>
<LeftOutlined /> Back
</Button>
) : ( ) : (
<Button onClick={goToReturn}> <Button onClick={goToReturn}>
<LeftOutlined /> <LeftOutlined />
......
src/components/Facilitys/Facilitys.tsx 0 → 100644
View file @ 516960d3
import React, { useState, useEffect, useRef } from 'react';
import './index.less';
import { Input, Button, Upload, Form, Select } from 'antd';
const { Option } = Select;
import { PlusOutlined } from '@ant-design/icons';
import { Link, useIntl, connect, Dispatch, history } from 'umi';
const Facilitys = (props: any) => {
//
const uploadButton = (
<div>
<PlusOutlined />
<div className="ant-upload-text">Upload</div>
</div>
);
// 列表
const fileList: any = [];
return (
<>
<Form.List
name="names"
rules={[
{
validator: async (_, names) => {
// if (!names || names.length < 2) {
// return Promise.reject(new Error('At least 2 passengers'));
// }
},
},
]}
>
{(fields, { add, remove }, { errors }) => (
<>
{fields.map((field, index) => (
<Form.Item required={false} key={field.key}>
{/* 每一个上传的组件 */}
<div className="test">
<div className="diy-box">
<Upload
fileList={fileList}
action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
listType="picture-card"
style={{ display: 'inline-block', width: '110px' }}
// onPreview={this.handlePreview}
// onChange={this.handleChange}
>
{fileList.length >= 1 ? null : uploadButton}
</Upload>
<div className="name">
<Form.Item
label="Facility name"
name="username"
rules={[{ required: true, message: 'Please input your username!' }]}
>
<Input />
</Form.Item>
<div className="over">
{fields.length > 1 ? (
<Button type="link" onClick={() => remove(field.name)}>
Delete
</Button>
) : null}
</div>
</div>
</div>
</div>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => add()}
style={{ width: '100px', height: '100px' }}
icon={<PlusOutlined />}
></Button>
<Form.ErrorList errors={errors} />
</Form.Item>
</>
)}
</Form.List>
</>
);
};
export default Facilitys;
src/components/Facilitys/index.less 0 → 100644
View file @ 516960d3
.ant-form-item-control-input-content {
display: flex;
flex-wrap: wrap;
}
.test {
width: 240px;
display: inline-block;
margin-right: 20px;
.ant-upload-picture-card-wrapper {
width: 110px;
}
.diy-box {
width: 210px;
display: flex;
justify-content: space-between;
.name {
width: 100px;
display: inline-block;
margin-left: 10px;
.ant-form-item {
margin-bottom: 5px;
}
}
.over {
text-align: center;
}
}
}
src/components/PictureOptions/PictureOptionsRow.tsx
View file @ 516960d3
...@@ -59,24 +59,24 @@ const PictureOptionsRow = (props: any) => { ...@@ -59,24 +59,24 @@ const PictureOptionsRow = (props: any) => {
useEffect(() => { useEffect(() => {
// if (props.disabled) { // if (props.disabled) {
if (props.defaultValue != null) { if (props.defaultValue != null) {
var tmp = props.defaultValue; var tmp = props.defaultValue;
var result = new Array(); var result = new Array();
var resultToInside = new Array(); var resultToInside = new Array();
// console.log('组件'); // console.log('组件');
// console.log(tmp); // console.log(tmp);
tmp.map((item: any, index: any) => { tmp.map((item: any, index: any) => {
if (item.name == null) { if (item.name == null) {
item.name = getUrlPicName(item.url); item.name = getUrlPicName(item.url);
item.uid = index; item.uid = index;
} }
result.push(item); result.push(item);
resultToInside.push(item.name); resultToInside.push(item.name);
}); });
setFileList(result); setFileList(result);
} }
// } // }
}, [props.defaultValue]); }, [props.defaultValue]);
// useEffect(() => { // useEffect(() => {
...@@ -111,6 +111,9 @@ const PictureOptionsRow = (props: any) => { ...@@ -111,6 +111,9 @@ const PictureOptionsRow = (props: any) => {
}; };
const handleChange = ({ file, fileList }) => { const handleChange = ({ file, fileList }) => {
// 给传递的附加名字
props.data.fileName = fileList[0].name;
console.log(props.data);
console.log(fileList); console.log(fileList);
let tmp = fileList; let tmp = fileList;
setFileList(tmp.filter((file) => !!file.status || file.status == null)); setFileList(tmp.filter((file) => !!file.status || file.status == null));
......
src/models/CommunityManagement/CommunityAnnouncement.ts
View file @ 516960d3
...@@ -9,10 +9,11 @@ import { printf } from '@/utils/log'; ...@@ -9,10 +9,11 @@ import { printf } from '@/utils/log';
export default { export default {
namespace: 'CommunityAnnouncement', namespace: 'CommunityAnnouncement',
state: { state: {
Data: null, //公告列表 Data: null, //公告列表
Result: null, //新增、编辑保存成功信息 Result: null, //新增、编辑保存成功信息
DataSave: null, // 列表内容 DataSave: null, // 列表内容
DataSaveDetail: {pageNum: 1}, // 页码 DataSaveDetail: { pageNum: 1 }, // 页码
ImgSrc: null,
}, },
reducers: { reducers: {
...@@ -23,14 +24,17 @@ export default { ...@@ -23,14 +24,17 @@ export default {
return { ...state, Result }; return { ...state, Result };
}, },
returnDataSave(state, { playload }) { returnDataSave(state, { playload }) {
console.log(playload) console.log(playload);
let DataSave = playload.DataSave let DataSave = playload.DataSave;
return { ...state, DataSave }; return { ...state, DataSave };
}, },
returnDataSaveDetail(state, {playload}) { returnDataSaveDetail(state, { playload }) {
// console.log(playload.DataSaveDetail) // console.log(playload.DataSaveDetail)
let DataSaveDetail = playload.DataSaveDetail let DataSaveDetail = playload.DataSaveDetail;
return { ...state, DataSaveDetail}; return { ...state, DataSaveDetail };
},
returnImg(state, { ImgSrc }) {
return { ...state, ImgSrc };
}, },
}, },
...@@ -57,6 +61,13 @@ export default { ...@@ -57,6 +61,13 @@ export default {
yield put({ type: 'returnResult', Result }); yield put({ type: 'returnResult', Result });
} }
break; break;
case 47:
{
let ImgSrc = resp.data;
yield put({ type: 'returnImg', ImgSrc });
}
console.log('图片请求成功');
break;
} }
}, },
...@@ -70,12 +81,15 @@ export default { ...@@ -70,12 +81,15 @@ export default {
yield put({ type: 'returnResult', tmp }); yield put({ type: 'returnResult', tmp });
}, },
*SA({ playload }, { put }) { *SA({ playload }, { put }) {
console.log(playload) console.log(playload);
// 这里传递两个值来。 一个是修改同步的方法 一个是修改值的名称 一个是修改 的数据 // 这里传递两个值来。 一个是修改同步的方法 一个是修改值的名称 一个是修改 的数据
yield put({ type: playload.Method , playload:{ yield put({
[playload.DefaultName]:playload.Data type: playload.Method,
}}); playload: {
[playload.DefaultName]: playload.Data,
},
});
}, },
}, },
}; };
src/pages/CommunityManagement/CellList/Adds.tsx
View file @ 516960d3
...@@ -9,6 +9,7 @@ import { history } from 'umi'; ...@@ -9,6 +9,7 @@ import { history } from 'umi';
import { village } from '@/utils/tip'; import { village } from '@/utils/tip';
import moment from 'moment'; import moment from 'moment';
import { parseInt } from 'lodash';
const { RangePicker } = TimePicker; const { RangePicker } = TimePicker;
...@@ -18,8 +19,6 @@ interface objc {} ...@@ -18,8 +19,6 @@ interface objc {}
const Adds = (props: any) => { const Adds = (props: any) => {
const { Data, dispatch, loading, Result } = props; const { Data, dispatch, loading, Result } = props;
console.log(loading);
const [form] = Form.useForm(); const [form] = Form.useForm();
//物业费选择 //物业费选择
...@@ -68,7 +67,10 @@ const Adds = (props: any) => { ...@@ -68,7 +67,10 @@ const Adds = (props: any) => {
form.setFieldsValue({ form.setFieldsValue({
// 必填的 // 必填的
des: { des: {
residentialZipCode: Data.residentialZipCode, residentialZipCode: Data.residentialZipCode.substring(
Data.residentialZipCode.length - 6,
Data.residentialZipCode.length,
),
residentialAddress: Data.residentialAddress, residentialAddress: Data.residentialAddress,
residentialName: Data.residentialName, residentialName: Data.residentialName,
}, },
...@@ -311,7 +313,11 @@ const Adds = (props: any) => { ...@@ -311,7 +313,11 @@ const Adds = (props: any) => {
</Form.Item> </Form.Item>
<Form.Item name={['des', 'residentialAddress']} noStyle rules={village[0] as any}> <Form.Item name={['des', 'residentialAddress']} noStyle rules={village[0] as any}>
<Input style={{ width: '360px' }} placeholder="Please enter community adds" /> <Input
style={{ width: '360px' }}
placeholder="Please enter community adds"
disabled={codeStrat}
/>
</Form.Item> </Form.Item>
<div className="li"> <div className="li">
......
src/pages/CommunityManagement/CellList/Details.tsx
View file @ 516960d3
...@@ -164,7 +164,11 @@ const Detail = (props: any) => { ...@@ -164,7 +164,11 @@ const Detail = (props: any) => {
<div className="item"> <div className="item">
<label>Community Address：</label> <label>Community Address：</label>
<span> <span>
{detailData.rows.residentialAddress}&nbsp;{detailData.rows.residentialZipCode}{' '} {detailData.rows.residentialAddress}&nbsp;
{detailData.rows.residentialZipCode.substring(
detailData.rows.residentialZipCode.length - 6,
detailData.rows.residentialZipCode.length,
)}{' '}
</span> </span>
</div> </div>
{/* ---------- */} {/* ---------- */}
......
src/pages/CommunityManagement/CommunityAnnouncement/Add.tsx
View file @ 516960d3
...@@ -4,7 +4,7 @@ const { TabPane } = Tabs; ...@@ -4,7 +4,7 @@ const { TabPane } = Tabs;
import { connect, history } from 'umi'; import { connect, history } from 'umi';
import { RA } from '@/utils/method'; import { RA, SA } from '@/utils/method';
import TitleBack from '@/components/TitleBack/TitleBack'; import TitleBack from '@/components/TitleBack/TitleBack';
// import FileUpload from '@/components/FileUpload/FileUpload'; // import FileUpload from '@/components/FileUpload/FileUpload';
import { validateMessages } from '@/utils/params'; import { validateMessages } from '@/utils/params';
...@@ -13,7 +13,7 @@ import TextArea from 'antd/lib/input/TextArea'; ...@@ -13,7 +13,7 @@ import TextArea from 'antd/lib/input/TextArea';
import SelectCommunity from '@/components/SelectCommunity'; import SelectCommunity from '@/components/SelectCommunity';
// import Line from '@/components/Line/Line'; // import Line from '@/components/Line/Line';
// import TimeComfirm from '@/components/TimeComfirm/TimeComfirm'; // import TimeComfirm from '@/components/TimeComfirm/TimeComfirm';
import imgs from '@/assets/logo_icon_bg.png';
import './ann.less'; import './ann.less';
import { Notice } from '@/utils/tip'; import { Notice } from '@/utils/tip';
import { getCookie } from '@/utils/method'; import { getCookie } from '@/utils/method';
...@@ -21,67 +21,97 @@ import moment from 'moment'; ...@@ -21,67 +21,97 @@ import moment from 'moment';
const module = 'CommunityAnnouncement'; const module = 'CommunityAnnouncement';
const Add = (props: any) => { const Add = (props: any) => {
const { dispatch, Result, loading , DataSave } = props; const { dispatch, Result, loading, DataSave, ImgSrc } = props;
const formRef = useRef(null); const formRef = useRef(null);
const [form] = Form.useForm(); const [form] = Form.useForm();
// 默认附件值 console.log(ImgSrc);
const defaultImg = [{
uid: '-1',
name: 'image.png',
status: 'done',
url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
}]
const [DefaultImage, setDefaultImage] = useState([] as any);
// 监听传递过来的值 // 监听传递过来的值
useEffect(() => { useEffect(() => {
if (DataSave != null) { if (DataSave != null) {
console.log(moment(DataSave.noticStartTime)) // let tim = DataSave.noticStartTime.time;
// 赋值 // 赋值
form.setFieldsValue({ form.setFieldsValue({
noticTitle:DataSave.noticTitlel, noticTitle: DataSave.noticTitlel,
noticText:DataSave.noticText, noticText: DataSave.noticText,
// noticStartTime:moment(DataSave.noticStartTime), // noticStartTime: moment(tim).format('YYYY-MM-DD'),
// noticEndTime:DataSave.noticEndTime?moment(DataSave.noticEndTime, 'YYYY-MM-DD HH:mm:ss'):'', // noticEndTime:DataSave.noticEndTime?moment(DataSave.noticEndTime, 'YYYY-MM-DD HH:mm:ss'):'',
}) });
// 图片 // 发起请求图片
setDefaultImage(defaultImg); let msg = {
type: 'tosCommunityNoticePreview',
fileName: DataSave.noticImageName,
};
RA(47, msg, module, dispatch);
} }
}, [DataSave]); }, [DataSave]);
// 图片地址
const [ImageSrc, setImageSrc] = useState([] as any);
// 监听图片状态 ImgSrc
useEffect(() => {
if (ImgSrc != null) {
let imgUrl = [
{
uid: '-1',
name: 'image.png',
status: 'done',
url: ImgSrc,
},
];
setImageSrc(imgUrl);
}
}, [ImgSrc]);
// 监听是不是提交成功 // 监听是不是提交成功
useEffect(() => { useEffect(() => {
if (Result != null) { if (Result != null) {
// 移除传递来的信息
dispatch({ dispatch({
type: `${module}/ResultRemove`, type: `${module}/ResultRemove`,
}); });
// 重新刷新页面
let page = {
noticTitlel: '',
creator: '',
pageNum: 1,
};
// 把内容存进去
SA(DetailPage(page), module, dispatch);
message.success('Released Successfully'); message.success('Released Successfully');
history.push('/CommunityManagement/CommunityAnnouncement'); history.push('/CommunityManagement/CommunityAnnouncement');
} }
}, [Result]); }, [Result]);
// 分业数据
const DetailPage = (page: any) => {
let data = {
Method: 'returnDataSaveDetail',
DefaultName: 'DataSaveDetail',
Data: page,
};
return data;
};
// 提交 // 提交
const onFinish = (values: any) => { const onFinish = (values: any) => {
console.log(values); // console.log(values);
var tmp = values; var tmp = values;
if(DataSave != null){ if (DataSave != null) {
tmp.id = DataSave.id; // 如果是修改传递的 修改ID tmp.id = DataSave.id; // 如果是修改传递的 修改ID
} }
tmp.creatorId = getCookie('id'); // 管理员 ID tmp.creatorId = getCookie('id'); // 管理员 ID
tmp.communityNum = values.community.value; tmp.communityNum = values.community.value;
tmp.noticScope = '' + values.community.index; tmp.noticScope = '' + values.community.index;
delete tmp.community; delete tmp.community;
// 文件名 // 文件名
tmp.noticImageName = values.file ? values.file[0] : null; tmp.noticImageName = values.file ? values.file[0] : null;
tmp.noticStartTime = values.noticStartTime.format('YYYY-MM-DD HH:mm:ss'); tmp.noticStartTime = values.noticStartTime.format('YYYY-MM-DD');
tmp.noticEndTime = values.noticEndTime tmp.noticEndTime = values.noticEndTime ? values.noticEndTime.format('YYYY-MM-DD') : null;
? values.noticEndTime.format('YYYY-MM-DD HH:mm:ss') // console.log(tmp);
: null;
console.log(tmp);
RA(28, tmp, module, dispatch); RA(28, tmp, module, dispatch);
}; };
...@@ -94,7 +124,9 @@ const Add = (props: any) => { ...@@ -94,7 +124,9 @@ const Add = (props: any) => {
<> <>
<Spin spinning={loading}> <Spin spinning={loading}>
<div style={{ width: '100%', padding: 20, backgroundColor: '#ffffff' }}> <div style={{ width: '100%', padding: 20, backgroundColor: '#ffffff' }}>
<TitleBack title={DataSave == null ? 'Add Announcement' : "Edit Announcement"}></TitleBack> <TitleBack
title={DataSave == null ? 'Add Announcement' : 'Edit Announcement'}
></TitleBack>
<Form <Form
ref={formRef} ref={formRef}
...@@ -105,18 +137,15 @@ const Add = (props: any) => { ...@@ -105,18 +137,15 @@ const Add = (props: any) => {
validateMessages={validateMessages} validateMessages={validateMessages}
> >
<Form.Item name={'community'} className="diyItem" label="Community" rules={Notice[0]}> <Form.Item name={'community'} className="diyItem" label="Community" rules={Notice[0]}>
<SelectCommunity checklist = {DataSave == null ? null : DataSave.communityNum.split(",")} /> <SelectCommunity
checklist={DataSave == null ? null : DataSave.communityNum.split(',')}
/>
</Form.Item> </Form.Item>
<Form.Item <Form.Item name="noticTitle" className="diyItem" label="Notice Title" rules={Notice[1]}>
name='noticTitle'
className="diyItem"
label="Notice Title"
rules={Notice[1]}
>
<Input style={{ width: 200 }} placeholder="Please input the notice title" /> <Input style={{ width: 200 }} placeholder="Please input the notice title" />
</Form.Item> </Form.Item>
<Form.Item <Form.Item
name='noticText' name="noticText"
className="diyItem" className="diyItem"
label="Notice Content" label="Notice Content"
rules={Notice[2]} rules={Notice[2]}
...@@ -134,7 +163,7 @@ const Add = (props: any) => { ...@@ -134,7 +163,7 @@ const Add = (props: any) => {
imageType: 'tosNotice', imageType: 'tosNotice',
}} }}
limitNums={1} limitNums={1}
defaultValue = { DefaultImage } defaultValue={ImageSrc}
/> />
</Form.Item> </Form.Item>
<Form.Item <Form.Item
...@@ -143,10 +172,18 @@ const Add = (props: any) => { ...@@ -143,10 +172,18 @@ const Add = (props: any) => {
label="Effective Dates" label="Effective Dates"
rules={Notice[3]} rules={Notice[3]}
> >
<DatePicker showTime placeholder="Effective Dates" disabledDate={disabledDate} /> <DatePicker
style={{ width: 200 }}
placeholder="Effective Dates"
disabledDate={disabledDate}
/>
</Form.Item> </Form.Item>
<Form.Item name="noticEndTime" className="diyItem" label="Expiration Date" rules={[]}> <Form.Item name="noticEndTime" className="diyItem" label="Expiration Date" rules={[]}>
<DatePicker showTime placeholder="Expiration Dates" disabledDate={disabledDate} /> <DatePicker
style={{ width: 200 }}
placeholder="Expiration Dates"
disabledDate={disabledDate}
/>
</Form.Item> </Form.Item>
<hr /> <hr />
<Form.Item style={{ marginBottom: 5 }} className="diyItem" label=" " colon={false}> <Form.Item style={{ marginBottom: 5 }} className="diyItem" label=" " colon={false}>
...@@ -162,9 +199,8 @@ const Add = (props: any) => { ...@@ -162,9 +199,8 @@ const Add = (props: any) => {
}; };
function map(state: any) { function map(state: any) {
// console.log(state) const { Result, DataSave, ImgSrc } = state[module];
const { Result, DataSave } = state[module];
const loading = state.loading.models.CommunityAnnouncement; const loading = state.loading.models.CommunityAnnouncement;
return { Result, loading , DataSave }; return { Result, loading, DataSave, ImgSrc };
} }
export default connect(map)(Add); export default connect(map)(Add);
src/pages/CommunityManagement/CommunityAnnouncement/CommunityAnnouncement.tsx
View file @ 516960d3
...@@ -34,14 +34,15 @@ const CommunityAnnouncement = (props: any) => { ...@@ -34,14 +34,15 @@ const CommunityAnnouncement = (props: any) => {
useEffect(() => { useEffect(() => {
dispatch({ type: module + '/returnDataSave', playload: { DataSave: null } }); dispatch({ type: module + '/returnDataSave', playload: { DataSave: null } });
dispatch({ type: module + '/returnDataSaveDetail', playload: { DataSaveDetail: null } }); dispatch({ type: module + '/returnDataSaveDetail', playload: { DataSaveDetail: null } });
dispatch({ type: module + '/returnImg', playload: { DataSaveDetail: null } });
}, [1]); }, [1]);
// 表头 // 表头
const columns = [ const columns: any = [
{ {
title: 'Community', title: 'Community',
dataIndex: 'communityNum', dataIndex: 'communityNum',
width: 400, width: 240,
ellipsis: { ellipsis: {
showTitle: false, showTitle: false,
}, },
...@@ -59,19 +60,19 @@ const CommunityAnnouncement = (props: any) => { ...@@ -59,19 +60,19 @@ const CommunityAnnouncement = (props: any) => {
dataIndex: 'noticStartTime', dataIndex: 'noticStartTime',
render: (record: any) => ( render: (record: any) => (
<Space size="middle"> <Space size="middle">
{record != null ? moment(record.noticEndTime).format('YYYY-MM-DD HH:mm:ss') : null} {record != null ? moment(record.time).format('YYYY-MM-DD') : null}
</Space> </Space>
), ),
}, },
{ {
title: 'NoticScope', title: 'NoticScope',
dataIndex: 'noticScope', dataIndex: 'noticStatus',
render: function (text: any) { render: function (text: any) {
switch (text) { switch (text) {
case 1: case 1:
return <Tag color="green">Publishing</Tag>; // 发布中 return <Tag color="green">Publishing</Tag>; // 发布中
break; break;
case 0: case 2:
return <Tag color="red">Expired</Tag>; // 已过期 return <Tag color="red">Expired</Tag>; // 已过期
break; break;
default: default:
...@@ -158,7 +159,7 @@ const CommunityAnnouncement = (props: any) => { ...@@ -158,7 +159,7 @@ const CommunityAnnouncement = (props: any) => {
// 表单提交 // 表单提交
const onFinishContract = (value: any) => { const onFinishContract = (value: any) => {
console.log(value); // console.log(value);
if (!value.communityNumList && !value.noticTitlel && !value.creator) { if (!value.communityNumList && !value.noticTitlel && !value.creator) {
message.error('Please enter one of them!'); message.error('Please enter one of them!');
} else { } else {
...@@ -202,7 +203,7 @@ const CommunityAnnouncement = (props: any) => { ...@@ -202,7 +203,7 @@ const CommunityAnnouncement = (props: any) => {
<SearchOptionsCommnity <SearchOptionsCommnity
// ubmit={extendName} // ubmit={extendName}
opname={opname} opname={opname}
type={1} type={1} // 单选还是多选 单选就直接去掉
/> />
</Form.Item> </Form.Item>
<Form.Item name="noticTitlel"> <Form.Item name="noticTitlel">
......
src/pages/CommunityManagement/CommunityAnnouncement/Detail.tsx
View file @ 516960d3
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { connect, history } from 'umi'; import { connect, history } from 'umi';
import { Button, Row, Col, Descriptions, Image, Badge ,Tag} from 'antd'; import { Button, Row, Col, Descriptions, Image, Badge, Tag, Spin } from 'antd';
import { LeftOutlined, EyeOutlined, } from '@ant-design/icons'; import { LeftOutlined, EyeOutlined } from '@ant-design/icons';
import './ann.less'; import './ann.less';
import moment from 'moment'; import moment from 'moment';
import imgs from '@/assets/logo_icon_bg.png'; import imgs from '@/assets/logo_icon_bg.png';
import { RA } from '@/utils/method';
import { getDetailCommunityList } from '@/services/tosUser';
const module = 'CommunityAnnouncement'; const module = 'CommunityAnnouncement';
const Detail = (props: any) => { const Detail = (props: any) => {
const { dispatch, loading, DataSave } = props; const { dispatch, loading, DataSave, ImgSrc } = props;
// 返回 // 返回
const goToReturn = () => { const goToReturn = () => {
history.go(-1); history.go(-1);
}; };
// 监听传递过来的值 // 监听传递过来的值
useEffect(() => { useEffect(() => {
if (DataSave == null) { if (DataSave == null) {
history.push('/CommunityManagement/CommunityAnnouncement'); history.push('/CommunityManagement/CommunityAnnouncement');
} } else {
}, [DataSave]); // 发起请求图片地址
let msg = {
// userToken: '',
// type: ans.substr(ans.lastIndexOf('.') + 1),
type: 'tosCommunityNoticePreview',
fileName: DataSave.noticImageName,
};
RA(47, msg, module, dispatch);
}
}, [DataSave]);
return ( // 图片地址
<> const [ImageSrc, setImageSrc] = useState(imgs);
{DataSave != null ?
<div className="form">
{/* 头部 */}
<h3>
<EyeOutlined />
&nbsp;Notice Details
<div className="back">
<Button onClick={goToReturn}>
<LeftOutlined /> Back
</Button>
</div>
</h3>
<hr />
{/* 内容 */}
<Row>
<Col span={12}>
<Descriptions title="Notice Info" layout="vertical" bordered>
<Descriptions.Item label="Title：" span={2}>{DataSave.noticTitlel}</Descriptions.Item>
<Descriptions.Item label="Publisher：">{DataSave.creator}</Descriptions.Item>
<Descriptions.Item label="Effective Dates：">2020-11-02 09:00:00</Descriptions.Item>
<Descriptions.Item label="Expiration Date：">2020-11-08 09:00:00</Descriptions.Item>
<Descriptions.Item label="NoticScope：" span={3}>
<Badge status="processing" text="Publishing" />
</Descriptions.Item>
<Descriptions.Item label="Effective Community：" span={3}>
<Tag color="#e10">小区1</Tag>
<Tag color="#e20">小区1</Tag>
<Tag color="#e30">小区1</Tag>
<Tag color="#e40">小区1</Tag>
<Tag color="#e50">小区1</Tag>
<Tag color="#e60">小区1</Tag>
<Tag color="#e70">小区1</Tag>
</Descriptions.Item>
<Descriptions.Item label="Notice Content：" span={3}>
<p>{DataSave.noticText}</p>
</Descriptions.Item>
</Descriptions>
</Col>
<Col span={12} style={{ textAlign: 'center' }}>
<div className='famg'>
<div>
<Image
width={200}
src={imgs}
/>
<p>Enclosure</p>
</div>
</div>
</Col>
</Row>
</div>
: ''
}
// 监听图片状态 ImgSrc
useEffect(() => {
if (ImgSrc != null) {
setImageSrc(ImgSrc);
}
}, [ImgSrc]);
// 状态返回
function hanFunStart(start: any) {
switch (start) {
case 1:
return <Badge status="success" text="Publishing" />;
// <Tag color="green">Publishing</Tag>; // 发布中
break;
case 2:
return <Badge status="error" text="Expired" />; // 已过期
break;
default:
return <Badge status="processing" text="Waiting for release" />; // 等待发布
break;
}
}
//小区返回
function CommunityLists(list: any) {
let listBack = list.split(',').map((item: any, index: any) => {
let last: number = parseInt(index % 10);
return (
<Tag color={`#${last}b0`} style={{ marginBottom: 3 }} key={index}>
{item}
</Tag>
);
});
return listBack;
}
</> return (
) <>
} {DataSave != null ? (
<div className="form">
{/* 头部 */}
<h3>
<EyeOutlined />
&nbsp;Notice Details
<div className="back">
<Button onClick={goToReturn}>
<LeftOutlined /> Back
</Button>
</div>
</h3>
<hr />
{/* 内容 */}
<Row>
<Col span={12}>
<Descriptions title="Notice Info" layout="vertical" bordered>
{/* 标题 */}
<Descriptions.Item label="Title：" span={2}>
{DataSave.noticTitlel}
</Descriptions.Item>
{/* 发布者 */}
<Descriptions.Item label="Publisher：">{DataSave.creator}</Descriptions.Item>
{/* 生效时间 */}
<Descriptions.Item label="Effective Dates：">
{moment(DataSave.noticStartTime.time).format('YYYY-MM-DD')}
</Descriptions.Item>
{/* 结束时间 */}
<Descriptions.Item label="Expiration Date：">
{DataSave.noticEndTime != null
? moment(DataSave.noticEndTime.time).format('YYYY-MM-DD')
: 'Permanent'}
</Descriptions.Item>
{/* 状态 */}
<Descriptions.Item label="NoticScope：" span={3}>
{hanFunStart(DataSave.noticStatus)}
</Descriptions.Item>
{/* 生效小区 */}
<Descriptions.Item label="Effective Community：" span={3}>
{CommunityLists(DataSave.communityNum)}
</Descriptions.Item>
{/* 内容 */}
<Descriptions.Item label="Notice Content：" span={3}>
<p>{DataSave.noticText}</p>
</Descriptions.Item>
</Descriptions>
</Col>
<Col span={12} style={{ textAlign: 'center' }}>
<div className="famg">
<div>
<Spin spinning={loading}>
<Image width={200} src={ImageSrc} />
</Spin>
<p>Enclosure</p>
</div>
</div>
</Col>
</Row>
</div>
) : (
''
)}
</>
);
};
function map(state: any) { function map(state: any) {
// console.log(state) // console.log(state);
const { DataSave } = state[module]; const { DataSave, ImgSrc } = state[module];
const loading = state.loading.models.CommunityAnnouncement; const loading = state.loading.models.CommunityAnnouncement;
return { loading, DataSave }; return { loading, DataSave, ImgSrc };
} }
export default connect(map)(Detail); export default connect(map)(Detail);
\ No newline at end of file
src/pages/CommunityManagement/FacilityBookings/css/index.less
View file @ 516960d3
...@@ -2,279 +2,316 @@ ...@@ -2,279 +2,316 @@
//基石 //基石
.base { .base {
width: 100%; width: 100%;
background-color: #ffffff; background-color: #ffffff;
padding: 34px; padding: 16px;
min-width: 1020px; margin-bottom: 15px;
} }
//头部组件 //头部组件
.box{ .box {
width: 100%; width: 100%;
height: 64px; height: 64px;
position: relative; position: relative;
} }
.item1{ .item1 {
position: absolute; position: absolute;
width: 180px; width: 180px;
text-align: center; text-align: center;
border-left: 5px solid rgba(24,144,255,1); border-left: 5px solid rgba(24, 144, 255, 1);
font-family:'Source Han Sans CN'; font-family: 'Source Han Sans CN';
font-size: 18px; font-size: 18px;
font-weight: 600; font-weight: 600;
color: #000000; color: #000000;
}
.item3 {
width: 80px;
height: 32px;
position: absolute;
right: 0;
} outline: none;
.item3{ background: none;
width:80px; cursor: pointer;
height: 32px;
position: absolute;
right: 0;
outline: none;
background:none;
cursor: pointer;
border:1px solid rgba(217,217,217,1); border: 1px solid rgba(217, 217, 217, 1);
border-radius:2px; border-radius: 2px;
} }
.box1{ .box1 {
width: 100%; width: 100%;
height: 34px; height: 34px;
position: relative; position: relative;
margin-bottom: 28px; margin-bottom: 28px;
} }
.box1item1{ .box1item1 {
position: absolute; position: absolute;
} }
.box1item2{ .box1item2 {
position: absolute; position: absolute;
left: 139px; left: 139px;
} }
.box2 {
.box2{ width: 100%;
width: 100%; height: 34px;
height: 34px; position: relative;
position: relative; margin-bottom: 28px;
margin-bottom: 28px;
} }
.box2item1{ .box2item1 {
position: absolute; position: absolute;
} }
.box2item2{ .box2item2 {
position: absolute; position: absolute;
left: 139px; left: 139px;
} }
.box2item3{ .box2item3 {
position: absolute; position: absolute;
left: 407px; left: 407px;
} }
.box2item4{ .box2item4 {
position: absolute; position: absolute;
left: 565px; left: 565px;
} }
.box2item5{ .box2item5 {
position: absolute; position: absolute;
left: 713px; left: 713px;
} }
.box2item6{ .box2item6 {
position: absolute; position: absolute;
left: 778px; left: 778px;
} }
.box3 {
.box3{ position: relative;
position: relative; margin-bottom: 28px;
margin-bottom: 28px;
} }
.box3item1{ .box3item1 {
position: absolute; position: absolute;
} }
.box3item2{ .box3item2 {
padding-left: 160px; padding-left: 160px;
} }
.box3group1{ .box3group1 {
width: 266px; width: 266px;
height: 100px; height: 100px;
} }
.box4{ .box4 {
position: relative; position: relative;
} }
.box4item1{ .box4item1 {
position: absolute; position: absolute;
} }
.box4item2{ .box4item2 {
padding-left: 160px; padding-left: 160px;
} }
.ulist{ .ulist {
float:left; float: left;
width:100%; width: 100%;
padding:0; padding: 0;
margin:0; margin: 0;
list-style-type:none; list-style-type: none;
}
.llist {
display: inline;
}
.alist {
float: left;
width: 160px;
}
.alist1 {
position: relative;
width: 100px;
height: 100px;
}
.alist2 {
float: left;
width: 326px;
margin-bottom: 20px;
z-index: 1;
} }
.llist{
display:inline;
}
.alist{
float:left;
width: 160px;
}
.alist1{
position: relative; .alist2box {
width: 100px; width: 100%;
height: 100px; height: 100%;
} position: relative;
.alist2{ }
float: left; .alist2boxitem1 {
width: 326px; position: absolute;
margin-bottom: 20px; top: -100px;
z-index: 1; left: 127px;
}
.alist2boxitem2 {
position: absolute;
top: -100px;
left: 180px;
}
.alist2boxitem3 {
position: absolute;
top: -40px;
left: 216px;
}
.alist2boxNone {
color: #ffffff;
moz-user-select: -moz-none;
-moz-user-select: none;
-o-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none;
} }
.alist2box{ .alist3 {
width: 100%; z-index: 10;
height: 100%; cursor: pointer;
position: relative; float: left;
} width: 100px;
.alist2boxitem1{ height: 100px;
position: absolute; line-height: 100px;
top: -100px; background-color: rgba(244, 244, 244, 1);
left: 127px; text-align: center;
}
.alist2boxitem2{
position: absolute;
top: -100px;
left: 180px;
}
.alist2boxitem3{
position: absolute;
top: -40px;
left: 216px;
}
.alist2boxNone{
color: #ffffff;
moz-user-select: -moz-none;
-moz-user-select: none;
-o-user-select:none;
-khtml-user-select:none;
-webkit-user-select:none;
-ms-user-select:none;
user-select:none;
}
.alist3{
z-index: 10;
cursor: pointer;
float: left;
width: 100px;
height: 100px;
line-height: 100px;
background-color: rgba(244,244,244,1);
text-align: center;
} }
// 线栏 // 线栏
.line{ .line {
width: 100%; width: 100%;
height: 1px; height: 1px;
border-top: 1px solid rgba(217,217,217,1); border-top: 1px solid rgba(217, 217, 217, 1);
margin-top: 28px; margin-top: 28px;
margin-bottom: 28px; margin-bottom: 28px;
} }
.box5{ .box5 {
position: relative; position: relative;
width: 100%; width: 100%;
height: 34px; height: 34px;
margin-bottom: 28px; margin-bottom: 28px;
} }
.box5item1{ .box5item1 {
position: absolute; position: absolute;
} }
.box5item2{ .box5item2 {
position: absolute; position: absolute;
left: 186px; left: 186px;
} }
.box6{ .box6 {
position: relative; position: relative;
line-height: 34px; line-height: 34px;
width: 100%; width: 100%;
height: 34px; height: 34px;
margin-bottom: 32px; margin-bottom: 32px;
} }
.box6item1{ .box6item1 {
position: absolute; position: absolute;
} }
.box6item2{ .box6item2 {
position: absolute; position: absolute;
left: 186px; left: 186px;
} }
.box6item3{ .box6item3 {
position: absolute; position: absolute;
left: 276px; left: 276px;
} }
.box6item4{ .box6item4 {
position: absolute; position: absolute;
left: 478px; left: 478px;
} }
.box6item5{ .box6item5 {
position: absolute; position: absolute;
left: 569px; left: 569px;
} }
.box6item6{ .box6item6 {
position: absolute; position: absolute;
left: 794px; left: 794px;
} }
.box6item7{ .box6item7 {
position: absolute; position: absolute;
left: 885px; left: 885px;
} }
.box7 {
.box7{ position: relative;
position: relative; width: 100%;
width: 100%; height: 34px;
height: 34px; margin-bottom: 28px;
margin-bottom: 28px;
} }
.box7item1{ .box7item1 {
position: absolute; position: absolute;
left: 186px; left: 186px;
} }
.box7item2{ .box7item2 {
position: absolute; position: absolute;
left: 323px; left: 323px;
} }
.box8{ .box8 {
position: relative; position: relative;
width: 100%; width: 100%;
height: 34px; height: 34px;
} }
.box8item1{ .box8item1 {
position: absolute; position: absolute;
} }
.box8item2{ .box8item2 {
position: absolute; position: absolute;
left: 346px; left: 346px;
} }
.box8item3{ .box8item3 {
position: absolute; position: absolute;
left: 462px; left: 462px;
color: rgba(217,217,217,1); color: rgba(217, 217, 217, 1);
} }
.box8item4{ .box8item4 {
position: absolute; position: absolute;
left: 502px; left: 502px;
}
// 自定义
.ant-tabs > .ant-tabs-nav,
.ant-tabs > div > .ant-tabs-nav {
margin: 0;
}
hr {
border: 0;
height: 1px;
background: #eee;
margin-bottom: 24px;
}
.ant-input-group {
display: flex;
.ant-form-item {
margin-right: 20px;
}
}
.diyspan {
display: inline-block;
margin: 0 10px;
}
.diyp {
margin-bottom: 24px;
font-size: 18px;
color: #333;
font-weight: 500;
}
.ant-input-prefix,
.ant-input-suffix {
color: #888;
} }
.ant-form-item-required,
.ant-form-item-label > label {
min-width: 100px;
text-align: right;
}
.ant-form-item-control-input-content {
display: flex;
flex-wrap: wrap;
}
src/utils/tip.ts
View file @ 516960d3
...@@ -12,7 +12,7 @@ export const tipList = [ ...@@ -12,7 +12,7 @@ export const tipList = [
// 小区提示 // 小区提示
export const village = [ export const village = [
[{ required: true, message: ' ' }], [{ required: true, message: 'Please select community' }],
[{ required: true, message: 'Please select working hours !' }], [{ required: true, message: 'Please select working hours !' }],
[{ required: true, message: 'Please enter the community administrator !' }], [{ required: true, message: 'Please enter the community administrator !' }],
[{ required: true, message: 'Please enter the phone number and email address !' }], [{ required: true, message: 'Please enter the phone number and email address !' }],
...@@ -21,8 +21,14 @@ export const village = [ ...@@ -21,8 +21,14 @@ export const village = [
//公告提示 //公告提示
export const Notice = [ export const Notice = [
[{ required: true, message: '小区' }], [{ required: true, message: 'Please select community' }],
[{ required: true, message: '标题' }], [{ required: true, message: 'Please input the notice title.' }],
[{ required: true, message: '内容' }], [{ required: true, message: 'Please input the announcement content.' }],
[{ required: true, message: '日期' }], [{ required: true, message: 'Please choose the effective time of the announcement.' }],
]; ];
// 时间
export const Time = {
hour: [1, 2],
minute: [],
};
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