术习电报 / electron-vue-template

转到一个项目
切换导航栏
切换导航栏固定状态
张恒
e0c8c93d 1 个父辈 3d35fd6b

提升依赖等级，添加多窗口示例

内嵌 并排
正在显示 8 个修改的文件 包含 148 行增加 和 41 行删除
......@@ -3415,9 +3415,9 @@
}
},
"builder-util-runtime": {
"version": "8.6.2",
"resolved": "https://registry.npm.taobao.org/builder-util-runtime/download/builder-util-runtime-8.6.2.tgz",
"integrity": "sha1-gnDhWwEtjTsRDz4yew/YsOB7FoY=",
"version": "8.7.0",
"resolved": "https://registry.npm.taobao.org/builder-util-runtime/download/builder-util-runtime-8.7.0.tgz",
"integrity": "sha1-5IrQBINcgoRmLo6vR6U0aMZujo0=",
"requires": {
"debug": "^4.1.1",
"sax": "^1.2.4"
......@@ -5278,30 +5278,19 @@
"dev": true
},
"electron-updater": {
"version": "4.2.5",
"resolved": "https://registry.npm.taobao.org/electron-updater/download/electron-updater-4.2.5.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Felectron-updater%2Fdownload%2Felectron-updater-4.2.5.tgz",
"integrity": "sha1-287Y2m+Mb8LcZi8ndhMfWknOAY0=",
"version": "4.3.1",
"resolved": "https://registry.npm.taobao.org/electron-updater/download/electron-updater-4.3.1.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Felectron-updater%2Fdownload%2Felectron-updater-4.3.1.tgz",
"integrity": "sha1-nUhbYmK8Vvz37mKx3Bs7EFo+lqc=",
"requires": {
"@types/semver": "^7.1.0",
"builder-util-runtime": "8.6.2",
"fs-extra": "^8.1.0",
"builder-util-runtime": "8.7.0",
"fs-extra": "^9.0.0",
"js-yaml": "^3.13.1",
"lazy-val": "^1.0.4",
"lodash.isequal": "^4.5.0",
"pako": "^1.0.11",
"semver": "^7.1.3"
},
"dependencies": {
"fs-extra": {
"version": "8.1.0",
"resolved": "https://registry.npm.taobao.org/fs-extra/download/fs-extra-8.1.0.tgz",
"integrity": "sha1-SdQ8RaiM2Wd2aMt74bRu/bjS4cA=",
"requires": {
"graceful-fs": "^4.2.0",
"jsonfile": "^4.0.0",
"universalify": "^0.1.0"
}
},
"semver": {
"version": "7.3.2",
"resolved": "https://registry.npm.taobao.org/semver/download/semver-7.3.2.tgz",
......@@ -6932,8 +6921,7 @@
"code-point-at": {
"version": "1.1.0",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"concat-map": {
"version": "0.0.1",
......@@ -7072,7 +7060,6 @@
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"number-is-nan": "^1.0.0"
}
......@@ -7207,8 +7194,7 @@
"number-is-nan": {
"version": "1.0.1",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"object-assign": {
"version": "4.1.1",
......@@ -9122,6 +9108,7 @@
"version": "4.0.0",
"resolved": "https://registry.npm.taobao.org/jsonfile/download/jsonfile-4.0.0.tgz",
"integrity": "sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss=",
"dev": true,
"requires": {
"graceful-fs": "^4.1.6"
}
......@@ -10985,7 +10972,8 @@
"pako": {
"version": "1.0.11",
"resolved": "https://registry.npm.taobao.org/pako/download/pako-1.0.11.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fpako%2Fdownload%2Fpako-1.0.11.tgz",
"integrity": "sha1-bJWZ00DVTf05RjgCUqNXBaa5kr8="
"integrity": "sha1-bJWZ00DVTf05RjgCUqNXBaa5kr8=",
"dev": true
},
"parallel-transform": {
"version": "1.2.0",
......@@ -14069,7 +14057,7 @@
},
"p-map": {
"version": "3.0.0",
"resolved": "https://registry.npm.taobao.org/p-map/download/p-map-3.0.0.tgz",
"resolved": "https://registry.npm.taobao.org/p-map/download/p-map-3.0.0.tgz?cache=0&sync_timestamp=1563032875018&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fp-map%2Fdownload%2Fp-map-3.0.0.tgz",
"integrity": "sha1-1wTZr4orpoTiYA2aIVmD1BQal50=",
"dev": true,
"requires": {
......@@ -14564,7 +14552,8 @@
"universalify": {
"version": "0.1.2",
"resolved": "https://registry.npm.taobao.org/universalify/download/universalify-0.1.2.tgz?cache=0&sync_timestamp=1583530825899&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Funiversalify%2Fdownload%2Funiversalify-0.1.2.tgz",
"integrity": "sha1-tkb2m+OULavOzJ1mOcgNwQXvqmY="
"integrity": "sha1-tkb2m+OULavOzJ1mOcgNwQXvqmY=",
"dev": true
},
"unpipe": {
"version": "1.0.0",
......
......@@ -72,7 +72,7 @@
"dependencies": {
"axios": "^0.19.2",
"date-fns": "^2.12.0",
"electron-updater": "^4.2.5",
"electron-updater": "^4.3.1",
"element-ui": "^2.13.1",
"express": "^4.17.1",
"fs-extra": "^9.0.0",
......
// 这里定义了静态文件路径的位置
import path from 'path'
/**
* Set `__static` path to static files in production
* https://simulatedgreg.gitbooks.io/electron-vue/content/en/using-static-assets.html
*/
// 这个瓜皮全局变量只能在单个js中生效，而并不是整个主进程中
if (process.env.NODE_ENV !== 'development') {
global.__static = path.join(__dirname, '/static').replace(/\\/g, '\\\\')
}
export const winURL = process.env.NODE_ENV === 'development' ? `http://localhost:${process.env.PORT}` : `file://${__dirname}/index.html`
export const loadingURL = process.env.NODE_ENV === 'development' ? `http://localhost:${process.env.PORT}/static/loader.html` : `file://${__static}/loader.html`
import { ipcMain, dialog } from 'electron'
import { ipcMain, dialog, BrowserWindow } from 'electron'
import Server from '../server/index'
import { winURL } from '../config/StaticPath'
export default {
Mainfunc (mainWindow, IsUseSysTitle) {
ipcMain.on('IsUseSysTitle', (event) => {
......@@ -48,5 +50,40 @@ export default {
)
})
})
ipcMain.on('open-win', (event, arg) => {
const ChildWin = new BrowserWindow({
height: 595,
useContentSize: true,
width: 842,
autoHideMenuBar: true,
minWidth: 842,
show: false,
webPreferences: {
nodeIntegration: true,
webSecurity: false,
// 如果是开发模式可以使用devTools
devTools: process.env.NODE_ENV === 'development',
// 在macos中启用橡皮动画
scrollBounce: process.platform === 'darwin'
}
})
ChildWin.loadURL(winURL + `/#${arg.url}`)
ChildWin.webContents.once('dom-ready', () => {
ChildWin.show()
ChildWin.webContents.send('send-data', arg.sendData)
if (arg.IsPay) {
// 检查支付时候自动关闭小窗口
const testUrl = setInterval(() => {
const Url = ChildWin.webContents.getURL()
if (Url.includes(arg.PayUrl)) {
ChildWin.close()
}
}, 1200)
ChildWin.on('close', () => {
clearInterval(testUrl)
})
}
})
})
}
}
......
......@@ -5,19 +5,8 @@ import setIpc from './ipcMain'
import electronDevtoolsInstaller, { VUEJS_DEVTOOLS } from 'electron-devtools-installer'
import upload from './checkupdate'
import DownloadUpdate from './downloadFile'
import path from 'path'
import { winURL, loadingURL } from '../config/StaticPath'
/**
* Set `__static` path to static files in production
* https://simulatedgreg.gitbooks.io/electron-vue/content/en/using-static-assets.html
*/
// 这个瓜皮全局变量只能在单个js中生效，而并不是整个主进程中
if (process.env.NODE_ENV !== 'development') {
global.__static = path.join(__dirname, '/static').replace(/\\/g, '\\\\')
}
// 将文件地址挪到这里
const winURL = process.env.NODE_ENV === 'development' ? `http://localhost:${process.env.PORT}` : `file://${__dirname}/index.html`
const loadingURL = process.env.NODE_ENV === 'development' ? `http://localhost:${process.env.PORT}/static/loader.html` : `file://${__static}/loader.html`
var loadWindow = null
var mainWindow = null
......@@ -38,6 +27,7 @@ function createMainWindow () {
webSecurity: false,
// 如果是开发模式可以使用devTools
devTools: process.env.NODE_ENV === 'development',
// devTools: true,
// 在macos中启用橡皮动画
scrollBounce: process.platform === 'darwin'
}
......@@ -75,6 +65,7 @@ function createMainWindow () {
mainWindow.webContents.once('dom-ready', () => {
mainWindow.show()
loadWindow.destroy()
// mainWindow.webContents.openDevTools(true)
})
}
......
......@@ -28,6 +28,7 @@
<el-button type="primary" round @click="CheckUpdate('two')">检查更新（第二种方法）</el-button>
<el-button type="primary" round @click="StartServer">启动内置服务端</el-button>
<el-button type="primary" round @click="getMessage">查看消息</el-button>
<el-button type="primary" round @click="openNewWin">打开新窗口</el-button>
</div>
</div>
</main>
......@@ -82,6 +83,12 @@ export default {
console.log(__lib);
},
methods: {
openNewWin(){
let data = {
url:'/form/index'
}
ipcApi.send("open-win", data);
},
getMessage() {
message().then(res => {
this.$alert(res.data, "提示", {
......
......@@ -32,7 +32,40 @@
margin: 0;
}
/* .loading-line {
height: 1px;
width: 100%;
position: absolute;
}
.top {
background: linear-gradient(-225deg, #ff3cac 0%, #2b86c5 58%, #ff3cac 100%);
top: 0;
}
.left {
background: linear-gradient(-225deg, #ff3cac 0%, #2b86c5 58%, #ff3cac 100%);
right: 99px;
transform: rotate(90deg);
width: 600px;
}
.right {
left: 99px;
transform: rotate(90deg);
width: 600px;
background: linear-gradient(-225deg, #ff3cac 0%, #2b86c5 58%, #ff3cac 100%);
}
.bottom {
background: linear-gradient(-225deg, #ff3cac 0%, #2b86c5 58%, #ff3cac 100%);
bottom: 0;
} */
.scene {
position: relative;
display: flex;
justify-content: center;
align-items: center;
......@@ -110,11 +143,23 @@
transform: rotate(1turn);
}
}
/* @keyframes slidein{
from{
}
to{
}
} */
</style>
</head>
<body>
<div class="scene">
<!-- <i class="loading-line top"></i>
<i class="loading-line right"></i>
<i class="loading-line bottom"></i>
<i class="loading-line left"></i> -->
<div class="loader">
<span></span>
<span></span>
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>支付宝</title>
</head>
<body>
<div id="alipay"></div>
</body>
<script>
const { ipcRenderer } = require('electron')
window.onload = () => {
ipcRenderer.on('send-data', (event, arg) => {
document.getElementById('alipay').innerHTML = arg
document.forms.alipay_submit.submit()
})
}
</script>
</html>
\ No newline at end of file