Skip to content

Commit 50ec096

Browse files
dino-zhaodino-zhao
committed
输入框
1 parent a9aa560 commit 50ec096

File tree

10 files changed

+145
-113
lines changed

10 files changed

+145
-113
lines changed

‎.eslintrc.js

+1
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ module.exports = {
88
'react/react-in-jsx-scope': 'off',
99
'no-console': 'off',
1010
'react/jsx-props-no-spreading': 'off',
11+
'@typescript-eslint/no-non-null-assertion': 'off',
1112
},
1213
parserOptions: {
1314
ecmaVersion: 2020,

‎src/main/main.ts

+13-24
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,15 @@
11
/* eslint global-require: off, no-console: off, promise/always-return: off */
22

3-
/**
4-
* This module executes inside of electron's main process. You can start
5-
* electron renderer process from here and communicate with the other processes
6-
* through IPC.
7-
*
8-
* When running `npm run build` or `npm run build:main`, this file is compiled to
9-
* `./src/main.js` using webpack. This gives us some performance wins.
10-
*/
113
import path from 'path';
124
import { app, BrowserWindow, shell, ipcMain } from 'electron';
135
import { autoUpdater } from 'electron-updater';
146
import log from 'electron-log';
157
import OSS from 'ali-oss';
168
import MenuBuilder from './menu';
179
import { resolveHtmlPath } from './util';
18-
10+
import type { ConfigParams } from '../renderer/type';
1911
// oss有些方法只能在node端使用https://github.com/ali-sdk/ali-oss#browser-usage
20-
// const client = new OSS({});
12+
let client: null | OSS = null;
2113

2214
export default class AppUpdater {
2315
constructor() {
@@ -29,23 +21,20 @@ export default class AppUpdater {
2921

3022
let mainWindow: BrowserWindow | null = null;
3123

32-
ipcMain.on('ipc-example', async (event, arg) => {
33-
const msgTemplate = (pingPong: string) => `IPC test: ${pingPong}`;
34-
console.log(msgTemplate(arg));
35-
event.reply('ipc-example', msgTemplate('pong'));
24+
ipcMain.handle('handleOss', async (event, method, ...args) => {
25+
console.log(method, ...args);
26+
return client?.[method](...args);
3627
});
3728

38-
ipcMain.on('client', async (event) => {
39-
const list = [];
40-
try {
41-
// list = await client.listBuckets();
42-
} catch (error) {
43-
console.log(error);
44-
}
45-
46-
event.reply('client', list);
29+
ipcMain.handle('initOssClient', async (event, ak: ConfigParams) => {
30+
client = new OSS({
31+
region: ak.region,
32+
accessKeyId: ak.accessKeyId!,
33+
accessKeySecret: ak.accessKeySecret!,
34+
bucket: 'pi-version-backup',
35+
});
36+
return 0;
4737
});
48-
4938
if (process.env.NODE_ENV === 'production') {
5039
const sourceMapSupport = require('source-map-support');
5140
sourceMapSupport.install();

‎src/main/preload.ts

+7-14
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,21 @@
11
import { contextBridge, ipcRenderer } from 'electron';
2+
import type { ConfigParams } from '../renderer/type';
23

34
contextBridge.exposeInMainWorld('electron', {
45
ipcRenderer: {
5-
list() {
6-
ipcRenderer.send('client');
6+
handleOss(...rest: any[]) {
7+
return ipcRenderer.invoke('handleOss', ...rest);
78
},
8-
myPing() {
9-
ipcRenderer.send('ipc-example', 'ping');
9+
initOssClient(ak: ConfigParams) {
10+
return ipcRenderer.invoke('initOssClient', ak);
1011
},
1112
// eslint-disable-next-line @typescript-eslint/no-explicit-any
1213
on(channel: string, func: (...args: any[]) => void) {
13-
const validChannels = ['ipc-example', 'client'];
14-
if (validChannels.includes(channel)) {
15-
// Deliberately strip event as it includes `sender`
16-
ipcRenderer.on(channel, (_event, ...args) => func(...args));
17-
}
14+
ipcRenderer.on(channel, (_event, ...args) => func(...args));
1815
},
1916
// eslint-disable-next-line @typescript-eslint/no-explicit-any
2017
once(channel: string, func: (...args: any[]) => void) {
21-
const validChannels = ['ipc-example', 'client'];
22-
if (validChannels.includes(channel)) {
23-
// Deliberately strip event as it includes `sender`
24-
ipcRenderer.once(channel, (_event, ...args) => func(...args));
25-
}
18+
ipcRenderer.once(channel, (_event, ...args) => func(...args));
2619
},
2720
},
2821
});

‎src/renderer/App.tsx

+32-7
Original file line numberDiff line numberDiff line change
@@ -7,21 +7,46 @@ import {
77
useNavigate,
88
} from 'react-router-dom';
99
import { Button } from 'antd';
10-
import { useEffect } from 'react';
11-
import Login from './routes/login';
10+
import { useEffect, useState } from 'react';
11+
import Config from './routes/config';
12+
13+
import { initOssClient, handleOss } from './util';
1214
import './App.css';
1315

1416
const Hello = () => {
1517
const navigate = useNavigate();
18+
const [hasInit, setInit] = useState(false);
19+
const localAk = localStorage.getItem('ak');
20+
if (!localAk) {
21+
navigate('/config');
22+
} else if (!hasInit) {
23+
if (!hasInit) {
24+
initOssClient(JSON.parse(localAk))
25+
.then((res) => {
26+
setInit(true);
27+
return res;
28+
})
29+
.catch((err) => console.log(err));
30+
}
31+
}
1632
useEffect(() => {
17-
if (!localStorage.getItem('ak')) {
18-
navigate('/login');
33+
async function handle() {
34+
if (hasInit) {
35+
const list = await handleOss('list', {
36+
prefix: '',
37+
delimiter: '/',
38+
'max-keys': 1000,
39+
});
40+
console.log(list);
41+
}
1942
}
20-
}, [navigate]);
43+
44+
handle();
45+
}, [hasInit]);
2146
return (
2247
<div>
2348
<Button type="primary">eeee</Button>
24-
<Link to="/login">登录</Link>
49+
<Link to="/config">登录</Link>
2550
<Outlet />
2651
</div>
2752
);
@@ -32,7 +57,7 @@ export default function App() {
3257
<Router>
3358
<Routes>
3459
<Route path="/" element={<Hello />} />
35-
<Route path="login" element={<Login />} />
60+
<Route path="config" element={<Config />} />
3661
</Routes>
3762
</Router>
3863
);

‎src/renderer/index.tsx

-10
Original file line numberDiff line numberDiff line change
@@ -12,13 +12,3 @@ render(
1212
</ConfigProvider>,
1313
document.getElementById('root')
1414
);
15-
16-
// calling IPC exposed from preload script
17-
window.electron.ipcRenderer.once('ipc-example', (arg) => {
18-
console.log(arg);
19-
});
20-
window.electron.ipcRenderer.myPing();
21-
window.electron.ipcRenderer.list();
22-
window.electron.ipcRenderer.once('client', (arg) => {
23-
console.log(arg);
24-
});

‎src/renderer/preload.d.ts

+3-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import type OSS from 'ali-oss';
2+
import type { ConfigParams } from './type';
23

34
declare global {
45
interface Window {
@@ -9,7 +10,8 @@ declare global {
910
on(channel: string, func: (...args: any[]) => void): void;
1011
// eslint-disable-next-line @typescript-eslint/no-explicit-any
1112
once(channel: string, func: (...args: any[]) => void): void;
12-
list: () => void;
13+
handleOss: (...rest: any[]) => Promise<any>;
14+
initOssClient: (ak: ConfigParams) => Promise<0>;
1315
};
1416
};
1517
ossClient: OSS;

‎src/renderer/routes/config.tsx

+72
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
import { Form, Input, Button, Layout, Select } from 'antd';
2+
import type { ConfigParams } from '../type';
3+
4+
const { Content } = Layout;
5+
const { Item } = Form;
6+
const layout = {
7+
labelCol: { span: 8 },
8+
wrapperCol: { span: 16 },
9+
};
10+
const tailLayout = {
11+
wrapperCol: { offset: 8, span: 16 },
12+
};
13+
const ak = JSON.parse(localStorage.getItem('ak') ?? '');
14+
const initialValues: ConfigParams = {
15+
deployBucketLists: ['pi-admin-web', 'pi-console-web'],
16+
region: 'oss-cn-hangzhou',
17+
accessKeyId: ak.accessKeyId ?? '',
18+
accessKeySecret: ak.accessKeySecret ?? '',
19+
backupBucket: 'pi-version-backup',
20+
};
21+
export default function Config() {
22+
const onFinish = (values: ConfigParams) => {
23+
localStorage.setItem('ak', JSON.stringify(values));
24+
};
25+
return (
26+
<Layout>
27+
<Content style={{ display: 'flex', justifyContent: 'center' }}>
28+
<Form
29+
{...layout}
30+
initialValues={initialValues}
31+
style={{ width: '50%', marginTop: '50px' }}
32+
onFinish={onFinish}
33+
>
34+
<Item name="region" label="region" rules={[{ required: true }]}>
35+
<Input placeholder="请输入region" />
36+
</Item>
37+
<Item
38+
name="accessKeyId"
39+
label="accessKeyId"
40+
rules={[{ required: true }]}
41+
>
42+
<Input placeholder="请输入accessKeyId" />
43+
</Item>
44+
<Item
45+
name="accessKeySecret"
46+
label="accessKeySecret"
47+
rules={[{ required: true }]}
48+
>
49+
<Input placeholder="请输入accessKeySecret" />
50+
</Item>
51+
<Item
52+
label="备份bucket"
53+
name="backupBucket"
54+
rules={[{ required: true }]}
55+
>
56+
<Input placeholder="请输入备份bucket" />
57+
</Item>
58+
<Item
59+
label="待备份bucket"
60+
name="deployBucketLists"
61+
rules={[{ required: true }]}
62+
>
63+
<Select mode="tags" placeholder="请输入待备份bucket" />
64+
</Item>
65+
<Item {...tailLayout}>
66+
<Button htmlType="submit">确定</Button>
67+
</Item>
68+
</Form>
69+
</Content>
70+
</Layout>
71+
);
72+
}

‎src/renderer/routes/login.tsx

-57
This file was deleted.

‎src/renderer/type.ts

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
export interface ConfigParams {
2+
region: string;
3+
accessKeyId: string;
4+
accessKeySecret: string;
5+
backupBucket: string;
6+
deployBucketLists: string[];
7+
}

‎src/renderer/util.ts

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import type { ConfigParams } from './type';
2+
3+
// eslint-disable-next-line import/prefer-default-export
4+
export function initOssClient(ak: ConfigParams) {
5+
return window.electron.ipcRenderer.initOssClient(ak);
6+
}
7+
8+
export function handleOss(...rest: any[]) {
9+
return window.electron.ipcRenderer.handleOss(...rest);
10+
}

0 commit comments

Comments
 (0)