Commit 8d09683c authored by cellee's avatar cellee

小区公告

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