Commit e713efc3 authored by maple's avatar maple

[step]保存工作区15:44

parent a4660d65
......@@ -97,9 +97,14 @@ export default defineConfig({
path: '/PropertyManagement',
name: 'propertymanagement',
icon: 'ReconciliationOutlined',
component: './PropertyManagement/ChargeManager',
routes: [
{ path: './', component: './PropertyManagement/ChargeManager' },
{ path: './AccoutingDetail', component: './PropertyManagement/AccoutingContent' },
{ path: './AccoutingEdit',component:'./PropertyManagement/AccoutingContent'},
]
},
{path: '/PropertyManagementDetail',component:'./PropertyManagement/ChargeDetail'},
{ path: '/PropertyManagementDetail', component: './PropertyManagement/ChargeDetail' },
{
path: '/CommercialService',
name: 'commercialservice',
......@@ -154,10 +159,10 @@ export default defineConfig({
component:'./runTest/Template'
},
{
path: '/ContractManagement/ContractManagement',
path: '/ContractManagement',
name: 'contractmanagement',
icon: 'SwitcherOutlined',
component:'./runTest/Template'
component:'./ContractManagement/Contract'
},
{
path: '/CommunityManagement',
......
import React from 'react';
import styles from './index.less';
const Line = () => {
return (
<div className={styles.line}></div>
);
};
export default Line;
// 线栏
.line{
width: 100%;
height: 1px;
border-top: 1px solid rgba(217,217,217,1);
margin-top: 28px;
margin-bottom: 28px;
}
\ No newline at end of file
import React, { useState, useEffect } from 'react';
import styles from './index.less';
import { Input ,Menu,Table,Space} from 'antd';
import { Link, useIntl, connect, Dispatch, history } from 'umi';
const dataSource = [
{
key: '1',
name: '胡彦斌',
age: 32,
address: '西湖区湖底公园1号',
},
];
const Contract = (props: { location: any; }) => {
const { formatMessage } = useIntl();
const { location } = props;
const nameofowner = formatMessage({ id: 'R.charge.input.nameofowner' })
const inputProject = formatMessage({ id: 'R.charge.input.project' })
const username = formatMessage({ id: 'R.charge.username' })
const project = formatMessage({ id: 'R.charge.project' })
const unit = formatMessage({ id: 'R.charge.unit' })
const status = formatMessage({ id: 'R.charge.status' })
const submissionTime = formatMessage({ id: 'R.charge.submissionTime' })
const actions = formatMessage({ id: 'R.charge.actions' })
const search = formatMessage({ id: 'R.charge.search' })
const addaccount = formatMessage({ id: 'R.charge.addaccount' })
const paymentsetting = formatMessage({ id: 'R.charge.paymentsetting' })
const menuListNormal = ["A",'Accounting company']
const [display, setDisplay] = useState("A");//小组件:线框
const pagination={defaultCurrent:1,total: 16}
const goToDetail = () => {
history.push('/PropertyManagementDetail?id=123')
}
const goToAddAccout = () => {
history.push('./PropertyAccoutingEdit')
}
const columns = [
{
title: username,
dataIndex: 'name',
key: 'name',
},
{
title: project,
dataIndex: 'age',
key: 'age',
},
{
title: unit,
dataIndex: 'address',
key: 'address',
},
{
title: status,
dataIndex: 'address',
key: 'address',
},
{
title: submissionTime,
dataIndex: 'address',
key: 'address',
},
{
title: actions,
key: 'action',
render: (text: any, record: any) => (
<Space size="middle">
<a onClick={goToDetail}>Detail</a>
</Space>
),
},
];
return (
<div className={styles.base}>
{/* 头部组件 */}
<div className={styles.box}>
<input className={styles.item1} placeholder={nameofowner} />
<input className={styles.item2} placeholder={inputProject} />
<button className={styles.item3}>{search}</button>
</div>
{/* 内容组件 */}
<div className={styles.box2}>
{
menuListNormal.map((item, index) => {
return (<button key={"bt"+ index } className={display==item?styles.buttonChoose:styles.buttonWait} onClick={()=>{setDisplay(item)}}>{item}</button>)
})
}
<button className={styles.buttonAdd2} onClick={goToAddAccout}>+ {addaccount} </button>
<button className={styles.buttonAdd} >{paymentsetting}</button>
</div>
{/* 列表组件 */}
<Table style={{ marginTop: 16 }} dataSource={dataSource} columns={columns} pagination={pagination} />
</div>
);
};
export default Contract;
@import '~antd/lib/style/themes/default.less';
//基石
.base {
width: 100%;
background-color: #ffffff;
padding: 34px;
}
//边栏1
//头部组件
.box{
width: 100%;
height: 34px;
position: relative;
margin-bottom: 56px;
}
.input{
width:200px;
height:32px;
background:none;
outline: none;
border:1px solid rgba(217,217,217,1);
border-radius:2px;
font-size:14px;
font-weight:400;
line-height:30px;
text-indent: 19px;
}
.item1{
.input();
}
.item2{
.input();
margin-left: 20px;
}
.item3{
width:80px;
height:32px;
border:1px solid rgba(24,144,255,1);
border-radius:2px;
background-color:#e7f4ff;
outline: none;
font-size:14px;
font-weight:400;
color:rgba(24,144,255,1);
line-height:30px;
cursor: pointer;
margin-left: 20px;
}
.item3:active{
background-color:#ffffff;
}
//边栏2
.box2{
width: 100%;
height: 40px;
margin-top: 0px;
position: relative;
}
//小组件1
.buttonLine{
width:240px;
height:32px;
border:none;
background:none;
outline: none;
font-size:14px;
font-weight:400;
line-height:30px;
cursor: pointer;
}
.fontgz(){
font-size:16px;
font-family:'Source Han Sans CN;';
font-weight:800;
}
.buttonWait{
.buttonLine();
border-bottom:2px solid#dedede;
color:#454545;
.fontgz();
}
.buttonWait:hover{
border-bottom:3px solid rgba(24,144,255,1);
color:rgba(24,144,255,1);
.fontgz();
}
.buttonChoose{
.buttonLine();
border-bottom:3px solid rgba(24,144,255,1);
color:rgba(24,144,255,1);
.fontgz();
}
.buttonAdd{
background:none;
outline: none;
cursor: pointer;
width:148px;
height:32px;
border:1px solid rgba(24,144,255,1);
color:rgba(24,144,255,1);
border-radius:2px;
position: absolute;
right: 0;
}
.buttonAdd2{
.buttonAdd();
right: 168px;
}
......@@ -7,7 +7,8 @@
padding: 34px;
min-width: 1020px;
}
//边栏1
//头部组件
.box{
width: 100%;
height: 64px;
......@@ -15,20 +16,13 @@
}
.item1{
position: absolute;
width: 180px;
text-align: center;
width: 320px;
text-indent: 15px;
border-left: 5px solid rgba(24,144,255,1);
font-family:'Source Han Sans CN';
font-size: 18px;
font-weight: 600;
color: #000000;
}
.item2{
width:300px;
position: absolute;
left: (180px+36px);
line-height: 30px;
}
.item3{
width:80px;
......@@ -44,90 +38,56 @@
border-radius:2px;
}
.box2{
.box1{
width: 100%;
height: 80px;
text-align: center;
height: 34px;
position: relative;
}
.item21{
line-height: 32px;
width: 200px;
.box1item1{
position: absolute;
}
.item22{
line-height: 32px;
.box1item2{
position: absolute;
left: 200px;
width: 200px;
height: 32px;
border:1px solid rgba(217,217,217,1);
border-radius:2px;
left: 154px;
}
.item23{
line-height: 32px;
.box1item3{
position: absolute;
left: 416px;
border:1px solid rgba(217,217,217,1);
border-radius:2px;
width: 94px;
height: 32px;
}
.item234{
line-height: 32px;
height: 32px;
position: absolute;
left: 514px;
left: 499px;
}
.item24{
line-height: 32px;
border:1px solid rgba(217,217,217,1);
border-radius:2px;
.box1item4{
position: absolute;
left: 529px;
width: 80px;
height: 32px;
left: 648px;
}
.item245{
line-height: 32px;
position: absolute;
left: 609px;
.box2{
width: 100%;
height: 34px;
position: relative;
margin-top: 28px;
}
.item25{
line-height: 32px;
width: 112px;
height: 32px;
border:1px solid rgba(217,217,217,1);
border-radius:2px;
.box2item1{
position: absolute;
left: 640px;
}
.item26{
width: 200px;
height: 32px;
line-height: 32px;
border:1px solid rgba(217,217,217,1);
border-radius:2px;
.box2item2{
position: absolute;
left: 780px;
left: 189px;
}
.box3out{
padding-left: 200px;
}
.box3{
width: 780px;
border:1px solid rgba(217,217,217,1);
background-color: rgba(244,244,244,1);
cursor: pointer;
overflow: auto;
width: 100%;
height: 34px;
position: relative;
margin-top: 28px;
}
.box3of{
cursor: pointer;
.box3item1{
position: absolute;
}
.box4{
padding-left: 200px;
.box3item2{
position: absolute;
left: 189px;
}
.box3item3{
position: absolute;
left: 405px;
}
\ No newline at end of file
import React, { useState, useEffect } from 'react';
import styles from './AccoutingContent.less';
import { Input ,Button,Table,Space,Pagination,Tooltip } from 'antd';
import { Link, useIntl, connect, Dispatch ,history } from 'umi';
import Line from '../../components/Line/Line';
import SelectOptions from '../../components/SelectOptions/index';
const goToReturn = () => {
history.back()
}
const AccoutingContent = (props: { location: any; }) => {
const { location } = props;
const [ editFlag, setEditFlag ] = useState(false);
useEffect(() => {
if (location.pathname=="/PropertyAccoutingEdit") {
setEditFlag(true)
} else {
setEditFlag(false)
}
},[location.pathname]);
const printContent = (comment: any)=>{
console.log(comment)
}
return (
<div className={styles.base}>
{/* 头部组件 */}
<div className={styles.box}>
<div className={styles.item1}>Add Accounting</div>
<button className={styles.item3} onClick={goToReturn}>Return</button>
</div>
<div className={styles.box1}>
<div className={styles.box1item1}>Company Name</div>
<div className={styles.box1item2}>{editFlag ? (<Input style={{ width: 260 }} placeholder="Please enter company name" />) : ("123")}</div>
<div className={styles.box1item3}>Office Address</div>
<div className={styles.box1item4}>{editFlag ? (<Input style={{ width: 200 }} placeholder="Single Line Input" />) : ("123")}</div>
</div>
<Line/>
<div style={{marginBottom:28}}>Service Community</div>
<SelectOptions list={["美国","美丽的","美好","加拿大","加油","XO"].sort()} onSubmit={printContent}/>
<div className={styles.box2}>
<div className={styles.box2item1}>Services Available</div>
<div className={styles.box2item2}>Accounting</div>
</div>
<div className={styles.box2}>
<div className={styles.box2item1}>Person In Charge</div>
<div className={styles.box2item2}>{editFlag?(<Input placeholder="Please enter a name" style={{width:200}}/>):("123")}</div>
</div>
<div className={styles.box3}>
<div className={styles.box3item1}>Contact Details</div>
<div className={styles.box3item2}>{editFlag?(<Input placeholder="Telephone" style={{width:200}}/>):("123")}</div>
<div className={styles.box3item3}>{editFlag?(<Input placeholder="E-mail" style={{width:200}}/>):("123")}</div>
</div>
{
editFlag ? (
<div>
<Line/>
<Button type="primary" size="large">提交</Button>
</div>
):(<div/>)
}
</div>
);
};
export default AccoutingContent;
......@@ -39,7 +39,9 @@ const ChargeManager = (props: { location: any; }) => {
const goToDetail = () => {
history.push('/PropertyManagementDetail?id=123')
}
const goToAddAccout = () => {
history.push(location.pathname+'/AccoutingDetail')
}
const columns = [
{
title: username,
......@@ -93,7 +95,7 @@ const ChargeManager = (props: { location: any; }) => {
return (<button key={"bt"+ index } className={display==item?styles.buttonChoose:styles.buttonWait} onClick={()=>{setDisplay(item)}}>{item}</button>)
})
}
<button className={styles.buttonAdd2} >+ {addaccount} </button>
<button className={styles.buttonAdd2} onClick={goToAddAccout}>+ {addaccount} </button>
<button className={styles.buttonAdd} >{paymentsetting}</button>
</div>
......
import React, { useState, useEffect } from 'react';
import styles from './ChangeDetail.less';
import { Input ,Menu,Table,Space,Pagination,Tooltip } from 'antd';
import styles from './index.less';
import { Input ,Button,Table,Space,Pagination,Tooltip } from 'antd';
import { Link, useIntl, connect, Dispatch } from 'umi';
import { Link, useIntl, connect, Dispatch,history } from 'umi';
import Line from '../../components/Line/Line';
import SelectOptions from '../../components/SelectOptions/index';
import PDF from 'react-pdf-js';//
import { render } from 'react-dom';
const Template = (props: { location: any; }) => {
const { location } = props;
const ChangeDetail = () => {
const { formatMessage } = useIntl();
const [editFlag, setEditFlag ]= useState(false);
useEffect(() => {
const [scale, setState] = useState(1.3)
const [pages,setPages] = useState(1)
const [curpage,setCurpage]=useState(1)
const pdfpages = (pages: any) => {
setPages(pages)
//alert(pages)
if (location.pathname=="/PropertyAccoutingDetail") {
setEditFlag(true)
} else {
setEditFlag(false)
}
},[location.pathname]);
const lookup = () => {
if (scale == 1.3) {
setState(2)
} else {
setState(1.3)
const gotoReturn=() => {
history.back()
}
const printContent = (comment: any)=>{
console.log(comment)
}
const pageChange = (curpage: any) => {
setCurpage(curpage)
}
return (
<div className={styles.base}>
{/* 组件 */}
{/* 头部组件 */}
<div className={styles.box}>
<div className={styles.item1}>Payment Settings</div>
<div className={styles.item2}>Upload Time 2020/7/14/18:09:00</div>
<button className={styles.item3}>返回</button>
<div className={styles.item1}>Add Accounting</div>
<button className={styles.item3} onClick={gotoReturn}>Return</button>
</div>
<div className={styles.box2}>
<div className={styles.item21}>Project</div>
<div className={styles.item22}>Project Name</div>
<div className={styles.item23}>Building No</div>
<div className={styles.item234}>#</div>
<div className={styles.item24}>Floor</div>
<div className={styles.item245}>——</div>
<div className={styles.item25}>Room Number</div>
<div className={styles.item26}>Owner's Name</div>
</div>
<div className={styles.box4}>
<Pagination simple defaultCurrent={curpage} total={pages*10} onChange={pageChange} />
<div className={styles.box1}>
<div className={styles.box1item1}>Company Name</div>
<div className={styles.box1item2}><Input style={{width:260}} placeholder="Please enter company name"/></div>
<div className={styles.box1item3}>Office Address</div>
<div className={styles.box1item4}><Input style={{width:200}} placeholder="Single Line Input"/></div>
</div>
<Line/>
<div style={{marginBottom:28}}>Service Community</div>
<SelectOptions list={["美国","美丽的","美好","加拿大","加油","XO"].sort()} onSubmit={printContent}/>
{
scale == 1.3 ? (
<Tooltip title="点击放大查看">
<div className={styles.box3out}>
<div className={styles.box3} onClick={lookup}>
<PDF key="pdfjs" file="test2.pdf" cMapUrl="http://127.0.0.1:80/" workerSrc = "//cdnjs.cloudflare.com/ajax/libs/pdf.js/2.2.228/pdf.worker.js" scale={scale} page={curpage} onDocumentComplete={pdfpages} />
</div>
<div className={styles.box2}>
<div className={styles.box2item1}>Services Available</div>
<div className={styles.box2item2}>Accounting</div>
</div>
</Tooltip>
) : (
<Tooltip title="还原视图">
< div className={ styles.box3of } onClick={ lookup } >
{/* <PDF key="pdfjs" file="test2.pdf" cMapUrl="http://127.0.0.1:80/" workerSrc = '//cdnjs.cloudflare.com/ajax/libs/pdf.js/2.2.228/pdf.worker.js' scale={scale} page={curpage} onDocumentComplete={pdfpages} /> */}
<div className={styles.box2}>
<div className={styles.box2item1}>Person In Charge</div>
<div className={styles.box2item2}>{editFlag?(<Input placeholder="Please enter a name" style={{width:200}}/>):("123")}</div>
</div>
</Tooltip>
)
}
<div className={styles.box3}>
<div className={styles.box3item1}>Contact Details</div>
<div className={styles.box3item2}><Input placeholder="Telephone" style={{width:200}}/></div>
<div className={styles.box3item3}><Input placeholder="E-mail" style={{width:200}}/></div>
</div>
<Line/>
<Button type="primary" size="large">提交</Button>
</div>
);
};
export default ChangeDetail;
export default Template;
@import '~antd/lib/style/themes/default.less';
//基石
.base {
width: 100%;
background-color: #ffffff;
padding: 34px;
min-width: 1020px;
}
//头部组件
.box{
width: 100%;
height: 64px;
position: relative;
}
.item1{
position: absolute;
width: 320px;
text-indent: 15px;
border-left: 5px solid rgba(24,144,255,1);
font-family:'Source Han Sans CN';
font-size: 18px;
font-weight: 600;
color: #000000;
}
.item3{
width:80px;
height: 32px;
position: absolute;
right: 0;
outline: none;
background:none;
cursor: pointer;
border:1px solid rgba(217,217,217,1);
border-radius:2px;
}
.box1{
width: 100%;
height: 34px;
position: relative;
}
.box1item1{
position: absolute;
}
.box1item2{
position: absolute;
left: 154px;
}
.box1item3{
position: absolute;
left: 499px;
}
.box1item4{
position: absolute;
left: 648px;
}
.box2{
width: 100%;
height: 34px;
position: relative;
margin-top: 28px;
}
.box2item1{
position: absolute;
}
.box2item2{
position: absolute;
left: 189px;
}
.box3{
width: 100%;
height: 34px;
position: relative;
margin-top: 28px;
}
.box3item1{
position: absolute;
}
.box3item2{
position: absolute;
left: 189px;
}
.box3item3{
position: absolute;
left: 405px;
}
\ No newline at end of file
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