Commit 8d09683c authored by cellee's avatar cellee

小区公告

Signed-off-by: cellee's avatarcellee <893264950@qq.com>
parent a2131b8a
import React from 'react'; import React from 'react';
import styles from './index.less'; import styles from './index.less';
import { LeftOutlined } from '@ant-design/icons';
import {Button } from 'antd'; import { Button } from 'antd';
import { Link, useIntl, connect, Dispatch, history } from 'umi'; import { Link, useIntl, connect, Dispatch, history } from 'umi';
import { URL } from '@/utils/method' import { URL } from '@/utils/method';
const module2="History" const module2 = 'History';
const BackButton = (props:any) => { const BackButton = (props: any) => {
const { history_url, dispatch } = props;
const { history_url, dispatch } = props
const url = props.url; const url = props.url;
const goToReturn = () => { const goToReturn = () => {
// history.back() // history.back()
URL({ pathname: history.location.pathname ,status:0}, module2, dispatch) URL({ pathname: history.location.pathname, status: 0 }, module2, dispatch);
console.log("这里的地址为") console.log('这里的地址为');
console.log(history.location.pathname) console.log(history.location.pathname);
history.go(-1) history.go(-1);
} };
const goToReturnByParam = () => { const goToReturnByParam = () => {
if (url == "none") { if (url == 'none') {
props.backFunction() props.backFunction();
} else { } else {
console.log("跳转页面" + url) console.log('跳转页面' + url);
history.push(url) history.push(url);
} }
} };
return ( return (
<> <>
{ {url != null ? (
url != null ? <Button onClick={goToReturnByParam}>Back</Button>
<Button onClick={goToReturnByParam}>Back</Button>:<Button onClick={goToReturn}>Back</Button> ) : (
} <Button onClick={goToReturn}>
<LeftOutlined />
Back
</Button>
)}
</> </>
) );
}; };
function mapStateToProps(state:any) { function mapStateToProps(state: any) {
const { history_url} = state.History; const { history_url } = state.History;
return { return {
history_url, history_url,
}; };
......
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import styles from './index.less'; import styles from './index.less';
import { Upload, Modal, Row, Col, Input, List, Card, Button, message } from 'antd';
import { Upload, Modal,Row,Col,Input,List,Card, Button,message } from 'antd'; import { PlusOutlined, PictureFilled } from '@ant-design/icons';
import { PlusOutlined,PictureFilled } from '@ant-design/icons';
function getBase64(file) { function getBase64(file) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const reader = new FileReader(); const reader = new FileReader();
reader.readAsDataURL(file); reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result); reader.onload = () => resolve(reader.result);
reader.onerror = error => reject(error); reader.onerror = (error) => reject(error);
}); });
} }
...@@ -23,58 +21,63 @@ const uploadButton = ( ...@@ -23,58 +21,63 @@ const uploadButton = (
); );
import { getUrlPicName } from '../../utils/string'; import { getUrlPicName } from '../../utils/string';
const PictureOptionsRow = (props: any) => { const PictureOptionsRow = (props: any) => {
const { value, onChange, limitNums } = props;
const {value, onChange} = props; const [fileList, setFileList] = useState([]);
const [fileList, setFileList] = useState([]) const [previewVisible, setPreviewVisible] = useState(false);
const [previewVisible, setPreviewVisible] = useState(false) const [previewImage, setPreviewImage] = useState('');
const [previewImage, setPreviewImage] = useState('') const [limitNum, setLimitNum] = useState(5);
const [limitNum,setLimitNum]=useState(5)
const handleCancel = () => setPreviewVisible(false); const handleCancel = () => setPreviewVisible(false);
useEffect(() => { useEffect(() => {
if (value!=null) { if (limitNums != null) {
var tmp = value setLimitNum(limitNums);
var result = new Array() }
var resultToInside = new Array() }, [limitNums]);
if (tmp.length > 0 && typeof (tmp[0]) != "string") {//输入输出 useEffect(() => {
if (value != null) {
var tmp = value;
var result = new Array();
var resultToInside = new Array();
if (tmp.length > 0 && typeof tmp[0] != 'string') {
//输入输出
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);
console.log("图片集最初组件"); console.log('图片集最初组件');
console.log(resultToInside); console.log(resultToInside);
onChange(resultToInside) onChange(resultToInside);
} }
} }
}, [value]) }, [value]);
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(() => {
// if (props.disabled) { // if (props.disabled) {
// if (value != null) { // if (value != null) {
...@@ -98,64 +101,61 @@ const PictureOptionsRow = (props: any) => { ...@@ -98,64 +101,61 @@ const PictureOptionsRow = (props: any) => {
// } // }
// }, [value]) // }, [value])
const handlePreview = async file => { const handlePreview = async (file) => {
if (!file.url && !file.preview) { if (!file.url && !file.preview) {
file.preview = await getBase64(file.originFileObj); file.preview = await getBase64(file.originFileObj);
} }
setPreviewImage(file.url || file.preview) setPreviewImage(file.url || file.preview);
setPreviewVisible(true) setPreviewVisible(true);
} };
const handleChange = ({ file, fileList }) => { const handleChange = ({ file, fileList }) => {
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));
var result=new Array() var result = new Array();
fileList.map((item, index) => { fileList.map((item, index) => {
result.push(item.name) result.push(item.name);
}) });
console.log("该过程图片发生改变"); console.log('该过程图片发生改变');
onChange(result) onChange(result);
} };
const beforeUpload=( file:any) => { const beforeUpload = (file: any) => {
if (file.type === 'image/png' || file.type === 'image/jpeg' || file.type === 'image/jpg') { if (file.type === 'image/png' || file.type === 'image/jpeg' || file.type === 'image/jpg') {
return true return true;
} else { } else {
message.error(`${file.name} is not a png/jpeg/jpg file`); message.error(`${file.name} is not a png/jpeg/jpg file`);
return false return false;
} }
} };
return ( return (
<div> <div>
<Upload <Upload
accept=".png,.jpg,.jpeg" accept=".png,.jpg,.jpeg"
action={props.action != null ? props.action : "/tos/image/upload"} action={props.action != null ? props.action : '/tos/image/upload'}
listType="picture-card" listType="picture-card"
data={props.data} data={props.data}
fileList={fileList} fileList={fileList}
onPreview={handlePreview} onPreview={handlePreview}
onChange={handleChange} onChange={handleChange}
disabled={props.disabled} disabled={props.disabled}
beforeUpload={beforeUpload} beforeUpload={beforeUpload}
> >
{fileList.length >= limitNum ? null : (props.disabled?null:uploadButton)} {fileList.length >= limitNum ? null : props.disabled ? null : uploadButton}
</Upload> </Upload>
<Modal <Modal
title="Preview"
footer={null}
visible={previewVisible} visible={previewVisible}
onOk={handleCancel} onOk={handleCancel}
onCancel={handleCancel} onCancel={handleCancel}
> >
<img alt="example" style={{ width: '100%' }} src={previewImage} /> <img alt="example" style={{ width: '100%' }} src={previewImage} />
</Modal> </Modal>
</div> </div>
); );
}; };
export default PictureOptionsRow; export default PictureOptionsRow;
import React from 'react'; import React from 'react';
import { Table, Tag, Space,Button,Radio,Row,Col, Input, Checkbox } from 'antd'; import { Table, Tag, Space, Button, Radio, Row, Col, Input, Checkbox } from 'antd';
import { connect } from 'dva'; import { connect } from 'dva';
import { gray } from 'chalk'; import { gray } from 'chalk';
...@@ -7,284 +7,366 @@ import { gray } from 'chalk'; ...@@ -7,284 +7,366 @@ import { gray } from 'chalk';
import { StarOutlined, StarFilled, StarTwoTone } from '@ant-design/icons'; import { StarOutlined, StarFilled, StarTwoTone } from '@ant-design/icons';
import { indexOf } from 'lodash'; import { indexOf } from 'lodash';
import { useIntl,getLocale} from 'umi'; import { useIntl, getLocale } from 'umi';
import { import { DownOutlined, UpOutlined } from '@ant-design/icons';
DownOutlined, var ArrayToPingYin = require('./ArrayToPingYin');
UpOutlined,
} from '@ant-design/icons';
var ArrayToPingYin = require('./ArrayToPingYin');
const CheckboxGroup = Checkbox.Group; const CheckboxGroup = Checkbox.Group;
const menuListNormal=["A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"] const menuListNormal = [
'A',
'B',
'C',
'D',
'E',
'F',
'G',
'H',
'I',
'J',
'K',
'L',
'M',
'N',
'O',
'P',
'Q',
'R',
'S',
'T',
'U',
'V',
'W',
'X',
'Y',
'Z',
];
function getDotText(arr) { function getDotText(arr) {
if(arr){ if (arr) {
var str = ""; var str = '';
for (var i = 0; i < arr.length; i++) { for (var i = 0; i < arr.length; i++) {
str += arr[i]+ ","; str += arr[i] + ',';
} }
if (str.length > 0) { if (str.length > 0) {
str = str.substr(0, str.length - 1); str = str.substr(0, str.length - 1);
}
return str;
} }
return str;
}
} }
class SelectOptions extends React.Component { class SelectOptions extends React.Component {
state = {};
constructor(props) {
super(props);
const { list, dispatch, checklist } = this.props;
state = { if (list == null) {
//console.error("组件错误:没有数据导入")
};
constructor(props) {
super(props);
const {list, dispatch,checklist} = this.props;
if(list==null){
//console.error("组件错误:没有数据导入")
}
if(checklist==null){
this.state = {
menuList:ArrayToPingYin.get(list),
checkedListOptions:list,
checkedList: this.props.single!=null?[]:list,
indeterminate: false,
checkAll: true,
checkNone: false,
resultList:this.props.single!=null?[]:list,
flag:false,
lastValue:null
};
}else{
console.log(checklist)
this.state = {
menuList:ArrayToPingYin.get(list),
checkedListOptions:list,
checkedList: checklist,
indeterminate: false,
checkAll: true,
checkNone: false,
resultList:checklist,
flag:false,
lastValue:null
};
}
} }
componentDidUpdate(){ if (checklist == null) {
if(this.props.show!=null){ this.state = {
if(this.props.show==this.state.flag){ menuList: ArrayToPingYin.get(list),
console.log(this.props.show) checkedListOptions: list,
if(this.props.show==false){ checkedList: this.props.single != null ? [] : list,
this.setState({componetVisible:this.state.selectoptionsOpen,flag:true}) indeterminate: false,
}else{ checkAll: true,
this.setState({componetVisible:this.state.selectoptionsPutItAway,flag:false}) checkNone: false,
} resultList: this.props.single != null ? [] : list,
console.log(this.state.componetVisible) flag: false,
} lastValue: null,
} };
} else {
console.log(checklist);
this.state = {
menuList: ArrayToPingYin.get(list),
checkedListOptions: list,
checkedList: checklist,
indeterminate: false,
checkAll: true,
checkNone: false,
resultList: checklist,
flag: false,
lastValue: null,
};
} }
componentDidMount(){ }
var name=getLocale(); componentDidUpdate() {
//console.log(name) if (this.props.show != null) {
if(name=="zh-CN"){ if (this.props.show == this.state.flag) {
this.setState({ console.log(this.props.show);
selectoptionsOpen : '展开', if (this.props.show == false) {
selectoptionsPutItAway :'收起', this.setState({ componetVisible: this.state.selectoptionsOpen, flag: true });
selectoptionsSelected : '已选', } else {
selectoptionsSelectAll : '全选', this.setState({ componetVisible: this.state.selectoptionsPutItAway, flag: false });
selectoptionsSelectNone : '全不选',
selectoptionsAll:'所有',
selectoptionsSearchCell :'搜索小区',
selectoptionsAllCell:'全部小区',
componetVisible:'收起',
})
}else{
this.setState({
selectoptionsOpen : 'Open',
selectoptionsPutItAway :'Put It Away',
selectoptionsSelected : 'Selected',
selectoptionsSelectAll : 'Select All',
selectoptionsSelectNone : 'Unselect All',
selectoptionsAll:'All',
selectoptionsSearchCell :'Search cell',
selectoptionsAllCell:'All Cell',
componetVisible:'Put It Away',
})
} }
// console.log("初始化2") console.log(this.state.componetVisible);
}; }
}
}
componentDidMount() {
var name = getLocale();
//console.log(name)
if (name == 'zh-CN') {
this.setState({
selectoptionsOpen: '展开',
selectoptionsPutItAway: '收起',
selectoptionsSelected: '已选',
selectoptionsSelectAll: '全选',
selectoptionsSelectNone: '全不选',
selectoptionsAll: '所有',
selectoptionsSearchCell: '搜索小区',
selectoptionsAllCell: '全部小区',
componetVisible: '收起',
});
} else {
this.setState({
selectoptionsOpen: 'Open',
selectoptionsPutItAway: 'Put It Away',
selectoptionsSelected: 'Selected',
selectoptionsSelectAll: 'Select All',
selectoptionsSelectNone: 'Unselect All',
selectoptionsAll: 'All',
selectoptionsSearchCell: 'Search cell',
selectoptionsAllCell: 'All Cell',
componetVisible: 'Put It Away',
});
}
// console.log("初始化2")
}
hideAndexpand = ()=> { hideAndexpand = () => {
if(this.state.componetVisible==this.state.selectoptionsOpen){ if (this.state.componetVisible == this.state.selectoptionsOpen) {
this.setState({componetVisible:this.state.selectoptionsPutItAway}) this.setState({ componetVisible: this.state.selectoptionsPutItAway });
}else{ } else {
this.setState({componetVisible:this.state.selectoptionsOpen}) this.setState({ componetVisible: this.state.selectoptionsOpen });
} }
}; };
onChangeValue = (checkedList) => { onChangeValue = (checkedList) => {
if(this.props.single!=null){ if (this.props.single != null) {
var tmp var tmp;
if(checkedList.length>1){ if (checkedList.length > 1) {
for(var i=0;i<checkedList.length;i++){ for (var i = 0; i < checkedList.length; i++) {
if(checkedList[i]!=(this.state.lastValue)[0]){ if (checkedList[i] != this.state.lastValue[0]) {
tmp=checkedList[i] tmp = checkedList[i];
} }
}
this.setState({
lastValue:[tmp],
checkedList:[tmp],
resultList:[tmp]
});
}else{
tmp=checkedList
this.setState({
lastValue:checkedList,
checkedList:checkedList,
resultList:checkedList
});
}
this.props.onSubmit(tmp[0])
}else{
let difference;
var a=this.state.resultList;
var b=this.state.checkedListOptions
let first = a.concat(b).filter(v => a.includes(v) && !b.includes(v))
a=first
b=checkedList
difference=a.concat(b.filter(v => !a.includes(v)))
this.setState({
checkedList,
indeterminate: !!difference.length && difference.length < this.props.list.length,
checkAll: difference.length === this.props.list.length,
checkNone:difference.length===0,
resultList:difference
});
this.props.onSubmit(difference)
};
} }
onCheckAllChange = e => {
this.setState({ this.setState({
checkedList:this.props.list, lastValue: [tmp],
indeterminate: false, checkedList: [tmp],
checkAll: true, resultList: [tmp],
checkNone:false,
resultList:this.props.list,
}); });
this.props.onSubmit(this.props.list) } else {
}; tmp = checkedList;
onCheckAllChangeOver = e => {
this.setState({ this.setState({
checkedList: [], lastValue: checkedList,
indeterminate:false, checkedList: checkedList,
checkAll: false, resultList: checkedList,
checkNone:true,
resultList:[],
});
this.props.onSubmit([])
};
itemSelectAll = (e)=>{
this.setState({
checkedListOptions:this.props.list,
checkedList:this.state.resultList,
}); });
} }
itemSelect = (item,e)=>{ this.props.onSubmit(tmp[0]);
var arraylist=this.props.list } else {
var array=ArrayToPingYin.get(this.props.list) let difference;
var tempAarry=new Array(); var a = this.state.resultList;
if(array){ var b = this.state.checkedListOptions;
for(var i=0;i<array.length;i++){ let first = a.concat(b).filter((v) => a.includes(v) && !b.includes(v));
if(array[i]==item){ a = first;
tempAarry.push(arraylist[i]); b = checkedList;
} difference = a.concat(b.filter((v) => !a.includes(v)));
} this.setState({
checkedList,
indeterminate: !!difference.length && difference.length < this.props.list.length,
checkAll: difference.length === this.props.list.length,
checkNone: difference.length === 0,
resultList: difference,
});
this.props.onSubmit(difference);
}
};
onCheckAllChange = (e) => {
this.setState({
checkedList: this.props.list,
indeterminate: false,
checkAll: true,
checkNone: false,
resultList: this.props.list,
});
this.props.onSubmit(this.props.list);
};
onCheckAllChangeOver = (e) => {
this.setState({
checkedList: [],
indeterminate: false,
checkAll: false,
checkNone: true,
resultList: [],
});
this.props.onSubmit([]);
};
itemSelectAll = (e) => {
this.setState({
checkedListOptions: this.props.list,
checkedList: this.state.resultList,
});
};
itemSelect = (item, e) => {
var arraylist = this.props.list;
var array = ArrayToPingYin.get(this.props.list);
var tempAarry = new Array();
if (array) {
for (var i = 0; i < array.length; i++) {
if (array[i] == item) {
tempAarry.push(arraylist[i]);
} }
this.setState({ }
checkedListOptions:tempAarry, }
checkedList:this.state.resultList, this.setState({
}); checkedListOptions: tempAarry,
}; checkedList: this.state.resultList,
});
};
getSearchValue=(item,e)=>{ getSearchValue = (item, e) => {
var list = this.props.list;
var list=this.props.list var tempAarry = new Array();
var tempAarry=new Array() for (var i = 0; i < list.length; i++) {
for(var i=0;i<list.length;i++){ if (list[i].toLowerCase().indexOf(item.toLowerCase()) != -1) {
if((list[i].toLowerCase()).indexOf(item.toLowerCase())!=-1){ tempAarry.push(list[i]);
tempAarry.push(list[i]);
}
}
this.setState({
checkedListOptions:tempAarry,
})
} }
}
this.setState({
checkedListOptions: tempAarry,
});
};
render() { render() {
return ( return (
<div style={{minWidth:800,marginBottom:16}}> <div style={{ marginBottom: 14 }}>
{ {this.state.componetVisible == this.state.selectoptionsOpen ? (
this.state.componetVisible==this.state.selectoptionsOpen? <>
<> <div style={{ width: '100%', height: 48, position: 'relative' }}>
<div style={{width:"100%",height:48, position:"relative"}}> <div style={{ position: 'absolute', left: 5, top: 5 }}>
<div style={{ position:"absolute",left:5,top:5}}>{this.state.resultList.length==0?this.state.selectoptionsSelectNone:this.state.selectoptionsSelected}{this.state.resultList.length==this.props.list.length?(this.state.selectoptionsAllCell):(null)}</div> {this.state.resultList.length == 0
<div style={{ position:"absolute",right:16,top:5,cursor:"pointer"}} onClick={()=>this.hideAndexpand()}>{this.state.componetVisible}<DownOutlined /></div> ? this.state.selectoptionsSelectNone
</div> : this.state.selectoptionsSelected}
<div style={{paddingLeft:15,paddingRight:15,paddingBottom:20}}>{this.state.resultList.length==this.props.list.length?null:getDotText(this.state.resultList)}</div> {this.state.resultList.length == this.props.list.length
</> ? this.state.selectoptionsAllCell
: : null}
<div style={{width:"100%",backgroundColor:"#eeeeee"}}> </div>
<div style={{width:"100%",height:48, position:"relative"}}> <div
<div style={{ position:"absolute",left:5,top:5}}>{this.state.resultList.length==0?this.state.selectoptionsSelectNone:this.state.selectoptionsSelected}{this.state.resultList.length==this.props.list.length?this.state.selectoptionsAllCell:null}</div> style={{ position: 'absolute', right: 16, top: 5, cursor: 'pointer' }}
<div style={{ position:"absolute",right:16,top:5,cursor:"pointer"}} onClick={()=>this.hideAndexpand()}>{this.state.componetVisible} <UpOutlined /></div> onClick={() => this.hideAndexpand()}
</div> >
<div style={{paddingLeft:15,paddingRight:15,paddingBottom:20}}>{this.state.resultList.length==this.props.list.length?null:getDotText(this.state.resultList)}</div> {this.state.componetVisible}
<div style={{width:"100%",backgroundColor:"#eeeeee",userSelect:"none"}}> <DownOutlined />
<div style={{width:"100%",height:40, position:"relative"}}> </div>
<div style={{fontSize:14,position:"absolute"}}> </div>
<a style={{marginLeft:16}} onClick={this.itemSelectAll.bind(this)}>{this.state.selectoptionsAll}</a> <div style={{ paddingLeft: 15, paddingRight: 15, paddingBottom: 20 }}>
{ {this.state.resultList.length == this.props.list.length
menuListNormal.map((item, index) => { ? null
if(this.state.menuList.indexOf(item)>-1){ : getDotText(this.state.resultList)}
return (<a key={item} style={{marginLeft:10,userSelect:"none"}} onClick={this.itemSelect.bind(this,item)}>{item}</a>) </div>
}else{ </>
return (<a key={item} style={{marginLeft:10,userSelect:"none"}} disabled>{item}</a>) ) : (
} <div style={{ width: '100%', backgroundColor: '#eeeeee' }}>
}) <div style={{ width: '100%', height: 40, position: 'relative' }}>
} <div style={{ position: 'absolute', left: 12, top: 10 }}>
</div> {this.state.resultList.length == 0
{ ? this.state.selectoptionsSelectNone
this.props.single!=null?null: : this.state.selectoptionsSelected}
<> {this.state.resultList.length == this.props.list.length
<Checkbox style={{ position:"absolute",right:130}} indeterminate={this.state.indeterminate} onChange={this.onCheckAllChange} checked={this.state.checkAll}>{this.state.selectoptionsSelectAll}</Checkbox> ? this.state.selectoptionsAllCell
<Checkbox style={{ position:"absolute",right:0}} onChange={this.onCheckAllChangeOver} checked={this.state.checkNone} >{this.state.selectoptionsSelectNone}</Checkbox> : null}
</> </div>
} <div
</div> style={{ position: 'absolute', right: 14, top: 10, cursor: 'pointer' }}
<div style={{width:"100%",paddingLeft:16,paddingRight:16}}> onClick={() => this.hideAndexpand()}
<div style={{width:"100%",backgroundColor:"#ffffff",border:"1px solid #cfcfcf",padding:5}}> >
{this.state.componetVisible} <UpOutlined />
<Input.Search placeholder={this.state.selectoptionsSearchCell} onSearch={this.getSearchValue.bind(this)} style={{width:200,margin:16}} /> </div>
<div><h1> </h1></div> </div>
<CheckboxGroup <div style={{ paddingLeft: 15, paddingRight: 15, paddingBottom: 20 }}>
options={ this.state.checkedListOptions} {this.state.resultList.length == this.props.list.length
value={this.state.checkedList} ? null
onChange={this.onChangeValue} style={{marginLeft:16}}/> : getDotText(this.state.resultList)}
<div><h1> </h1></div> </div>
</div> <div style={{ width: '100%', backgroundColor: '#eeeeee', userSelect: 'none' }}>
</div> <div style={{ width: '100%', height: 30, position: 'relative' }}>
<br/> <div style={{ fontSize: 14, position: 'absolute' }}>
</div> <a style={{ marginLeft: 16 }} onClick={this.itemSelectAll.bind(this)}>
</div> {this.state.selectoptionsAll}
} </a>
{menuListNormal.map((item, index) => {
if (this.state.menuList.indexOf(item) > -1) {
return (
<a
key={item}
style={{ marginLeft: 10, userSelect: 'none' }}
onClick={this.itemSelect.bind(this, item)}
>
{item}
</a>
);
} else {
return (
<a key={item} style={{ marginLeft: 10, userSelect: 'none' }} disabled>
{item}
</a>
);
}
})}
</div>
{this.props.single != null ? null : (
<>
<Checkbox
style={{ position: 'absolute', right: 100 }}
indeterminate={this.state.indeterminate}
onChange={this.onCheckAllChange}
checked={this.state.checkAll}
>
{this.state.selectoptionsSelectAll}
</Checkbox>
<Checkbox
style={{ position: 'absolute', right: 10 }}
onChange={this.onCheckAllChangeOver}
checked={this.state.checkNone}
>
{this.state.selectoptionsSelectNone}
</Checkbox>
</>
)}
</div>
<div style={{ width: '100%', paddingLeft: 12, paddingRight: 12 }}>
<div
style={{
width: '100%',
backgroundColor: '#ffffff',
border: '1px solid #cfcfcf',
padding: 5,
}}
>
<Input.Search
placeholder={this.state.selectoptionsSearchCell}
onSearch={this.getSearchValue.bind(this)}
style={{ width: 200, margin: '10px' }}
/>
<CheckboxGroup
options={this.state.checkedListOptions}
value={this.state.checkedList}
onChange={this.onChangeValue}
style={{ marginLeft: 10 }}
/>
<div>
<h1> </h1>
</div>
</div>
</div>
<br />
</div>
</div>
)}
</div> </div>
); );
} }
}
};
export default SelectOptions; export default SelectOptions;
\ No newline at end of file
...@@ -3,28 +3,27 @@ import { DatePicker } from 'antd'; ...@@ -3,28 +3,27 @@ import { DatePicker } from 'antd';
import { MomentToTime, TimeToMoment2 } from '@/utils/time'; import { MomentToTime, TimeToMoment2 } from '@/utils/time';
import moment from 'moment'; import moment from 'moment';
const TimeComfirm = (props: any) => {
const { value, onChange } = props;
const TimeComfirm = (props:any) => {
const { value, onChange } = props
const [val, setVal] = useState(null); const [val, setVal] = useState(null);
useEffect(() => { useEffect(() => {
if (value != null) { if (value != null) {
setVal(TimeToMoment2(value)) setVal(TimeToMoment2(value));
} }
},[value]) }, [value]);
const onsubmit = (values: any) => { const onsubmit = (values: any) => {
onChange(MomentToTime(values)) onChange(MomentToTime(values));
} };
return ( return (
<> <>
{ {val != null ? (
val != null ? <>
<><DatePicker showTime defaultValue={val} onOk={onsubmit} /></> : <DatePicker showTime defaultValue={val} onOk={onsubmit} />
<DatePicker showTime onOk={onsubmit} /> </>
} ) : (
<DatePicker showTime onOk={onsubmit} />
)}
</> </>
); );
}; };
......
...@@ -3,28 +3,31 @@ import styles from './index.less'; ...@@ -3,28 +3,31 @@ import styles from './index.less';
import BackButton from '../BackButton/BackButton'; import BackButton from '../BackButton/BackButton';
import TitleGet from '../TitleGet/TitleGet'; import TitleGet from '../TitleGet/TitleGet';
const TitleBack = (props: any) => { const TitleBack = (props: any) => {
// <TitleBack sublist={['Handle Status : '+CurDataDetail.status,'Create Time : '+CurDataDetail.time]} title={headTitle} /> // <TitleBack sublist={['Handle Status : '+CurDataDetail.status,'Create Time : '+CurDataDetail.time]} title={headTitle} />
const backData = (values: any) => { const backData = (values: any) => {
props.titleBack(values) props.titleBack(values);
} };
return ( return (
<> <>
<div className={styles.item0}><TitleGet title={props.title} /></div> <div className={styles.item0}>
{ <TitleGet title={props.title} />
props.sublist != null && props.title == "Edit Owner Infomation" </div>
? {props.sublist != null && props.title == 'Edit Owner Infomation' ? (
(props.sublist).map((item: any, index: any) => { props.sublist.map((item: any, index: any) => {
return ( return (
<div key={index} className={styles.item1}>{item}</div> <div key={index} className={styles.item1}>
) {item}
}) </div>
: );
<></> })
} ) : (
<div className={styles.item2}><BackButton backFunction={backData} url={props.url} /></div> <></>
)}
<div className={styles.item2}>
<BackButton backFunction={backData} url={props.url} />
</div>
<div className={styles.clear0}></div> <div className={styles.clear0}></div>
</> </>
); );
......
//头部组件 //头部组件
.item0{ .item0 {
float: left; float: left;
} }
.item1{ .item1 {
float: left; float: left;
margin-left: 16px; margin-left: 16px;
line-height: 34px; line-height: 34px;
} }
.item2{ .item2 {
float: right; float: right;
} }
.clear{ .clear {
clear: both; clear: both;
} }
.clear0{ .clear0 {
.clear(); .clear();
margin-bottom: 35px; margin-bottom: 30px;
} }
import React, { useState, useEffect, useRef } from 'react'; import React, { useState, useEffect, useRef } from 'react';
import { Link, useIntl, connect, Dispatch, history } from 'umi'; import { Link, useIntl, connect, Dispatch, history } from 'umi';
import {SearchOutlined} from '@ant-design/icons'; import { SearchOutlined } from '@ant-design/icons';
import { Input, Row, Col, Form, Select, Button, DatePicker } from 'antd'; import { Input, Row, Col, Form, Select, Button, DatePicker } from 'antd';
const { Option } = Select; const { Option } = Select;
...@@ -133,7 +133,7 @@ const TitleSearch = (props: any) => { ...@@ -133,7 +133,7 @@ const TitleSearch = (props: any) => {
{/* 小区列表的管理员姓名搜索 */} {/* 小区列表的管理员姓名搜索 */}
{username != null ? ( {username != null ? (
<Col key={'username_' + username[0]}> <Col key={'username_' + username[0]}>
<Form.Item name={username[0]}> <Form.Item name={username[0]} style={{ marginBottom: 15 }}>
<Input placeholder={username[1]} allowClear /> <Input placeholder={username[1]} allowClear />
</Form.Item> </Form.Item>
</Col> </Col>
...@@ -186,7 +186,7 @@ const TitleSearch = (props: any) => { ...@@ -186,7 +186,7 @@ const TitleSearch = (props: any) => {
/> />
) : null} ) : null}
<Form.Item> <Form.Item style={{ marginBottom: 5 }}>
<Button <Button
type="primary" type="primary"
htmlType="submit" htmlType="submit"
......
...@@ -2,7 +2,7 @@ import * as service from '../../services/tos'; ...@@ -2,7 +2,7 @@ import * as service from '../../services/tos';
import { message } from 'antd'; import { message } from 'antd';
import { Link, useIntl, connect, Dispatch, history } from 'umi'; import { Link, useIntl, connect, Dispatch, history } from 'umi';
import { routerRedux } from 'dva/router' import { routerRedux } from 'dva/router';
import { printf } from '@/utils/log'; import { printf } from '@/utils/log';
...@@ -12,62 +12,63 @@ export default { ...@@ -12,62 +12,63 @@ export default {
Data: null, Data: null,
Result: null, Result: null,
DataSave: null, DataSave: null,
DataSaveDetail:null, DataSaveDetail: null,
}, },
reducers: { reducers: {
returnPage(state, { Data}) { returnPage(state, { Data }) {
return { ...state, Data }; return { ...state, Data };
}, },
returnResult(state, { Result}) { returnResult(state, { Result }) {
return { ...state, Result}; return { ...state, Result };
}, },
returnDataSave(state, { DataSave }) { returnDataSave(state, { DataSave }) {
return {...state,DataSave} return { ...state, DataSave };
}, },
returnDataSaveDetail(state, { DataSaveDetail }) { returnDataSaveDetail(state, { DataSaveDetail }) {
return {...state,DataSaveDetail} return { ...state, DataSaveDetail };
}, },
}, },
effects: { effects: {
//标准请求 //标准请求
*RA({ playload }, { call, put }) { *RA({ playload }, { call, put }) {
const resp = yield call(service.RA, playload); const resp = yield call(service.RA, playload);
console.log(resp) console.log(resp);
if (resp.error_code != "0000") { if (resp.error_code != '0000') {
printf(playload, resp) printf(playload, resp);
} }
switch (playload.index) {
case 25: {
let Data = resp.data;
yield put({ type: 'returnPage', Data });
} break;
case 28: {
let Result = resp;
yield put({ type: 'returnResult', Result });
} break;
} switch (playload.index) {
case 25:
{
let Data = resp.data;
yield put({ type: 'returnPage', Data });
}
break;
case 28:
{
let Result = resp;
yield put({ type: 'returnResult', Result });
}
break;
}
},
*ResultClear({}, { put }) {
var Result = null;
yield put({ type: 'returnResult', Result });
}, },
*ResultClear({ }, { put }) { *ResultRemove({}, { put }) {
var tmp=null var tmp = null;
yield put({type: 'returnResult', tmp} ) yield put({ type: 'returnResult', tmp });
}, },
*SA({ playload }, { call, put }) { *SA({ playload }, { call, put }) {
var DataSave = playload var DataSave = playload;
yield put({type: 'returnDataSave', DataSave} ) yield put({ type: 'returnDataSave', DataSave });
}, },
}, },
}; };
...@@ -13,7 +13,7 @@ import moment from 'moment'; ...@@ -13,7 +13,7 @@ import moment from 'moment';
const { RangePicker } = TimePicker; const { RangePicker } = TimePicker;
// 接口申明 // 接口申明
interface objc { } interface objc {}
const Adds = (props: any) => { const Adds = (props: any) => {
const { Data, dispatch, loading, Result } = props; const { Data, dispatch, loading, Result } = props;
...@@ -28,7 +28,6 @@ const Adds = (props: any) => { ...@@ -28,7 +28,6 @@ const Adds = (props: any) => {
{ label: 'Offline Payment', value: '1' }, { label: 'Offline Payment', value: '1' },
]; ];
// 表单物业费提交值 // 表单物业费提交值
const [PropertyFee, setPropertyFee] = useState(['1']); const [PropertyFee, setPropertyFee] = useState(['1']);
// 楼巴上传列表 // 楼巴上传列表
...@@ -89,7 +88,7 @@ const Adds = (props: any) => { ...@@ -89,7 +88,7 @@ const Adds = (props: any) => {
time: [ time: [
moment(Data.residentialHotlineServieStartTime, 'HH:mm'), moment(Data.residentialHotlineServieStartTime, 'HH:mm'),
moment(Data.residentialHotlineServieEndTime, 'HH:mm'), moment(Data.residentialHotlineServieEndTime, 'HH:mm'),
] ],
}, },
}); });
// 上传 // 上传
...@@ -204,11 +203,11 @@ const Adds = (props: any) => { ...@@ -204,11 +203,11 @@ const Adds = (props: any) => {
const onFinish = (values: any) => { const onFinish = (values: any) => {
let { residentialZipCode, residentialAddress, residentialName } = values.des; let { residentialZipCode, residentialAddress, residentialName } = values.des;
if (residentialZipCode.length < 6) { if (residentialZipCode.length < 6) {
message.error('Please Enter 6-digit Zip Code!') message.error('Please Enter 6-digit Zip Code!');
} else { } else {
onUpDate(values) onUpDate(values);
} }
} };
// 表单提交 // 表单提交
function onUpDate(values: any) { function onUpDate(values: any) {
...@@ -218,7 +217,7 @@ const Adds = (props: any) => { ...@@ -218,7 +217,7 @@ const Adds = (props: any) => {
obj.propertyFee = PropertyFee; obj.propertyFee = PropertyFee;
// 小区信息; // 小区信息;
let { residentialZipCode, residentialAddress, residentialName } = values.des; let { residentialZipCode, residentialAddress, residentialName } = values.des;
obj.residentialZipCode = residentialZipCode; obj.residentialZipCode = `SINGAPORE${residentialZipCode}`;
obj.residentialAddress = residentialAddress; obj.residentialAddress = residentialAddress;
obj.residentialName = residentialName; obj.residentialName = residentialName;
...@@ -238,8 +237,12 @@ const Adds = (props: any) => { ...@@ -238,8 +237,12 @@ const Adds = (props: any) => {
// 小区热线 // 小区热线
// 表单结构存在数据不存在情况, 所以要多判断一次 // 表单结构存在数据不存在情况, 所以要多判断一次
if (values.help) { if (values.help) {
obj.residentialHotlineName = values.help.residentialHotlineName ? undeFi(values.help.residentialHotlineName) : values.info.tel; obj.residentialHotlineName = values.help.residentialHotlineName
obj.residentialHotline = values.help.residentialHotlineName ? undeFi(values.help.residentialHotline) : values.info.tel; ? undeFi(values.help.residentialHotlineName)
: values.info.tel;
obj.residentialHotline = values.help.residentialHotlineName
? undeFi(values.help.residentialHotline)
: values.info.tel;
// 编辑的时候 为空 判断 // 编辑的时候 为空 判断
if (values.help.time) { if (values.help.time) {
obj.residentialHotlineServieStartTime = undeFi(values.help.time[0]).format('HH:mm'); obj.residentialHotlineServieStartTime = undeFi(values.help.time[0]).format('HH:mm');
...@@ -261,7 +264,7 @@ const Adds = (props: any) => { ...@@ -261,7 +264,7 @@ const Adds = (props: any) => {
} }
// 上传 // 上传
RA(29, obj, 'CellList', dispatch); RA(29, obj, 'CellList', dispatch);
}; }
// 返回 // 返回
const goToReturn = () => { const goToReturn = () => {
...@@ -279,7 +282,7 @@ const Adds = (props: any) => { ...@@ -279,7 +282,7 @@ const Adds = (props: any) => {
<> <>
<Spin spinning={loading} tip="信息提交中..." size="large"> <Spin spinning={loading} tip="信息提交中..." size="large">
<div className="form"> <div className="form">
<h3 className='capi'> <h3 className="capi">
<EditOutlined /> <EditOutlined />
&nbsp; {Data ? 'edit' : 'establish'} community &nbsp; {Data ? 'edit' : 'establish'} community
<div className="back"> <div className="back">
...@@ -331,7 +334,7 @@ const Adds = (props: any) => { ...@@ -331,7 +334,7 @@ const Adds = (props: any) => {
</Form.Item> </Form.Item>
<Form.Item label="Working Hours" name="workingHours" rules={village[1] as any}> <Form.Item label="Working Hours" name="workingHours" rules={village[1] as any}>
<RangePicker format="HH:mm" placeholder={['Start Time','End Time']} /> <RangePicker format="HH:mm" placeholder={['Start Time', 'End Time']} />
</Form.Item> </Form.Item>
<Form.Item label="Community Telephone" name="info" rules={village[3] as any}> <Form.Item label="Community Telephone" name="info" rules={village[3] as any}>
...@@ -436,7 +439,7 @@ const Adds = (props: any) => { ...@@ -436,7 +439,7 @@ const Adds = (props: any) => {
</Form.Item> </Form.Item>
<Form.Item name={['help', 'time']} noStyle> <Form.Item name={['help', 'time']} noStyle>
<RangePicker format="HH:mm" placeholder={['Start Time','End Time']} /> <RangePicker format="HH:mm" placeholder={['Start Time', 'End Time']} />
</Form.Item> </Form.Item>
</Input.Group> </Input.Group>
</Form.Item> </Form.Item>
......
...@@ -57,8 +57,8 @@ const Detail = (props: any) => { ...@@ -57,8 +57,8 @@ const Detail = (props: any) => {
//物业费选择 //物业费选择
const plainOptions = [ const plainOptions = [
{ label: '线上缴费', value: '0', disabled: true }, { label: 'Online Payment', value: '0', disabled: true },
{ label: '线下缴费', value: '1', disabled: true }, { label: 'Offline Payment', value: '1', disabled: true },
]; ];
// 关闭提示框 // 关闭提示框
const [ModelFee, setModelFee] = useState(false); const [ModelFee, setModelFee] = useState(false);
......
...@@ -2,9 +2,9 @@ li { ...@@ -2,9 +2,9 @@ li {
list-style: none; list-style: none;
} }
.contop { .contop {
padding: 20px; padding: 16px;
background: #fff; background: #fff;
margin-bottom: 20px; margin-bottom: 15px;
} }
.listbox { .listbox {
width: 100%; width: 100%;
...@@ -148,8 +148,8 @@ img { ...@@ -148,8 +148,8 @@ img {
.capi { .capi {
text-transform: capitalize; text-transform: capitalize;
} }
.pages{ .pages {
background: #fff; background: #fff;
text-align: right; text-align: right;
padding: 10px ; padding: 10px;
} }
\ No newline at end of file
import React, { useState, useEffect,useRef } from 'react'; import React, { useState, useEffect, useRef } from 'react';
import { Input ,Tabs,message,Form, Button} from 'antd'; import { Input, Tabs, message, Form, Button, DatePicker, Spin } from 'antd';
const { TabPane } = Tabs; const { TabPane } = Tabs;
import {connect} from 'umi'; import { connect, history } from 'umi';
const layout = { import { RA } from '@/utils/method';
labelCol: { span: 2},
// wrapperCol: { span: 8 },
};
import { RA, ResultClear } 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';
...@@ -19,84 +14,133 @@ import SelectCommunity from '@/components/SelectCommunity'; ...@@ -19,84 +14,133 @@ 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 './ann.less';
import { Notice } from '@/utils/tip';
import { getCookie } from '@/utils/method';
import moment from 'moment';
const module="CommunityAnnouncement" const module = 'CommunityAnnouncement';
const Add = (props:any) => { const Add = (props: any) => {
const { dispatch, Result, loading } = props;
const { dispatch, Result } = props; const formRef = useRef(null);
const formRef = useRef(null)
useEffect(() => { useEffect(() => {
// var obj = { // var obj = {
// "noticTitle":"Garden公告", // "noticTitle":"Garden公告",
// // "communityNum":"珠江丽景小区", // // "communityNum":"珠江丽景小区",
// "noticText":"今晚晚上停水4小时", // "noticText":"今晚晚上停水4小时",
// "noticScope":"1", // "noticScope":"1",
// "noticStartTime":"2020-07-01 12:30:00", // "noticStartTime":"2020-07-01 12:30:00",
// "noticEndTime":"2020-08-01 9:30:00", // "noticEndTime":"2020-08-01 9:30:00",
// "file":["A.jpg"] // "file":["A.jpg"]
// } // }
// formRef.current.setFieldsValue(obj) // formRef.current.setFieldsValue(obj)
}, []) }, []);
useEffect(() => { useEffect(() => {
if (Result != null) { if (Result != null) {
console.log("页面结果") dispatch({
console.log(Result) type: `${module}/ResultRemove`,
if (Result.error_code == undefined) { });
console.log("服务器有问题") message.success('Released Successfully');
message.error("服务器有问题,请求失败",5) history.push('/CommunityManagement/CommunityAnnouncement');
}
if (Result.error_code == "0000") {
ResultClear(module,dispatch)
history.go(-1)
}
} }
}, [Result]) }, [Result]);
const onFinish = ((values: any) => { const onFinish = (values: any) => {
var tmp = values console.log(values);
tmp.communityNum = values.community.value var tmp = values;
tmp.noticScope= ""+values.community.index tmp.creatorId = getCookie('id');
// "communityNum":["珠江丽景小区一期","A4"], tmp.communityNum = values.community.value;
// "noticText":"今晚晚上停水4小时", tmp.noticScope = '' + values.community.index;
// "noticScope":"1", delete tmp.community;
delete tmp.community // 文件名
console.log(tmp) tmp.noticImageName = values.file ? values.file[0] : null;
RA(28,values, module, dispatch); tmp.noticStartTime = values.noticStartTime.format('YYYY-MM-DD HH:mm:ss');
}) tmp.noticEndTime = values.noticEndTime
? values.noticEndTime.format('YYYY-MM-DD HH:mm:ss')
: null;
console.log(tmp);
RA(28, tmp, module, dispatch);
};
// 设置之前时间不能选择
function disabledDate(current: any) {
return current && current <= moment().subtract(1, 'days').endOf('day');
}
return ( return (
<div style={{ width: "100%", minWidth: 1020, padding: 34, backgroundColor: "#ffffff" }}> <>
<Spin spinning={loading}>
<div style={{ width: '100%', padding: 20, backgroundColor: '#ffffff' }}>
<TitleBack title="Add Announcement"></TitleBack>
<Form
ref={formRef}
// {...layout}
name="nest-messages"
onFinish={onFinish}
validateMessages={validateMessages}
>
<Form.Item name={'community'} className="diyItem" label="Community" rules={Notice[0]}>
<SelectCommunity />
</Form.Item>
<Form.Item
name={'noticTitle'}
className="diyItem"
label="Notice Title"
rules={Notice[1]}
>
<Input style={{ width: 200 }} placeholder="Please input the notice title" />
</Form.Item>
<Form.Item
name={'noticText'}
className="diyItem"
label="Notice Content"
rules={Notice[2]}
>
<TextArea
style={{ width: 400, height: 100 }}
placeholder="Please input the announcement content"
/>
</Form.Item>
<TitleBack title="Add Announcement" ></TitleBack> <Form.Item name={'file'} className="diyItem" label=" " colon={false}>
<PictureOptionsRow
<Form ref={formRef} {...layout} name="nest-messages" onFinish={onFinish} validateMessages={validateMessages}> action="/tos/image/upload"
data={{
imageType: 'tosNotice',
<Form.Item name={"community"} label="服务小区" rules={[]}><SelectCommunity /></Form.Item> }}
<Form.Item name={"noticTitle"} label="公告标题" rules={[]}><Input style={{width: 200}} /></Form.Item> limitNums={1}
<Form.Item name={"noticText"} label="公告内容" rules={[]}><TextArea style={{width: 400,height:100}} /></Form.Item> />
</Form.Item>
<Form.Item style={{ display: 'inline-block', width: '200', marginLeft: 100 }} name={"file"}> <Form.Item
<PictureOptionsRow name="noticStartTime"
action="/tos/image/upload" className="diyItem"
data={{ label="Effective Dates"
imageType: 'tosNotice', rules={Notice[3]}
}} >
/> <DatePicker showTime placeholder="Effective Dates" disabledDate={disabledDate} />
</Form.Item> </Form.Item>
<Form.Item name={"noticStartTime"} label="生效日期" rules={[]}><TimeComfirm /></Form.Item> <Form.Item name="noticEndTime" className="diyItem" label="Expiration Date" rules={[]}>
<Form.Item name={"noticEndTime"} label="结束日期" rules={[]}><TimeComfirm /></Form.Item> <DatePicker showTime placeholder="Expiration Dates" disabledDate={disabledDate} />
<Line></Line> </Form.Item>
<Form.Item wrapperCol={{ ...layout.wrapperCol, offset: 2 }}><Button type="primary" htmlType="submit">Submit</Button></Form.Item> <hr />
</Form> <Form.Item style={{ marginBottom: 5 }} className="diyItem" label=" " colon={false}>
</div> <Button type="primary" htmlType="submit" loading={loading}>
Submit
</Button>
</Form.Item>
</Form>
</div>
</Spin>
</>
); );
}; };
function map(state:any) { function map(state: any) {
const { Result} = state[module] const { Result } = state[module];
return { Result} const loading = state.loading.models.CommunityAnnouncement;
return { Result, loading };
} }
export default connect(map)(Add); export default connect(map)(Add);
\ No newline at end of file
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { connect, history, useModel, Loading } from 'umi'; import { connect, history, useModel, Loading } from 'umi';
import { Input, Tabs, Table, Space, Button, Tooltip, Form, message } from 'antd'; import { Input, Tabs, Table, Space, Button, Tooltip, Form, message, Pagination, Tag } from 'antd';
const { TabPane } = Tabs; const { TabPane } = Tabs;
import moment from 'moment';
import { PlusOutlined, SearchOutlined, ClearOutlined } from '@ant-design/icons'; import { PlusOutlined, SearchOutlined, ClearOutlined } from '@ant-design/icons';
import ProTable from '@ant-design/pro-table'; import ProTable from '@ant-design/pro-table';
import { RA } from '@/utils/method';
// import { objectColumns } from '@/utils/string'; // import { objectColumns } from '@/utils/string';
import { timestampToTime3, timestampToTime } from '@/utils/time'; import { timestampToTime3, timestampToTime } from '@/utils/time';
import SearchOptionsCommnity from '@/components/SearchOptions/SearchOptionsCommnity'; import SearchOptionsCommnity from '@/components/SearchOptions/SearchOptionsCommnity';
...@@ -26,16 +26,14 @@ import SearchOptionsCommnity from '@/components/SearchOptions/SearchOptionsCommn ...@@ -26,16 +26,14 @@ import SearchOptionsCommnity from '@/components/SearchOptions/SearchOptionsCommn
// import { RA } from '@/utils/method'; // import { RA } from '@/utils/method';
const goToAdd = () => {
history.push('./CommunityAnnouncement/Add');
};
const module = 'CommunityAnnouncement'; const module = 'CommunityAnnouncement';
const CommunityAnnouncement = (props: any) => { const CommunityAnnouncement = (props: any) => {
const { dispatch, Data, curString, userListLoading } = props; const { dispatch, Data, curString, userListLoading } = props;
// 表头
const columns = [ const columns = [
{ {
title: 'community', title: 'Community',
dataIndex: 'communityNum', dataIndex: 'communityNum',
width: 400, width: 400,
ellipsis: { ellipsis: {
...@@ -46,49 +44,77 @@ const CommunityAnnouncement = (props: any) => { ...@@ -46,49 +44,77 @@ const CommunityAnnouncement = (props: any) => {
title: 'Title', title: 'Title',
dataIndex: 'noticTitlel', dataIndex: 'noticTitlel',
}, },
{
title: 'Publisher',
dataIndex: 'creator',
},
{ {
title: 'Publish Time', title: 'Publish Time',
dataIndex: 'noticStartTime', dataIndex: 'noticStartTime',
render: (text: any, record: any) => ( render: (record: any) => (
<Space size="middle">{text != null ? timestampToTime(text.time) : null}</Space> <Space size="middle">
{record != null ? moment(record.noticEndTime).format('YYYY-MM-DD') : null}
</Space>
), ),
}, },
{ {
title: 'noticScope', title: 'NoticScope',
dataIndex: 'noticScope', dataIndex: 'noticScope',
render: function (text: any) {
switch (text) {
case 1:
return <Tag color="green">发布中</Tag>;
break;
case 0:
return <Tag color="red">已过期</Tag>;
break;
default:
return <Tag color="cyan">等待发布</Tag>;
break;
}
},
}, },
{ {
title: 'Actions', title: 'Actions',
render: (text: any, record: any) => ( render: (text: any, record: any) => (
<Space size="middle"> <Space size="middle">
<a>Detail</a> <a
onClick={() => {
goToAdd(1);
}}
>
Detail
</a>
</Space> </Space>
), ),
}, },
]; ];
// 页面进来加载
useEffect(() => { useEffect(() => {
RA(25, { communityNum: '', noticTitlel: '', pageNum: 1 }, module, dispatch); let data = {
communityNum: '',
noticTitlel: '',
creator: '',
pageNum: 5,
};
request(data);
}, [1]); }, [1]);
// // 数据请求
const request = (data: any) => {
const RA = (index: any, values: any) => { console.log(data);
dispatch({ RA(25, data, module, dispatch);
type: 'FacilityBookings/RA',
playload: { index: index, body: values },
});
}; };
const SA = (values: any) => { //
dispatch({ type: 'FacilityBookings/SA', playload: values });
};
const QA = (values: any) => {
dispatch({ type: 'FacilityBookings/QA', playload: values });
};
const CA = () => { // 跳转到新增或编辑
dispatch({ type: 'FacilityBookings/CA', playload: null }); function goToAdd(num: any) {
}; if (num == 1) {
console.log('编辑');
}
history.push('./CommunityAnnouncement/Add');
}
const [form] = Form.useForm(); const [form] = Form.useForm();
...@@ -130,6 +156,12 @@ const CommunityAnnouncement = (props: any) => { ...@@ -130,6 +156,12 @@ const CommunityAnnouncement = (props: any) => {
communityName: value, communityName: value,
}); });
}; };
// 页面切换
const paginationHandler = (page: number, pageSize?: number) => {
dispatch({});
};
return ( return (
<> <>
<div style={{ width: '100%', padding: 20, marginBottom: 15, backgroundColor: '#ffffff' }}> <div style={{ width: '100%', padding: 20, marginBottom: 15, backgroundColor: '#ffffff' }}>
...@@ -174,42 +206,66 @@ const CommunityAnnouncement = (props: any) => { ...@@ -174,42 +206,66 @@ const CommunityAnnouncement = (props: any) => {
</Form.Item> </Form.Item>
</Form> </Form>
</div> </div>
<div style={{ width: '100%', padding: 10, backgroundColor: '#ffffff' }}> <div style={{ width: '100%', paddingLeft: 10, paddingRight: 10, backgroundColor: '#ffffff' }}>
{Data != null ? ( {Data ? (
<ProTable <div>
loading={userListLoading} <ProTable
rowKey="id" loading={userListLoading}
dataSource={Data.rows} rowKey="id"
columns={columns} dataSource={Data.rows}
pagination={false} // 隐藏默认分页 columns={columns}
search={false} pagination={false} // 隐藏默认分页
toolBarRender={() => [ search={false}
<Button key="3" type="primary" onClick={goToAdd}> toolBarRender={() => [
<PlusOutlined /> <Button
Create new Announcement key="3"
</Button>, type="primary"
]} onClick={() => {
options={{ goToAdd(0);
density: true, }}
fullScreen: true, >
reload: () => { <PlusOutlined />
// resetHandler(); Create New Announcement
}, </Button>,
setting: false, ]}
}} options={{
headerTitle="Announcement list" density: true,
/> fullScreen: true,
) : null} reload: () => {
// resetHandler();
},
setting: false,
}}
headerTitle="Announcement list"
/>
</div>
) : (
''
)}
{Data ? (
<div style={{ textAlign: 'right', padding: 10 }}>
<Pagination
current={Data.page.currentPage}
total={Data.page.totalRow}
onChange={paginationHandler}
pageSizeOptions={['15']}
// showSizeChanger={false}
pageSize={Data.page.curPageSize}
/>
</div>
) : (
''
)}
</div> </div>
</> </>
); );
}; };
function map(state: any) { function map(state: any) {
const userListLoading = state.loading.models.FacilityBookings; console.log(state);
const Data = state.FacilityBookings.NoticeList; const userListLoading = state.loading.models.CommunityAnnouncement;
const { curString } = state.FacilityBookings; const Data = state.CommunityAnnouncement.Data;
return { Data, curString, userListLoading }; return { Data, userListLoading };
} }
export default connect(map)(CommunityAnnouncement); export default connect(map)(CommunityAnnouncement);
......
.ann-title {
line-height: 45px;
}
.diyItem {
margin-bottom: 20px;
.ant-form-item-label {
label {
min-width: 120px;
text-align: right;
}
}
}
hr {
border: 0;
height: 1px;
background: #eee;
margin-bottom: 20px;
}
...@@ -18,3 +18,11 @@ export const village = [ ...@@ -18,3 +18,11 @@ export const village = [
[{ required: true, message: 'Please enter the phone number and email address !' }], [{ required: true, message: 'Please enter the phone number and email address !' }],
[{ required: true, message: 'Please input the address and name of the community !' }], [{ required: true, message: 'Please input the address and name of the community !' }],
]; ];
//公告提示
export const Notice = [
[{ required: true, message: '小区' }],
[{ required: true, message: '标题' }],
[{ required: true, message: '内容' }],
[{ required: true, message: '日期' }],
];
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