Commit af99de5f authored by 熊成伟's avatar 熊成伟

debug

parent d822ce8e
This diff is collapsed.
import React, {PureComponent} from 'react';
import {Icon, Popover} from 'antd-mobile'
import './index.less'
const Item = Popover.Item;
class Index extends PureComponent {
state={
visible: false
};
visibleChange = (visible) => {
this.setState({visible})
};
onSelect = (val) => {
console.log(this.props.id);
this.visibleChange(false)
}
render() {
const {type} = this.props;
const {visible} = this.state
return (
<div className={`adjunct-card ${type ? 'adjunct-word' : 'adjunct-pdf'}`}>
<div className="adjunct-title">
<img alt="" src={type ? '/img/test/test-2.png' : '/img/test/test.png'} className="adjunct-img"/>
<div>
<p className="adjunct-title-1">武汉考察注意政策</p>
<p className="adjunct-title-2">科技创新委员会</p>
</div>
</div>
<Popover
mask
visible={visible}
overlay={[
(<Item key="4" value="scan">下载</Item>),
]}
onVisibleChange={this.visibleChange}
onSelect={this.onSelect}
>
<Icon type="ellipsis" className="adjunct-icon" size="xxs"/>
</Popover>
</div>
);
}
}
export default Index;
.adjunct-card{
padding: 7px;
display: flex;
justify-content: space-between;
align-items: center;
border-radius: 7px;
margin-bottom: 6px;
}
.adjunct-word{
background: rgba(234, 244, 255, 1);
}
.adjunct-pdf{
background: rgba(255, 243, 234, 1);
}
.adjunct-title{
display: flex;
justify-content: flex-start;
}
.adjunct-img{
width: 33px;
height: 38px;
margin-right: 9px;
}
.adjunct-icon{
transform: rotate(90deg);
}
.adjunct-title-1{
font-size:14px;
}
.adjunct-title-2{
font-size:11px;
color:rgba(152,152,152,1);
}
...@@ -11,6 +11,8 @@ body { ...@@ -11,6 +11,8 @@ body {
html, html,
body, body,
#root { #root {
position: fixed;
top: 0; left: 0;right: 0; bottom: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
margin: 0; margin: 0;
......
import React from 'react'; import React from 'react';
import {WingBlank} from 'antd-mobile'
import {withRouter} from 'react-router-dom' import {withRouter} from 'react-router-dom'
const BlankLayout = (props) => { const BlankLayout = (props) => {
......
...@@ -10,3 +10,7 @@ ...@@ -10,3 +10,7 @@
height: 18px; height: 18px;
margin-bottom: 4px; margin-bottom: 4px;
} }
.am-activity-indicator.am-activity-indicator-toast{
background: rgba(35,35,35, 0.5);
}
import React, {Component} from 'react'; import React, {Component} from 'react';
import {List, WhiteSpace,Row,Col} from 'antd-mobile'; import './index.less';
import { BrowserRouter, Route, Link } from "react-router-dom";
import '../Communicate/index.less';
class AddressList extends Component { class AddressList extends Component {
state = { state = {
......
import React from 'react'; import React, {Component} from 'react';
import {WhiteSpace, WingBlank} from 'antd-mobile' import {WhiteSpace, WingBlank, ActivityIndicator} from 'antd-mobile'
import TodoCard from '../../components/TodoCard' import TodoCard from '../../components/TodoCard'
import TopSearch from '../../components/TopSearch' import TopSearch from '../../components/TopSearch'
const Backlog = (props) => {
const checkLog = () => { class Index extends Component {
props.history.push(`/blank/example/1`) state={
loading: false
}
checkLog = () => {
this.props.history.push(`/blank/example/1`)
} }
render() {
const {loading} = this.state
return ( return (
<WingBlank> <WingBlank>
<ActivityIndicator
toast
text="加载中..."
animating={loading}
/>
<WhiteSpace/> <WhiteSpace/>
<TopSearch onSearch={val => console.log(val)}/> <TopSearch onSearch={val => console.log(val)}/>
{ {
[{},{},{},{},{},{}].map((item, index) => ( [{},{},{},{},{},{}].map((item, index) => (
<div key={index}> <div key={index}>
<WhiteSpace/> <WhiteSpace/>
<TodoCard data={item} onCLick={checkLog}/> <TodoCard data={item} onCLick={this.checkLog}/>
</div> </div>
)) ))
...@@ -23,6 +34,7 @@ const Backlog = (props) => { ...@@ -23,6 +34,7 @@ const Backlog = (props) => {
</WingBlank> </WingBlank>
); );
}; }
}
export default Backlog; export default Index;
import React, {Component} from 'react';
import {List, WhiteSpace,Row,Col} from 'antd-mobile';
import TopSearch from '../../components/TopSearch'
import './index.less'
const Item = List.Item;
class Communicate extends Component {
render() {
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'>
<ul className='adListBox'>
<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
</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
</p>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
);
}
}
export default Communicate;
import React from 'react'; import React from 'react';
import List from '../../components/List' import List from '../../components/List'
import AdjunctList from '../../components/Adjunct'
const da222 = Array.from(new Array(7)).map((_val, i) => ({
id: `name${i}`,
text: `name${i}`,
}));
const Adjunct = () => { const Adjunct = () => {
const listData = [ const listData = [
{title: '开始时间', content: '文电科'}, {title: '开始时间', content: '文电科'},
...@@ -11,13 +17,14 @@ const Adjunct = () => { ...@@ -11,13 +17,14 @@ const Adjunct = () => {
{title: '备注', line: true, content: '函数是也是对象,是一个属性的集合,所以函数下也有属性,也可以自定义属性。当我们创建一个函数时就默认会有一个prototype属性,这个属性是一个对象(属性的集合)。这个东西就是原型---通过调用构造函数而创建的那个对象实例的原型对象。prototype里也有个属性constructor,指向的是函数本身'}, {title: '备注', line: true, content: '函数是也是对象,是一个属性的集合,所以函数下也有属性,也可以自定义属性。当我们创建一个函数时就默认会有一个prototype属性,这个属性是一个对象(属性的集合)。这个东西就是原型---通过调用构造函数而创建的那个对象实例的原型对象。prototype里也有个属性constructor,指向的是函数本身'},
{title: '附件', line: true, content: {title: '附件', line: true, content:
<div> <div>
<div style={{width: '100%', height: 44}}>111111</div> {da222.map((item, index) => (
<div style={{width: '100%', height: 44}}>111111</div> <AdjunctList key={index} {...item}/>
))}
</div> </div>
}, },
] ]
return ( return (
<div id="event-adjunct"> <div>
<List <List
listData={listData} listData={listData}
/> />
......
...@@ -23,7 +23,7 @@ const Basic = () => { ...@@ -23,7 +23,7 @@ const Basic = () => {
{title: '事由', content: '考察'}, {title: '事由', content: '考察'},
]; ];
return ( return (
<div id="event-basic"> <div>
<List <List
title={"6.1日,部门考察工作出差申请"} title={"6.1日,部门考察工作出差申请"}
listData={listData} listData={listData}
......
...@@ -3,7 +3,7 @@ import StepCard from '../../components/StepCard' ...@@ -3,7 +3,7 @@ import StepCard from '../../components/StepCard'
const Flow = () => { const Flow = () => {
return ( return (
<div id="event-flow"> <div>
<StepCard/> <StepCard/>
</div> </div>
); );
......
import React from 'react'; import React, {Component} from 'react';
import './index.less' import {Modal} from 'antd-mobile'
import './index.less';
const Option = (props) => { const operation = Modal.operation;
const topSearch = () => {
class Option extends Component {
state = {
}
onChange = () => {
const input = document.getElementsByClassName("option-text"); const input = document.getElementsByClassName("option-text");
props.onChange(input[0].value) this.props.onChange(input[0].value)
} }
render() {
return ( return (
<div id="event-option"> <div>
<div className="option-card"> <div className="option-card">
<div className="option-title"> <div className="option-title">
<div>流转意见:</div> <div>流转意见:</div>
<a className="option-fast">常用阅办意见<img alt="" src="/img/option-icon.png" className="option-icon"/></a> <a
className="option-fast"
onClick={() => operation([
{ text: '默认一', onPress: () => console.log('默认一被点击了') },
{ text: '默认二', onPress: () => console.log('默认二被点击了') },
])}
>
常用阅办意见<img alt="" src="/img/option-icon.png" className="option-icon"/>
</a>
</div> </div>
<textarea className="option-text" onChange={topSearch}/> <textarea className="option-text" onChange={this.onChange}/>
</div> </div>
</div> </div>
); );
}; }
}
export default Option; export default Option;
import React, {Component} from 'react'; import React, {Component} from 'react';
import {WingBlank, WhiteSpace, ActionSheet} from 'antd-mobile' import {WingBlank, WhiteSpace, ActionSheet, ActivityIndicator} from 'antd-mobile'
import './index.less' import './index.less'
import TopTabs from '../../components/TopTabs' import TopTabs from '../../components/TopTabs'
import Basic from './Basic' import Basic from './Basic'
...@@ -25,7 +25,8 @@ class Process extends Component { ...@@ -25,7 +25,8 @@ class Process extends Component {
current: 'basic', current: 'basic',
disabled: true, disabled: true,
footStatus: false, footStatus: false,
footButton: '处理' footButton: '处理',
loading: false
} }
}; };
componentDidMount() { componentDidMount() {
...@@ -48,17 +49,16 @@ class Process extends Component { ...@@ -48,17 +49,16 @@ class Process extends Component {
const top = event.scrollTop; const top = event.scrollTop;
const scrollHeight = event.scrollHeight; const scrollHeight = event.scrollHeight;
const clientHeight = event.clientHeight const clientHeight = event.clientHeight
if (top >= 0 && top < adjunct) {
if (top >= 0 && top < adjunct - 9) {
this.setState({current: 'basic'}) this.setState({current: 'basic'})
}else if (top >= adjunct && top < flow - 9) { }else if (top >= adjunct && top < flow) {
this.setState({current: 'adjunct'}) this.setState({current: 'adjunct'})
}else if (top >= flow && top < option - 9) { }else if (top >= flow && top < option) {
this.setState({current: 'flow'}) this.setState({current: 'flow'})
}else if (top >= option) { }else if (top >= option) {
this.setState({current: 'option'}) this.setState({current: 'option'})
} }
if (top + clientHeight == scrollHeight) { if (top + clientHeight === scrollHeight) {
this.setState({current: 'option'}) this.setState({current: 'option'})
} }
}; };
...@@ -67,11 +67,11 @@ class Process extends Component { ...@@ -67,11 +67,11 @@ class Process extends Component {
name === 'option' && document.getElementsByClassName("option-text")[0].focus(); name === 'option' && document.getElementsByClassName("option-text")[0].focus();
name === 'option' && this.optionBlur() name === 'option' && this.optionBlur()
const top = document.getElementById(`event-${name}`).offsetTop; const top = document.getElementById(`event-${name}`).offsetTop;
document.getElementById("event").scrollTo(0,top - 9); document.getElementById("event").scrollTo(0,top);
}; };
textClick = () => { textClick = () => {
const top = document.getElementById(`event-option`).offsetTop; const top = document.getElementById(`event-option`).offsetTop;
document.getElementById("event").scrollTo(0,top - 9) document.getElementById("event").scrollTo(0,top)
document.getElementsByClassName("option-text")[0].focus(); document.getElementsByClassName("option-text")[0].focus();
this.optionBlur() this.optionBlur()
} }
...@@ -93,19 +93,27 @@ class Process extends Component { ...@@ -93,19 +93,27 @@ class Process extends Component {
} }
render() { render() {
console.log(this.state.current); const {footButton, disabled, footStatus, current, loading} = this.state
const {footButton, disabled, footStatus, current} = this.state
return ( return (
<div> <div>
<ActivityIndicator
toast
text="加载中..."
animating={loading}
/>
<TopTabs page={current} onClick={this.tabClick}/> <TopTabs page={current} onClick={this.tabClick}/>
<div id="event"> <div id="event">
<WingBlank> <WingBlank>
<div id="event-basic"/>
<WhiteSpace/> <WhiteSpace/>
<Basic/> <Basic/>
<div id="event-adjunct"/>
<WhiteSpace/> <WhiteSpace/>
<Adjunct/> <Adjunct/>
<div id="event-flow"/>
<WhiteSpace/> <WhiteSpace/>
<Flow/> <Flow/>
<div id="event-option"/>
<WhiteSpace/> <WhiteSpace/>
<Option onChange={this.optionChange}/> <Option onChange={this.optionChange}/>
</WingBlank> </WingBlank>
......
import React, {Component} from 'react';
class SubmitDetail extends Component {
render() {
return (
<div>
</div>
);
}
}
export default SubmitDetail;
import React from 'react'; import React, {Component} from 'react';
import {WhiteSpace, WingBlank} from 'antd-mobile' import {ActivityIndicator, WhiteSpace, WingBlank} from 'antd-mobile'
import TodoCard from '../../components/TodoCard' import TodoCard from '../../components/TodoCard'
import TopNotice from '../../components/TopNotice' import TopNotice from '../../components/TopNotice'
const Notice = () => {
class Notice extends Component {
state={
loading: false
};
render() {
const {loading} = this.state;
return ( return (
<WingBlank> <WingBlank>
<ActivityIndicator
toast
text="加载中..."
animating={loading}
/>
<WhiteSpace/> <WhiteSpace/>
<TopNotice/> <TopNotice/>
<WhiteSpace/> <WhiteSpace/>
<TodoCard/> <TodoCard/>
</WingBlank> </WingBlank>
); );
}; }
}
export default Notice; export default Notice;
import React, {Component} from 'react'; import React, {Component} from 'react';
import {WhiteSpace, WingBlank} from "antd-mobile"; import {ActivityIndicator, WhiteSpace, WingBlank} from "antd-mobile";
import TopSearch from '../../components/TopSearch' import TopSearch from '../../components/TopSearch'
import WorkCard from '../../components/WorkCard' import WorkCard from '../../components/WorkCard'
class Work extends Component { class Work extends Component {
state = { state = {
addStatus: false addStatus: false,
loading: false
}; };
commonEdit = () => { commonEdit = () => {
const {addStatus} = this.state; const {addStatus} = this.state;
...@@ -24,7 +25,7 @@ class Work extends Component { ...@@ -24,7 +25,7 @@ class Work extends Component {
// index > -1 && arr.splice(index, 1); // index > -1 && arr.splice(index, 1);
}; };
render() { render() {
const {addStatus} = this.state; const {addStatus, loading} = this.state;
//测试数据 //测试数据
const data222 = Array.from(new Array(7)).map((_val, i) => ({ const data222 = Array.from(new Array(7)).map((_val, i) => ({
...@@ -40,6 +41,11 @@ class Work extends Component { ...@@ -40,6 +41,11 @@ class Work extends Component {
return ( return (
<WingBlank> <WingBlank>
<ActivityIndicator
toast
text="加载中..."
animating={loading}
/>
<WhiteSpace/> <WhiteSpace/>
<TopSearch onSearch={this.workSearch}/> <TopSearch onSearch={this.workSearch}/>
<WhiteSpace/> <WhiteSpace/>
......
...@@ -6,7 +6,6 @@ import CommonLayout from './layout/CommonLayout'; ...@@ -6,7 +6,6 @@ import CommonLayout from './layout/CommonLayout';
import Backlog from './pages/Backlog/Backlog' import Backlog from './pages/Backlog/Backlog'
import Work from './pages/Work/Work' import Work from './pages/Work/Work'
import Notice from './pages/Notice/Notice' import Notice from './pages/Notice/Notice'
import Communicate from './pages/Communicate/Communicate';
import AddressList from './pages/AddressList/AddressList'; import AddressList from './pages/AddressList/AddressList';
import Process from './pages/EventProcessing/Process' import Process from './pages/EventProcessing/Process'
...@@ -24,7 +23,6 @@ const ReactRouter = () => { ...@@ -24,7 +23,6 @@ const ReactRouter = () => {
<Route path="/bord/backlog" component={Backlog}/> <Route path="/bord/backlog" component={Backlog}/>
<Route path="/bord/work" component={Work}/> <Route path="/bord/work" component={Work}/>
<Route path="/bord/addressList" component={AddressList}/> <Route path="/bord/addressList" component={AddressList}/>
<Route path="/bord/communicate" component={Communicate}/>
<Route path="/bord/notice" component={Notice}/> <Route path="/bord/notice" component={Notice}/>
</CommonLayout> </CommonLayout>
}/> }/>
......
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