|
|
|
@ -1,24 +1,14 @@ |
|
|
|
import electron from "@/plugins/electron" |
|
|
|
import { addTodo, removeTodo } from "@/store/action/todo" |
|
|
|
import { |
|
|
|
Button, |
|
|
|
ButtonGroup, |
|
|
|
Card, |
|
|
|
ControlGroup, |
|
|
|
Elevation, |
|
|
|
FormGroup, |
|
|
|
HotkeysProvider, |
|
|
|
Icon, |
|
|
|
InputGroup, |
|
|
|
Overlay, |
|
|
|
TextArea, |
|
|
|
} from "@blueprintjs/core" |
|
|
|
import { Button, ButtonGroup, ControlGroup, FormGroup, HotkeysProvider, InputGroup } from "@blueprintjs/core" |
|
|
|
import { Cell, Column, Table2 } from "@blueprintjs/table" |
|
|
|
import React from "react" |
|
|
|
import { useState } from "react" |
|
|
|
import { connect } from "react-redux" |
|
|
|
import cs from "classnames" |
|
|
|
import _ from "lodash" |
|
|
|
import React, { useEffect, useRef, useState } from "react" |
|
|
|
import { connect } from "react-redux" |
|
|
|
import Dialog from "./Dialog" |
|
|
|
import style from "./index.module.scss" |
|
|
|
import useLocation from "./useLocation" |
|
|
|
|
|
|
|
export interface HomeProps { |
|
|
|
add(text: string): void |
|
|
|
@ -28,31 +18,64 @@ export interface HomeProps { |
|
|
|
remove(id: number): void |
|
|
|
} |
|
|
|
|
|
|
|
let keyGen = 0 |
|
|
|
|
|
|
|
function Home(props: HomeProps) { |
|
|
|
const [isOpen, setIsOpen] = useState<boolean>(false) |
|
|
|
let clockList = [ |
|
|
|
{ |
|
|
|
key: 1, |
|
|
|
title: "上班时间", |
|
|
|
startTime: "2021-01-01 09:00:00", |
|
|
|
endTime: "2021-01-01 17:00:00", |
|
|
|
desc: "描述", |
|
|
|
}, |
|
|
|
{ |
|
|
|
key: 2, |
|
|
|
title: "上班时间", |
|
|
|
startTime: "2021-01-01 09:00:00", |
|
|
|
endTime: "2021-01-01 17:00:00", |
|
|
|
desc: "描述", |
|
|
|
}, |
|
|
|
] |
|
|
|
const keyRef = useRef<HTMLInputElement>(null) |
|
|
|
|
|
|
|
function delItem() { |
|
|
|
let key = keyRef.current?.value |
|
|
|
if (key) { |
|
|
|
let index = _.findIndex(clockList, { key: +key }) |
|
|
|
if (index != -1) { |
|
|
|
var list = [...clockList] |
|
|
|
list.splice(index, 1) |
|
|
|
setClockList(list) |
|
|
|
keyRef.current!.value = "" |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
const { save, get } = useLocation() |
|
|
|
const [clockList, setClockList] = useState<Record<string, any>[]>([]) |
|
|
|
const keyList = _.map(clockList, "key") |
|
|
|
const titleList = _.map(clockList, "title") |
|
|
|
const startTimeList = _.map(clockList, "startTime") |
|
|
|
const endTimeList = _.map(clockList, "endTime") |
|
|
|
const timeList = _.map(clockList, "time") |
|
|
|
const descList = _.map(clockList, "desc") |
|
|
|
|
|
|
|
function onConfrim(title: string, time: string, desc: string) { |
|
|
|
if (title && time) { |
|
|
|
const value = { |
|
|
|
key: ++keyGen, |
|
|
|
title: title, |
|
|
|
time: time, |
|
|
|
desc: desc |
|
|
|
} |
|
|
|
setClockList([...clockList, value]) |
|
|
|
setIsOpen(false) |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
(async ()=>{ |
|
|
|
let list = await electron.ipcRenderer.invoke("@func:clock:getData") |
|
|
|
if(list){ |
|
|
|
setClockList(list) |
|
|
|
const keyList = _.map(list, "key") |
|
|
|
if (keyList.length) { |
|
|
|
keyGen = Math.max(...keyList) |
|
|
|
} |
|
|
|
} |
|
|
|
})() |
|
|
|
}, []) |
|
|
|
useEffect(() => { |
|
|
|
electron.ipcRenderer.send("@func:clock:saveData", clockList) |
|
|
|
}, [clockList]) |
|
|
|
|
|
|
|
return ( |
|
|
|
<div className={style.container}> |
|
|
|
<div className={cs(style.container, "container")}> |
|
|
|
<div className={style.title}>闹钟列表</div> |
|
|
|
<div className={style.opeation}> |
|
|
|
<ButtonGroup> |
|
|
|
@ -71,35 +94,34 @@ function Home(props: HomeProps) { |
|
|
|
<Table2 numRows={titleList.length}> |
|
|
|
<Column name="KEY" cellRenderer={index => <Cell>{keyList[index]}</Cell>}></Column> |
|
|
|
<Column name="标题" cellRenderer={index => <Cell>{titleList[index]}</Cell>}></Column> |
|
|
|
<Column name="开始时间" cellRenderer={index => <Cell>{startTimeList[index]}</Cell>}></Column> |
|
|
|
<Column name="结束时间" cellRenderer={index => <Cell>{endTimeList[index]}</Cell>}></Column> |
|
|
|
<Column name="时间" cellRenderer={index => <Cell>{timeList[index]}</Cell>}></Column> |
|
|
|
<Column name="描述" cellRenderer={index => <Cell>{descList[index]}</Cell>}></Column> |
|
|
|
</Table2> |
|
|
|
</HotkeysProvider> |
|
|
|
<div style={{ margin: "10px 0" }}> |
|
|
|
<FormGroup helperText="需要填入指定的闹钟进行删除" label="Key" labelFor="text-input" labelInfo="(required)"> |
|
|
|
<ControlGroup fill={false} vertical={false}> |
|
|
|
<InputGroup id="text-input" placeholder="请输入Key值进行删除" /> |
|
|
|
<Button icon="trash" intent="danger" type="submit"> |
|
|
|
<InputGroup inputRef={keyRef} id="text-input" placeholder="请输入Key值进行删除"/> |
|
|
|
<Button onClick={() => delItem()} icon="trash" intent="danger" type="submit"> |
|
|
|
删除 |
|
|
|
</Button> |
|
|
|
</ControlGroup> |
|
|
|
</FormGroup> |
|
|
|
</div> |
|
|
|
<Dialog isOpen={isOpen} setIsOpen={setIsOpen}></Dialog> |
|
|
|
<Dialog isOpen={isOpen} setIsOpen={setIsOpen} onConfrim={onConfrim}></Dialog> |
|
|
|
</div> |
|
|
|
) |
|
|
|
} |
|
|
|
|
|
|
|
const mapStateToProps = (state: any) => { |
|
|
|
return { |
|
|
|
todo: state.todo, |
|
|
|
todo: state.todo |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
const mapDispatchToProps = (dispatch: any) => ({ |
|
|
|
add: (text: string) => dispatch(addTodo(text)), |
|
|
|
remove: (id: string | number) => dispatch(removeTodo(id)), |
|
|
|
remove: (id: string | number) => dispatch(removeTodo(id)) |
|
|
|
}) |
|
|
|
|
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(Home) |
|
|
|
|
