diff --git a/src/components/Meeting/BuildMeeting.js b/src/components/Meeting/BuildMeeting.js index 29d0b1d14af7e9f08a6fc5d11df15921bb55b973..c6a3a0c7177946e891128f6ae42925caa16f9d69 100644 --- a/src/components/Meeting/BuildMeeting.js +++ b/src/components/Meeting/BuildMeeting.js @@ -10,12 +10,12 @@ export default class BuildMeeting extends Component { super(props); const { user } = OAglobal; this.state = { - key:this.props.data.data.length+1, date:moment().locale('en').utcOffset(0).format().slice(0,10), meeting:null, status:'未召开', role:'部门例会', - owner: user.name + owner: user.name, + depart:user.depart } this.submit = this.submit.bind(this); } @@ -48,12 +48,12 @@ export default class BuildMeeting extends Component { type:'meeting/createMeeting', payload:this.state }); + console.log(this.state); this.setState({ - key:null, - date:moment().locale('en').utcOffset(0).format().slice(0,10), - meeting:null, - status:'未召开', - role:'部门例会' + date:moment().locale('en').utcOffset(0).format().slice(0,10), + meeting:null, + status:'未召开', + role:'部门例会' }); setTimeout(function () { message.success('会议发起成功'); @@ -64,12 +64,12 @@ export default class BuildMeeting extends Component { } componentWillReceiveProps(nextProps) { this.setState({ - key:nextProps.data.data.length+1 + id:nextProps.data.data.length+1 }) } render() { return ( -
+
会议时间 this.setDate(date,dateString)} @@ -83,10 +83,12 @@ export default class BuildMeeting extends Component {
会议分类 - this.setRole(value)} defaultValue="部门例会" style={{width:120}}> + { + OAglobal.meetingRoles.map(function(item) { + + }) + }
diff --git a/src/components/Meeting/MeetingEdit.js b/src/components/Meeting/MeetingEdit.js new file mode 100644 index 0000000000000000000000000000000000000000..5a94c29186c71c64a92fb06d7e7956cb6fc20985 --- /dev/null +++ b/src/components/Meeting/MeetingEdit.js @@ -0,0 +1,18 @@ +import React, { Component } from 'react'; + +export default class MeetingEdit extends Component { + handleClick = () => { + this.props.seeMeeting(this.props.record) + } + handleEdit = () => { + this.props.editMeeting(this.props.record) + } + render() { + const {record} = this.props; + if (record.status == '已召开') { + return 查看内容; + } else{ + return 编辑内容; + } + } +} \ No newline at end of file diff --git a/src/components/Meeting/MeetingFilter.css b/src/components/Meeting/MeetingFilter.css new file mode 100644 index 0000000000000000000000000000000000000000..b8864f8d3780430d6bd32d2969dbdc825f290f85 --- /dev/null +++ b/src/components/Meeting/MeetingFilter.css @@ -0,0 +1 @@ +.oa_ant_advanced_search_form{padding:8pt 24px}.oa_form_title{font-size:1rem;padding-right:20px}.oa_member_table{border-radius:0}.oa_member_filter_search{padding:8px;border-radius:6px;background:#fff;box-shadow:0 1px 6px rgba(0,0,0,.2)}.oa_member_filter_search_input{width:130px;margin-right:8px} \ No newline at end of file diff --git a/src/components/Meeting/MeetingFilter.js b/src/components/Meeting/MeetingFilter.js new file mode 100644 index 0000000000000000000000000000000000000000..7c4783127422426490231289d8cef0b630429e29 --- /dev/null +++ b/src/components/Meeting/MeetingFilter.js @@ -0,0 +1,95 @@ +import React, { Component, PropTypes } from 'react'; +import { Select, Row, Col, Form, Input, Button ,DatePicker } from 'antd'; +import styles from './MeetingFilter.less'; +const Option = Select.Option; +const FormItem = Form.Item; +const { RangePicker } = DatePicker; + +class MeetingFilter extends Component { + + state = { + conditions: { + depart:OAglobal.user.depart + } + } + + handleChange = (prop, value) => { + const { conditions } = this.state; + conditions[prop] = value; + this.setState({ conditions }); + } + + // 提交表单 + handleSearch = (e) => { + e.preventDefault(); + this.props.handleSearch(this.state.conditions); + } + + handleTime = (dates,dateString,e) => { + this.state.conditions['time1'] = dateString[0]; + this.state.conditions['time2'] = dateString[1]; + } + + render() { + const FormItemLayout = { + labelCol: {span: 6}, + wrapperCol: { span: 18 } + }; + return ( +
+
+ + + + + + + + + + + this.handleTime(dates,dateString)}/> + + + + + + + + + + + + + + + +
+
+ ); + } +} + +const MeetingFilterForm = Form.create()(MeetingFilter); + +export default MeetingFilterForm; \ No newline at end of file diff --git a/src/components/Meeting/MeetingFilter.less b/src/components/Meeting/MeetingFilter.less new file mode 100644 index 0000000000000000000000000000000000000000..6ab592b2c1eba5b3539d946817d02584bff24da8 --- /dev/null +++ b/src/components/Meeting/MeetingFilter.less @@ -0,0 +1,27 @@ +.oa_ant_advanced_search_form { + padding: 8pt 24px; + /*background: #fbfbfb;*/ + /*border: 1px solid #d9d9d9;*/ +} + +.oa_form_title { + font-size: 1rem; + padding-right: 20px; +} + +.oa_member_table { + border-radius: 0px; + /*max-height: 700px;*/ +} + +.oa_member_filter_search { + padding: 8px; + border-radius: 6px; + background: #fff; + box-shadow: 0 1px 6px rgba(0, 0, 0, .2); +} + +.oa_member_filter_search_input { + width: 130px; + margin-right: 8px; +} \ No newline at end of file diff --git a/src/components/Meeting/MeetingPanel.js b/src/components/Meeting/MeetingPanel.js index 187f4002a6bef5d1cc88f8eeff4a466d6e025538..bc4596477c62745818290a7973f0062ee4ff13aa 100644 --- a/src/components/Meeting/MeetingPanel.js +++ b/src/components/Meeting/MeetingPanel.js @@ -1,8 +1,12 @@ import DataTable from '../Common/DataTable.js'; import WriteOnlyMeeting from './WriteOnlyMeeting.js'; import ReadOnlyMeeting from './ReadOnlyMeeting.js'; +import MeetingEdit from './MeetingEdit.js'; import React,{ Component,PropTypes } from 'react'; import { Popconfirm,message } from 'antd'; +import SelectCell from '../Common/SelectCell.js'; +import MeetingFilter from '../meeting/MeetingFilter.js'; + class MeetingPanel extends Component { constructor(props) { super(props); @@ -16,7 +20,7 @@ class MeetingPanel extends Component { { title:'日期', dataIndex:'date', - key:'time' + key:'date' }, { title:'会议', @@ -50,7 +54,7 @@ class MeetingPanel extends Component { key:'operate', render:(text,record,index) => { return ( - + ) } } @@ -60,83 +64,46 @@ class MeetingPanel extends Component { } //编辑table editMeeting(record) { - return () => { - //保证页面上只显示一个table const { user } = OAglobal; if (user.name !== record.owner) { message.error('只有会议发起者才能编辑'); return; }else { - if (!this.state.isVisibleWritten) { - this.setState({ - isVisibleWritten:!this.state.isVisibleWritten, - isVisibleRead:false, - record:record - }) - } + this.props.showPullScreen({ + content: + }) } - } } //查看table seeMeeting(record) { - return () => { - this.setState({ - record:record - }); - //保证页面上只显示一个table - if (!this.state.isVisibleRead) { - this.setState({ - isVisibleWritten:false, - isVisibleRead:!this.state.isVisibleRead, - record:record - }) - } - } + this.props.showPullScreen({ + content: + }) } + closeTable() { - this.setState({ - isVisibleRead:false, - isVisibleWritten:false + this.props.closePullScreen(); + } + + handleSearch = (param) => { + this.props.dispatch({ + type:'meeting/fetchAllMeeting', + payload:param }) } + render() { let data = this.props.data; const columns = this.columns; - //测试数据 - const text = { - key:1, - date:2016/11/20, - time:'9:30', - name:'第一次全员大会', - people:'张春林', - role:'部门例会', - text:'啊哈哈哈哈哈' - }; return (
+ - { - this.state.isVisibleWritten - && - - } - { - this.state.isVisibleRead - && - - } + style={{width:'100%',height:'100%',display:'inline-block',marginRight:20}}/>
) } } -function Edit(props){ - const record = props.record; - if (record.status == '已召开') { - return 查看内容 - }else{ - return 编辑内容 - } -} + export default MeetingPanel; diff --git a/src/components/Meeting/ReadOnlyMeeting.js b/src/components/Meeting/ReadOnlyMeeting.js index 41672c232101f30687d7706ba2a561198d9b0078..a860d578dac9de08a8c87c40909627ae91335a9d 100644 --- a/src/components/Meeting/ReadOnlyMeeting.js +++ b/src/components/Meeting/ReadOnlyMeeting.js @@ -10,7 +10,7 @@ export default class ReadOnlyMeeting extends Component {
会议时间 -
{`${this.props.data.date} ${this.props.data.time}`}
+
{this.props.data.date}
会议名称 diff --git a/src/components/Meeting/WriteOnlyMeeting.css b/src/components/Meeting/WriteOnlyMeeting.css index edb608f7333e22b486fa354f5ec39ad7e8bf1a75..f7e20663aef5a0a7fa9f47a40fc66a369f8f97ff 100644 --- a/src/components/Meeting/WriteOnlyMeeting.css +++ b/src/components/Meeting/WriteOnlyMeeting.css @@ -5,14 +5,13 @@ margin-right: 20px; } .wrapper{ - width:45%; + width:100%; display:inline-block; padding: 20px; - box-shadow: 0 0 6px 3px #ccc; vertical-align: top; } .div{ - padding: 5px; + padding: 10px; } .input{ width: 400px; diff --git a/src/components/Meeting/WriteOnlyMeeting.js b/src/components/Meeting/WriteOnlyMeeting.js index e547fad2c7a7af3024821d230c22277508c6c1b9..90c9deb73636e107401eebebb24443f5f9d60905 100644 --- a/src/components/Meeting/WriteOnlyMeeting.js +++ b/src/components/Meeting/WriteOnlyMeeting.js @@ -7,56 +7,58 @@ export default class WriteOnlyMeeting extends Component { constructor(props) { super(props); this.state = { - key:this.props.data.key, - date:null, - time:null, - status:'已召开', - meeting:this.props.data.meeting, - people:null, - role:'部门例会', - text:null + infor:{ + id:this.props.data.id, + date:null, + status:'已召开', + meeting:this.props.data.meeting, + people:null, + role:'部门例会', + text:null + }, + show:false }; this.submit = this.submit.bind(this); - this.reset = this.reset.bind(this); } setRole(value) { - this.setState({ - role:value - }) + const { infor } = this.state; + infor.role = value; } setPeople(ev) { - this.setState({ - people:ev.target.value - }) + const { infor } = this.state; + infor.people = ev.target.value } setName(ev) { - this.setState({ - meeting:ev.target.value - }) + const { infor } = this.state; + infor.meeting = ev.target.value; } setDate(date,dateString) { + const { infor } = this.state; + infor.date = dateString; this.setState({ - date:dateString + show:true }) } setText(ev) { let text = ev.target.value; let text2 = text.replace(/\s/g,'
'); - this.setState({ - text:text2 - }) + const { infor } = this.state; + infor.text = text2; } - setTime = (moment) => { - this.setState({ - time:moment.format('LT') - }) + setTime = (time,timeString) => { + if (this.state.infor.date != null) { + const { infor } = this.state; + infor.date = this.state.infor.date + ' ' + timeString; + }else{ + message.error('请先选择日期'); + } } //更新table submit() { - let states = this.state; + let { infor } = this.state; let val = true; - for ( let x in states) { - if (states[x] == null) { + for ( let x in infor) { + if (infor[x] == null) { message.error('填写的内容不能为空'); val = false; break; @@ -66,25 +68,22 @@ export default class WriteOnlyMeeting extends Component { this.props.dispatch({ type:'meeting/updateList', payload:{ - meeting:this.state + meeting:infor } }); message.success("保存成功"); setTimeout(function () { - this.props.closeTable(); + this.props.closePullScreen(); }.bind(this),500); } } - reset() { - this.props.closeTable(); - } render() { return (
会议时间 this.setDate(date,dateString)}/> - + {this.state.show && }
会议名称 @@ -110,13 +109,6 @@ export default class WriteOnlyMeeting extends Component { -
- - - -
) } diff --git a/src/index.html b/src/index.html index 9ea0fb2860f86e8e6b412b3c482fcc1693f12a55..c4e8956a29f97b21278e27c05c6b40c7be78425b 100755 --- a/src/index.html +++ b/src/index.html @@ -15,13 +15,21 @@ // 全局变量,由服务端输出 var OAglobal = { user: { - // avatar: 'http://online.hfut.edu.cn/online_logo.png', - avatar: 'default', + avatar: 'http://online.hfut.edu.cn/online_logo.png', stuid: 201111111, - name: '村上春树', + name: '曹善敏', depart: 3, role: 3 }, + meetingRoles:[ + { + key:1,value:'全员大会',text:'全员大会' + },{ + key:2,value:'部门例会',text:'部门例会' + },{ + key:3,value:'其他',text:'其他' + } + ], currentPeriod: 11, navList: [ { @@ -40,15 +48,10 @@ link: 'report' }, { - key: 'setting', - text: '设置', - link: 'setting' + key: 'meeting', + text: '会议', + link: 'meeting' } - // { - // key: 'meeting', - // text: '会议', - // link: 'meeting' - // } ], memberStatus: [ { diff --git a/src/models/meeting.js b/src/models/meeting.js index 3950e5c5071c20341ea1593055903f1b4e03e2a8..89737e72233b63ad33b3ab86c5057519a7d64b37 100644 --- a/src/models/meeting.js +++ b/src/models/meeting.js @@ -14,12 +14,14 @@ export default { }, subscriptions: { - setup({ dispatch, history }) { + setup({ dispatch, history ,payload }) { history.listen(location => { if (location.pathname === '/meeting') { dispatch({ type: 'fetchAllMeeting', - payload: {} + payload: { + depart:OAglobal.user.depart + } }); } }); @@ -29,7 +31,7 @@ export default { effects: { // 获取所有会议信息 *fetchAllMeeting({ payload }, { call, put }) { - const { data } = yield call(queryMeeting); + const { data } = yield call(queryMeeting,parse(payload)); if (data) { yield put({ type: 'querySuccess', @@ -51,7 +53,7 @@ export default { type: 'updateSuccess', payload: payload }) - }else { + } else { yield put({ type: 'updateFailure' }) @@ -70,7 +72,7 @@ export default { type: 'queryFailure' }) } - } + }, }, reducers: { querySuccess(state, action) { @@ -87,8 +89,9 @@ export default { updateSuccess(state , action) { const meetingContent = action.payload; + console.log('meetingContent',meetingContent); const data = state.data.map(item => { - if (item.key == action.payload.meeting.key) { + if (item.id == action.payload.meeting.id) { return { ...item, ...action.payload.meeting } } return item; @@ -104,7 +107,7 @@ export default { addSuccess(state , action) { const data = action.payload; let oldData = state.data; - oldData.splice(0,0,data); + oldData.unshift(data); const param = { data:oldData, shouldUpdate:true diff --git a/src/routes/Meeting.js b/src/routes/Meeting.js index 5af7086c7e29cbc12104cd19f1a751c4cabbf4f3..16ccaa9210a2a11627cfc865b17fadf049c1c5df 100644 --- a/src/routes/Meeting.js +++ b/src/routes/Meeting.js @@ -5,13 +5,19 @@ import Layout from '../components/Common/Layout.js'; import TabPage from '../components/Common/TabPage.js'; import MeetingPanel from '../components/Meeting/MeetingPanel.js'; import BuildMeeting from '../components/Meeting/BuildMeeting.js'; +import PullScreen from '../components/Common/PullScreen.js'; class Meeting extends Component { constructor(props) { super(props); this.state = { meeting:props.meeting.data, - currentNav:2 + currentNav:2, + pullScreen:{ + isShow:false, + title:null, + content:null + } } } @@ -20,13 +26,43 @@ class Meeting extends Component { meeting: nextProps.meeting.data }); } + + showPullScreen = (pullScreen) => { + this.setState({ + pullScreen :{ + isShow:true, + title:pullScreen.title || '', + content:pullScreen.content + } + }) + } + handlechange = () => { + this.props.dispatch({ + type:'fetchAllMeeting', + payload:{ + depart:OAglobal.user.depart + } + }) + } + closePullScreen = () => { + this.setState({ + pullScreen:{ + isShow:false, + title:null, + content:null + } + }) + } + render() { const { user } = OAglobal; + // console.log('meeting',this.state.meeting); const tabItems1 = [ { text:'我的会议', key:'done', - content: + content: }, { text:'发起会议', @@ -42,9 +78,16 @@ class Meeting extends Component { } ]; const tabItems = user.role > 1 ? tabItems1:tabItems2; + const pullScreen = this.state.pullScreen; return ( + ) } } diff --git a/src/services/meeting.js b/src/services/meeting.js index 0b0d73cf628b68f29cfaff4f5d9f8877485216ef..ce0f59563bb8015c3d7239b0319994ffa62ca1e6 100644 --- a/src/services/meeting.js +++ b/src/services/meeting.js @@ -1,13 +1,21 @@ import request from '../utils/request'; import qs from 'qs'; -export async function queryMeeting () { - return request('/api/meeting') +export async function queryMeeting (params) { + return request(`/api/meeting?${qs.stringify(params)}`,{ + credentials:'include', + headers: { + 'Content-Type': 'application/x-www-form-urlencoded' + } + }) } export async function updateMeeting (params) { return request('/api/meeting/',{ - method: 'put', + method: 'post', mode: 'cors', credentials: 'include', + headers: { + 'Content-Type': 'application/x-www-form-urlencoded' + }, body: qs.stringify(params) }) } @@ -16,6 +24,9 @@ export async function addMeeting (params) { method:'put', mode:'cors', credentials:'include', + headers: { + 'Content-Type': 'application/x-www-form-urlencoded' + }, body:qs.stringify(params) }) -} \ No newline at end of file +}