Skip to content

T
TOSTUMI
Commit 1421fe2b authored by cellee's avatar cellee
Browse files
Options

文字更改，小区列表上传模块重做 

Signed-off-by: cellee's avatarcellee <893264950@qq.com>
parent f7f8ea16
Hide whitespace changes
Inline Side-by-side
Showing with 315 additions and 248 deletions
src/components/GlobalHeader/AvatarDropdown.tsx
View file @ 1421fe2b
......@@ -61,7 +61,7 @@ class AvatarDropdown extends React.Component<GlobalHeaderRightProps> {
<Menu.Item key="logout">
<LogoutOutlined />
退出登录
Sign Out
</Menu.Item>
</Menu>
);
......@@ -73,16 +73,16 @@ class AvatarDropdown extends React.Component<GlobalHeaderRightProps> {
</span>
</HeaderDropdown>
) : (
<span className={`${styles.action} ${styles.account}`}>
<Spin
size="small"
style={{
marginLeft: 8,
marginRight: 8,
}}
/>
</span>
);
<span className={`${styles.action} ${styles.account}`}>
<Spin
size="small"
style={{
marginLeft: 8,
marginRight: 8,
}}
/>
</span>
);
}
}
......
src/components/SelectOptions/index.jsx
View file @ 1421fe2b
......@@ -138,15 +138,15 @@ class SelectOptions extends React.PureComponent {
});
} else {
this.setState({
selectoptionsOpen: 'Open',
selectoptionsPutItAway: 'Put It Away',
selectoptionsOpen: 'Collapse ',
selectoptionsPutItAway: 'Close ',
selectoptionsSelected: 'Selected',
selectoptionsSelectAll: 'Select All',
selectoptionsSelectNone: 'Unselect All',
selectoptionsAll: 'All',
selectoptionsSearchCell: 'Search cell',
selectoptionsAllCell: 'All Cell',
componetVisible: 'Put It Away',
selectoptionsAllCell: ' All',
componetVisible: 'Close',
});
}
// console.log("初始化2")
......
src/components/ShowOptions/index.jsx
View file @ 1421fe2b
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,197 +7,252 @@ 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 ShowOptions extends React.Component {
state = {
};
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',
})
}
};
constructor(props) {
super(props);
const {list, dispatch,defaultValue } = this.props;
if(list==null){
console.error("组件错误:没有数据导入")
}else{
// console.log("显示组件")
// console.log(list)
}
this.state = {
selectoptionsOpen : 'Open',
selectoptionsPutItAway :'Put It Away',
selectoptionsSelected : 'Selected',
selectoptionsSelectNone : 'Select None',
selectoptionsAll:'All',
selectoptionsSearchCell :'Search cell',
menuList:ArrayToPingYin.get(list),
componetVisible:'Open',
checkedListOptions:list,
checkedList: list,
indeterminate: false,
checkAll: true,
checkNone: false,
resultList:list,
};
state = {};
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',
});
}
}
constructor(props) {
super(props);
const { list, dispatch, defaultValue } = this.props;
if (list == null) {
console.error('组件错误:没有数据导入');
} else {
// console.log("显示组件")
// console.log(list)
}
this.state = {
selectoptionsOpen: 'Open',
selectoptionsPutItAway: 'Put It Away',
selectoptionsSelected: 'Selected',
selectoptionsSelectNone: 'Select None',
selectoptionsAll: 'All',
selectoptionsSearchCell: 'Search cell',
hideAndexpand = ()=> {
if(this.state.componetVisible==this.state.selectoptionsOpen){
this.setState({componetVisible:this.state.selectoptionsPutItAway})
}else{
this.setState({componetVisible:this.state.selectoptionsOpen})
}
menuList: ArrayToPingYin.get(list),
componetVisible: 'Open',
checkedListOptions: list,
checkedList: list,
indeterminate: false,
checkAll: true,
checkNone: false,
resultList: list,
};
}
hideAndexpand = () => {
if (this.state.componetVisible == this.state.selectoptionsOpen) {
this.setState({ componetVisible: this.state.selectoptionsPutItAway });
} else {
this.setState({ componetVisible: this.state.selectoptionsOpen });
}
};
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]);
}
}
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: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,
checkedList: tempAarry,
});
};
this.setState({ checkedList: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({ checkedList: 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.selectoptionsSelected} ...</div>
<div style={{ position:"absolute",right:16,top:5,cursor:"pointer"}} onClick={()=>this.hideAndexpand()}>{this.state.componetVisible}<DownOutlined /></div>
</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)}</div>
<div style={{ position:"absolute",right:16,top:5,cursor:"pointer"}} onClick={()=>this.hideAndexpand()}>{this.state.componetVisible} <UpOutlined /></div>
</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>
</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>
<div style={{margin:16}}>
{(this.state.checkedList).map((tag, index) => {
return (
<Tag color="blue" key={"Tag_"+index}>{tag}</Tag>
);
})}
</div>
<div><h1> </h1></div>
</div>
</div>
<br/>
</div>
</div>
}
<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.selectoptionsSelected} ...
</div>
<div
style={{ position: 'absolute', right: 16, top: 5, cursor: 'pointer' }}
onClick={() => this.hideAndexpand()}
>
{this.state.componetVisible}
<DownOutlined />
</div>
</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}
</div>
<div
style={{ position: 'absolute', right: 16, top: 5, cursor: 'pointer' }}
onClick={() => this.hideAndexpand()}
>
{this.state.componetVisible} <UpOutlined />
</div>
</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>
</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>
<div style={{ margin: 16 }}>
{this.state.checkedList.map((tag, index) => {
return (
<Tag color="blue" key={'Tag_' + index}>
{tag}
</Tag>
);
})}
</div>
<div>
<h1> </h1>
</div>
</div>
</div>
<br />
</div>
</div>
)}
</div>
);
}
};
}
export default ShowOptions;
\ No newline at end of file
src/pages/CommunityManagement/CellList/Adds.tsx
View file @ 1421fe2b
import React, { useState, useEffect } from 'react';
import { connect } from 'dva';
import { LeftOutlined, EditOutlined, UploadOutlined, LinkOutlined } from '@ant-design/icons';
import {
LeftOutlined,
EditOutlined,
UploadOutlined,
LinkOutlined,
PlusOutlined,
} from '@ant-design/icons';
import { Form, Input, Button, TimePicker, Checkbox, Upload, message, Spin } from 'antd';
// 样式
import './celllist.less';
......@@ -10,6 +16,7 @@ import { village } from '@/utils/tip';
import moment from 'moment';
import { getNumber } from '@/utils/string'; // 正则
import imgs from '@/assets/logo_icon_bg.png';
const { RangePicker } = TimePicker;
......@@ -90,11 +97,11 @@ const Adds = (props: any) => {
}, [Data]);
// 返回上传格式 和 地址
function backUpload(str: string, index: number) {
function backUpload(str: string, index: number, url?: any) {
let a = {
uid: str + index,
name: str,
url: 'http://',
url: url ? url : imgs,
};
return a;
}
......@@ -109,63 +116,50 @@ const Adds = (props: any) => {
// 楼巴上传
const upload1 = {
onChange(info: any) {
if (codename !== '') {
let po = new Array();
po.push(info.fileList[info.fileList.length - 1]);
// 给楼巴上传列表值
console.log(po);
setLouba(po);
onChange({ file, fileList }: any) {
console.log(file);
console.log(fileList);
if (file.status === 'done') {
setLouba(fileList);
setcodeStrat(true);
setTipMain('Binding Content Already Exists, Cannot Be Modified！');
// 结果
uploadMsg(info);
} else {
message.warning('Please Fill In The Community Name');
}
// 结果
uploadMsg(file);
},
};
// 指南上传
const upload2 = {
onChange(info: any) {
if (codename !== '') {
let po = new Array();
po.push(info.fileList[info.fileList.length - 1]);
// 给楼巴上传列表值
setGuide(po);
onChange({ file, fileList }: any) {
if (file.status === 'done') {
setGuide(fileList);
setcodeStrat(true);
setTipMain('Binding Content Already Exists, Cannot Be Modified！');
// 结果
uploadMsg(info);
} else {
message.warning('Please Fill In The Community Name');
}
// 结果
uploadMsg(file);
},
};
// 保质期上传
const upload3 = {
onChange(info: any) {
if (codename !== '') {
let po = new Array();
po.push(info.fileList[info.fileList.length - 1]);
// 给楼巴上传列表值 以及禁止修改小区名
setPeriod(po);
onChange({ file, fileList }: any) {
if (file.status === 'done') {
setPeriod(fileList);
setcodeStrat(true);
setTipMain('Binding Content Already Exists, Cannot Be Modified！');
// 结果
uploadMsg(info);
} else {
message.warning('Please Fill In The Community Name');
}
// 结果
uploadMsg(file);
},
};
// 上传提示
function uploadMsg(info: any) {
if (info.file.status === 'done') {
message.success(`${info.file.name} File Uploaded Successfully`);
} else if (info.file.status === 'error') {
message.error(`${info.file.name} File Upload Failed.`);
function uploadMsg(file: any) {
if (file.status === 'done') {
message.success(`${file.name} File Uploaded Successfully`);
} else if (file.status === 'error') {
message.error(`${file.name} File Upload Failed.`);
}
}
......@@ -263,7 +257,7 @@ const Adds = (props: any) => {
};
// 小区名输入监听ant
function insdInp(value: string, prevValue, prevValues) {
function insdInp(value: string) {
setCodeName(value);
return value;
}
......@@ -278,13 +272,21 @@ const Adds = (props: any) => {
e.target.value = keyup_tool(e.target.value);
};
// 上传按钮
const uploadButton = (
<div>
<PlusOutlined />
<div style={{ marginTop: 8 }}>Upload</div>
</div>
);
return (
<>
<Spin spinning={loading} tip="loading..." size="large">
<div className="form">
<h3 className="capi">
<EditOutlined />
&nbsp; {Data ? 'edit' : 'establish'} community
&nbsp; {Data ? 'edit' : 'Create New'} community
<div className="back">
<Button onClick={goToReturn}>
<LeftOutlined />
......@@ -363,7 +365,7 @@ const Adds = (props: any) => {
</Form.Item>
<Form.Item
label="Administrators"
label="Administrator"
name="residentialManagerUserName"
rules={village[6] as any}
>
......@@ -393,54 +395,64 @@ const Adds = (props: any) => {
<hr />
{/* 上传部分 */}
<Form.Item
label="Louba Timetable"
label="Shuttle Bus Timetable"
name="balouscheduleFile"
style={{ marginBottom: '0' }}
>
<Upload {...uploads} {...upload1} fileList={loubaUpload} showUploadList={false}>
<Button icon={<UploadOutlined />}>Click to Upload</Button>
<Upload
{...uploads}
{...upload1}
fileList={loubaUpload}
listType="picture-card"
disabled={codename == '' ? true : false}
>
{loubaUpload.length >= 1 ? null : uploadButton}
</Upload>
<div className="tip">
<p className={loubaUpload.length > 0 ? 'show' : ''}>
<LinkOutlined color="#409EFF" />
{loubaUpload.length > 0 ? loubaUpload[0].name : ''}
</p>
<span>Support Files：.jpg, .png, .pdf</span>
</div>
</Form.Item>
{/* 上传部分 */}
<Form.Item label="Property Guide" name="serviceGuideFile" style={{ marginBottom: '0' }}>
<Upload {...uploads} {...upload2} fileList={guideUpload} showUploadList={false}>
<Button icon={<UploadOutlined />}>Click to Upload</Button>
<Upload
{...uploads}
{...upload2}
fileList={guideUpload}
listType="picture-card"
disabled={codename == '' ? true : false}
>
{guideUpload.length >= 1 ? null : uploadButton}
</Upload>
<div className="tip">
<p className={guideUpload.length > 0 ? 'show' : ''}>
<LinkOutlined color="#409EFF" />
{guideUpload.length > 0 ? guideUpload[0].name : ''}
</p>
<span>Support Files：.jpg, .png, .pdf</span>
</div>
</Form.Item>
{/* 上传部分 */}
<Form.Item
label="Period Of Service"
label="Warranty Period Service"
name="lifeServiceFile"
style={{ marginBottom: '0' }}
>
<Upload {...uploads} {...upload3} fileList={periodUpload} showUploadList={false}>
<Button icon={<UploadOutlined />}>Click to Upload</Button>
<Upload
{...uploads}
{...upload3}
fileList={periodUpload}
listType="picture-card"
disabled={codename == '' ? true : false}
>
{periodUpload.length >= 1 ? null : uploadButton}
</Upload>
<div className="tip">
<p className={periodUpload.length > 0 ? 'show' : ''}>
<LinkOutlined color="#409EFF" />
{periodUpload.length > 0 ? periodUpload[0].name : ''}
</p>
<span>Support Files：.jpg, .png, .pdf</span>
</div>
</Form.Item>
<hr />
{/* 帮助中心 */}
<Form.Item label="Help Center" name="help">
<Input.Group compact>
......
src/pages/CommunityManagement/CellList/CellList.tsx
View file @ 1421fe2b
......@@ -169,7 +169,7 @@ const CellLists = (props: any) => {
toolBarRender={() => [
<Button key="3" type="primary" onClick={goToAdd}>
<PlusOutlined />
Create new Community
Create New Community
</Button>,
]}
options={{
......
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