zdg #106
|
@ -58,6 +58,12 @@ export function ipcMsgSend(key, data, type) {
|
|||
return ipcRenderer?.invoke(key, data)
|
||||
}
|
||||
}
|
||||
export function ipcMsgSend2(key, ...args) {
|
||||
return ipcRenderer?.send(key, ...args)
|
||||
}
|
||||
export function ipcMsgInvoke(key, ...args) {
|
||||
return ipcRenderer?.invoke(key, ...args)
|
||||
}
|
||||
/**
|
||||
* @description 封装ipcRenderer事件监听
|
||||
* @param {*} fn on once handle invoke
|
||||
|
@ -197,9 +203,9 @@ const eventHandles = (type, win) => {
|
|||
const setIgnore = (_, ignore) => {win.setIgnoreMouseEvents(ignore, {forward: true})}
|
||||
Remote.ipcMain.handle('tool-sphere:set:ignore', setIgnore) // 异步
|
||||
// 关闭窗口
|
||||
Remote.ipcMain.once('tool-sphere:close', () => { win&&win.destroy() })
|
||||
// 放大监听-测试
|
||||
Remote.ipcMain.once('maximize-window', () => {win&&win.destroy()})
|
||||
Remote.ipcMain.handleOnce('tool-sphere:close', () => {win&&win.destroy()})
|
||||
// // 放大监听-测试
|
||||
// Remote.ipcMain.once('maximize-window', () => {win&&win.destroy()})
|
||||
const on = {
|
||||
onClosed: () => {
|
||||
Remote.ipcMain.removeHandler('tool-sphere:set:ignore', setIgnore)
|
||||
|
|
|
@ -38,7 +38,7 @@ const props = defineProps({
|
|||
{ label: '资源', prop: 'resource', icon: 'icon-hudong' },
|
||||
{ label: '互动', prop: 'interact', icon: 'icon-hudong' },
|
||||
{ label: '窗口', prop: 'win', icon: 'icon-hudong' },
|
||||
{ label: '下课', prop: 'over', icon: 'icon-hudong' },
|
||||
{ label: '下课', prop: 'over', isExtra: true, icon: 'icon-hudong' },
|
||||
]
|
||||
}
|
||||
})
|
||||
|
@ -71,12 +71,14 @@ const getStyle = (style,index) => {
|
|||
}
|
||||
// 事件
|
||||
const clickHandel = (o, e) => {
|
||||
const node = e.target.parentNode.getBoundingClientRect()
|
||||
const isColse = activeObj.value && activeObj.value.prop === o.prop && isVisible.value
|
||||
isVisible.value = !isColse // 相同的按钮且打开状态,点击关闭
|
||||
activeObj.value = o
|
||||
const nodeH = parseInt(node.height / 2) // 高度的一半
|
||||
topPos.value = parseInt(node.top) - posBtnAll.top + nodeH
|
||||
if (!o.isExtra) { // 忽略其他操作: 打开内容窗口,指示器指向当前
|
||||
const node = e.target.parentNode.getBoundingClientRect()
|
||||
const isColse = activeObj.value && activeObj.value.prop === o.prop && isVisible.value
|
||||
isVisible.value = !isColse // 相同的按钮且打开状态,点击关闭
|
||||
activeObj.value = o
|
||||
const nodeH = parseInt(node.height / 2) // 高度的一半
|
||||
topPos.value = parseInt(node.top) - posBtnAll.top + nodeH
|
||||
}
|
||||
emit('change', o)
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -29,7 +29,8 @@ class Ignore {
|
|||
})
|
||||
}
|
||||
changeHandle(e) {
|
||||
const customEvent = new CustomEvent('ignore-mounted', {detail:{ignore: this, e}})
|
||||
const data = {detail:{ignore: this, e, type: e.type}}
|
||||
const customEvent = new CustomEvent('ignore-mounted', data)
|
||||
this.el.dispatchEvent(customEvent)
|
||||
}
|
||||
}
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<!-- 画板 -->
|
||||
<board-vue v-model="tabActive" v-show="isShow" ref="boardVueRef"></board-vue>
|
||||
<!-- 侧边工具栏 -->
|
||||
<side-vue v-ignore></side-vue>
|
||||
<side-vue v-ignore @ignore-mounted="sideMouse" @change="sideChange"></side-vue>
|
||||
<!-- 底部工具栏 :style="dataPos.style"-->
|
||||
<div class="tool-bottom-all" @mouseenter="mouseChange(0)" @mouseleave="mouseChange(1)">
|
||||
<div v-drag="{handle:'.tool-bottom-all', dragtime}"
|
||||
|
@ -36,7 +36,7 @@ import sideVue from './components/side.vue' // 画板-子组件
|
|||
import vDrag from './directive/drag' // 自定义指令-拖拽
|
||||
import vIgnore from './directive/ignore' // 自定义指令-穿透
|
||||
import { useToolState } from '@/store/modules/tool'
|
||||
import { ipcMsgSend, ipcHandle, ipcMain } from '@/utils/tool' // 相关工具
|
||||
import { ipcMsgSend, ipcHandle, ipcMain, ipcMsgInvoke } from '@/utils/tool' // 相关工具
|
||||
const tabActive = ref('select') // 工具栏当前选中项
|
||||
const isFold = ref(false) // 折叠工具栏
|
||||
const isDrag = ref(false) // 开始拖拽
|
||||
|
@ -53,33 +53,38 @@ const btnList = [ // 工具栏按钮列表
|
|||
// { label: '聚焦', value: 'focus', icon: 'icon-jujiao' },
|
||||
// { label: '更多', value: 'more', icon: 'icon-xiazai9' },
|
||||
]
|
||||
// 页面加载完毕
|
||||
// === 页面加载完毕 ===
|
||||
onMounted(async() => {
|
||||
resetStatus() // 开启重置状态-监听
|
||||
})
|
||||
// const test = (e) => { console.log('test', e) }
|
||||
|
||||
|
||||
// ==== 方法 ===
|
||||
const tabChange = (val) => { // 切换tab-change
|
||||
// const test = (e) => { console.log('test', e) }
|
||||
// 切换tab-change
|
||||
const tabChange = (val) => {
|
||||
const bool = !toolStore.isPdfWin && !toolStore.showBoardAll
|
||||
if(bool) toolStore.showBoardAll = true
|
||||
// ipcMsgSend('tool-sphere:close')
|
||||
toolStore.model = val // 存储当前tab
|
||||
}
|
||||
const logoHandle = (e,t) => { // logo 点击-事件 折叠|展开
|
||||
// logo 点击-事件 折叠|展开
|
||||
const logoHandle = (e,t) => {
|
||||
if (Date.now() - dragtime.value < 200) {
|
||||
isFold.value = !isFold.value
|
||||
}
|
||||
}
|
||||
const mouseChange = (bool) => { // 鼠标移入工具栏 是否穿透
|
||||
// 底部工具栏:移入移出-是否穿透
|
||||
const mouseChange = (bool) => {
|
||||
let resBool = false
|
||||
if (tabActive.value == 'select') resBool = !!bool
|
||||
if (!isShow.value) resBool = !!bool
|
||||
setIgnore(resBool)
|
||||
}
|
||||
const setIgnore = (bool) => { // 忽略鼠标穿透
|
||||
ipcMsgSend('tool-sphere:set:ignore', bool)
|
||||
}
|
||||
const resetStatus = () => { // 重置状态
|
||||
// 忽略鼠标穿透
|
||||
const setIgnore = (bool) => {ipcMsgSend('tool-sphere:set:ignore', bool)}
|
||||
// 重置状态: 鼠标|画板
|
||||
const resetStatus = () => {
|
||||
if (toolStore.isToolWin) return // 已经打开过-忽略
|
||||
ipcMain?.handle?.('tool-sphere:reset', () => {
|
||||
setTimeout(() => {
|
||||
|
@ -89,8 +94,30 @@ const resetStatus = () => { // 重置状态
|
|||
})
|
||||
toolStore.isToolWin = true // 标记状态
|
||||
}
|
||||
// 侧边工具栏: 移入移出
|
||||
const sideMouse = e => {
|
||||
const {type} = e.detail
|
||||
mouseChange(type == 'mouseleave')
|
||||
}
|
||||
// 侧边工具栏: 操作变化
|
||||
const sideChange = o => {
|
||||
// console.log(o)
|
||||
switch(o.prop) {
|
||||
case 'resource': // 资源
|
||||
break
|
||||
case 'interact': // 互动
|
||||
break
|
||||
case 'win': // 窗口
|
||||
break
|
||||
case 'over': // 下课
|
||||
toolStore.isToolWin = false
|
||||
ipcMsgSend('tool-sphere:close')
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
watchEffect(() => { // 监听
|
||||
// === 监听器 ===
|
||||
watchEffect(() => {
|
||||
// 不同的时候, 更新值: 是否显示-画板
|
||||
const show = !toolStore.isPdfWin && toolStore.showBoardAll
|
||||
if (show != isShow.value) isShow.value = show
|
||||
|
|
Loading…
Reference in New Issue