更新

main.js

@@ -12,7 +12,7 @@ const {
     Notification
 } = require('electron');
 const path = require('node:path')
-const {autoUpdater, CancellationToken} = require('electron-updater');
+const { autoUpdater, CancellationToken } = require('electron-updater');
 const cancellationToken = new CancellationToken()
 app.allowRendererProcessReuse = false;
 let mainWindow = null;
@@ -34,7 +34,7 @@ class AppWindow extends BrowserWindow {
             backgroundColor: '#00000000',
             transparent: true,
         };
-        const finalConfig = {...basicConfig, ...config};
+        const finalConfig = { ...basicConfig, ...config };
         super(finalConfig);
         const env = process.argv.find((arg) => arg.startsWith('--env='))?.split('=')[1];
         if (env === 'development') {
@@ -127,10 +127,7 @@ app.on('ready', () => {
             }
         })
         autoUpdater.updateConfigPath = path.join('latest.yml')
-        // autoUpdater.updateConfigPath = path.join('http://test.bossmei.top/electron/latest.yml')
     }
-    // autoUpdater.updateConfigPath = path.join('http://test.bossmei.top/electron/latest.yml')
-    console.log(123123123)
     createWindow()
     updateHandle() // 检查更新
     createTray()
@@ -201,7 +198,7 @@ app.on('ready', () => {
         mainWindow.setMinimumSize(config.width, config.height);
         // 设置最大尺寸
         const primaryDisplay = screen.getPrimaryDisplay()
-        const {width, height} = primaryDisplay.workAreaSize
+        const { width, height } = primaryDisplay.workAreaSize
         if (config.key === 'login') {
             mainWindow.setMaximumSize(config.width, config.height);
         } else {
@@ -210,7 +207,7 @@ app.on('ready', () => {
         // 设置窗口尺寸
         mainWindow.setSize(config.width, config.height)
         // 设置窗口位置使其居中于当前屏幕
-        const display = screen.getDisplayMatching({...mainWindow.getBounds()});
+        const display = screen.getDisplayMatching({ ...mainWindow.getBounds() });
         const x = Math.round((display.workArea.width - mainWindow.getSize()[0]) / 2);
         const y = Math.round((display.workArea.height - mainWindow.getSize()[1]) / 2);
         mainWindow.setPosition(x, y);
@@ -230,28 +227,20 @@ function updateHandle() {
     autoUpdater.setFeedURL('http://test.bossmei.top/electron')
     autoUpdater.autoDownload = false // 不自动下载安装包
     autoUpdater.autoInstallOnAppQuit = false // 不自动安装
-    // eslint-disable-next-line handle-callback-err
     autoUpdater.on('error', function (error) {
-        // sendUpdateError(JSON.stringify(error))
         sendUpdateMessage(message.error)
     })
     autoUpdater.on('checking-for-update', function () {
-        console.log('开始检测')
-        console.log('checking-for-update')
         sendUpdateMessage(message.checking)
     })
     autoUpdater.on('update-available', function (info) {
-        console.log('update-available', info)
+        let messageStr = JSON.stringify({ type: '0' })
-        let messageStr = JSON.stringify({type: '0'})
-        // todo 延迟5秒打开弹窗(逻辑要改)
         setTimeout(() => {
             sendUpdateMessage(messageStr)
         }, 5000)
-        // sendUpdateMessage(message.updateAva)
     })
     autoUpdater.on('update-not-available', function (info) {
-        console.log(info)
+
-        // sendUpdateMessage(message.updateNotAva)
     })
     // 更新下载进度事件
     autoUpdater.on('download-progress', function (progressObj) {
@@ -260,23 +249,12 @@ function updateHandle() {
             value: progressObj.percent
         })
         sendUpdateMessage(message)
-        console.log(progressObj.percent)
-        // mainWindow.webContents.send('downloadProgress', progressObj)
     })
     autoUpdater.on('update-downloaded', function (event, releaseNotes, releaseName, releaseDate, updateUrl, quitAndUpdate) {
-        console.log('下载完成---------------')
         let message = JSON.stringify({
-            type: '3',
+            type: '2',
         })
-        // sendUpdateMessage(message)
+        sendUpdateMessage(message)
-        autoUpdater.quitAndInstall()
-        ipcMain.on('isUpdateNow', (e, arg) => {
-            console.log(arg)
-            console.log('开始更新')
-            // some code here to handle event
-            autoUpdater.quitAndInstall()
-        })
-        // mainWindow.webContents.send('isUpdateNow')
     })
 }
 

package.json

@@ -1,7 +1,7 @@
 {
   "name": "multi.person.meeting",
   "private": true,
-  "version": "0.0.3",
+  "version": "0.0.2",
   "main": "main.js",
   "authors": "yj",
   "description": "test",

src/components/UpdateModal/index.module.scss

@@ -1,8 +1,8 @@
 .isUpdateModal {
-  width: 338px;
+  height: 400px;
-  height: 432px;
+  background-color: rgb(21, 25, 29);
-  background: url("../../assets/updateBg.png");
+  background-size: 100% auto;
-  background-size: 100% 100%;
+  background-repeat: no-repeat;
   color: #ffffff;
   padding: 230px 30px 0;
   box-sizing: border-box;
@@ -15,21 +15,13 @@
   .buttons {
     width: 100%;
     margin-top: 32px;
-    font-size: 16px;
     text-align: center;
 
-    .button1 {
-      width: 100%;
-      height: 44px;
-      background-color: #5575F2;
-      line-height: 44px;
-      border-radius: 10px;
-    }
-
     .button2 {
       margin-top: 20px;
       color: #555454;
+      cursor: pointer;
+      font-size: 14px;
     }
   }
-}
+}
-

src/components/UpdateModal/index.tsx

@@ -1,19 +1,19 @@
 import styles from '@/components/UpdateModal/index.module.scss'
-import {Flex, Modal, Progress} from 'antd';
+import ImageUrl from '@/utils/package/ImageUrl';
-import {forwardRef, useImperativeHandle, useState} from "react";
+import { Button, Flex, Modal, Progress } from 'antd';
+import { forwardRef, useImperativeHandle, useState } from "react";
 
 const UpdateModal = forwardRef((props: any, ref: any) => {
     useImperativeHandle(ref, () => ({
         changeModal: (data: any) => {
             let dataJson = JSON.parse(data)
-            console.log(dataJson)
-            setIsUpdateModal(true)
             getContent()
             if (dataJson.type === '0') { // 打开弹窗
                 setIsUpdateModal(true)
             } else if (dataJson.type === '1') { // 下载中 返回进度值
-                console.log('下载中', dataJson.value.toFixed(2))
                 setProgress(dataJson.value.toFixed(2))
+            } else if (dataJson.type === '2') { // 下载完成
+                setProgress(100)
             }
         }
     }))
@@ -30,15 +30,15 @@ const UpdateModal = forwardRef((props: any, ref: any) => {
                 throw new Error('Network response was not ok.');
             })
             .then(textContent => {
-                console.log(textContent);
             })
             .catch(error => {
-                console.error('There has been a problem with your fetch operation:', error);
             });
     }
 
     function closeModal() {
-        window.electron.onDownload('0') // 取消下载
+        if (progress != 100) {
+            window.electron.onDownload('0') // 取消下载
+        }
         setIsUpdateModal(false)
     }
 
@@ -51,25 +51,34 @@ const UpdateModal = forwardRef((props: any, ref: any) => {
                 onCancel={() => closeModal()}
                 centered
                 width={'338px'}
+                className='modal-padding'
+                maskClosable={true}
             >
-                <div className={styles.isUpdateModal}>
+                <div className={styles.isUpdateModal} style={{ backgroundImage: `url(${ImageUrl.icon7})` }}>
                     <div className={styles.remarks}>
                         {updateContent}
                     </div>
                     {
                         !progress ?
                             <div className={styles.buttons}>
-                                <div className={styles.button1}
+                                <Button type="primary"
-                                     onClick={() => window.electron.onDownload('1')}>立即更新
+                                    onClick={() => window.electron.onDownload('1')}
-                                </div>
+                                    style={{ width: '100%', height: '40px' }}
+                                    className={`m-ant-btn`}
+                                >立即更新</Button>
                                 <div className={styles.button2} onClick={() => setIsUpdateModal(false)}>暂不更新</div>
-                            </div> :
+                            </div> : progress < 100 ?
-                            <div className={styles.progress}>
+                                <div style={{ marginTop: '20px' }}>
-                                下载进度：{progress}%
+                                    下载进度：{progress}%
-                                <Flex gap="small" vertical>
+                                    <Flex gap="small" vertical>
-                                    <Progress percent={progress} showInfo={false}/>
+                                        <Progress percent={progress} showInfo={false} />
-                                </Flex>
+                                    </Flex>
-                            </div>
+                                </div> :
+                                <Button type="primary"
+                                    onClick={() => window.electron.onDownload('2')}
+                                    style={{ width: '100%', height: '40px',marginTop:'20px' }}
+                                    className={`m-ant-btn`}
+                                >下载完成，点击安装</Button>
                     }
                 </div>
             </Modal>

src/utils/package/imageUrl.ts

@@ -6,6 +6,7 @@ import icon3 from '@/assets/icon3.png'
 import icon4 from '@/assets/icon4.png'
 import icon5 from '@/assets/icon5.png'
 import icon6 from '@/assets/icon6.png'
+import icon7 from '@/assets/icon7.png'
 import icon8 from '@/assets/icon8.png'
 import icon9 from '@/assets/icon9.png'
 import icon10 from '@/assets/icon10.png'
@@ -61,6 +62,7 @@ export default {
   icon4,
   icon5,
   icon6,
+  icon7,
   icon8,
   icon9,
   icon10,

src/utils/styles/App.scss

@@ -282,7 +282,7 @@ $pagination-hover-background-color: #5575F2;
     }
 
     .ant-modal-body {
-      max-height: 70vh;
+      max-height: 80vh;
       overflow-y: auto;
     }
   }