file

parent 81723061
This diff is collapsed.
......@@ -20,7 +20,7 @@ class Footer extends Component {
const tabItem = [
{title: '待办', key: 'backlog', icon: '/img/footer-backlog.png', selectedIcon: '/img/footer-backlog-s.png', badge: '', onPress: '/bord/backlog'},
{title: '工作', key: 'work', icon: '/img/footer-work.png', selectedIcon: '/img/footer-work-s.png', badge: '', onPress: '/bord/work'},
{title: '通讯录', key: 'communicate', icon: '/img/footer-communicate.png', selectedIcon: '/img/footer-communicate-s.png', badge: '', onPress: '/bord/communicate'},
{title: '通讯录', key: 'addressList', icon: '/img/footer-communicate.png', selectedIcon: '/img/footer-communicate-s.png', badge: '', onPress: '/bord/addressList'},
{title: '通知', key: 'notice', icon: '/img/footer-notice.png', selectedIcon: '/img/footer-notice-s.png', badge: '', onPress: '/bord/notice'}
];
......
import React, {Component} from 'react';
import {List, WhiteSpace,Row,Col} from 'antd-mobile';
import { BrowserRouter, Route, Link } from "react-router-dom";
import '../Communicate/index.less';
class AddressList extends Component {
state = {
}
render() {
const partList = [{
name:'办公厅',
id:1,
},{
name:'组织部',
id:2
}];
return (
<div>
<div className='breadBox'>
<span className='currentLink'>科技创新委员会</span><span className='symbol'>&gt;</span><span>组织架构</span><span className='symbol'>&gt;</span><span>办公厅</span>
</div>
<div className='adMainBox'>
<div className='adListBox'>
<ul className='partList'>
{partList && partList.map(item => {
return <li onClick = { () => {this.props.history.push(`/bord/communicate/${item.id}`)}}>
<p className="item">{item.name}</p>
<p className="item"><img src="/img/rarrow.png" alt="" className='icon18'/></p>
</li>
})}
</ul>
</div>
</div>
</div>
);
}
}
export default AddressList;
......@@ -5,6 +5,7 @@ import './index.less'
const Item = List.Item;
class Communicate extends Component {
render() {
return (
<div>
......@@ -19,7 +20,50 @@ class Communicate extends Component {
<div className='adContent'>
<div className='peopleList'>
<p className='subItem'>
王磊
<span className='cicrleHead mr-5'>
<img src='/img/head.png' className='imgRes' />
</span>
王磊
</p>
<p className='subItem'>
<img className='smallIco mr-5' src='/img/tel.png' />13488876526
</p>
</div>
<div className='peopleList'>
<p className='subItem'>
<span className='cicrleHead mr-5 centerFont'>
</span>
王磊
</p>
<p className='subItem'>
<img className='smallIco mr-5' src='/img/tel.png' />13488876526
</p>
</div>
</div>
</div>
</li>
<li>
<div className='itemBox'>
<h4 className='titleBar'>市委办公厅审核员</h4>
<div className='adContent'>
<div className='peopleList'>
<p className='subItem'>
<span className='cicrleHead mr-5'>
<img src='/img/head.png' className='imgRes' />
</span>
王磊
</p>
<p className='subItem'>
<img className='smallIco mr-5' src='/img/tel.png' />13488876526
</p>
</div>
<div className='peopleList'>
<p className='subItem'>
<span className='cicrleHead mr-5 centerFont'>
</span>
王磊
</p>
<p className='subItem'>
<img className='smallIco mr-5' src='/img/tel.png' />13488876526
......
......@@ -20,12 +20,16 @@
}
.adListBox{
li{
margin-bottom:5px ;
margin-bottom:10px ;
border-bottom: 1px solid @grayLight;
&:last-child{
padding-top: 0;
border-bottom: none;
}
}
.titleBar{
font-size: 16px;
font-weight: bold;
padding-top: 0;
}
.adContent{
padding:15px 0;
......@@ -35,6 +39,8 @@
display: flex;
justify-content: space-between;
line-height: 1.5;
align-items:center;
padding:10px 0;
}
.peopleList .subItem{
flex:1;
......@@ -43,3 +49,18 @@
.peopleList > p:last-child{
text-align: right;
}
.partList{
li{
&:extend(.peopleList);
border-bottom: 1px solid @grayLight;
margin-bottom: 0;
line-height: 1.5;
padding:15px 5px !important;
}
p:nth-child(1){
font-size: 14px;
}
.icon18{
margin-bottom: -4px;
}
}
\ No newline at end of file
......@@ -6,13 +6,14 @@ import CommonLayout from './layout/CommonLayout';
import Backlog from './pages/Backlog/Backlog'
import Work from './pages/Work/Work'
import Notice from './pages/Notice/Notice'
import Communicate from './pages/Communicate/Communicate'
import Communicate from './pages/Communicate/Communicate';
import AddressList from './pages/AddressList/AddressList';
import Process from './pages/EventProcessing/Process'
import NoFound from './pages/NoFound'
const ReactRouter = () => {
return (
<Router>
......@@ -22,6 +23,7 @@ const ReactRouter = () => {
<CommonLayout>
<Route path="/bord/backlog" component={Backlog}/>
<Route path="/bord/work" component={Work}/>
<Route path="/bord/addressList" component={AddressList}/>
<Route path="/bord/communicate" component={Communicate}/>
<Route path="/bord/notice" component={Notice}/>
</CommonLayout>
......
......@@ -58,4 +58,27 @@ table {
}
.mr-5{
margin-right: 5px !important;
}
.cicrleHead{
width:30px;
height:30px;
display: inline-block;
vertical-align: middle;
&.centerFont{
background-color: @primary;
color:#fff;
font-size: 14px;
font-weight: bold;
line-height: 30px;
text-align: center;
border-radius: 100%;
}
}
.imgRes{
width: auto;
max-width: 100%;
}
.icon18{
width:18px;
height: 18px;
}
\ 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