add confirm box

This commit is contained in:
Jay 2017-04-26 15:05:03 +08:00
parent 27d2209ea2
commit b07e51ef7c
11 changed files with 481 additions and 407 deletions

File diff suppressed because it is too large Load Diff

View File

@ -75,13 +75,15 @@ class Location extends React.Component {
delLocation = (id) => {
if(!id) return ;
let {showDialog} = this.props;
fetch('/api/wristband/dellocation', getRequest({id}))
.then(response => response.json())
.then(json => {
if(json.status != 1) return showDialog(json.message);
this.getList();
})
let {showDialog, callConfirm} = this.props;
callConfirm('確定要刪除這筆定位點資料?', ()=>{
fetch('/api/wristband/dellocation', getRequest({id}))
.then(response => response.json())
.then(json => {
if(json.status != 1) return showDialog(json.message);
this.getList();
})
})
}
render() {

View File

@ -44,13 +44,16 @@ class WristbandInfo extends React.Component {
delWristband = (id) => {
if(!id) return ;
let {showDialog, callConfirm} = this.props;
fetch('/api/wristband/delwristband', getRequest({id}))
.then(response=>response.json())
.then(json=>{
if(json.status!=1) return showDialog(json.message);
this.getList();
})
callConfirm('確定要刪除這筆手環資料?', ()=>{
fetch('/api/wristband/delwristband', getRequest({id}))
.then(response=>response.json())
.then(json=>{
if(json.status!=1) return showDialog(json.message);
this.getList();
})
})
}
openModal = (type, data = {}) => {

View File

@ -0,0 +1,15 @@
import React from 'react';
import {Modal, Button} from 'semantic-ui-react';
const ConfirmBox = ({obj, getNext}) => (
<Modal open={obj && obj.msg != '' ? true : false} onClose={() => getNext()} style={{zIndex: "2001"}}>
<Modal.Content>{obj && obj.msg ? obj.msg : ''}</Modal.Content>
<Modal.Actions>
<Button onClick={() => getNext(true, obj.act)} content="Submit" />
<Button onClick={() => getNext()} content="Cancel" />
</Modal.Actions>
</Modal>
);
export default ConfirmBox;

View File

@ -1,5 +1,5 @@
import { connect } from 'react-redux';
import { add_dialog_msg, toggle_loading } from '../../../actions';
import { add_dialog_msg, toggle_loading, add_confirm } from '../../../actions';
import LocationPage from '../../../components/AdminPage/Wristband/Location';
@ -13,6 +13,9 @@ const mapDispatchToProps = (dispatch, ownProps) => ({
},
toggleLoading: (flag = false) => {
dispatch(toggle_loading(flag));
},
callConfirm: (msg, act = null) => {
dispatch(add_confirm(msg, act))
}
})

View File

@ -1,5 +1,5 @@
import { connect } from 'react-redux';
import { add_dialog_msg, toggle_loading } from '../../../actions';
import { add_dialog_msg, toggle_loading, add_confirm } from '../../../actions';
import WristbandInfo from '../../../components/AdminPage/Wristband/WristbandInfo';
@ -13,6 +13,9 @@ const mapDispatchToProps = (dispatch, ownProps) => ({
},
toggleLoading: (flag = false) => {
dispatch(toggle_loading(flag));
},
callConfirm: (msg, act = null) => {
dispatch(add_confirm(msg, act))
}
})

View File

@ -1,16 +1,16 @@
import {connect} from 'react-redux';
import {add_dialog_msg, toggle_loading} from '../../../actions';
import { connect } from 'react-redux';
import { add_dialog_msg, toggle_loading, add_confirm } from '../../../actions';
import WristbandPage from '../../../components/AdminPage/Wristband';
const mapStateToProps = (state) => ({
i18n: state.i18n
i18n: state.i18n
});
const mapDispatchToProps = (dispatch, ownProps) => ({
showDialog: (msg) => {
dispatch(add_dialog_msg(msg));
},
showDialog: (msg) => {
dispatch(add_dialog_msg(msg));
},
toggleLoading: (flag = false) => {
dispatch(toggle_loading(flag));
}

View File

@ -4,6 +4,7 @@ import Datetime from 'react-datetime';
import MainMenu from '../../containers/MenuControl';
import Loading from '../../containers/LoadingControl';
import Dialog from '../DialogControl';
import ConfirmBox from '../ConfirmControl';
import Dashboard from '../../containers/DashBoard';
import {toggle_dashboard} from '../../actions'
@ -27,6 +28,7 @@ class AdmPage extends React.Component {
<div style={{height: '100%'}}>
<Loading />
<Dialog />
<ConfirmBox />
<MainMenu i18n={i18n} >
<Dashboard />
{children}

View File

@ -0,0 +1,19 @@
import { connect } from 'react-redux';
import ConfirmBox from '../components/ConfirmBox';
import { remove_confirm } from '../actions'
const mapStateToProps = (state) => ({
obj: state.confirmbox[0] || null
});
const mapDispatchToProps = (dispatch, ownProps) => ({
getNext: (doit = false, act = null) => {
//get next dialog message
if (doit) {
if (typeof act == 'function') act();
}
dispatch(remove_confirm());
}
});
export default connect(mapStateToProps, mapDispatchToProps)(ConfirmBox);

View File

@ -0,0 +1,15 @@
const confirmbox = (state = [], action) => {
switch (action.type) {
case 'confirm_addmsg':
return [...state, {
msg: action.msg,
act: action.act || null
}];
case 'confirm_remove':
return state.slice(1);
default:
return state;
}
}
export default confirmbox;

View File

@ -1,16 +1,18 @@
import {combineReducers} from 'redux';
import { combineReducers } from 'redux';
import dialog from './dialog';
import i18n from './i18n';
import ui from './ui';
import sysinfo from './sysinfo';
import lists from './lists';
import confirmbox from './confirmbox';
const reducers = combineReducers({
dialog,
i18n,
ui,
sysinfo,
lists
dialog,
i18n,
ui,
sysinfo,
lists,
confirmbox
});
export default reducers;