Skip to content

T
testMenu
提交 bd556075 authored 作者: caicai's avatar caicai
浏览文件
操作

修改3

上级 c6b0a549
显示空白字符变更
内嵌 并排
正在显示 包含 149 行增加 和 87 行删除
.env
浏览文件 @ bd556075
......@@ -13,9 +13,21 @@ VUE_APP_APPID=com.menu.test
# 请求api版本号
VUE_APP_API_VERSION=V1
#主窗口宽高
#主窗口宽高（简约）
VUE_APP_mainW=1000
VUE_APP_mainH=60
VUE_APP_mainH=70
#极简模式-宽高
VUE_APP_JiJianModeW=419
VUE_APP_JiJianModeH=70
#U学模式-宽高
VUE_APP_UXueModeW=1074
VUE_APP_UXueModeH=100
#窗口:初始化左边距，下边距
VUE_APP_WINDOW_LEFT=20
VUE_APP_WINDOW_BOTTOM=10
......
package.json
浏览文件 @ bd556075
......@@ -6,7 +6,7 @@
"homepage": "/",
"author": "Guangzhou Menu Technology Co., Ltd. <service@sei-tpo.com> (https://www.zei-dao.com/)",
"scripts": {
"serve": "vue-cli-service serve --mode web --enable-transparent-visuals",
"serve": "vue-cli-service serve --mode web",
"build": "vue-cli-service build",
"build:web": "vue-cli-service build --mode web",
"test:unit": "vue-cli-service test:unit",
......
public/index.html
浏览文件 @ bd556075
......@@ -8,7 +8,7 @@
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
</head>
<body style="background-color:rgba(255,255,255,0);">
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
......
src/assets/css/common.less 0 → 100644
浏览文件 @ bd556075
/* 禁止图片拖拽 */
.disable-drag {
-webkit-user-drag: none;
}
\ No newline at end of file
src/main/events/app.js
浏览文件 @ bd556075
......@@ -33,9 +33,10 @@ class AppEvents {
Before electron app is ready, we should initial */
app.on('ready', async () => {
try {
// console.log('getPrimaryDisplay')
// console.log(screen.getPrimaryDisplay())
setTimeout(() => {
//为了窗体透明，延迟
appManager.initApp()
}, 500);
} catch (error) {
console.error(error)
}
......
src/main/events/ipc.js
浏览文件 @ bd556075
......@@ -55,6 +55,8 @@ class IpcEvents {
// 显示右键菜单
ipcMain.on('show-context-menu', (event) => {
const window_left_distance = Number( process.env.VUE_APP_WINDOW_LEFT );
const window_bottom_distance = Number( process.env.VUE_APP_WINDOW_BOTTOM );
const displayDetail = screen.getPrimaryDisplay();
let currentMode = this.store.get("currentMode");
let displayWH = displayDetail.size;
......@@ -63,14 +65,11 @@ class IpcEvents {
label: '简约模式',
str:'modeJianYue',
click: () => {
// console.log('modeJianYue')
event.sender.send('context-menu-command', 'modeJianYue');
this.store.set("currentMode", "modeJianYue");
this.windowManager.mainWindow.win.setBounds({
// x: (displayWH.width - Number(process.env.VUE_APP_mainW))/2,
x: 0,
y: (displayWH.height - Number(process.env.VUE_APP_mainH)),
// width: Number(process.env.VUE_APP_mainW),
x: window_left_distance,
y: (displayWH.height - Number(process.env.VUE_APP_mainH) - window_bottom_distance),
width: displayWH.width,
height: Number(process.env.VUE_APP_mainH)
}, true);
......@@ -80,15 +79,13 @@ class IpcEvents {
label: '极简模式',
str:'modeJiJian',
click: () => {
// console.log('modeJiJian',displayWH.width,displayWH.height)
event.sender.send('context-menu-command', 'modeJiJian');
this.store.set("currentMode", "modeJiJian");
this.windowManager.mainWindow.win.setBounds({
// x: ( Number(displayWH.width) - 419)/2,
x:0,
y: ( Number(displayWH.height) - 60),
width: 419,
height: 60
x: window_left_distance,
y: ( Number(displayWH.height) - Number( process.env.VUE_APP_JiJianModeH ) - window_bottom_distance),
width: Number( process.env.VUE_APP_JiJianModeW ),
height: Number( process.env.VUE_APP_JiJianModeH )
}, true);
}
},
......@@ -96,14 +93,12 @@ class IpcEvents {
label: 'U学模式',
str:'modeUXue',
click: () => {
// console.log('modeUXue')
event.sender.send('context-menu-command', 'modeUXue');
this.windowManager.mainWindow.win.setBounds({
// x: ( Number(displayWH.width) - 419)/2,
x:0,
y: ( Number(displayWH.height) - 74),
x: window_left_distance,
y: ( Number(displayWH.height) - Number( process.env.VUE_APP_UXueModeH ) - window_bottom_distance),
width: displayWH.width,
height: 74
height: Number( process.env.VUE_APP_UXueModeH )
}, true);
this.store.set("currentMode", "modeUXue");
}
......@@ -122,7 +117,7 @@ class IpcEvents {
// 获取app列表
ipcMain.on("getApps", (e, data) => {
let apps = this.store.get("apps8");
let apps = this.store.get("apps10");
this.store.set("currentMode", "modeJianYue");
e.sender.send("appsList", apps)
})
......@@ -148,10 +143,10 @@ class IpcEvents {
}else if(imagePath && imagePath.indexOf('.svg') > 0) {
src = this.softList.svgToBase64(imagePath);
}
let apps = this.store.get("apps8");
let apps = this.store.get("apps10");
apps[index].icon = src || imagePath;
this.store.set("apps8", apps);
this.store.set("apps10", apps);
e.sender.send("base64Info", {url:src,index});
} catch (error) {
console.error(error)
......@@ -160,7 +155,7 @@ class IpcEvents {
// 移动app列表
ipcMain.on("moveSoft", (e, {appname, addFiles})=>{
let appList = this.store.get("apps8");
let appList = this.store.get("apps10");
let addFile = addFiles[0]; //某个拖拽文件
let targetIndex = appList.findIndex(v => v.name == appname);
let resIndex = appList.findIndex(v => v.name == addFile.shortName);
......@@ -190,7 +185,7 @@ class IpcEvents {
}
// 刷新渲染进程app列表
e.sender.send('appsList_update', appList);
this.store.set("apps8", appList);
this.store.set("apps10", appList);
}
})
......
src/main/index.js
浏览文件 @ bd556075
......@@ -7,7 +7,7 @@ Electron will restart when saving this file */
/* AppManager负责管理整个app
AppManager is responsible for managing the entire app */
import AppManager from './managers/app'
import { protocol } from 'electron'
import { protocol, app as appElectron } from 'electron'
//热加载
try {
......@@ -19,6 +19,14 @@ protocol.registerSchemesAsPrivileged([
{ scheme: 'app', privileges: { secure: true, standard: true } }
])
// 实现窗体透明
if(process.platform === "linux") {
// 启用 ARGB,用以实现窗体透明
appElectron.commandLine.appendSwitch('enable-transparent-visuals');
// 为当前应用程序禁用硬件加速
appElectron.disableHardwareAcceleration();
}
const app = new AppManager()
/* 可通过electron remote从渲染进程（vue）获取到appManager
......
src/main/managers/window.js
浏览文件 @ bd556075
......@@ -20,13 +20,17 @@ class WindowManager {
// // minHeight: Number(process.env.VUE_APP_mainH),
// })
// 极简模式
const JiJianModeW = Number( process.env.VUE_APP_JiJianModeW );
const JiJianModeH = Number( process.env.VUE_APP_JiJianModeH );
const window_left_distance = Number( process.env.VUE_APP_WINDOW_LEFT );
const window_bottom_distance = Number( process.env.VUE_APP_WINDOW_BOTTOM );
this.mainWindow.createWindow({
isMainWin: true,
x:0,
y: ( Number(displayDetail.size.height) - 60),
width: 419,
height: 60 ,
})
x: window_left_distance,
y: ( Number(displayDetail.size.height) - JiJianModeH - window_bottom_distance),
width: JiJianModeW,
height: JiJianModeH,
});
}
}
export default WindowManager
src/main/plugins/category.js
浏览文件 @ bd556075
......@@ -6,7 +6,7 @@ class category {
// 重置列表
resetList() {
this.store.set("categorys6",[
this.store.set("categorys8",[
{
name:'备课资源',
id:'bk001',
......@@ -34,7 +34,7 @@ class category {
getList () {
// console.log('获取分类列表')
this.mainWindow.win.webContents.send('getMsg', '获取分类列表-mainprocess')
let categoryList = this.store.get("categorys6");
let categoryList = this.store.get("categorys8");
// this.mainWindow.win.webContents.send("categoryList", categoryList);
return categoryList;
}
......@@ -42,7 +42,7 @@ class category {
/* 新增分类 */
addCategory({name, sender}) {
if(name == undefined) return;
let categoryList = this.store.get("categorys6");
let categoryList = this.store.get("categorys8");
name = name.trim();
let hasIn = categoryList.findIndex(v => v.name == name);
if(hasIn != -1) return;
......@@ -53,28 +53,28 @@ class category {
softIds:[]
};
categoryList.unshift(category);
this.store.set("categorys6", categoryList);
this.store.set("categorys8", categoryList);
sender.send("add-category", category);
this.mainWindow.win.webContents.send("add-category", category);
}
/* 删除分类 */
delCategory({id, sender}) {
let categoryList = this.store.get("categorys6");
let categoryList = this.store.get("categorys8");
let hasIn = categoryList.findIndex(v => v.id == id);
console.log('delCategory - hasIn', hasIn, id)
if(hasIn == -1) return null;
categoryList.splice(hasIn,1);
this.store.set("categorys6", categoryList);
this.store.set("categorys8", categoryList);
sender.send('remove-category',{id});
this.mainWindow.main.webContents.send("category-list", categoryList);
}
// 获取分类详情
getCategory(id) {
let categoryList = this.store.get("categorys6");
let categoryList = this.store.get("categorys8");
let hasIn = categoryList.findIndex(v => v.id == id);
if(hasIn == -1) return null;
return categoryList[hasIn]
......@@ -82,42 +82,42 @@ class category {
/* 更新分类列表 */
updateCategory({id, detail, sender}) {
let categoryList = this.store.get("categorys6");
let categoryList = this.store.get("categorys8");
let hasIn = categoryList.findIndex(v => v.id == id);
// console.log('hasIn', hasIn)
if(hasIn == -1) return null;
categoryList[hasIn] = detail;
this.store.set("categorys6", categoryList);
this.store.set("categorys8", categoryList);
sender.send('change-category',{detail,id});
this.mainWindow.main.webContents.send("category-list", categoryList);
}
// 更新分类下的软件列表
updateSoftList({id, detail, sender}) {
let categoryList = this.store.get("categorys6");
let categoryList = this.store.get("categorys8");
let hasIn = categoryList.findIndex(v => v.id == id);
// console.log('hasIn', hasIn)
if(hasIn == -1) return null;
categoryList[hasIn] = detail;
this.store.set("categorys6", categoryList);
this.store.set("categorys8", categoryList);
sender.send('remove-soft',{detail,id});
this.mainWindow.main.webContents.send("category-list", categoryList);
}
/* 修改分类名称 */
updateName({name, detail, sender}) {
let categoryList = this.store.get("categorys6");
let categoryList = this.store.get("categorys8");
let id = detail.id;
let hasIn = categoryList.findIndex(v => v.id == id);
// console.log('hasIn-updateName', hasIn)
if(hasIn == -1) return null;
categoryList[hasIn].name = name;
this.store.set("categorys6", categoryList);
this.store.set("categorys8", categoryList);
sender.send('update-category-name',{detail,id,name});
}
......@@ -159,7 +159,7 @@ class category {
}
getSoftDetail(softId) {
let appList = this.store.get("apps8");
let appList = this.store.get("apps10");
let targetIndex = appList.findIndex(v => v.id == softId);
if(targetIndex==-1) return null;
return appList[targetIndex];
......
src/main/plugins/softList.js
浏览文件 @ bd556075
......@@ -11,7 +11,7 @@ class SoftList {
/* 获取app列表 */
getList ({sender} = {}) {
this.mainWindow.win.webContents.send('getMsg', '获取app列表-mainprocess')
let appsList = this.store.get("apps8");
let appsList = this.store.get("apps10");
if(appsList && appsList.length > 0) {
// 已有app列表
// console.log('apps-length', appsList.length)
......@@ -37,14 +37,16 @@ class SoftList {
/* 查找linux icon */
findIcon(iconName, pathBase, callback = ()=>{}) { ///usr/share/icons
try {
exec(`find ${pathBase} -name "${iconName}.png" -o -name "${iconName}.svg"`, (error, stdout, stderr) =>{
// exec(`find ${pathBase} -name "${iconName}.png" -o -name "${iconName}.svg"`, (error, stdout, stderr) =>{
exec(`dpkg -L ${iconName}`, (error, stdout, stderr) =>{
if(error) {
console.error(`findIcon: ${error}`);
if(typeof callback === 'function') callback([]);
return;
}
const iconPaths = stdout.toString().split('\n').filter(path => path && path.trim() !== '');
if(typeof callback === 'function') callback(iconPaths);
let newIconList = iconPaths.filter(v => ( v.indexOf('.png') > 0 || v.indexOf('.svg') > 0 ))
if(typeof callback === 'function') callback(newIconList);
});
// const stdout = execSync(`find ${pathBase} -name "${iconName}.*"`);
// const iconPaths = stdout.toString().split('\n').filter(path => path && path.trim() !== '');
......@@ -221,7 +223,7 @@ class SoftList {
searchIcon:true,
};
})
this.store.set("apps8", newApps);
this.store.set("apps10", newApps);
this.mainWindow.win.webContents.send("appsList", newApps);
console.log('sender',sender)
if(sender && sender.send) sender.send("appsList", newApps);
......@@ -280,7 +282,7 @@ class SoftList {
};
});
let newarr = apps.filter(v => !!v.name)
this.store.set("apps8", newarr);
this.store.set("apps10", newarr);
this.mainWindow.win.webContents.send("appsList", newarr)
});
}
......@@ -337,12 +339,12 @@ class SoftList {
}
updatePath({index, path, name}) {
let appsList = this.store.get("apps8");
let appsList = this.store.get("apps10");
let currentApp = appsList[index];
if(currentApp && currentApp.name == name) {
appsList[index].icon = path;
appsList[index].searchIcon = true;
this.store.set("apps8", appsList);
this.store.set("apps10", appsList);
}
}
......
src/main/windows/mainWindow.js
浏览文件 @ bd556075
import { BrowserWindow, Menu, app, globalShortcut, shell, ipcMain, remote } from 'electron'
import { BrowserWindow, Menu, app, globalShortcut, shell, ipcMain, remote, screen } from 'electron'
import { createProtocol } from 'vue-cli-plugin-electron-builder/lib'
const fs = require('fs');
const path = require('path')
......@@ -7,9 +7,9 @@ import SoftList from '../plugins/softList';
const store = new Store({
defaults: {
"apps8": [], //app列表
"apps10": [], //app列表
//分类
"categorys6": [
"categorys8": [
{
name:'备课资源',
id:'bk001',
......@@ -102,8 +102,9 @@ class MainWindow {
// autoHideMenuBar: true,
// titleBarStyle: "hidden",
// backgroundColor: '#1affff1a', //透明颜色
// transparent: true,
transparent: true, //支持透明
resizable: false,
movable:true,
minimizable: false,
maximizable: false,
frame: false,
......@@ -239,6 +240,7 @@ class MainWindow {
// event.preventDefault();
// // win.hide();
// })
// 等待加载完成再去显示，不显示白屏加载过程
win.once('ready-to-show', () => {
if(args.visible!='hide') {
......@@ -251,20 +253,26 @@ class MainWindow {
});
win.on('blur', (event) => {
event.preventDefault();
// console.log(`Window ${win.id} lost focus webType:${win.webContents.webType}`)
// 如果当前app 管理页 失去焦点，则隐藏
// if(win.webContents.webType === 'appManage') {
// event.sender.send('manageVisible',false);
// 如果没有聚焦窗口存在，则隐藏app 管理页
if(win.webContents.webType === 'appManage' || win.webContents.webType === 'mainWindow') {
let focusWin = BrowserWindow.getFocusedWindow();
if(focusWin != null) return;
console.log('需要隐藏')
event.sender.send('manageVisible',false);
// // win.hide();
if(win.webContents.webType === 'appManage') win.hide();
else {
let manageWin = this.getWinOf('appManage');
if(manageWin != null) manageWin.hide();
}
// let winList = this.getAllWindows();
// console.log(winList[0].webContents.webType, winList[1].webContents.webType)
// if(winList[1].webContents.webType === 'mainWindow') {
// console.log('通知')
// winList[1].webContents.send('manageVisible',false);
// }
// }
}
})
win.on('hide', (event) => {
......
src/renderer/App.vue
浏览文件 @ bd556075
......@@ -7,18 +7,20 @@
</script>
<style lang="less">
html {
// background-color: transparent;
font-size: 16px;
}
body {
margin: 0;
font-size: 14px !important;
// background-color: rgba(0,0,0,0.25);
background: linear-gradient(180deg, rgba(10,37,91,0.3) 0%, #05173A 100%);
}
.electron_app {
border-radius: 20px;
// background: linear-gradient(180deg, rgba(10,37,91,0.3) 0%, #05173A 100%);
}
</style>
<style>
/* CDN 服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 */
@import url('https://at.alicdn.com/t/c/font_4010399_5s1gb1mpn7t.css');
@import '~@/assets/css/common.less';
</style>
src/renderer/components/Appbox/item.vue
浏览文件 @ bd556075
<template>
<div class="item_wrap" @click="tapApp" data-type="right-menu" :data-id="detail.id" :data-index="index">
<div v-if="src && (src.indexOf('data:image/svg') == 0 || src.indexOf('data:image/png') == 0)"
class="item_wrap" @click="tapApp" data-type="right-menu" :data-id="detail.id" :data-index="index">
<img :src="src" alt="" class="item_img">
<span class="item_name">{{name}}</span>
</div>
......
src/renderer/components/Dockmode/one.vue
浏览文件 @ bd556075
<template>
<div class="one_container">
<div class="left_main">
<img src="~@/assets/xuchanzhongxue.png" alt="" class="left_img" @click="getFrontApp">
<img src="~@/assets/xuchanzhongxue.png" alt="" class="left_img disable-drag" @click="getFrontApp">
</div>
<div v-if="mode === 'modeJiJian'" class="group1_wrap center">
<img src="~@/assets/yunpingtai.png" alt="" class="yun_img">
<img src="~@/assets/yunpingtai.png" alt="" class="yun_img disable-drag">
</div>
<div v-if="mode === 'modeJianYue'" class="group_list">
<div v-for="(cateItem, cateIndex) in cateList"
......@@ -15,7 +15,7 @@
:data-appname="appItem.name"
class="app_item"
@click="tapApp(appItem)">
<img :src="appItem.icon" alt="" class="img">
<img :src="appItem.icon" alt="" class="img disable-drag">
<span class="app_name">{{ appItem.name }}</span>
</div>
</div>
......@@ -71,11 +71,12 @@ export default {
flex-shrink: 0;
padding: 0 20px 0 6px;
width: 240px;
-webkit-app-region: drag;
&::after {
position: absolute;
content: "";
right: 0;
border-right: 1px solid #031428;
border-right: 1px solid rgba(3, 20, 40, 0.5);
width: 1px;
height: calc(100% - 14px);
}
......@@ -83,10 +84,9 @@ export default {
.left_img {
margin-top: 6px;
width: 225px;
// height: 60px;
height: 54px;
height: 60px;
object-fit: contain;
-webkit-app-region: no-drag;
}
.left_name {
padding-left: 4px;
......
src/renderer/components/Dockmode/second.vue
浏览文件 @ bd556075
<template>
<div class="second_container">
<div class="left_main">
<img src="~@/assets/xuchanzhongxue.png" alt="" class="left_img" @click="getFrontApp">
<img src="~@/assets/xuchanzhongxue.png" alt="" class="left_img disable-drag" @click="getFrontApp">
</div>
<div class="right_app_wrapper">
<div class="right_app" :class="['active_'+(current+1)]">
......@@ -14,10 +14,10 @@
</div>
</div>
</el-scrollbar>
<div v-if="list.length > 12" @click="toLeft" class="scroll-to-left">
<div v-if="list && list.length > 12" @click="toLeft" class="scroll-to-left">
<span class="iconfont icon-right"></span>
</div>
<div v-if="list.length > 12" @click="toRight" class="scroll-to-right">
<div v-if="list && list.length > 12" @click="toRight" class="scroll-to-right">
<span class="iconfont icon-right"></span>
</div>
</div>
......@@ -167,7 +167,7 @@ export default {
.second_container {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
.left_main {
box-sizing: border-box;
......
src/renderer/views/Home.vue
浏览文件 @ bd556075
<template>
<div class="application-list-container" :class="{'uMode':mode === 'modeUXue'}">
<div class="application-list-container" :class="{'uMode':mode === 'modeUXue'}" :style="applicationStyle">
<one v-if="mode !== 'modeUXue'" :cateList="categoryList" :mode="mode"
@tapApp="tapApp" @getFrontApp="newWin"></one>
<second v-else
......@@ -22,7 +22,7 @@ export default {
return {
appList: [],
categoryList:[],
mode: "modeJiJian",
mode: "modeJiJian", //modeJianYue、modeUXue
showManage:false,
secondAcitveIndex:1, //U学模式，当前选中
};
......@@ -31,6 +31,23 @@ export default {
ipcRenderer() {
return (this.$electron && this.$electron.ipcRenderer) || {};
},
applicationStyle() {
if(this.mode === "modeJiJian") {
return {
height: `${process.env.VUE_APP_JiJianModeH}px`
}
}
if(this.mode === "modeJianYue") {
return {
height: `${process.env.VUE_APP_mainH}px`
}
}
if(this.mode === "modeUXue") {
return {
height: `${process.env.VUE_APP_UXueModeH}px`
}
}
}
},
created() {
// this.ipcRenderer.invoke('getOsPlatform').then((platform) => {
......@@ -81,11 +98,11 @@ export default {
// width: 1200,
width: 600,
height: 700,
backgroundColor: "#DBE4F6",
// backgroundColor: "#DBE4F6",
resizable: false,
modal: false,
x: 0,
y: mainY - 700 -6,
x: Number( process.env.VUE_APP_WINDOW_LEFT ),
y: mainY - 700 - 6 - Number( process.env.VUE_APP_WINDOW_BOTTOM ),
webType:'appManage',
visible: 'hide'
});
......@@ -314,10 +331,16 @@ export default {
</script>
<style lang="less" scoped>
.application-list-container {
box-sizing: border-box;
border-radius: 8px;
border: 1px solid rgba(135, 183, 255, 0.44);
border-right-color: rgba(0,148,255,0.5);
border-left-color: rgba(0,148,255,0.5);
width: 100%;
height: 60px;
// height: 60px;
height: 100%;
font-size: 24px;
// background: #fff;
background: linear-gradient(180deg, rgba(10,37,91,0.3) 0%, #05173A 100%);
&.uMode {
height: 74px;
......
src/renderer/views/manage/index.vue
浏览文件 @ bd556075
......@@ -267,6 +267,7 @@ export default {
display: flex;
flex-direction: column;
justify-content: space-between;
border-radius: 20px 0 0 20px;
background-color: #DBE4F6;
box-shadow: 2px 0px 4px 0px rgba(10,78,141,0.1);
transition: width 0.6s;
......@@ -306,10 +307,10 @@ export default {
}
}
.manage_main {
border-radius: 0 20px 20px 0;
padding: 36px 0 36px 48px;
background-color: #C6D3EA;
.manage_main_content {
// padding-bottom: 36px;
padding-right: 48px;
}
.el-scrollbar__wrap {
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论