-
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
parking-space complete
- Loading branch information
Showing
6 changed files
with
1,160 additions
and
8 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
126 changes: 124 additions & 2 deletions
126
src/views/parkingSpace/cSpaceQtySetting/CspaceQtySetting.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,7 +1,129 @@ | ||
import React from 'react' | ||
|
||
import { | ||
CTable, | ||
CPagination, | ||
CPaginationItem, | ||
CFormSelect, | ||
CButton, | ||
CButtonGroup, | ||
} from '@coreui/react' | ||
const CspaceQtySetting = () => { | ||
return <div>CspaceQtySetting</div> | ||
const operation = () => { | ||
return ( | ||
<CButtonGroup role="group" aria-label="Basic mixed styles example" size="sm"> | ||
<CButton color="info">View</CButton> | ||
<CButton color="warning">Edit</CButton> | ||
</CButtonGroup> | ||
) | ||
} | ||
|
||
const columns = [ | ||
{ | ||
key: 'parkingname', | ||
label: 'Parking Name', | ||
_props: { scope: 'col' }, | ||
}, | ||
{ | ||
key: 'zonename', | ||
label: 'Zone Name', | ||
_props: { scope: 'col' }, | ||
}, | ||
{ | ||
key: 'totalspace', | ||
label: 'Total Space', | ||
_props: { scope: 'col' }, | ||
}, | ||
{ | ||
key: 'emptyspace', | ||
label: 'Empty Space', | ||
_props: { scope: 'col' }, | ||
}, | ||
{ | ||
key: 'modifer', | ||
label: 'Modifer', | ||
_props: { scope: 'col' }, | ||
}, | ||
{ | ||
key: 'modifytime', | ||
label: 'Modify Time', | ||
_props: { scope: 'col' }, | ||
}, | ||
{ | ||
key: 'operation', | ||
label: 'Operation', | ||
_props: { scope: 'col' }, | ||
}, | ||
] | ||
const items = [ | ||
{ | ||
parkingname: ' ', | ||
zonename: ' ', | ||
totalspace: ' ', | ||
emptyspace: ' ', | ||
modifer: ' ', | ||
modifytime: ' ', | ||
operation: operation(), | ||
_cellProps: { id: { scope: 'row' } }, | ||
}, | ||
] | ||
return ( | ||
<> | ||
<div className="conf-list"> | ||
<h1>C-Space Qty. Setting</h1> | ||
<div | ||
style={{ | ||
display: 'flex', | ||
flexDirection: 'column', | ||
flexWrap: 'wrap', | ||
justifyContent: 'space-around', | ||
height: 'max-content', | ||
minHeight: '20vh', | ||
borderTop: '1px solid grey', | ||
borderBottom: '1px solid grey', | ||
width: '100%', | ||
}} | ||
> | ||
<div | ||
style={{ | ||
display: 'flex', | ||
flexDirection: 'row', | ||
width: '50%', | ||
minHeight: '5vh', | ||
justifyContent: 'space-between', | ||
flexWrap: 'wrap', | ||
}} | ||
> | ||
<CFormSelect aria-label="Default select example" style={{ width: '40%' }}> | ||
<option>Mall</option> | ||
<option value="1">Mall</option> | ||
</CFormSelect> | ||
</div> | ||
</div> | ||
<div style={{ overflow: 'auto' }}> | ||
<CTable | ||
columns={columns} | ||
items={items} | ||
style={{ | ||
width: '100vw', | ||
minWidth: '600px', | ||
}} | ||
hover | ||
/> | ||
</div> | ||
<CPagination size="sm" align="end" aria-label="Page navigation example"> | ||
<CPaginationItem style={{ color: 'black' }} disabled> | ||
Previous | ||
</CPaginationItem> | ||
<CPaginationItem style={{ color: 'black' }} active="true"> | ||
1 | ||
</CPaginationItem> | ||
<CPaginationItem style={{ color: 'black' }}>2</CPaginationItem> | ||
<CPaginationItem style={{ color: 'black' }}>3</CPaginationItem> | ||
<CPaginationItem style={{ color: 'black' }}>Next</CPaginationItem> | ||
</CPagination> | ||
</div> | ||
</> | ||
) | ||
} | ||
|
||
export default CspaceQtySetting |
Oops, something went wrong.