add confirm box
This commit is contained in:
parent
27d2209ea2
commit
b07e51ef7c
File diff suppressed because it is too large
Load Diff
@ -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() {
|
||||
|
@ -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 = {}) => {
|
||||
|
15
src/components/ConfirmBox.js
Normal file
15
src/components/ConfirmBox.js
Normal 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;
|
@ -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))
|
||||
}
|
||||
})
|
||||
|
||||
|
@ -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))
|
||||
}
|
||||
})
|
||||
|
||||
|
@ -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));
|
||||
}
|
||||
|
@ -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}
|
||||
|
19
src/containers/ConfirmControl.js
Normal file
19
src/containers/ConfirmControl.js
Normal 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);
|
15
src/reducers/confirmbox.js
Normal file
15
src/reducers/confirmbox.js
Normal 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;
|
@ -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;
|
Loading…
Reference in New Issue
Block a user