add

a.md

@@ -23,3 +23,5 @@ https://www.jianshu.com/p/4699b825d285
     https://www.npmjs.com/package/node-fetch
     https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API/Using_Fetch
     react-desktop
+
+    考虑使用谷歌的材料ui

backup/Home/index.module.scss

@@ -0,0 +1,10 @@
+.container {
+  padding: 20px;
+  .title {
+    font-size: 25px;
+    font-weight: bolder;
+  }
+  .opeation {
+    margin: 20px 0;
+  }
+}

backup/Home/index.tsx

@@ -0,0 +1,152 @@
+import electron from "@/plugins/electron"
+import { addTodo, removeTodo } from "@/store/action/todo"
+import { Button, ButtonGroup, ControlGroup, FormGroup, HotkeysProvider, InputGroup } from "@blueprintjs/core"
+import { Cell, Column, Table2 } from "@blueprintjs/table"
+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
+
+  todo: ITodo[]
+
+  remove(id: number): void
+}
+
+let keyGen = 0
+
+function Home(props: HomeProps) {
+  const [isOpen, setIsOpen] = useState<boolean>(false)
+  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 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={cs(style.container, "container")}>
+      <div className={style.title}>闹钟列表</div>
+      <div className={style.opeation}>
+        <ButtonGroup>
+          <Button
+            icon="insert"
+            onClick={() => {
+              setIsOpen(true)
+            }}
+          >
+            添加闹钟
+          </Button>
+          <Button icon="refresh">同步闹钟</Button>
+        </ButtonGroup>
+      </div>
+      <table>
+        <thead>
+          <tr>
+            <th>Month</th>
+            <th>Savings</th>
+          </tr>
+        </thead>
+
+        <tfoot>
+          <tr>
+            <td>Sum</td>
+            <td>$180</td>
+          </tr>
+        </tfoot>
+
+        <tbody>
+          <tr>
+            <td>January</td>
+            <td>$100</td>
+          </tr>
+          <tr>
+            <td>February</td>
+            <td>$80</td>
+          </tr>
+        </tbody>
+      </table>
+      {/* <HotkeysProvider>
+        <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>{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 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} onConfrim={onConfrim}></Dialog>
+    </div>
+  )
+}
+
+const mapStateToProps = (state: any) => {
+  return {
+    todo: state.todo,
+  }
+}
+
+const mapDispatchToProps = (dispatch: any) => ({
+  add: (text: string) => dispatch(addTodo(text)),
+  remove: (id: string | number) => dispatch(removeTodo(id)),
+})
+
+export default connect(mapStateToProps, mapDispatchToProps)(Home)

src/main/facilities/float/index.ts

@@ -82,7 +82,7 @@ ipcMain.on("@func:float:showRightMenu", e => {
 function createSuspensionWindow() {
   Shared.data.floatWindow = new BrowserWindow({
     width: 260, // 悬浮窗口的宽度 比实际DIV的宽度要多2px 因为有1px的边框
-    height: 95, // 悬浮窗口的高度 比实际DIV的高度要多2px 因为有1px的边框
+    height: 105, // 悬浮窗口的高度 比实际DIV的高度要多2px 因为有1px的边框
     type: "toolbar", // 创建的窗口类型为工具栏窗口
     frame: false, // 要创建无边框窗口
     resizable: false, // 禁止窗口大小缩放

src/render/views/About/index.tsx

@@ -1,7 +1,7 @@
 import React from "react"
 import style from "./index.module.scss"
 import { useLocation, Route, Switch, useHistory } from "react-router-dom"
-// import html from "./a.md"
+import html from "./a.md"
 
 function Test() {
   return <div>test</div>
@@ -20,7 +20,7 @@ export default function About(props: any) {
   return (
     <div className={`container ${style.about}`}>
       <div className={"bp3-running-text bp3-text-large"}>
-         {/* {html} */}
+        {html}
       </div>
       {/*<div onClick={() =>back()}>阿萨 阿松大asdasd</div>*/}
       {/*<div>22{props.children}{location.href}</div>*/}

src/render/views/Home/index.tsx

@@ -1,127 +1,15 @@
 import electron from "@/plugins/electron"
-import { addTodo, removeTodo } from "@/store/action/todo"
-import { Button, ButtonGroup, ControlGroup, FormGroup, HotkeysProvider, InputGroup } from "@blueprintjs/core"
-import { Cell, Column, Table2 } from "@blueprintjs/table"
 import cs from "classnames"
 import _ from "lodash"
-import React, { useEffect, useRef, useState } from "react"
+import React 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
-
-  todo: ITodo[]
-
-  remove(id: number): void
-}
-
-let keyGen = 0
-
-function Home(props: HomeProps) {
-  const [isOpen, setIsOpen] = useState<boolean>(false)
-  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 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])
 
