jcnet/webio-node
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

add del event, add download event, add download event video

Browse Source
This commit is contained in:
Jay
2017-05-05 17:24:45 +08:00
parent 0cd5667f63
commit 7826befe8e
7 changed files with 125 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/AdminPage/IPCam/EventModal.js
+32 -4
View File
@@ -1,9 +1,9 @@
import React from 'react';
import { Modal, Grid, List, Menu, Icon } from 'semantic-ui-react';
import { Modal, Grid, List, Menu, Icon, Message } from 'semantic-ui-react';
import {convertTime} from '../../../tools';
import ImgGrid from './EvtImgGrid';
const EventModal = ({ i18n, open, name, list, sel, closeEventModal, changeSelectEvent,refreshEvt }) => {
const EventModal = ({ i18n, open, name, list, sel, closeEventModal, changeSelectEvent,refreshEvt, delEvent }) => {
return (
<Modal open={open} onClose={()=>{closeEventModal()}} size="fullscreen">
@@ -26,8 +26,17 @@ const EventModal = ({ i18n, open, name, list, sel, closeEventModal, changeSelect
let n = t.name;
let time = n.split('-')[1];
return (
<Menu.Item key={idx} active={sel == idx} onClick={()=>{changeSelectEvent(idx)}}>
{convertTime(time, true)}
<Menu.Item key={idx} active={sel == idx} >
<span onClick={()=>{changeSelectEvent(idx)}}
style={{cursor: "pointer"}}>{convertTime(time, true)}</span>
<Icon name="download" title="下載事件" style={{
cursor: "pointer",
float: 'right'
}} onClick={()=>{window.open(`/dlevent/${t.name}`, '_blank')}}/>
<Icon name="trash" title="刪除事件" style={{
cursor: "pointer",
float: 'right'
}} onClick={()=>{delEvent(t.name)}}/>
</Menu.Item>
)})
}
@@ -36,6 +45,25 @@ const EventModal = ({ i18n, open, name, list, sel, closeEventModal, changeSelect
</Menu>
</Grid.Column>
<Grid.Column width={12}>
{
sel != -1 && list[sel].files.video.length > 0 ? (
<Message>
<Message.Header>影片下載</Message.Header>
<p>
{
list[sel].files.video.map((t, idx) => {
return (
<div key={idx}>
<a href={`/dlcamvideo/${list[sel].name}/${t}`} target="_blank">{t}</a>
</div>
)
})
}
</p>
</Message>
) :null
}
{
sel != -1 ?
(
src/components/AdminPage/IPCam/IPCamModal.js
+2 -2
View File
@@ -46,10 +46,10 @@ const IPCamModal = ({ i18n, open, type, data, closeModal, submitModal }) => {
</select>
</Form.Field>
<Form.Field>
<Input name="maxevents" label="最大儲存事件數量(1-5)" defaultValue={data.maxevents} />
<Input name="maxevents" label="最大儲存事件數量(1-10)" defaultValue={data.maxevents} />
</Form.Field>
<Form.Field>
<Input name="maximg" label="最大儲存圖片數量(1-10)" defaultValue={data.maximg} />
<Input name="maximg" label="最大儲存圖片數量(1-20)" defaultValue={data.maximg} />
</Form.Field>
<Grid columns={2}>
<Grid.Column>
src/components/AdminPage/IPCam/index.js
+19 -3
View File
@@ -77,8 +77,8 @@ class IPCamPage extends React.Component {
submitModal = (type, data = {}) => {
let {toggleLoading,showDialog} = this.props;
if(type == 1 && !data.id) return showDialog('資料讀取錯誤');
if(!data.maxevents || data.maxevents < 1 || data.maxevents > 5) return showDialog('事件數量請介於1-5間');
if(!data.maximg || data.maximg < 1 || data.maximg > 10) return showDialog('圖片數量請介於1-5間');
if(!data.maxevents || data.maxevents < 1 || data.maxevents > 10) return showDialog('事件數量請介於1-5間');
if(!data.maximg || data.maximg < 1 || data.maximg > 20) return showDialog('圖片數量請介於1-5間');
if(!data.name) return showDialog('請輸入名稱');
if(!data.ip) return showDialog('請輸入IP');
if(!data.model) return showDialog('請選擇型號');
@@ -146,6 +146,21 @@ class IPCamPage extends React.Component {
})
}
delEvent = (dir) => {
if(!dir) return ;
let {callConfirm, toggleLoading, showDialog} = this.props;
callConfirm('確定刪除這筆事件?', ()=>{
toggleLoading(1);
fetch('/api/ipcam/delevent', getRequest({dir}))
.then(response=>response.json())
.then(json => {
toggleLoading(0);
if(json.status != 1) return showDialog(json.message);
this.getEvents(-1);
})
})
}
render() {
let {i18n} = this.props;
return (
@@ -197,7 +212,8 @@ class IPCamPage extends React.Component {
name={this.state.evt.name}
refreshEvt={this.getEvents}
closeEventModal={this.closeEventModal}
changeSelectEvent={this.changeSelectEvent} />
changeSelectEvent={this.changeSelectEvent}
delEvent={this.delEvent} />
</Container>
)
}