Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
T
TOSTUMI
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Maple
TOSTUMI
Commits
47d17e5f
Commit
47d17e5f
authored
Nov 09, 2020
by
cellee
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
设施新增重做
Signed-off-by:
cellee
<
893264950@qq.com
>
parent
4ac63b98
Changes
11
Show whitespace changes
Inline
Side-by-side
Showing
11 changed files
with
1198 additions
and
414 deletions
+1198
-414
Facilitys copy.tsx
src/components/Facilitys/Facilitys copy.tsx
+0
-170
Facilitys.tsx
src/components/Facilitys/Facilitys.tsx
+205
-41
FacilitysTow.tsx
src/components/Facilitys/FacilitysTow.tsx
+0
-153
OnTime.tsx
src/components/OnTime/OnTime.tsx
+11
-5
FacilityBookings.ts
src/models/CommunityManagement/FacilityBookings.ts
+9
-7
Bookings.tsx
src/pages/CommunityManagement/FacilityBookings/Bookings.tsx
+6
-4
Facility copy 2.tsx
.../CommunityManagement/FacilityBookings/Facility copy 2.tsx
+508
-0
Facility.tsx
src/pages/CommunityManagement/FacilityBookings/Facility.tsx
+31
-26
FacilityBookings copy.tsx
...nityManagement/FacilityBookings/FacilityBookings copy.tsx
+398
-0
FacilityBookings.tsx
...CommunityManagement/FacilityBookings/FacilityBookings.tsx
+25
-8
index.less
...pages/CommunityManagement/FacilityBookings/css/index.less
+5
-0
No files found.
src/components/Facilitys/Facilitys copy.tsx
deleted
100644 → 0
View file @
4ac63b98
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'react'
;
import
'./index.less'
;
import
{
Input
,
Button
,
Upload
,
Form
,
Select
,
message
,
Modal
}
from
'antd'
;
const
{
Option
}
=
Select
;
import
{
PlusOutlined
}
from
'@ant-design/icons'
;
import
{
Link
,
useIntl
,
connect
,
Dispatch
,
history
}
from
'umi'
;
import
{
event
}
from
'@/.umi/plugin-locale/locale'
;
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
);
});
}
const
Facilitys
=
(
props
:
any
)
=>
{
//传递值
const
{
updata
,
disabled
}
=
props
;
console
.
log
(
disabled
);
//上传列表
const
[
fileList
,
setFileList
]
=
useState
([]);
//显示隐藏
const
[
previewVisible
,
setpreviewVisible
]
=
useState
(
false
);
// 名称
const
[
previewTitle
,
setpreviewTitle
]
=
useState
(
''
);
// 图片地址
const
[
previewImage
,
setpreviewImage
]
=
useState
(
null
);
// 新增按钮
const
uploadButton
=
(
<
div
>
<
PlusOutlined
/>
<
div
className=
"ant-upload-text"
>
Upload
</
div
>
</
div
>
);
// 上传属性
const
uploadProps
=
{
listType
:
'picture-card'
,
accept
:
'.jpeg,.png,.jpg'
,
action
:
'/tos/image/upload'
,
// fileList: fileList,
onChange
(
info
:
any
)
{
console
.
log
(
info
);
if
(
info
.
file
.
status
===
'done'
)
{
message
.
success
(
`
${
info
.
file
.
name
}
file uploaded successfully`
);
// 拿到key 值 开始存储
let
list
=
fileList
;
// setFileList(list); // 注意 不能直接赋值 因为使用完全绑定需要全部更新
setFileList
([...
list
]);
console
.
log
(
fileList
);
}
else
if
(
info
.
file
.
status
===
'error'
)
{
message
.
error
(
`
${
info
.
file
.
name
}
file upload failed.`
);
}
},
};
// 上传
const
carryData
=
(
key
:
any
)
=>
{
console
.
log
(
`key值是
${
key
}
`
);
updata
.
identification
=
key
;
console
.
log
(
updata
);
return
updata
;
};
// 预览
const
handlePreview
=
async
(
file
)
=>
{
if
(
!
file
.
url
&&
!
file
.
preview
)
{
file
.
preview
=
await
getBase64
(
file
.
originFileObj
);
}
setpreviewImage
(
file
.
url
||
file
.
preview
);
setpreviewTitle
(
file
.
name
);
setpreviewVisible
(
true
);
};
// 点击遮罩回调
const
handleCancel
=
()
=>
{
setpreviewVisible
(
false
);
};
// 点击移除图片
const
handRemove
=
()
=>
{
setFileList
([...
fileList
]);
};
return
(
<>
<
Form
.
List
name=
"names"
rules=
{
[
{
validator
:
async
(
_
,
names
)
=>
{
// if (!names || names.length < 2)
{
// return Promise.reject(new Error('At least 2 passengers'));
//
}
},
},
]
}
>
{
(
fields
,
{
add
,
remove
},
{
errors
})
=>
(
<>
{
fields
.
map
((
field
,
index
)
=>
(
<
Form
.
Item
required=
{
false
}
key=
{
field
.
key
}
style=
{
{
marginBottom
:
0
}
}
>
{
/* 每一个上传的组件 */
}
<
div
className=
{
'test'
}
>
<
div
className=
{
'diybox'
}
>
<
Upload
fileList=
{
fileList
}
data=
{
carryData
(
index
)
}
{
...
uploadProps
}
disabled=
{
disabled
}
onPreview=
{
handlePreview
}
onRemove=
{
handRemove
}
>
{
/* 这里存在一个bug 当 key 超过 fileList 的默认值后 会报错 */
}
{
fileList
.
length
>=
1
?
null
:
uploadButton
}
</
Upload
>
<
div
className=
{
'Facility'
}
>
<
Form
.
Item
label=
{
`Facility Name ${index}`
}
name=
{
field
.
key
}
rules=
{
[{
required
:
true
,
message
:
'Please input Facility Name!'
}]
}
>
<
Input
placeholder=
"Facility Name"
disabled=
{
disabled
}
/>
</
Form
.
Item
>
<
div
className=
{
'over'
}
>
{
fields
.
length
>
1
?
(
<
Button
type=
"link"
disabled=
{
disabled
}
onClick=
{
()
=>
remove
(
field
.
name
)
}
>
Delete
</
Button
>
)
:
null
}
</
div
>
</
div
>
</
div
>
</
div
>
</
Form
.
Item
>
))
}
{
fields
.
length
<
5
?
(
<
Form
.
Item
>
<
Button
type=
"dashed"
onClick=
{
()
=>
add
()
}
style=
{
{
width
:
'100px'
,
height
:
'100px'
}
}
icon=
{
<
PlusOutlined
/>
}
disabled=
{
disabled
}
></
Button
>
<
Form
.
ErrorList
errors=
{
errors
}
/>
</
Form
.
Item
>
)
:
null
}
</>
)
}
</
Form
.
List
>
{
/* 预览表格 */
}
<
Modal
visible=
{
previewVisible
}
title=
{
previewTitle
}
footer=
{
null
}
onCancel=
{
handleCancel
}
>
<
img
alt=
"example"
style=
{
{
width
:
'100%'
}
}
src=
{
previewImage
}
/>
</
Modal
>
</>
);
};
export
default
Facilitys
;
src/components/Facilitys/Facilitys.tsx
View file @
47d17e5f
import
React
,
{
useState
}
from
'react'
;
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'react'
;
import
'./index.less'
;
import
{
Button
,
Form
,
message
,
Modal
}
from
'antd'
;
import
{
Button
,
Form
,
message
,
Modal
,
Input
,
Upload
}
from
'antd'
;
import
{
PlusOutlined
}
from
'@ant-design/icons'
;
import
FacilitysTow
from
'./FacilitysTow'
;
//
import FacilitysTow from './FacilitysTow';
import
{
Link
,
useIntl
,
connect
,
Dispatch
,
history
}
from
'umi'
;
function
getBase64
(
file
)
{
function
getBase64
(
file
:
any
)
{
return
new
Promise
((
resolve
,
reject
)
=>
{
const
reader
=
new
FileReader
();
reader
.
readAsDataURL
(
file
);
...
...
@@ -13,32 +13,195 @@ function getBase64(file) {
reader
.
onerror
=
(
error
)
=>
reject
(
error
);
});
}
const
module
=
'FacilityBookings'
;
const
Facilitys
=
(
props
:
any
)
=>
{
//传递值
const
{
updata
,
disabled
}
=
props
;
const
{
updata
,
disabled
,
FacilitysList
,
dispatch
,
dumps
}
=
props
;
//上传列表
// const [FacilitysList, setFileList] = useState(FacilitysList);
//显示隐藏
const
[
previewVisible
,
setpreviewVisible
]
=
useState
(
false
);
// 名称
const
[
previewTitle
,
setpreviewTitle
]
=
useState
(
''
);
// 图片地址
const
[
previewImage
,
setpreviewImage
]
=
useState
(
''
);
// 传递给后台加 key
const
updetaTow
=
(
key
:
any
)
=>
{
let
data
=
updata
;
data
.
identification
=
key
;
return
data
;
};
//绑定值
const
updetaList
=
(
key
:
any
)
=>
{
return
FacilitysList
[
key
].
fileList
;
};
// 预览
const
handlePreview
=
async
(
file
:
any
)
=>
{
if
(
!
file
.
url
&&
!
file
.
preview
)
{
file
.
preview
=
await
getBase64
(
file
.
originFileObj
);
}
setpreviewImage
(
file
.
url
||
file
.
preview
);
setpreviewTitle
(
file
.
name
);
setpreviewVisible
(
true
);
};
// 点击移除图片
const
handRemove
=
(
key
:
any
)
=>
{
// let list = fileList;
// 将图片信息提交给state
deleteImg
(
key
);
};
// 点击遮罩回调
const
handleCancel
=
()
=>
{
setpreviewVisible
(
false
);
};
// 上传属性
const
uploadProps
:
any
=
{
listType
:
'picture-card'
,
accept
:
'.jpeg,.png,.jpg'
,
action
:
'/tos/image/upload'
,
onChange
(
info
:
any
)
{
// console.log(info);
if
(
info
.
file
.
status
===
'done'
)
{
message
.
success
(
`
${
info
.
file
.
name
}
file uploaded successfully`
);
// 拿到key 值 开始存储
let
key
=
info
.
fileList
[
0
].
response
.
data
.
identification
;
let
list
=
FacilitysList
;
list
[
key
].
id
=
key
;
list
[
key
].
fileList
=
info
.
fileList
;
// 存储到mode里面去
dispatch
({
type
:
module
+
'/genxin'
,
list
});
// 当前页面也要刷新
// let list = fileList;
// setFileList(list); // 注意 不能直接赋值 因为使用完全绑定需要全部更新
// setFileList(list);
// let list: any = [...fileList, ...info.fileList];
// setFileList(list);
console
.
log
(
list
);
// 将图片信息提交给state
// let data = { val: info.file.name, key: keys };
// dispatch({ type: module + '/retImgsList', data });
// 结束
}
else
if
(
info
.
file
.
status
===
'error'
)
{
message
.
error
(
`
${
info
.
file
.
name
}
file upload failed.`
);
}
},
};
// 新增动作
const
add
=
()
=>
{
let
list
=
FacilitysList
;
let
adds
=
{
id
:
'-1'
,
fileList
:
[],
name
:
''
,
};
// 验证已添加的是否上传完整
let
complete
=
list
.
every
((
item
:
any
)
=>
{
// return item.fileList.length > 0 && item.name !== '';
return
item
.
fileList
.
length
>
0
;
});
if
(
list
.
length
==
0
||
complete
)
{
list
.
push
(
adds
);
// 存储到mode里面去
dispatch
({
type
:
module
+
'/genxin'
,
list
});
}
else
{
// 提示每一项都要填写完
message
.
error
(
'Please fill out each item !'
);
}
};
//删除动作
const
deleteImg
=
(
key
:
any
)
=>
{
let
list
=
FacilitysList
;
list
[
key
].
name
=
''
;
// 这里还要清除表单的值,否则再次新增输入框的值会重复出现
dumps
(
key
);
list
.
splice
(
key
,
1
);
// 存储到mode里面去
dispatch
({
type
:
module
+
'/genxin'
,
list
});
};
// 新增按钮
const
uploadButton
=
(
<
div
>
<
PlusOutlined
/>
<
div
className=
"ant-upload-text"
>
Upload
</
div
>
</
div
>
);
// 输入框内容
const
monitor
=
(
e
:
any
)
=>
{
let
list
=
FacilitysList
;
let
{
id
,
value
}
=
e
.
target
;
if
(
id
==
'basic_shebei_0'
)
{
id
=
0
;
}
list
[
id
].
name
=
value
;
dispatch
({
type
:
module
+
'/genxin'
,
list
});
};
return
(
<>
<
Form
.
List
name=
"picList"
rules=
{
[
{
validator
:
async
(
_
,
names
)
=>
{
// if (!names || names.length < 2)
{
// return Promise.reject(new Error('At least 2 passengers'));
//
}
},
},
]
}
<
Form
.
Item
name=
"picList"
required=
{
false
}
style=
{
{
marginBottom
:
0
}
}
>
{
FacilitysList
.
map
((
item
:
any
,
index
:
any
,
key
:
any
)
=>
{
return
(
<
div
className=
{
'test'
}
key=
{
'pic_'
+
index
}
>
<
div
className=
{
'diybox'
}
key=
{
'pic_'
+
index
}
>
<
Upload
{
...
uploadProps
}
fileList=
{
FacilitysList
[
index
].
fileList
.
length
>
0
?
FacilitysList
[
index
].
fileList
:
false
}
// data=
{
updata
}
data=
{
updetaTow
(
index
)
}
// 携带数据
disabled=
{
disabled
}
// 禁止
onPreview=
{
handlePreview
}
// 预览
onRemove=
{
()
=>
{
handRemove
(
index
);
}
}
//移除
>
{
(
fields
,
{
add
,
remove
},
{
errors
})
=>
(
<>
{
fields
.
map
((
field
,
index
)
=>
(
<
Form
.
Item
required=
{
false
}
key=
{
field
.
key
}
style=
{
{
marginBottom
:
0
}
}
>
<
FacilitysTow
updata=
{
updata
}
disabled=
{
disabled
}
keys=
{
field
.
key
}
></
FacilitysTow
>
{
FacilitysList
[
index
].
fileList
.
length
>
0
?
null
:
uploadButton
}
</
Upload
>
<
div
className=
{
'Facility'
}
key=
{
'pic_'
+
index
}
>
<
Form
.
Item
label=
{
`Facility Name ${index + 1}`
}
name=
{
'shebei_'
+
index
}
rules=
{
[{
required
:
true
,
message
:
'Please input Facility Name!'
}]
}
>
<
Input
placeholder=
"Facility Name"
disabled=
{
disabled
}
id=
{
index
}
onChange=
{
(
e
:
any
)
=>
monitor
(
e
)
}
value=
{
FacilitysList
[
index
].
name
}
/>
</
Form
.
Item
>
<
div
className=
{
'over'
}
>
<
Button
type=
"link"
disabled=
{
disabled
}
onClick=
{
()
=>
deleteImg
(
index
)
}
>
Delete
</
Button
>
</
div
>
</
div
>
</
div
>
</
div
>
);
})
}
</
Form
.
Item
>
))
}
{
fields
.
length
<
5
?
(
<
Form
.
Item
>
<
Button
type=
"dashed"
...
...
@@ -47,20 +210,21 @@ const Facilitys = (props: any) => {
icon=
{
<
PlusOutlined
/>
}
disabled=
{
disabled
}
></
Button
>
<
Form
.
ErrorList
errors=
{
errors
}
/>
</
Form
.
Item
>
)
:
null
}
</>
)
}
</
Form
.
List
>
{
/* 预览表格 */
}
<
Modal
visible=
{
previewVisible
}
title=
{
previewTitle
}
footer=
{
null
}
onCancel=
{
handleCancel
}
>
<
img
alt=
"example"
style=
{
{
width
:
'100%'
}
}
src=
{
previewImage
}
/>
</
Modal
>
</>
);
};
function
mapStateToProps
(
state
:
any
)
{
const
{
imgList
}
=
state
.
FacilityBookings
;
const
{
FacilitysList
}
=
state
.
FacilityBookings
;
console
.
log
(
FacilitysList
);
return
{
img
List
,
Facilitys
List
,
};
}
export
default
connect
(
mapStateToProps
)(
Facilitys
);
src/components/Facilitys/FacilitysTow.tsx
deleted
100644 → 0
View file @
4ac63b98
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'react'
;
import
'./index.less'
;
import
{
Input
,
Upload
,
Form
,
Select
,
message
,
Modal
}
from
'antd'
;
const
{
Option
}
=
Select
;
import
{
PlusOutlined
}
from
'@ant-design/icons'
;
import
{
Link
,
useIntl
,
connect
,
Dispatch
,
history
}
from
'umi'
;
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
);
});
}
const
module
=
'FacilityBookings'
;
const
FacilitysTow
=
(
props
:
any
)
=>
{
const
{
updata
,
disabled
,
keys
,
dispatch
}
=
props
;
//上传列表
const
[
fileList
,
setFileList
]
=
useState
([]);
//显示隐藏
const
[
previewVisible
,
setpreviewVisible
]
=
useState
(
false
);
// 名称
const
[
previewTitle
,
setpreviewTitle
]
=
useState
(
''
);
// 图片地址
const
[
previewImage
,
setpreviewImage
]
=
useState
(
''
);
// 新增按钮
const
uploadButton
=
(
<
div
>
<
PlusOutlined
/>
<
div
className=
"ant-upload-text"
>
Upload
</
div
>
</
div
>
);
// 上传属性
const
uploadProps
=
{
listType
:
'picture-card'
,
accept
:
'.jpeg,.png,.jpg'
,
action
:
'/tos/image/upload'
,
// fileList: fileList,
onChange
(
info
:
any
)
{
console
.
log
(
info
);
if
(
info
.
file
.
status
===
'done'
)
{
message
.
success
(
`
${
info
.
file
.
name
}
file uploaded successfully`
);
// 拿到key 值 开始存储
// let key = info.fileList[0].response.data.identification;
// let list = fileList;
// list[key] = info.fileList;
// setFileList(list); // 注意 不能直接赋值 因为使用完全绑定需要全部更新
// setFileList(list);
let
list
:
any
=
[...
fileList
,
...
info
.
fileList
];
setFileList
(
list
);
console
.
log
(
info
);
// 将图片信息提交给state
let
data
=
{
val
:
info
.
file
.
name
,
key
:
keys
};
dispatch
({
type
:
module
+
'/retImgsList'
,
data
});
// 结束
}
else
if
(
info
.
file
.
status
===
'error'
)
{
message
.
error
(
`
${
info
.
file
.
name
}
file upload failed.`
);
}
},
};
// 预览
const
handlePreview
=
async
(
file
)
=>
{
if
(
!
file
.
url
&&
!
file
.
preview
)
{
file
.
preview
=
await
getBase64
(
file
.
originFileObj
);
}
setpreviewImage
(
file
.
url
||
file
.
preview
);
setpreviewTitle
(
file
.
name
);
setpreviewVisible
(
true
);
};
// 点击遮罩回调
const
handleCancel
=
()
=>
{
setpreviewVisible
(
false
);
};
// 点击移除图片
const
handRemove
=
()
=>
{
// let list = fileList;
setFileList
([]);
// 将图片信息提交给state
let
data
=
{
key
:
keys
};
dispatch
({
type
:
module
+
'/overImgList'
,
data
});
};
// 输入框内容
const
monitor
=
(
e
:
any
)
=>
{
let
data
=
{
val
:
e
.
target
.
value
,
key
:
keys
};
dispatch
({
type
:
module
+
'/retImgsName'
,
data
});
};
return
(
<
div
>
{}
{
/* 每一个上传的组件 */
}
<
div
className=
{
'test'
}
>
<
div
className=
{
'diybox'
}
>
<
Upload
fileList=
{
fileList
}
data=
{
updata
}
{
...
uploadProps
}
disabled=
{
disabled
}
onPreview=
{
handlePreview
}
onRemove=
{
handRemove
}
>
{
/* 这里存在一个bug 当 key 超过 fileList 的默认值后 会报错 */
}
{
fileList
.
length
>=
1
?
null
:
uploadButton
}
</
Upload
>
<
div
className=
{
'Facility'
}
>
<
Form
.
Item
label=
{
`Facility Name ${keys}`
}
name=
{
keys
.
key
}
rules=
{
[{
required
:
true
,
message
:
'Please input Facility Name!'
}]
}
>
<
Input
placeholder=
"Facility Name"
onChange=
{
monitor
}
disabled=
{
disabled
}
/>
</
Form
.
Item
>
<
div
className=
{
'over'
}
>
{
/* {fields.length > 1 ? (
<Button type="link" disabled={disabled} onClick={() => remove(field.name)}>
Delete
</Button>
) : null} */
}
</
div
>
</
div
>
</
div
>
</
div
>
{
/* 预览表格 */
}
<
Modal
visible=
{
previewVisible
}
title=
{
previewTitle
}
footer=
{
null
}
onCancel=
{
handleCancel
}
>
<
img
alt=
"example"
style=
{
{
width
:
'100%'
}
}
src=
{
previewImage
}
/>
</
Modal
>
</
div
>
);
};
function
mapProps
(
state
:
any
)
{
console
.
log
(
state
.
FacilityBookings
);
console
.
log
(
'------------------'
);
const
{
imgList
}
=
state
.
FacilityBookings
;
return
{
imgList
,
};
}
export
default
connect
(
mapProps
)(
FacilitysTow
);
src/components/OnTime/OnTime.tsx
View file @
47d17e5f
...
...
@@ -3,9 +3,11 @@ import { Select } from 'antd';
const
Option
=
Select
.
Option
;
const
OnTime
=
(
porps
:
any
)
=>
{
// placeholder 默认显示 disabled 是否禁止 openSelect 选中函数 limit 限制时间
let
{
placeholder
,
disabled
,
openSelect
,
limit
}
=
porps
;
// placeholder 默认显示 disabled 是否禁止
// openSelect 选中函数 limit 限制时间 type 类型 时开始还是结束 1 就是结束 结尾是59
let
{
placeholder
,
disabled
,
openSelect
,
limit
,
type
}
=
porps
;
console
.
log
(
limit
);
// 生成数组 -- 时间
const
createArray
=
(
num
:
any
)
=>
{
var
arr
=
[];
...
...
@@ -21,11 +23,15 @@ const OnTime = (porps: any) => {
//小时
const
hourS
=
createArray
(
24
).
map
((
item
)
=>
// 处理限制时间
// 处理限制时间
段
limit
?
(
<
Option
value=
{
item
+
':00'
}
key=
{
item
}
disabled=
{
Times
(
item
,
limit
)
}
>
{
`${item}:00`
}
</
Option
>
<
Option
value=
{
item
+
(
type
?
':59'
:
':00'
)
}
key=
{
item
}
disabled=
{
Times
(
item
,
limit
)
}
>
{
item
+
(
type
?
':59'
:
':00'
)
}
</
Option
>
)
:
(
<
Option
value=
{
item
+
':00'
}
key=
{
item
}
>
{
`${item}:00`
}
</
Option
>
<
Option
value=
{
item
+
(
type
?
':59'
:
':00'
)
}
key=
{
item
}
>
{
item
+
(
type
?
':59'
:
':00'
)
}
</
Option
>
),
);
...
...
src/models/CommunityManagement/FacilityBookings.ts
View file @
47d17e5f
...
...
@@ -29,8 +29,8 @@ export default {
// 不知道前面是干嘛的,自增公告列表
NoticeList
:
[],
imgList
:
[{},
{},
{},
{},
{}],
// 设施图片列表
resultTime
:
null
,
// 设施已预约时间段
resultTime
:
null
,
// 设施已预约时间段
FacilitysList
:
[],
// 动态新增组件
},
reducers
:
{
...
...
@@ -41,9 +41,9 @@ export default {
},
// 设施图片列表
retImgsList
(
state
,
{
data
})
{
state
.
imgList
[
data
.
key
][
'pic'
]
=
data
.
val
;
return
state
retImgsList
(
state
,
{
list
})
{
let
FacilitysList
=
list
;
return
{
...
state
,
FacilitysList
}
},
// 设施图片名称
...
...
@@ -242,8 +242,10 @@ export default {
yield
put
({
type
:
'returnResult'
,
null
}
)
},
// 更新列表
*
genxin
({
list
},
{
put
})
{
yield
put
({
type
:
'retImgsList'
,
list
}
)
}
},
...
...
src/pages/CommunityManagement/FacilityBookings/Bookings.tsx
View file @
47d17e5f
...
...
@@ -352,15 +352,17 @@ const Bookings = (props: any) => {
disabled=
{
prohibit
}
limit=
{
curString
.
categoriesOpenTime
}
openSelect=
{
startTimes
}
type=
{
0
}
/>
</
Form
.
Item
>
<
span
className=
"diyspan"
>
-
</
span
>
<
Form
.
Item
name=
"endTime"
noStyle
>
<
OnTime
placeholder=
{
'Closing Time'
}
disabled=
{
prohibit
}
limit=
{
curString
.
categoriesOpenTime
}
openSelect=
{
endTimes
}
placeholder=
{
'Closing Time'
}
// 默认值
disabled=
{
prohibit
}
// 是否禁止
limit=
{
curString
.
categoriesOpenTime
}
// 禁止时间段
openSelect=
{
endTimes
}
// 时间类型
type=
{
1
}
/>
</
Form
.
Item
>
</
Form
.
Item
>
...
...
src/pages/CommunityManagement/FacilityBookings/Facility copy 2.tsx
0 → 100644
View file @
47d17e5f
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'react'
;
import
'./css/index.less'
;
import
{
Input
,
TimePicker
,
InputNumber
,
Button
,
Space
,
Pagination
,
Tooltip
,
Upload
,
Form
,
Select
,
message
,
}
from
'antd'
;
const
{
RangePicker
}
=
TimePicker
;
const
{
Option
}
=
Select
;
import
{
PlusOutlined
,
MinusCircleOutlined
,
ClearOutlined
}
from
'@ant-design/icons'
;
import
{
Link
,
useIntl
,
connect
,
Dispatch
,
history
}
from
'umi'
;
import
{
FieldTimeOutlined
}
from
'@ant-design/icons'
;
import
PictureOptions
from
'../../../components/PictureOptions/PictureOptions'
;
import
PictureOptionsRow
from
'../../../components/PictureOptions/PictureOptionsRow'
;
import
TitleBack
from
'../../../components/TitleBack/TitleBack'
;
import
TimeSelect
from
'../../../components/TimeSelect/TimeSelect'
;
import
Line
from
'../../../components/Line/Line'
;
import
{
getNumber
}
from
'../../../utils/string'
;
import
SearchOptionsCommnity
from
'../../../components/SearchOptions/SearchOptionsCommnity'
;
import
{
NewFaci
}
from
'@/utils/tip'
;
// categoriesDetailsImageName: ["test.jpg"],
// categoriesName: ["篮球场A&test.jpg"],
// reservationQuantumTime: ["09:00-07:00"]
import
Facilitys
from
'@/components/Facilitys/Facilitys'
;
import
{
getUrlLast
,
numberToString
}
from
'../../../utils/string'
;
import
{
checkParam
,
timeForm
}
from
'@/utils/method'
;
import
{
validateMessages
}
from
'@/utils/params'
;
const
module
=
'FacilityBookings'
;
import
moment
from
'moment'
;
const
Facility
=
(
props
:
any
)
=>
{
const
{
dispatch
,
location
,
token
,
sourceData
,
DataSave
,
Result
,
imgList
,
load
}
=
props
;
const
RA
=
(
index
:
any
,
values
:
any
)
=>
{
dispatch
({
type
:
'FacilityBookings/RA'
,
playload
:
{
index
:
index
,
body
:
values
}
});
};
const
ResultClear
=
()
=>
{
dispatch
({
type
:
'FacilityBookings/ResultClear'
});
};
const
openCheck
=
true
;
const
[
Ref3
,
setRef3
]
=
useState
([]);
const
[
extend
,
setExtend
]
=
useState
(
null
);
const
[
timeExtend
,
setTimeExtend
]
=
useState
(
null
);
const
[
pictrueExtend
,
setPictrueExtend
]
=
useState
({
pic
:
null
,
pics
:
null
,
tab
:
3
});
const
[
facilityDetail
,
setFacilityDetail
]
=
useState
(
false
);
const
[
PATHNAME
,
setPATHNAME
]
=
useState
(
''
);
const
formRef
=
useRef
(
null
);
// 再监听列表
const
[
extImgList
,
setextImgList
]
=
useState
(
imgList
);
useEffect
(()
=>
{
console
.
log
(
'变化'
);
console
.
log
(
imgList
);
if
(
imgList
!=
null
)
{
setextImgList
(
imgList
);
}
},
[
imgList
]);
useEffect
(()
=>
{
if
(
Result
!=
null
)
{
console
.
log
(
'页面结果'
);
console
.
log
(
Result
);
ResultClear
();
history
.
push
(
'/CommunityManagement/FacilityBookings'
);
}
},
[
Result
]);
const
RA_S
=
()
=>
{
if
(
DataSave
!=
null
)
{
console
.
log
(
'请求的设施ID为:'
+
DataSave
.
id
);
RA
(
7
,
{
userToken
:
token
,
facilitieId
:
DataSave
.
id
,
});
}
else
{
history
.
go
(
-
1
);
}
};
useEffect
(()
=>
{
if
(
sourceData
!=
null
)
{
console
.
log
(
'【传入详情,当前数据不为空】'
);
console
.
log
(
sourceData
);
setExtend
(
sourceData
.
communityName
);
setTimeExtend
(
sourceData
.
reservationQuantumTime
);
// 中断
// setPictrueExtend({tab:null,pic:null,pics:null})
console
.
log
(
'重点检查'
);
console
.
log
(
sourceData
);
formRef
.
current
.
setFieldsValue
(
sourceData
);
}
},
[
sourceData
]);
useEffect
(()
=>
{
var
tmp
=
pictrueExtend
;
if
(
location
.
pathname
.
indexOf
(
'FacilityEdit'
)
>
-
1
)
{
setPATHNAME
(
'Edit Facility'
);
tmp
.
tab
=
1
;
setPictrueExtend
(
tmp
);
RA_S
();
}
else
if
(
location
.
pathname
.
indexOf
(
'FacilityDetail'
)
>
-
1
)
{
setFacilityDetail
(
true
);
tmp
.
tab
=
2
;
setPictrueExtend
(
tmp
);
setPATHNAME
(
'Facility Detail'
);
RA_S
();
}
else
{
tmp
.
tab
=
3
;
setPictrueExtend
(
tmp
);
setPATHNAME
(
'Add Facility'
);
}
},
[]);
// const TimeSelectRef = (values:any) => {
// setRef3(values)
// }
// 提交
const
onFinish
=
(
values
:
any
)
=>
{
var
result
=
values
;
// 过滤表单;
let
imgs
=
extImgList
.
filter
((
item
:
any
)
=>
(
Object
.
keys
(
item
).
length
==
0
?
false
:
true
));
console
.
log
(
imgs
.
length
);
// 开放时间判断
if
(
imgs
.
length
==
0
)
{
message
.
error
(
'Please upload at least one facility!'
);
}
else
if
(
!
result
.
endTime
&&
!
result
.
startTime
)
{
message
.
error
(
'Please select the opening time!'
);
}
else
{
// 先处理设施和时间
let
categoriesName
:
any
=
[];
let
reservationQuantumTime
:
any
=
[
moment
(
result
.
startTime
,
'HH:mm'
).
format
(
'HH:mm'
),
moment
(
result
.
endTime
,
'HH:mm'
).
format
(
'HH:mm'
),
];
for
(
var
i
in
imgs
)
{
if
(
imgs
[
i
].
name
&&
imgs
[
i
].
pic
)
{
categoriesName
[
i
]
=
`
${
imgs
[
i
].
name
}
&
${
imgs
[
i
].
pic
}
`
;
}
else
{
message
.
error
(
'Please fill in the name of the facility!'
);
return
;
}
}
result
.
categoriesName
=
categoriesName
;
// 设施内容
result
.
reservationQuantumTime
=
reservationQuantumTime
;
// 开放时间段
result
.
categoriesOpenTime
=
`
${
result
.
startTime
}
-
${
result
.
endTime
}
`
;
// 预约时间段 二开需要
delete
result
.
startTime
;
delete
result
.
periodType
;
delete
result
.
picList
;
console
.
log
(
reservationQuantumTime
);
console
.
log
(
result
);
RA
(
6
,
result
);
// 如果有了 开始上传
// if (categoriesName) {
// }
}
return
false
;
// if (Ref3.length!=0) {
// result.reservationQuantumTime = Ref3
// } else {
result
.
reservationQuantumTime
=
[
timeForm
(
result
.
categoriesOpenTime
,
'HH:mm'
)];
var
categoriesOpenTime
=
timeForm
(
result
.
categoriesOpenTime
,
'HH:mm'
);
result
.
categoriesOpenTime
=
categoriesOpenTime
;
// }
// console.log(timeForm(result.categoriesOpenTime,'HH:mm'))
// result.categoriesOpenTime = "09:00-20:00"
if
(
result
.
communityManagerFee
==
null
)
{
result
.
communityManagerFee
=
numberToString
(
0
);
}
else
{
result
.
communityManagerFee
=
numberToString
(
result
.
communityManagerFee
);
}
if
(
result
.
communityMargin
==
null
)
{
result
.
communityMargin
=
numberToString
(
0
);
}
else
{
result
.
communityMargin
=
numberToString
(
result
.
communityMargin
);
}
if
(
result
.
canReservationDay
<=
result
.
cancelReservationDay
||
result
.
canReservationDay
<=
result
.
nomarginCancelReservationDay
)
{
message
.
error
(
'can Reservation Day is invaild!'
,
3
);
result
.
canReservationDay
=
null
;
}
else
{
console
.
log
(
'Should be check:'
,
result
);
if
(
checkParam
(
result
))
{
//中断
if
(
pictrueExtend
.
tab
==
3
)
{
if
(
Result
==
null
)
{
console
.
log
(
'提交'
);
RA
(
6
,
result
);
}
}
else
{
result
.
id
=
DataSave
.
id
;
console
.
log
(
'编辑'
);
if
(
Result
==
null
)
{
RA
(
17
,
result
);
}
}
}
else
{
message
.
error
(
'Error,Please finish it,not empty!'
,
3
);
}
}
};
const
onFinishFailed
=
(
errorInfo
:
any
)
=>
{
console
.
log
(
'Failed:'
,
errorInfo
);
};
const
Subscribe
=
()
=>
{
history
.
push
(
getUrlLast
(
location
.
pathname
)
+
'/FacilityApply'
);
};
const
keyup_tool
=
(
value
:
any
)
=>
{
return
getNumber
(
value
.
replace
(
/
[^\d
^
\.]
+/g
,
''
));
};
const
keyup_communityManagerFee
=
(
e
:
any
)
=>
{
e
.
target
.
value
=
keyup_tool
(
e
.
target
.
value
);
formRef
.
current
.
setFieldsValue
({
communityManagerFee
:
e
.
target
.
value
});
};
const
keyup_communityMargin
=
(
e
:
any
)
=>
{
e
.
target
.
value
=
keyup_tool
(
e
.
target
.
value
);
formRef
.
current
.
setFieldsValue
({
communityMargin
:
e
.
target
.
value
});
};
const
keyup
=
(
keyname
:
any
,
e
:
any
)
=>
{
e
.
target
.
value
=
e
.
target
.
value
.
replace
(
/
[^\d
^
\.]
+/g
,
''
);
var
tmp
=
{};
tmp
[
keyname
]
=
e
.
target
.
value
;
formRef
.
current
.
setFieldsValue
(
tmp
);
};
// 监听是否选择了小区
const
[
imgOpen
,
setImgOpen
]
=
useState
(
true
);
const
[
ctyName
,
setCtyName
]
=
useState
(
null
);
// 生成数组 -- 时间
const
createArray
=
(
num
:
any
)
=>
{
var
arr
=
[];
for
(
let
i
=
1
;
i
<
num
;
i
++
)
{
if
(
i
<
10
)
{
arr
[
i
]
=
`0
${
i
}
`
;
}
else
{
arr
[
i
]
=
i
;
}
}
return
arr
;
};
const
Option
=
Select
.
Option
;
//小时
const
hourS
=
createArray
(
24
).
map
((
item
)
=>
(
<
Option
value=
{
item
+
':00'
}
key=
{
item
}
>
{
`${item}:00`
}
</
Option
>
));
// 图片列表
const
fileList
:
any
=
[];
// 表单标识
const
[
form
]
=
Form
.
useForm
();
// 选择小区名字并赋值
const
opname
=
(
value
:
any
)
=>
{
if
(
value
)
{
setImgOpen
(
false
);
// 允许图片上传
setCtyName
(
value
);
// 给小区赋值
form
.
setFieldsValue
({
communityName
:
value
,
// 给表单赋值
});
}
else
{
// 设置是否能点击上传
setImgOpen
(
true
);
}
};
return
(
<
div
className=
{
'base basediy'
}
>
{
/* 头部组件v1.2 */
}
<
TitleBack
title=
{
PATHNAME
}
url=
{
getUrlLast
(
location
.
pathname
)
+
'?Facility=true'
}
/>
<
Form
ref=
{
formRef
}
form=
{
form
}
name=
"basic"
onFinish=
{
onFinish
}
onFinishFailed=
{
onFinishFailed
}
validateMessages=
{
validateMessages
}
>
{
/* 选择小区 */
}
<
Form
.
Item
label=
"Community"
name=
"communityName"
rules=
{
NewFaci
[
0
]
}
>
<
SearchOptionsCommnity
// ubmit={extendName}
opname=
{
opname
}
/>
</
Form
.
Item
>
{
/* 设施名称 以及费用 */
}
<
Input
.
Group
>
<
Form
.
Item
label=
"Facility"
name=
"facilityName"
rules=
{
NewFaci
[
1
]
}
>
<
Input
placeholder=
"Facility Name"
/>
</
Form
.
Item
>
<
Form
.
Item
label=
"Fee($)"
name=
"communityManagerFee"
rules=
{
NewFaci
[
2
]
}
>
<
span
className=
"divIconMoney"
>
$
</
span
>
<
InputNumber
onKeyUp=
{
keyup_communityManagerFee
}
prefix=
"$"
placeholder=
"00.00"
disabled=
{
facilityDetail
}
min=
{
0
}
max=
{
999
}
step=
{
0.01
}
style=
{
{
paddingLeft
:
'12px'
,
width
:
'120px'
}
}
/>
</
Form
.
Item
>
<
Form
.
Item
label=
"Deposit"
name=
"communityMargin"
rules=
{
NewFaci
[
3
]
}
>
<
span
className=
"divIconMoney"
>
$
</
span
>
<
InputNumber
onKeyUp=
{
keyup_communityMargin
}
prefix=
"$"
placeholder=
"00.00"
disabled=
{
facilityDetail
}
min=
{
0
}
max=
{
999
}
step=
{
0.01
}
style=
{
{
paddingLeft
:
'12px'
,
width
:
'120px'
}
}
/>
</
Form
.
Item
>
</
Input
.
Group
>
<
hr
></
hr
>
{
/* 设施品类上传 */
}
<
Form
.
Item
label=
"Facility Classification"
className=
"flex required"
>
<
Facilitys
disabled=
{
imgOpen
}
updata=
{
{
// userToken: token,
imageType
:
'categoriesImageName'
,
extends
:
ctyName
,
}
}
></
Facilitys
>
</
Form
.
Item
>
{
/* 设施详情上传 */
}
<
Form
.
Item
name=
"categoriesDetailsImageName"
label=
"Facility Details"
rules=
{
NewFaci
[
4
]
}
>
<
PictureOptionsRow
over=
{
imgOpen
}
data=
{
{
userToken
:
token
,
imageType
:
'categoriesDetailsImageName'
,
extends
:
ctyName
,
}
}
/>
</
Form
.
Item
>
{
/* 时间 */
}
<
Form
.
Item
label=
"Opening Hours"
className=
"required"
>
<
Form
.
Item
name=
"startTime"
noStyle
>
<
Select
style=
{
{
width
:
140
}
}
placeholder=
"Start Time"
>
{
hourS
}
</
Select
>
</
Form
.
Item
>
<
span
className=
"diyspan"
>
-
</
span
>
<
Form
.
Item
name=
"endTime"
noStyle
>
<
Select
style=
{
{
width
:
140
}
}
placeholder=
"Closing Time"
>
{
hourS
}
</
Select
>
</
Form
.
Item
>
</
Form
.
Item
>
<
hr
></
hr
>
{
/* ------------- */
}
<
p
className=
"diyp"
>
Appointment Settings :
</
p
>
{
/* 预约设置 */
}
<
Input
.
Group
>
<
Form
.
Item
name=
"cancelReservationDay"
label=
"Early Cancellation"
rules=
{
NewFaci
[
5
]
}
>
<
Input
onKeyUp=
{
keyup
.
bind
(
this
,
'cancelReservationDay'
)
}
disabled=
{
facilityDetail
}
prefix=
"Advance"
suffix=
"Day"
style=
{
{
width
:
160
,
textAlign
:
'center'
}
}
placeholder=
"0"
/>
</
Form
.
Item
>
<
Form
.
Item
label=
"No deposit to cancel reservation"
name=
"nomarginCancelReservationDay"
rules=
{
NewFaci
[
6
]
}
>
<
Input
onKeyUp=
{
keyup
.
bind
(
this
,
'nomarginCancelReservationDay'
)
}
disabled=
{
facilityDetail
}
prefix=
"Advance"
suffix=
"Day"
style=
{
{
width
:
160
,
textAlign
:
'center'
}
}
placeholder=
"0"
/>
</
Form
.
Item
>
<
Form
.
Item
label=
"Booking"
name=
"canReservationDay"
rules=
{
NewFaci
[
7
]
}
>
<
Input
onKeyUp=
{
keyup
.
bind
(
this
,
'canReservationDay'
)
}
placeholder=
"0"
style=
{
{
width
:
160
,
textAlign
:
'center'
}
}
disabled=
{
facilityDetail
}
prefix=
"Advance"
suffix=
"Day"
/>
</
Form
.
Item
>
</
Input
.
Group
>
{
/* 设置次数 */
}
<
Input
.
Group
>
<
Form
.
Item
label=
"Appointment Cycle"
name=
"periodType"
rules=
{
NewFaci
[
8
]
}
>
<
Select
placeholder=
"Period"
allowClear
style=
{
{
width
:
120
}
}
disabled=
{
facilityDetail
}
>
<
Option
value=
"1"
>
Week
</
Option
>
<
Option
value=
"2"
>
Month
</
Option
>
<
Option
value=
"3"
>
Year
</
Option
>
</
Select
>
</
Form
.
Item
>
<
Form
.
Item
name=
"canReservationNum"
rules=
{
NewFaci
[
9
]
}
>
<
Input
onKeyUp=
{
keyup
.
bind
(
this
,
'canReservationNum'
)
}
placeholder=
"second"
style=
{
{
width
:
120
}
}
disabled=
{
facilityDetail
}
suffix=
"second"
/>
</
Form
.
Item
>
</
Input
.
Group
>
<
hr
></
hr
>
{
/* <Row gutter={32} style={{ marginTop: 28 }}>
<Col>Appointment Period</Col>
<Col><TimeSelect putSubmit={TimeSelectRef} defaultValue={timeExtend} disabled={facilityDetail}/></Col>
</Row> */
}
{
facilityDetail
?
(
<>
<
Button
type=
"primary"
onClick=
{
Subscribe
}
loading=
{
load
}
>
Subscribe
</
Button
>
</>
)
:
(
<>
<
Button
type=
"primary"
htmlType=
"submit"
loading=
{
load
}
>
Submit
</
Button
>
</>
)
}
</
Form
>
</
div
>
);
};
function
mapStateToProps
(
state
:
any
)
{
const
{
sourceData
,
DataSave
,
Result
,
imgList
}
=
state
.
FacilityBookings
;
const
{
token
}
=
state
.
login
;
const
load
=
typeof
state
.
loading
.
models
.
FacilityBookings
==
'undefined'
?
true
:
state
.
loading
.
models
.
FacilityBookings
;
return
{
DataSave
,
sourceData
,
token
,
Result
,
imgList
,
load
,
};
}
export
default
connect
(
mapStateToProps
)(
Facility
);
// ["10:00-12:00","13:00-14:00"]
// defultValue={[{ url: "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png", name: "篮球场A"},{ url: "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png", name: "篮球场B" }]}
// defultValue={[{ url: "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" }]}
// const Data = {
// canReservationDay: "5",
// canReservationNum: "6",
// cancelReservationDay: "3",
// categoriesOpenTime: "09:00-20:00",
// communityManagerFee: "18",
// communityMargin: "20",
// communityName: "A9",
// facilityName: "篮球场",
// nomarginCancelReservationDay: "4",
// periodType: "2",
// }
src/pages/CommunityManagement/FacilityBookings/Facility.tsx
View file @
47d17e5f
...
...
@@ -28,7 +28,7 @@ import TimeSelect from '../../../components/TimeSelect/TimeSelect';
import
Line
from
'../../../components/Line/Line'
;
import
{
getNumber
}
from
'../../../utils/string'
;
import
SearchOptionsCommnity
from
'
../../..
/components/SearchOptions/SearchOptionsCommnity'
;
import
SearchOptionsCommnity
from
'
@
/components/SearchOptions/SearchOptionsCommnity'
;
import
{
NewFaci
}
from
'@/utils/tip'
;
...
...
@@ -45,7 +45,9 @@ const module = 'FacilityBookings';
import
moment
from
'moment'
;
const
Facility
=
(
props
:
any
)
=>
{
const
{
dispatch
,
location
,
token
,
sourceData
,
DataSave
,
Result
,
imgList
,
load
}
=
props
;
const
{
dispatch
,
location
,
token
,
sourceData
,
DataSave
,
Result
,
load
,
FacilitysList
}
=
props
;
console
.
log
(
DataSave
);
const
RA
=
(
index
:
any
,
values
:
any
)
=>
{
dispatch
({
type
:
'FacilityBookings/RA'
,
playload
:
{
index
:
index
,
body
:
values
}
});
...
...
@@ -66,15 +68,13 @@ const Facility = (props: any) => {
const
formRef
=
useRef
(
null
);
// 再监听列表
const
[
extImgList
,
setextImgList
]
=
useState
(
imgList
);
// 页面进来 先清一遍 图片列表
useEffect
(()
=>
{
console
.
log
(
'变化'
);
console
.
log
(
imgList
);
if
(
imgList
!=
null
)
{
setextImgList
(
imgList
);
if
(
DataSave
==
null
)
{
let
list
:
any
=
[];
dispatch
({
type
:
module
+
'/genxin'
,
list
});
}
},
[
imgList
]);
},
[
1
]);
useEffect
(()
=>
{
if
(
Result
!=
null
)
{
...
...
@@ -140,8 +140,12 @@ const Facility = (props: any) => {
const
onFinish
=
(
values
:
any
)
=>
{
var
result
=
values
;
// 过滤表单;
let
imgs
=
extImgList
.
filter
((
item
:
any
)
=>
(
Object
.
keys
(
item
).
length
==
0
?
false
:
true
));
console
.
log
(
imgs
.
length
);
let
imgs
:
any
=
[];
for
(
let
i
in
FacilitysList
)
{
imgs
[
i
]
=
`
${
FacilitysList
[
i
].
fileList
[
0
].
name
}
&
${
FacilitysList
[
i
].
name
}
`
;
}
// 开放时间判断
if
(
imgs
.
length
==
0
)
{
message
.
error
(
'Please upload at least one facility!'
);
...
...
@@ -149,24 +153,15 @@ const Facility = (props: any) => {
message
.
error
(
'Please select the opening time!'
);
}
else
{
// 先处理设施和时间
let
categoriesName
:
any
=
[];
let
reservationQuantumTime
:
any
=
[
moment
(
result
.
startTime
,
'HH:mm'
).
format
(
'HH:mm'
),
moment
(
result
.
endTime
,
'HH:mm'
).
format
(
'HH:mm'
),
];
for
(
var
i
in
imgs
)
{
if
(
imgs
[
i
].
name
&&
imgs
[
i
].
pic
)
{
categoriesName
[
i
]
=
`
${
imgs
[
i
].
name
}
&
${
imgs
[
i
].
pic
}
`
;
}
else
{
message
.
error
(
'Please fill in the name of the facility!'
);
return
;
}
}
let
categoriesName
:
any
=
imgs
;
// 设施图片
result
.
categoriesName
=
categoriesName
;
// 设施内容
result
.
reservationQuantumTime
=
reservationQuantumTime
;
// 开放时间段
result
.
categoriesOpenTime
=
`
${
result
.
startTime
}
-
${
result
.
endTime
}
`
;
// 预约时间段 二开需要
delete
result
.
startTime
;
delete
result
.
periodType
;
delete
result
.
picList
;
console
.
log
(
reservationQuantumTime
);
console
.
log
(
result
);
...
...
@@ -272,7 +267,7 @@ const Facility = (props: any) => {
));
// 图片列表
const
fileList
:
any
=
[];
// 表单标识
const
[
form
]
=
Form
.
useForm
();
// 选择小区名字并赋值
...
...
@@ -288,6 +283,14 @@ const Facility = (props: any) => {
setImgOpen
(
true
);
}
};
// 子组件清除表单的 输入框值
const
dumps
=
(
key
:
any
)
=>
{
form
.
setFieldsValue
({
[
'shebei_'
+
key
]:
''
,
});
};
return
(
<
div
className=
{
'base basediy'
}
>
{
/* 头部组件v1.2 */
}
...
...
@@ -304,6 +307,7 @@ const Facility = (props: any) => {
<
Form
.
Item
label=
"Community"
name=
"communityName"
rules=
{
NewFaci
[
0
]
}
>
<
SearchOptionsCommnity
// ubmit={extendName}
defaultName=
{
DataSave
!=
null
?
DataSave
.
communityName
:
''
}
opname=
{
opname
}
/>
</
Form
.
Item
>
...
...
@@ -352,6 +356,7 @@ const Facility = (props: any) => {
imageType
:
'categoriesImageName'
,
extends
:
ctyName
,
}
}
dumps=
{
dumps
}
></
Facilitys
>
</
Form
.
Item
>
...
...
@@ -360,7 +365,7 @@ const Facility = (props: any) => {
<
PictureOptionsRow
over=
{
imgOpen
}
data=
{
{
userToken
:
token
,
//
userToken: token,
imageType
:
'categoriesDetailsImageName'
,
extends
:
ctyName
,
}
}
...
...
@@ -474,19 +479,19 @@ const Facility = (props: any) => {
};
function
mapStateToProps
(
state
:
any
)
{
const
{
sourceData
,
DataSave
,
Result
,
img
List
}
=
state
.
FacilityBookings
;
const
{
sourceData
,
DataSave
,
Result
,
Facilitys
List
}
=
state
.
FacilityBookings
;
const
{
token
}
=
state
.
login
;
const
load
=
typeof
state
.
loading
.
models
.
FacilityBookings
==
'undefined'
?
tru
e
?
fals
e
:
state
.
loading
.
models
.
FacilityBookings
;
return
{
DataSave
,
sourceData
,
token
,
Result
,
imgList
,
load
,
FacilitysList
,
};
}
export
default
connect
(
mapStateToProps
)(
Facility
);
...
...
src/pages/CommunityManagement/FacilityBookings/FacilityBookings copy.tsx
0 → 100644
View file @
47d17e5f
import
React
,
{
useState
,
useEffect
}
from
'react'
;
import
{
Input
,
Tabs
,
Pagination
,
Space
,
Button
}
from
'antd'
;
const
{
TabPane
}
=
Tabs
;
import
{
Link
,
useIntl
,
connect
,
Dispatch
,
history
}
from
'umi'
;
import
{
objectColumns
}
from
'../../../utils/string'
;
import
{
timestampToTime
}
from
'../../../utils/time'
;
import
TitleSearch
from
'../../../components/TitleSearch/TitleSearch'
;
// const managerFeeStatusDes= ["未交", "已交", "已退"]
// const marginFeeStatusDes = ["未交", "已交", "未退", "已退部分", "已退全部"]
// const statusDes = ["全部", "已申请", "已预订", "已使用", "已取消", "已完成"]
const
managerFeeStatusDes
=
[
'Not paid'
,
'Paid'
,
'Returned'
];
const
marginFeeStatusDes
=
[
'Not paid'
,
'Paid'
,
'Not Returned'
,
'Returned part'
,
'Returned all'
];
const
statusDes
=
[
'All'
,
'Applied'
,
'Reserved'
,
'Used'
,
'Cancelled'
,
'Completed'
];
import
{
getUrlLastParams
}
from
'../../../utils/string'
;
import
'./css/index.less'
;
import
ProTable
from
'@ant-design/pro-table'
;
import
{
PlusOutlined
,
ClockCircleOutlined
,
ClearOutlined
}
from
'@ant-design/icons'
;
import
moment
from
'moment'
;
const
FacilityBookings
=
(
props
:
any
)
=>
{
const
{
formatMessage
}
=
useIntl
();
const
{
dispatch
,
location
,
Data
,
Data2
,
token
,
DataSave
,
curString
,
Result
,
loading
}
=
props
;
const
RA
=
(
index
:
any
,
values
:
any
)
=>
{
console
.
log
(
values
);
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
});
};
const
[
columns
,
setColumns
]
=
useState
([]);
const
[
columns2
,
setColumns2
]
=
useState
([]);
const
goToFunction
=
()
=>
{
if
(
curString
.
tab
==
2
)
{
CA
();
// 先清空上传图片列表
dispatch
({
type
:
'FacilityBookings/overAllImgList'
});
}
else
{
// 清空之前的数据
let
Data3
=
null
;
dispatch
({
type
:
'FacilityBookings/returnPage3'
,
Data3
});
}
history
.
push
(
location
.
pathname
+
(
curString
.
tab
==
1
?
'/Booking'
:
'/Adding'
));
};
// 预约详情跳转
const
goToDetail
=
(
values
:
any
)
=>
{
SA
(
values
);
history
.
push
(
location
.
pathname
+
'/Detail'
);
};
// 列表2 点击跳转
const
makeOperator
=
(
values
:
any
,
index
:
any
)
=>
{
const
path
=
[
'/FacilityDetail'
,
'/FacilityEdit'
,
'/FacilityApply'
];
SA
(
values
);
console
.
log
(
'准备页面跳转'
);
console
.
log
(
curString
);
history
.
push
(
location
.
pathname
+
path
[
index
]);
};
useEffect
(()
=>
{
const
key
=
[
[
'Service Community'
,
'communityName'
],
[
'User Name'
,
'accountName'
],
[
'Facility Bookings'
,
'facilityTitle'
],
[
'Order Time'
,
null
,
(
text
:
any
,
record
:
any
)
=>
(
<
div
>
<
ClockCircleOutlined
style=
{
{
color
:
'#666'
}
}
/>
{
moment
(
record
.
createTime
.
time
).
format
(
'YYYY-MM-DD'
)
}
</
div
>
),
],
[
'Booking Schedule'
,
'subscribeDate'
,
(
text
:
any
)
=>
(
<
div
>
<
ClockCircleOutlined
style=
{
{
color
:
'#666'
}
}
/>
{
moment
(
text
).
format
(
'YYYY-MM-DD'
)
}
</
div
>
),
],
[
'Fee'
,
'managerFeeStatus'
,
(
text
:
any
)
=>
<
div
>
{
managerFeeStatusDes
[
text
]
}
</
div
>],
[
'Deposit'
,
'marginFeeStatus'
,
(
text
:
any
)
=>
<
div
>
{
marginFeeStatusDes
[
text
]
}
</
div
>],
[
'Status'
,
'status'
,
(
text
:
any
)
=>
<
div
>
{
statusDes
[
text
]
}
</
div
>],
[
'Actions'
,
null
,
(
text
:
any
,
record
:
any
)
=>
(
<
Space
size=
"middle"
>
{
' '
}
<
a
onClick=
{
goToDetail
.
bind
(
this
,
record
)
}
>
Detail
</
a
>
</
Space
>
),
],
];
const
key2
=
[
[
'Community'
,
'communityName'
],
[
'Facilty'
,
'facilityName'
],
[
'Open Time'
,
'categoriesOpenTime'
],
[
'Action'
,
null
,
(
text
:
any
,
record
:
any
)
=>
(
<
Space
size=
"middle"
>
<
a
onClick=
{
()
=>
makeOperator
(
record
,
0
)
}
>
Detail
</
a
>
<
a
onClick=
{
()
=>
makeOperator
(
record
,
1
)
}
>
Edit
</
a
>
<
a
onClick=
{
()
=>
makeOperator
(
record
,
2
)
}
>
Booking
</
a
>
</
Space
>
),
],
];
setColumns
(
objectColumns
(
key
));
setColumns2
(
objectColumns
(
key2
));
console
.
log
(
'页面刷新'
);
console
.
log
(
DataSave
);
console
.
log
(
curString
);
if
(
curString
.
tab
==
1
)
{
RA
(
9
,
{
userToken
:
token
,
pageNum
:
curString
.
curPage
,
subscribeDate
:
curString
.
subscribeDate
,
status
:
curString
.
status
,
communityNameList
:
curString
.
communityNameList
,
});
}
else
{
RA
(
8
,
{
userToken
:
token
,
pageNum
:
curString
.
curPage2
});
}
},
[]);
const
CallBackTitleSearch
=
(
comment
:
any
)
=>
{
console
.
log
(
comment
);
if
(
curString
.
tab
==
1
)
{
if
(
comment
.
communityName
!=
null
||
comment
.
key
!=
null
||
comment
.
status
!=
null
)
{
var
tmp
=
curString
;
tmp
.
subscribeDate
=
comment
.
key
;
if
(
comment
.
status
==
null
||
comment
.
status
==
undefined
)
{
tmp
.
status
=
0
;
}
else
{
tmp
.
status
=
comment
.
status
;
}
tmp
.
communityNameList
=
comment
.
communityName
;
tmp
.
curPage
=
1
;
QA
(
tmp
);
console
.
log
(
tmp
);
//中断
RA
(
9
,
{
userToken
:
token
,
pageNum
:
'1'
,
subscribeDate
:
tmp
.
subscribeDate
,
status
:
tmp
.
status
,
communityNameList
:
comment
.
communityName
,
});
}
}
else
{
if
(
comment
.
communityName
!=
null
||
comment
.
facilityName
!=
null
)
{
var
tmp
=
curString
;
tmp
.
communityNameList
=
comment
.
communityName
;
tmp
.
facilityName
=
comment
.
facilityName
;
tmp
.
curPage
=
1
;
QA
(
tmp
);
RA
(
8
,
{
communityNameList
:
comment
.
communityName
,
facilityName
:
comment
.
facilityName
,
pageNum
:
'1'
,
});
}
}
};
function
TabCallback
(
tab
:
any
)
{
var
tmp
=
curString
;
tmp
.
tab
=
tab
;
QA
(
tmp
);
if
(
tab
==
1
)
{
RA
(
9
,
{
userToken
:
token
,
status
:
curString
.
status
,
subscribeDate
:
curString
.
subscribeDate
,
pageNum
:
curString
.
curPage
,
communityNameList
:
curString
.
communityNameList
,
});
}
else
{
RA
(
8
,
{
userToken
:
token
,
pageNum
:
curString
.
curPage2
});
}
}
function
Pagechange
(
current
:
any
,
pageSize
:
any
)
{
if
(
curString
.
tab
==
1
)
{
var
tmp
=
curString
;
tmp
.
curPage
=
current
;
QA
(
tmp
);
RA
(
9
,
{
userToken
:
token
,
pageNum
:
current
,
subscribeDate
:
curString
.
subscribeDate
,
status
:
curString
.
status
,
communityNameList
:
curString
.
communityNameList
,
});
}
else
{
var
tmp
=
curString
;
tmp
.
curPage2
=
current
;
QA
(
tmp
);
if
(
curString
.
communityNameList
!=
null
)
{
RA
(
8
,
{
userToken
:
token
,
pageNum
:
current
,
communityNameList
:
curString
.
communityNameList
,
});
}
else
{
RA
(
8
,
{
userToken
:
token
,
pageNum
:
current
});
}
}
}
return
(
<>
<
div
className=
"base"
>
{
/* 头部组件 */
}
{
curString
.
tab
==
1
?
(
<>
<
TitleSearch
status=
{
[
{
name
:
[
'status'
,
'Order status'
],
data
:
[
[
0
,
'All'
],
[
1
,
'Applied'
],
[
2
,
'Reserved'
],
[
3
,
'Used'
],
[
4
,
'Cancelled'
],
],
},
]
}
time=
{
[
'key'
,
'Booking time '
]
}
community=
{
'communityName'
}
checklist=
{
curString
.
communityNameList
!=
null
?
curString
.
communityNameList
:
null
}
onSubmit=
{
CallBackTitleSearch
}
/>
</>
)
:
(
<>
<
TitleSearch
listkey=
{
[
'facilityName'
]
}
list=
{
[
'Facility name'
]
}
community=
{
'communityName'
}
onSubmit=
{
CallBackTitleSearch
}
/>
</>
)
}
</
div
>
{
/* 下方及搜索 */
}
<
div
className=
{
'base'
}
>
{
/* <div style={{ position: 'relative', height: 40 }}>
<Button type="primary" style={{ position: 'absolute', right: 0 }} onClick={goToFunction}>
{curString.tab == 1 ? 'Booking' : 'Add Facility'}
</Button>
</div> */
}
<
Tabs
defaultActiveKey=
{
curString
.
tab
.
toString
()
}
onChange=
{
TabCallback
}
className=
"diytabs"
>
<
TabPane
tab=
"Facility Bookings"
key=
"1"
>
<
ProTable
loading=
{
loading
}
rowKey=
"id"
dataSource=
{
Data
.
data
}
columns=
{
columns
}
// pagination={{
// current: curString.curPage,
// total: Data.total.totalRow,
// showSizeChanger: false,
// onChange: Pagechange,
// }}
pagination=
{
false
}
search=
{
false
}
toolBarRender=
{
()
=>
[
<
Button
key=
"3"
type=
"primary"
onClick=
{
goToFunction
}
>
<
PlusOutlined
/>
添加预约
</
Button
>,
]
}
options=
{
{
density
:
true
,
fullScreen
:
true
,
reload
:
()
=>
{
// onReset();
},
setting
:
false
,
}
}
headerTitle=
"预约列表"
/>
{
curString
?
(
<
div
className=
"pages"
>
<
Pagination
current=
{
curString
.
curPage
}
total=
{
Data
.
total
.
totalRow
}
// pageSizeOptions=
{[]}
showSizeChanger=
{
false
}
// pageSize=
{
village
.
page
.
curPageSize
}
onChange=
{
Pagechange
}
/>
</
div
>
)
:
(
''
)
}
</
TabPane
>
<
TabPane
tab=
"Facility Management"
key=
"2"
>
<
ProTable
loading=
{
loading
}
rowKey=
"id"
dataSource=
{
Data2
.
data
}
columns=
{
columns2
}
pagination=
{
{
current
:
curString
.
curPage2
,
total
:
Data2
.
total
.
totalRow
,
showSizeChanger
:
false
,
onChange
:
Pagechange
,
}
}
// pagination={false} // 隐藏默认分页
search=
{
false
}
toolBarRender=
{
()
=>
[
<
Button
key=
"3"
type=
"primary"
onClick=
{
goToFunction
}
>
<
PlusOutlined
/>
添加设施
</
Button
>,
]
}
options=
{
{
density
:
true
,
fullScreen
:
true
,
reload
:
()
=>
{
// onReset();
},
setting
:
false
,
}
}
headerTitle=
"设施列表"
/>
</
TabPane
>
</
Tabs
>
</
div
>
</>
);
};
function
mapStateToProps
(
state
:
any
)
{
const
{
Data
,
Data2
,
DataSave
,
curString
,
Result
}
=
state
.
FacilityBookings
;
const
{
token
}
=
state
.
login
;
const
loading
=
typeof
state
.
loading
.
models
.
FacilityBookings
==
'undefined'
?
true
:
state
.
loading
.
models
.
FacilityBookings
;
return
{
Data
,
Data2
,
DataSave
,
curString
,
Result
,
token
,
loading
,
};
}
export
default
connect
(
mapStateToProps
)(
FacilityBookings
);
// status:预约设施状态 0:全部 1:已申请 2:已预订 3:已使用 4:已取消 5:已完成
// manager_fee_status:管理费 0:未 1:已交 2:已退
// margin_fee_status:押金 0:未 1:已交 2:未退 3:已退部分 4:已退全部 5:
src/pages/CommunityManagement/FacilityBookings/FacilityBookings.tsx
View file @
47d17e5f
import
React
,
{
useState
,
useEffect
}
from
'react'
;
import
{
Input
,
Tabs
,
Table
,
Space
,
Button
}
from
'antd'
;
import
{
Input
,
Tabs
,
Pagination
,
Space
,
Button
}
from
'antd'
;
const
{
TabPane
}
=
Tabs
;
import
{
Link
,
useIntl
,
connect
,
Dispatch
,
history
}
from
'umi'
;
...
...
@@ -102,7 +102,8 @@ const FacilityBookings = (props: any) => {
(
text
:
any
)
=>
(
<
div
>
<
ClockCircleOutlined
style=
{
{
color
:
'#666'
}
}
/>
{
text
}
{
moment
(
text
).
format
(
'YYYY-MM-DD'
)
}
</
div
>
),
],
...
...
@@ -295,12 +296,13 @@ const FacilityBookings = (props: any) => {
rowKey=
"id"
dataSource=
{
Data
.
data
}
columns=
{
columns
}
pagination=
{
{
current
:
curString
.
curPage
,
total
:
Data
.
total
.
totalRow
,
showSizeChanger
:
false
,
onChange
:
Pagechange
,
}
}
// pagination={{
// current: curString.curPage,
// total: Data.total.totalRow,
// showSizeChanger: false,
// onChange: Pagechange,
// }}
pagination=
{
false
}
search=
{
false
}
toolBarRender=
{
()
=>
[
<
Button
key=
"3"
type=
"primary"
onClick=
{
goToFunction
}
>
...
...
@@ -318,6 +320,21 @@ const FacilityBookings = (props: any) => {
}
}
headerTitle=
"预约列表"
/>
{
curString
?
(
<
div
className=
"pages"
>
<
Pagination
current=
{
curString
.
curPage
}
total=
{
Data
.
total
.
totalRow
}
// pageSizeOptions=
{[]}
showSizeChanger=
{
false
}
// pageSize=
{
village
.
page
.
curPageSize
}
onChange=
{
Pagechange
}
/>
</
div
>
)
:
(
''
)
}
</
TabPane
>
<
TabPane
tab=
"Facility Management"
key=
"2"
>
...
...
src/pages/CommunityManagement/FacilityBookings/css/index.less
View file @
47d17e5f
...
...
@@ -356,3 +356,8 @@ hr {
margin-bottom: 0;
}
}
.pages {
background: #fff;
text-align: right;
padding: 20px 10px 10px;
}
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment