mirror of
https://github.com/kuaifan/dootask.git
synced 2026-03-03 16:02:08 +00:00
feat: 标签页新增更多菜单按钮
- 将原浏览器打开按钮替换为更多菜单按钮 - 添加 more.svg 图标并调整样式 - 实现 webTabShowMenu 通信接口及菜单框架
This commit is contained in:
parent
4929d44ce7
commit
3b1dce6d67
56
electron/electron.js
vendored
56
electron/electron.js
vendored
@ -1958,6 +1958,62 @@ ipcMain.on('webTabExternal', (event) => {
|
||||
event.returnValue = "ok"
|
||||
})
|
||||
|
||||
/**
|
||||
* 内置浏览器 - 显示更多菜单
|
||||
*/
|
||||
ipcMain.on('webTabShowMenu', (event, args) => {
|
||||
const windowId = args?.windowId
|
||||
const windowData = windowId ? webTabWindows.get(windowId) : null
|
||||
const webTabWindow = windowData?.window
|
||||
|
||||
if (!webTabWindow || webTabWindow.isDestroyed()) {
|
||||
event.returnValue = "ok"
|
||||
return
|
||||
}
|
||||
|
||||
const item = currentWebTabInWindow(windowId)
|
||||
const currentUrl = item?.view?.webContents?.getURL() || ''
|
||||
|
||||
const menuTemplate = [
|
||||
{
|
||||
label: '重新加载',
|
||||
click: () => {
|
||||
// TODO: 实现重新加载
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '复制链接地址',
|
||||
click: () => {
|
||||
// TODO: 实现复制链接
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '默认浏览器打开',
|
||||
click: () => {
|
||||
// TODO: 实现默认浏览器打开
|
||||
}
|
||||
},
|
||||
{ type: 'separator' },
|
||||
{
|
||||
label: '将标签页移至新窗口',
|
||||
click: () => {
|
||||
// TODO: 实现移至新窗口
|
||||
}
|
||||
},
|
||||
{ type: 'separator' },
|
||||
{
|
||||
label: '打印',
|
||||
click: () => {
|
||||
// TODO: 实现打印
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
const menu = Menu.buildFromTemplate(menuTemplate)
|
||||
menu.popup({ window: webTabWindow })
|
||||
event.returnValue = "ok"
|
||||
})
|
||||
|
||||
/**
|
||||
* 内置浏览器 - 打开开发者工具
|
||||
*/
|
||||
|
||||
22
electron/render/tabs/assets/css/style.css
vendored
22
electron/render/tabs/assets/css/style.css
vendored
@ -135,11 +135,12 @@ body {
|
||||
content: none;
|
||||
}
|
||||
|
||||
/* 浏览器打开 */
|
||||
.nav-browser {
|
||||
/* 更多菜单 */
|
||||
.nav-more {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 40px;
|
||||
padding: 0 14px;
|
||||
margin: 0 2px;
|
||||
@ -148,14 +149,15 @@ body {
|
||||
-webkit-app-region: none;
|
||||
}
|
||||
|
||||
.nav-browser span {
|
||||
display: inline-block;
|
||||
.nav-more svg {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
background-size: 94%;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url(../image/link/light_selected.svg);
|
||||
color: #000000;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.nav-more:hover svg {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 图标 */
|
||||
@ -390,8 +392,8 @@ body.darwin.full-screen .nav {
|
||||
background-image: var(--tab-icon-image, url(../image/earth/dark_selected.svg));
|
||||
}
|
||||
|
||||
.nav-browser span {
|
||||
background-image: url(../image/link/dark_selected.svg);
|
||||
.nav-more svg {
|
||||
color: #C7C7C7;
|
||||
}
|
||||
|
||||
.tab-icon::before {
|
||||
|
||||
@ -29,8 +29,8 @@
|
||||
<div class="tab-close" @click.stop="onClose(item)"></div>
|
||||
</li>
|
||||
</ul>
|
||||
<div v-if="canBrowser" class="nav-browser" @click="onBrowser">
|
||||
<span></span>
|
||||
<div class="nav-more" @click="onShowMenu">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><g fill="none"><path d="M9.5 16a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0zm9 0a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0zm6.5 2.5a2.5 2.5 0 1 0 0-5a2.5 2.5 0 0 0 0 5z" fill="currentColor"></path></g></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -513,10 +513,10 @@
|
||||
},
|
||||
|
||||
/**
|
||||
* 打开浏览器
|
||||
* 显示更多菜单
|
||||
*/
|
||||
onBrowser() {
|
||||
this.sendMessage('webTabExternal')
|
||||
onShowMenu() {
|
||||
this.sendMessage('webTabShowMenu', {windowId: this.windowId, tabId: this.activeId})
|
||||
},
|
||||
|
||||
/**
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user