Skip to content

T
TOSTUMI
Commit e713efc3 authored by maple's avatar maple
Browse files
Options

[step]保存工作区15:44

parent a4660d65
Show whitespace changes
Inline Side-by-side
Showing with 577 additions and 66 deletions
config/config.ts
View file @ e713efc3
...@@ -97,9 +97,14 @@ export default defineConfig({ ...@@ -97,9 +97,14 @@ export default defineConfig({
path: '/PropertyManagement', path: '/PropertyManagement',
name: 'propertymanagement', name: 'propertymanagement',
icon: 'ReconciliationOutlined', 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', path: '/CommercialService',
name: 'commercialservice', name: 'commercialservice',
...@@ -154,10 +159,10 @@ export default defineConfig({ ...@@ -154,10 +159,10 @@ export default defineConfig({
component:'./runTest/Template' component:'./runTest/Template'
}, },
{ {
path: '/ContractManagement/ContractManagement', path: '/ContractManagement',
name: 'contractmanagement', name: 'contractmanagement',
icon: 'SwitcherOutlined', icon: 'SwitcherOutlined',
component:'./runTest/Template' component:'./ContractManagement/Contract'
}, },
{ {
path: '/CommunityManagement', path: '/CommunityManagement',
......
src/components/Line/Line.tsx 0 → 100644
View file @ e713efc3
import React from 'react';
import styles from './index.less';
const Line = () => {
return (
<div className={styles.line}></div>
);
};
export default Line;
src/components/Line/index.less 0 → 100644
View file @ e713efc3
// 线栏
.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
src/pages/ContractManagement/Contract.tsx 0 → 100644
View file @ e713efc3
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;
src/pages/ContractManagement/index.less 0 → 100644
View file @ e713efc3
@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;
}
src/pages/runTest/ChangeDetail.less → src/pages/PropertyManagement/AccoutingContent.less
View file @ e713efc3
...@@ -7,7 +7,8 @@ ...@@ -7,7 +7,8 @@
padding: 34px; padding: 34px;
min-width: 1020px; min-width: 1020px;
} }
//边栏1
//头部组件
.box{ .box{
width: 100%; width: 100%;
height: 64px; height: 64px;
...@@ -15,20 +16,13 @@ ...@@ -15,20 +16,13 @@
} }
.item1{ .item1{
position: absolute; position: absolute;
width: 180px; width: 320px;
text-align: center; text-indent: 15px;
border-left: 5px solid rgba(24,144,255,1); border-left: 5px solid rgba(24,144,255,1);
font-family:'Source Han Sans CN'; font-family:'Source Han Sans CN';
font-size: 18px; font-size: 18px;
font-weight: 600; font-weight: 600;
color: #000000; color: #000000;
}
.item2{
width:300px;
position: absolute;
left: (180px+36px);
line-height: 30px;
} }
.item3{ .item3{
width:80px; width:80px;
...@@ -44,90 +38,56 @@ ...@@ -44,90 +38,56 @@
border-radius:2px; border-radius:2px;
} }
.box2{
.box1{
width: 100%; width: 100%;
height: 80px; height: 34px;
text-align: center;
position: relative; position: relative;
} }
.box1item1{
.item21{
line-height: 32px;
width: 200px;
position: absolute; position: absolute;
} }
.item22{ .box1item2{
line-height: 32px;
position: absolute; position: absolute;
left: 200px; left: 154px;
width: 200px;
height: 32px;
border:1px solid rgba(217,217,217,1);
border-radius:2px;
} }
.item23{ .box1item3{
line-height: 32px;
position: absolute; position: absolute;
left: 416px; left: 499px;
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;
} }
.item24{ .box1item4{
line-height: 32px;
border:1px solid rgba(217,217,217,1);
border-radius:2px;
position: absolute; position: absolute;
left: 529px; left: 648px;
width: 80px;
height: 32px;
} }
.item245{
line-height: 32px; .box2{
position: absolute; width: 100%;
left: 609px; height: 34px;
position: relative;
margin-top: 28px;
} }
.item25{ .box2item1{
line-height: 32px;
width: 112px;
height: 32px;
border:1px solid rgba(217,217,217,1);
border-radius:2px;
position: absolute; position: absolute;
left: 640px;
} }
.item26{ .box2item2{
width: 200px;
height: 32px;
line-height: 32px;
border:1px solid rgba(217,217,217,1);
border-radius:2px;
position: absolute; position: absolute;
left: 780px; left: 189px;
} }
.box3out{
padding-left: 200px;
}
.box3{ .box3{
width: 780px; width: 100%;
border:1px solid rgba(217,217,217,1); height: 34px;
background-color: rgba(244,244,244,1); position: relative;
cursor: pointer; margin-top: 28px;
overflow: auto;
} }
.box3of{ .box3item1{
cursor: pointer; position: absolute;
} }
.box4{ .box3item2{
padding-left: 200px; position: absolute;
left: 189px;
}
.box3item3{
position: absolute;
left: 405px;
} }
\ No newline at end of file
src/pages/PropertyManagement/AccoutingContent.tsx 0 → 100644
View file @ e713efc3
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;
src/pages/PropertyManagement/ChargeManager.tsx
View file @ e713efc3
...@@ -39,7 +39,9 @@ const ChargeManager = (props: { location: any; }) => { ...@@ -39,7 +39,9 @@ const ChargeManager = (props: { location: any; }) => {
const goToDetail = () => { const goToDetail = () => {
history.push('/PropertyManagementDetail?id=123') history.push('/PropertyManagementDetail?id=123')
} }
const goToAddAccout = () => {
history.push(location.pathname+'/AccoutingDetail')
}
const columns = [ const columns = [
{ {
title: username, title: username,
...@@ -93,7 +95,7 @@ const ChargeManager = (props: { location: any; }) => { ...@@ -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>) 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> <button className={styles.buttonAdd} >{paymentsetting}</button>
</div> </div>
......
src/pages/runTest/Template.tsx
View file @ e713efc3
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import styles from './ChangeDetail.less'; import styles from './index.less';
import { Input ,Menu,Table,Space,Pagination,Tooltip } from 'antd'; 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';// const Template = (props: { location: any; }) => {
import { render } from 'react-dom';
const { location } = props;
const ChangeDetail = () => { const [editFlag, setEditFlag ]= useState(false);
const { formatMessage } = useIntl(); useEffect(() => {
const [scale, setState] = useState(1.3) if (location.pathname=="/PropertyAccoutingDetail") {
const [pages,setPages] = useState(1) setEditFlag(true)
const [curpage,setCurpage]=useState(1) } else {
setEditFlag(false)
const pdfpages = (pages: any) => {
setPages(pages)
//alert(pages)
} }
},[location.pathname]);
const lookup = () => {
if (scale == 1.3) { const gotoReturn=() => {
setState(2) history.back()
} else {
setState(1.3)
} }
const printContent = (comment: any)=>{
console.log(comment)
} }
const pageChange = (curpage: any) => {
setCurpage(curpage)
}
return ( return (
<div className={styles.base}> <div className={styles.base}>
{/* 组件 */}
{/* 头部组件 */}
<div className={styles.box}> <div className={styles.box}>
<div className={styles.item1}>Payment Settings</div> <div className={styles.item1}>Add Accounting</div>
<div className={styles.item2}>Upload Time 2020/7/14/18:09:00</div> <button className={styles.item3} onClick={gotoReturn}>Return</button>
<button className={styles.item3}>返回</button>
</div> </div>
<div className={styles.box2}> <div className={styles.box1}>
<div className={styles.item21}>Project</div> <div className={styles.box1item1}>Company Name</div>
<div className={styles.item22}>Project Name</div> <div className={styles.box1item2}><Input style={{width:260}} placeholder="Please enter company name"/></div>
<div className={styles.item23}>Building No</div> <div className={styles.box1item3}>Office Address</div>
<div className={styles.item234}>#</div> <div className={styles.box1item4}><Input style={{width:200}} placeholder="Single Line Input"/></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> </div>
<Line/>
<div style={{marginBottom:28}}>Service Community</div>
<SelectOptions list={["美国","美丽的","美好","加拿大","加油","XO"].sort()} onSubmit={printContent}/>
{ <div className={styles.box2}>
scale == 1.3 ? ( <div className={styles.box2item1}>Services Available</div>
<Tooltip title="点击放大查看"> <div className={styles.box2item2}>Accounting</div>
<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> </div>
</Tooltip>
) : ( <div className={styles.box2}>
<Tooltip title="还原视图"> <div className={styles.box2item1}>Person In Charge</div>
< div className={ styles.box3of } onClick={ lookup } > <div className={styles.box2item2}>{editFlag?(<Input placeholder="Please enter a name" style={{width:200}}/>):("123")}</div>
{/* <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>
</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> </div>
); );
}; };
export default ChangeDetail; export default Template;
src/pages/runTest/index.less 0 → 100644
View file @ e713efc3
@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