+function Home() {
   return (
     <div className={cs(style.container, "container")}>
-      <div className={style.title}>闹钟列表</div>
+      add 
-      <div className={style.opeation}>
-        <ButtonGroup>
-          <Button
-            icon="insert"
-            onClick={() => {
-              setIsOpen(true)
-            }}
-          >
-            添加闹钟
-          </Button>
-          <Button icon="refresh">同步闹钟</Button>
-        </ButtonGroup>
-      </div>
-      <HotkeysProvider>
-        <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>{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 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} onConfrim={onConfrim}></Dialog>
     </div>
   )
 }
 
-const mapStateToProps = (state: any) => {
+export default Home
-  return {
-    todo: state.todo
-  }
-}
-
-const mapDispatchToProps = (dispatch: any) => ({
-  add: (text: string) => dispatch(addTodo(text)),
-  remove: (id: string | number) => dispatch(removeTodo(id))
-})
-
-export default connect(mapStateToProps, mapDispatchToProps)(Home)

src/render/views/Layout/index.module.scss

@@ -3,6 +3,15 @@
   height: 100vh;
   position: relative;
   transform:scale(1,1);
+  &.NoLayout{
+    .left {
+      display: none;
+      width: 0;
+    }
+    .right{
+      margin-left: 0;
+    }
+  }
   .left {
     position: fixed;
     left: 0;

src/render/views/Layout/index.tsx

@@ -3,11 +3,11 @@ import route, { useRoute } from "@render/route"
 import React, { Fragment } from "react"
 import { NavLink, useLocation } from "react-router-dom"
 import style from "./index.module.scss"
-import { TitleBar, Toolbar, Text } from "react-desktop/macOs"
+import cs from "classnames"
 
-// interface IProps {
+function ActionItem(){
-//   render(): ReactElement
+  
-// }
+}
 
 export default function Layout(props: any) {
   let isLayout = true
@@ -26,8 +26,8 @@ export default function Layout(props: any) {
     {
       path: "/home",
       icon: "time",
-      title: "添加闹钟",
+      title: "首页",
-      text: "闹钟",
+      text: "首页",
     },
     {
       path: "/about",
@@ -35,39 +35,34 @@ export default function Layout(props: any) {
       title: "添加闹钟",
       text: "关于",
     },
-    {
-      path: "/float",
-      icon: "mugshot",
-      title: "浮动框测试",
-      text: "浮动",
-    },
   ]
 
-  return isLayout ? (
+  return (
-      <div className={style.Layout}>
+    <div className={cs(style.Layout, !isLayout ? style.NoLayout : "")}>
-        <div className={style.left}>
+      <div className={style.left}>
-          <div className={style.leftList}>
+        <div className={style.leftList}>
-            {list.map((v, i) => (
+          {list.map((v, i) => (
-              <NavLink key={i} replace to={v.path} style={{ display: "block" }}>
+            <NavLink key={i} replace to={v.path} style={{ display: "block" }}>
-                <div className={style.leftItem} title={v.title}>
+              <div className={style.leftItem} title={v.title}>
-                  <Icon icon={v.icon} size={20} />
+                <Icon icon={v.icon} size={22} />
-                  <div>{v.text}</div>
+                <div>{v.text}</div>
-                  {v.path == curRoute.path && <div className={style.activeLine}></div>}
+                {v.path == curRoute.path && <div className={style.activeLine}></div>}
-                </div>
+              </div>
-              </NavLink>
+            </NavLink>
-            ))}
+          ))}
+        </div>
+        <div className={style.leftListBottom}>
+          <div className={style.leftItem} title={"设置"}>
+            <Icon icon="settings" size={22} />
           </div>
-          <div className={style.leftListBottom}>
+          <div className={style.leftItem} title={"设置"}>
-            <div className={style.leftItem} title={"设置"}>
+            <Icon icon="settings" size={22} />
-              <Icon icon="settings" size={20} />
-            </div>
           </div>
         </div>
-        <div className={style.right}>
-          <props.render></props.render>
-        </div>
       </div>
-  ) : (
+      <div className={style.right}>
-    <props.render></props.render>
+        <props.render></props.render>
+      </div>
+    </div>
   )
 }