npmrun 4 years ago
parent
commit
4dc0f3f3ba
  1. 3
      a.md
  2. 3
      src/main/facilities/main/index.ts
  3. 3
      src/render/views/Layout/index.module.scss
  4. 45
      src/render/views/Layout/index.tsx
  5. 1
      types/global.d.ts

3
a.md

@ -21,4 +21,5 @@ https://www.jianshu.com/p/4699b825d285
https://blueprintjs.com/ https://blueprintjs.com/
https://chakra-ui.com/ https://chakra-ui.com/
https://www.npmjs.com/package/node-fetch https://www.npmjs.com/package/node-fetch
https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API/Using_Fetch https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API/Using_Fetch
react-desktop

3
src/main/facilities/main/index.ts

@ -28,10 +28,9 @@ export default function showWindow(url?: string) {
minWidth: 800, minWidth: 800,
minHeight: 600, minHeight: 600,
icon: __static + "/icon.png", icon: __static + "/icon.png",
// show: false,
// frame: false, // 去除原生的菜单 // frame: false, // 去除原生的菜单
// transparent: true, // 背景透明 // transparent: true, // 背景透明
alwaysOnTop: true, alwaysOnTop: false,
webPreferences: { webPreferences: {
nodeIntegration: true, nodeIntegration: true,
contextIsolation: false, contextIsolation: false,

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

@ -1,5 +1,8 @@
.Layout { .Layout {
height: 100vh; height: 100vh;
position: relative;
transform:scale(1,1);
.left { .left {
position: fixed; position: fixed;
left: 0; left: 0;

45
src/render/views/Layout/index.tsx

@ -1,8 +1,9 @@
import { Icon, IconName } from "@blueprintjs/core" import { Icon, IconName } from "@blueprintjs/core"
import route, {useRoute} from "@render/route" import route, { useRoute } from "@render/route"
import React from "react" import React, { Fragment } from "react"
import { NavLink, useLocation } from "react-router-dom" import { NavLink, useLocation } from "react-router-dom"
import style from "./index.module.scss" import style from "./index.module.scss"
import { TitleBar, Toolbar, Text } from "react-desktop/macOs"
// interface IProps { // interface IProps {
// render(): ReactElement // render(): ReactElement
@ -16,50 +17,49 @@ export default function Layout(props: any) {
} }
interface TList { interface TList {
icon: IconName; icon: IconName
path: string; path: string
title: string; title: string
text: string; text: string
} }
const list: TList[]= [ const list: TList[] = [
{ {
path: "/home", path: "/home",
icon: "time", icon: "time",
title: "添加闹钟", title: "添加闹钟",
text: "闹钟" text: "闹钟",
}, },
{ {
path: "/about", path: "/about",
icon: "mugshot", icon: "mugshot",
title: "添加闹钟", title: "添加闹钟",
text: "关于" text: "关于",
}, },
{ {
path: "/float", path: "/float",
icon: "mugshot", icon: "mugshot",
title: "浮动框测试", title: "浮动框测试",
text: "浮动" text: "浮动",
}, },
] ]
return ( return isLayout ? (
isLayout ? (
<div className={style.Layout}> <div className={style.Layout}>
<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={20} />
<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>
<div className={style.leftListBottom}> <div className={style.leftListBottom}>
<div className={style.leftItem} title={"设置"}> <div className={style.leftItem} title={"设置"}>
<Icon icon="settings" size={20}/> <Icon icon="settings" size={20} />
</div> </div>
</div> </div>
</div> </div>
@ -67,6 +67,7 @@ export default function Layout(props: any) {
<props.render></props.render> <props.render></props.render>
</div> </div>
</div> </div>
) : (<props.render></props.render>) ) : (
<props.render></props.render>
) )
} }

1
types/global.d.ts

@ -13,3 +13,4 @@ declare const __staticVar: string;
declare module "*.md" declare module "*.md"
declare module 'react-desktop/macOs';

Loading…
Cancel
Save