Compare commits
14 Commits
1871e7e565
...
22239090ea
Author | SHA1 | Date |
---|---|---|
yangws | 22239090ea | |
zhengdegang | cb0d60b93e | |
zdg | d65af70a34 | |
zdg | 3f4e9c35b0 | |
zhengdegang | a133c322f3 | |
zdg | b5d41050ae | |
zdg | fa77c6cc6b | |
lyc | ff97a2bef6 | |
lyc | 05c567d1cd | |
lyc | 1a6abfaa50 | |
zhengdegang | 2ae200cc9e | |
zdg | 177df96d69 | |
zdg | 571bfc98f7 | |
yangws | b249df2dff |
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "aix-win",
|
||||
"version": "1.1.1",
|
||||
"version": "1.1.6",
|
||||
"description": "An Electron application with Vue",
|
||||
"main": "./out/main/index.js",
|
||||
"author": "example.com",
|
||||
|
|
Binary file not shown.
After Width: | Height: | Size: 48 KiB |
|
@ -3,15 +3,17 @@ import { join } from 'path'
|
|||
import { electronApp, optimizer, is } from '@electron-toolkit/utils'
|
||||
import icon from '../../resources/icon.png?asset'
|
||||
import File from './file'
|
||||
import chat from './chat' // chat封装
|
||||
import Store from './store' // Store封装
|
||||
import Logger from './logger' // 日志封装
|
||||
import chat from './chat' // chat封装
|
||||
import Store from './store' // Store封装
|
||||
import updateInit from './update'
|
||||
|
||||
// 代理 electron/remote
|
||||
// 第一步:引入remote
|
||||
import remote from '@electron/remote/main'
|
||||
// 第二步: 初始化remote
|
||||
remote.initialize()
|
||||
// 日志配置-初始化(日志直接绑定到console上)
|
||||
Logger.initialize()
|
||||
// 持久化数据-初始化
|
||||
Store.initialize()
|
||||
|
||||
|
@ -153,6 +155,7 @@ async function createLinkWin(data) {
|
|||
|
||||
// 初始化完成
|
||||
app.on('ready', () => {
|
||||
appWatchError() // 监听app错误
|
||||
process.env.LANG = 'en_US.UTF-8'
|
||||
// 设置应用程序用户模型标识符
|
||||
electronApp.setAppUserModelId('com.electron')
|
||||
|
@ -259,3 +262,34 @@ function handleAll() {
|
|||
win.webContents.send('pinia-state-set', storeName, jsonStr)
|
||||
})
|
||||
}
|
||||
|
||||
// app 崩溃监听器
|
||||
function appWatchError() {
|
||||
// 渲染进程崩溃
|
||||
app.on('renderer-process-crashed', (event, webContents, killed) => {
|
||||
console.error(
|
||||
`APP-ERROR:renderer-process-crashed; event: ${JSON.stringify(event)}; webContents:${JSON.stringify(
|
||||
webContents
|
||||
)}; killed:${JSON.stringify(killed)}`
|
||||
)
|
||||
})
|
||||
|
||||
// GPU进程崩溃
|
||||
app.on('gpu-process-crashed', (event, killed) => {
|
||||
console.error(`APP-ERROR:gpu-process-crashed; event: ${JSON.stringify(event)}; killed: ${JSON.stringify(killed)}`)
|
||||
})
|
||||
|
||||
// 渲染进程结束
|
||||
app.on('render-process-gone', async (event, webContents, details) => {
|
||||
console.error(
|
||||
`APP-ERROR:render-process-gone; event: ${JSON.stringify(event)}; webContents:${JSON.stringify(
|
||||
webContents
|
||||
)}; details:${JSON.stringify(details)}`
|
||||
)
|
||||
})
|
||||
|
||||
// 子进程结束
|
||||
app.on('child-process-gone', async (event, details) => {
|
||||
console.error(`APP-ERROR:child-process-gone; event: ${JSON.stringify(event)}; details:${JSON.stringify(details)}`)
|
||||
})
|
||||
}
|
|
@ -0,0 +1,52 @@
|
|||
/**
|
||||
* @description 日志配置
|
||||
* @author zdg
|
||||
* @date 2021-07-05 14:07:01
|
||||
*/
|
||||
// import log from 'electron-log'
|
||||
import log from 'electron-log/main'
|
||||
import { app } from 'electron'
|
||||
import path from 'path'
|
||||
|
||||
// 关闭控制台打印
|
||||
// 日志控制台等级,默认值:false
|
||||
log.transports.console.level = false
|
||||
// log.transports.console.level = 'info'
|
||||
// 日志文件等级,默认值:false
|
||||
log.transports.file.level = 'info'
|
||||
// 日志文件名,默认:main.log
|
||||
// log.transports.file.fileName = 'main.log';
|
||||
// 日志大小,默认:1048576(1M),达到最大上限后,备份文件并重命名为:main.old.log,有且仅有一个备份文件
|
||||
log.transports.file.maxSize = 10 * 1024 * 1024; // 文件最大不超过 10M
|
||||
// 自定义日志文件滚动策略
|
||||
log.transports.file.rollSize = 10 * 1024 * 1024; // 10MB
|
||||
// 日志格式,默认:[{y}-{m}-{d} {h}:{i}:{s}.{ms}] [{level}]{scope} {text}
|
||||
log.transports.file.format = '[{y}-{m}-{d} {h}:{i}:{s}.{ms}] [{level}]{scope} {text}'
|
||||
let date = new Date()
|
||||
let dateStr = date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate()
|
||||
// 文件位置及命名方式
|
||||
// 默认位置为:C:\Users\[user]\AppData\Roaming\[appname]\electron_log\
|
||||
// 文件名为:年-月-日.log
|
||||
// 自定义文件保存位置为安装目录下 \log\年-月-日.log
|
||||
// log.transports.file.resolvePathFn = () => 'logs\\' + dateStr+ '.log';
|
||||
log.transports.file.resolvePathFn = () => path.join(app.getPath('userData'), `logs/${dateStr}.log`)
|
||||
|
||||
// 有六个日志级别error, warn, info, verbose, debug, silly。默认是silly
|
||||
export const logger = {
|
||||
error: (...args) => log.error(...args),
|
||||
warn: (...args) => log.warn(...args),
|
||||
info: (...args) => log.info(...args),
|
||||
verbose: (...args) => log.verbose(...args),
|
||||
debug: (...args) => log.debug(...args),
|
||||
silly: (...args) => log.silly(...args)
|
||||
}
|
||||
export function initialize(bool = true, type = 'all') {
|
||||
log.initialize() // 为渲染器进行初始化
|
||||
if (bool) { // 是否替换默认的console
|
||||
if (type == 'all') Object.assign(console, log.functions)
|
||||
else { // 替换指定类型
|
||||
console[type] = log[type]
|
||||
}
|
||||
}
|
||||
}
|
||||
export default { initialize }
|
|
@ -8,25 +8,54 @@ Store.initRenderer()
|
|||
|
||||
// 默认共享数据
|
||||
const defaultData = {
|
||||
model: 'select', // 悬浮球-当前模式
|
||||
showBoardAll: false, // 全屏画板-是否显示
|
||||
isPdfWin: false, // pdf窗口是否打开
|
||||
isToolWin: false, // 工具窗口是否打开
|
||||
curSubjectNode: {
|
||||
data: {}, // 当前教材节点 (包含当前教材 单元)
|
||||
querySearch: {} // 查询资源所需参数
|
||||
}
|
||||
session: { // 缓存(临时sessionStorage)
|
||||
model: 'select', // 悬浮球-当前模式
|
||||
showBoardAll: false, // 全屏画板-是否显示
|
||||
isPdfWin: false, // pdf窗口是否打开
|
||||
isToolWin: false, // 工具窗口是否打开
|
||||
curSubjectNode: {
|
||||
data: {}, // 当前教材节点 (包含当前教材 单元)
|
||||
querySearch: {} // 查询资源所需参数
|
||||
}
|
||||
},
|
||||
local: { // 本地(永久localStorage)
|
||||
},
|
||||
}
|
||||
|
||||
// 初始化
|
||||
export function initialize(){
|
||||
const store = new Store({
|
||||
name: 'cache-store', // 存储文件名
|
||||
// 缓存数据-sessionStore
|
||||
const sessionStore = new Store({
|
||||
name: 'session-store', // 存储文件名
|
||||
fileExtension: 'ini', // 文件后缀名
|
||||
encryptionKey: 'Eihrjwi7h104h2Kub423' // 数据加密-防止用户直接改配置
|
||||
encryptionKey: 'BvPLmgCC4DSIG0KkTec5', // 数据加密-防止用户直接改配置
|
||||
beforeEachMigration: (store, context) => { // 版本迁移回调
|
||||
console.log(`[session-store] 迁移从 ${context.fromVersion} → ${context.toVersion}`);
|
||||
},
|
||||
migrations: { // 版本变化
|
||||
'0.0.0': store => {
|
||||
// store.set('debugPhase', true);
|
||||
}
|
||||
}
|
||||
})
|
||||
store.clear() // 先清除-所有缓存数据
|
||||
store.set(defaultData) // 初始化-默认数据
|
||||
return store
|
||||
sessionStore.clear() // 先清除-所有缓存数据
|
||||
sessionStore.set(defaultData.session) // 初始化-默认数据
|
||||
|
||||
// 缓存数据-localStore
|
||||
const localStore = new Store({
|
||||
name: 'local-store', // 存储文件名
|
||||
fileExtension: 'ini', // 文件后缀名
|
||||
encryptionKey: '6CyoHQmUaPmLzvVsh', // 数据加密-防止用户直接改配置
|
||||
beforeEachMigration: (store, context) => { // 版本迁移回调
|
||||
console.log(`[local-store] 迁移从 ${context.fromVersion} → ${context.toVersion}`);
|
||||
},
|
||||
migrations: { // 版本变化
|
||||
'0.0.0': store => {
|
||||
// store.set('debugPhase', true);
|
||||
}
|
||||
}
|
||||
})
|
||||
localStore.set(defaultData.local) // 初始化-默认数据
|
||||
return {sessionStore, localStore}
|
||||
}
|
||||
export default { initialize }
|
|
@ -12,10 +12,14 @@ import 'virtual:windi.css'
|
|||
import { store } from '@/store'
|
||||
import App from './App.vue'
|
||||
import router from './router'
|
||||
import log from 'electron-log/renderer' // 渲染进程日志-文件记录
|
||||
|
||||
if(process.env.NODE_ENV != 'development') { // 非开发环境,将日志打印到日志文件
|
||||
Object.assign(console, log.functions) // 渲染进程日志-控制台替换
|
||||
}
|
||||
|
||||
const app = createApp(App)
|
||||
|
||||
|
||||
app.use(router)
|
||||
.use(store)
|
||||
.use(ElementPlus, { locale: zhLocale }).mount('#app')
|
|
@ -21,12 +21,21 @@ const toolState = useToolState() // 获取store状态
|
|||
|
||||
// 暴露Remote中的属性
|
||||
export const ipcMain = Remote?.ipcMain || {}
|
||||
// 暴露Store存储对象
|
||||
export const store = Store ? new Store({
|
||||
name: 'cache-store', // 存储文件名
|
||||
fileExtension: 'ini', // 文件后缀名
|
||||
encryptionKey: 'Eihrjwi7h104h2Kub423' // 数据加密-防止用户直接改配置
|
||||
|
||||
// 暴露sessionStore存储对象
|
||||
export const sessionStore = Store ? new Store({
|
||||
name: 'session-store', // 存储文件名
|
||||
fileExtension: 'ini', // 文件后缀名
|
||||
encryptionKey: 'BvPLmgCC4DSIG0KkTec5' // 数据加密-防止用户直接改配置
|
||||
}) : {}
|
||||
|
||||
// 暴露localStore存储对象
|
||||
export const localStore = Store ? new Store({
|
||||
name: 'local-store', // 存储文件名
|
||||
fileExtension: 'ini', // 文件后缀名
|
||||
encryptionKey: '6CyoHQmUaPmLzvVsh' // 数据加密-防止用户直接改配置
|
||||
}) : {}
|
||||
|
||||
/**
|
||||
* 获取静态资源,开发和生产环境
|
||||
* @param {*} url
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
<template>
|
||||
<el-card style="width: 100%;height: 100%">
|
||||
<template #header>
|
||||
<div class="card-header" style="text-align: left">
|
||||
<el-button type="primary" @click="addGroup">新建分组</el-button>
|
||||
</div>
|
||||
</template>
|
||||
<!-- <template #header>-->
|
||||
<!-- <div class="card-header" style="text-align: left">-->
|
||||
<!-- <el-button type="primary" @click="addGroup">新建分组</el-button>-->
|
||||
<!-- </div>-->
|
||||
<!-- </template>-->
|
||||
<template v-if="groupList.length > 0">
|
||||
<div style="font-size: 16px;font-weight: bold;color: #000;text-align: left;margin-bottom: 5px">可用分组</div>
|
||||
<div class="groupList">
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
<template>
|
||||
<el-card style="width: 100%;height: 100%">
|
||||
<template #header>
|
||||
<div style="text-align: left">
|
||||
<el-button type="danger" @click="deleteClassRoom">删除班级</el-button>
|
||||
</div>
|
||||
</template>
|
||||
<!-- <template #header>-->
|
||||
<!-- <div style="text-align: left">-->
|
||||
<!-- <el-button type="danger" @click="deleteClassRoom">删除班级</el-button>-->
|
||||
<!-- </div>-->
|
||||
<!-- </template>-->
|
||||
<el-descriptions :column="1">
|
||||
<el-descriptions-item label="班级名称">{{ classInfo.caption }}</el-descriptions-item>
|
||||
<el-descriptions-item label="教师">
|
||||
|
|
|
@ -6,11 +6,12 @@
|
|||
<div :style="{'max-height': (viewportHeight - 120) + 'px','overflow-y': 'auto'}">
|
||||
<Aside :menuItems="menuItems" :classList="classList" @handleSelect="handleSelect"></Aside>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div>
|
||||
<el-button @click="addClass" type="primary" :icon="Plus" >新增班级</el-button>
|
||||
</div>
|
||||
</template>
|
||||
<!-- 隐藏操作按钮-->
|
||||
<!-- <template #footer>-->
|
||||
<!-- <div>-->
|
||||
<!-- <el-button @click="addClass" type="primary" :icon="Plus" >新增班级</el-button>-->
|
||||
<!-- </div>-->
|
||||
<!-- </template>-->
|
||||
</el-card>
|
||||
</el-aside>
|
||||
<el-main :style="{'min-height': (viewportHeight - 160) + 'px'}">
|
||||
|
|
|
@ -3,10 +3,10 @@
|
|||
<el-card style="width: 100%;height: 100%;overflow-y: auto">
|
||||
<template #header>
|
||||
<div style="text-align: left;display: flex;justify-content: space-between">
|
||||
<div>
|
||||
<el-button type="primary" @click="addStudent(0)">新增学生</el-button>
|
||||
<el-button type="primary" @click="importStudent()">导入学生</el-button>
|
||||
</div>
|
||||
<!-- <div>-->
|
||||
<!-- <el-button type="primary" @click="addStudent(0)">新增学生</el-button>-->
|
||||
<!-- <el-button type="primary" @click="importStudent()">导入学生</el-button>-->
|
||||
<!-- </div>-->
|
||||
<el-text class="mx-1">点击学生头像查看学生信息</el-text>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -54,27 +54,27 @@
|
|||
<el-form-item label="电话" prop="parentmobile">
|
||||
<el-input v-model="studentForm.parentmobile" placeholder="请输入电话" style="width: 50%"/>
|
||||
</el-form-item>
|
||||
<div>
|
||||
<el-row :gutter="4">
|
||||
<el-col :span="12">
|
||||
<el-form-item label-width="100px" label="平台登录账号">
|
||||
系统自动创建
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label-width="100px" label="平台登录密码">
|
||||
系统自动创建,默认为123123
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<!-- <div>-->
|
||||
<!-- <el-row :gutter="4">-->
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label-width="100px" label="平台登录账号">-->
|
||||
<!-- 系统自动创建-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label-width="100px" label="平台登录密码">-->
|
||||
<!-- 系统自动创建,默认为123123-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- </el-row>-->
|
||||
<!-- </div>-->
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button type="warning" v-show="studentForm.id > 0" @click="delStudent(1)">移出班级</el-button>
|
||||
<el-button type="danger" v-show="studentForm.id > 0 && studentForm.editoruserid == userStore.userId" @click="delStudent(2)">删除学生</el-button>
|
||||
<el-button @click="studentVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="btnStudentSave">确 定</el-button>
|
||||
</template>
|
||||
<!-- <template #footer>-->
|
||||
<!-- <el-button type="warning" v-show="studentForm.id > 0" @click="delStudent(1)">移出班级</el-button>-->
|
||||
<!-- <el-button type="danger" v-show="studentForm.id > 0 && studentForm.editoruserid == userStore.userId" @click="delStudent(2)">删除学生</el-button>-->
|
||||
<!-- <el-button @click="studentVisible = false">取 消</el-button>-->
|
||||
<!-- <el-button type="primary" @click="btnStudentSave">确 定</el-button>-->
|
||||
<!-- </template>-->
|
||||
</el-dialog>
|
||||
<!-- 学生导入-->
|
||||
<el-dialog title="学生导入" v-model="importVisiable" :width="600" append-to-body>
|
||||
|
|
|
@ -177,14 +177,19 @@ const disabledHours = ()=>{
|
|||
}
|
||||
}
|
||||
// 限制分-返回被禁选的
|
||||
const disabledMinute = () => {
|
||||
const disabledMinute = (hour,role) => {
|
||||
if(getCurrentTime('YYYY-MM-DD') == form.day){
|
||||
const arrs = []
|
||||
for (let i = 0; i < 60; i++) {
|
||||
if (new Date().getMinutes() <= i && form.time[0]) continue;
|
||||
arrs.push(i)
|
||||
if(role == 'start'){
|
||||
for (let i = 0; i < 60; i++) {
|
||||
if (new Date().getMinutes() <= i) continue;
|
||||
arrs.push(i)
|
||||
}
|
||||
return arrs;
|
||||
}
|
||||
else{
|
||||
if(form.time[0]) return []
|
||||
}
|
||||
return arrs;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -2,17 +2,19 @@
|
|||
<div class="warp" ref="btnRef" :style="isFold?'min-height:auto;':''">
|
||||
<slot name="start"></slot>
|
||||
<!-- 工具按钮 -->
|
||||
<el-space direction="vertical" v-show="!isFold">
|
||||
<template v-for="(item,index) in list">
|
||||
<slot :name="item.prop" :item="item" :index="index">
|
||||
<div class="c-btn flex flex-col items-center gap-2 p-2" @click.stop="clickHandel(item,$event)">
|
||||
<i class="iconfont" :class="item.icon" :style="item.style" />
|
||||
<span>{{item.label||item.text||item.name}}</span>
|
||||
</div>
|
||||
</slot>
|
||||
</template>
|
||||
<slot name="append"></slot>
|
||||
</el-space>
|
||||
<transition name="el-zoom-in-bottom">
|
||||
<el-space direction="vertical" v-show="!isFold">
|
||||
<template v-for="(item,index) in list">
|
||||
<slot :name="item.prop" :item="item" :index="index">
|
||||
<div class="c-btn flex flex-col items-center gap-2 p-2" @click.stop="clickHandel(item,$event)">
|
||||
<i class="iconfont" :class="item.icon" :style="item.style" />
|
||||
<span>{{item.label||item.text||item.name}}</span>
|
||||
</div>
|
||||
</slot>
|
||||
</template>
|
||||
<slot name="append"></slot>
|
||||
</el-space>
|
||||
</transition>
|
||||
<slot name="end">
|
||||
<span class="fold" @click="isFold=!isFold" :style="isFold?'margin: 5px;':''">
|
||||
{{isFold?'<<<':'>>>'}}
|
||||
|
|
|
@ -36,6 +36,7 @@ class Drag {
|
|||
const {cx, cy} = this.getMousePos(e)
|
||||
this.x = cx
|
||||
this.y = cy
|
||||
this.getCurPos() // 被拖拽元素初始坐标
|
||||
// 手动-触发事件 v-drag-start
|
||||
this.el.dispatchEvent(new CustomEvent('v-drag-start', {detail:{drag: this}}))
|
||||
}
|
||||
|
@ -85,12 +86,20 @@ class Drag {
|
|||
}
|
||||
// 获取移动后坐标
|
||||
getPos(x, y) {
|
||||
const w = this.max.w - this.toRound(this.el.clientWidth)
|
||||
const h = this.max.h - this.toRound(this.el.clientHeight)
|
||||
// 边界控制:图标元素
|
||||
// const w = this.max.w - this.toRound(this.el.clientWidth)
|
||||
// const h = this.max.h - this.toRound(this.el.clientHeight)
|
||||
// 边界控制:整个工具
|
||||
const w = this.max.w - this.toRound(this.handle.clientWidth)
|
||||
const h = this.max.h - this.toRound(this.handle.clientHeight)
|
||||
x = x < 0 ? 0 : x > w ? w : x
|
||||
y = y < 0 ? 0 : y > h ? h : y
|
||||
return { x, y }
|
||||
}
|
||||
getCurPos(dom) {
|
||||
const pos = this[dom||'handle']?.getBoundingClientRect()
|
||||
this.data = {left:this.toRound(pos.left), top:this.toRound(pos.top)}
|
||||
}
|
||||
// 小数转整数
|
||||
toRound = v => Math.round(v)
|
||||
}
|
||||
|
|
|
@ -20,17 +20,19 @@
|
|||
<el-image :src="logo" draggable="false" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="tool-btns" v-show="!isFold">
|
||||
<el-segmented class="c-btns" v-model="tabActive" :options="btnList" size="large" block
|
||||
@change="tabChange">
|
||||
<template #default="{item}">
|
||||
<div class="c-btn flex flex-col items-center gap-2 p-2">
|
||||
<i class="iconfont" :class="item.icon" :style="item.style" />
|
||||
<span>{{item.label}}</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-segmented>
|
||||
</div>
|
||||
<transition name="a-fade">
|
||||
<div class="tool-btns" v-if="!isFold">
|
||||
<el-segmented class="c-btns" v-model="tabActive" :options="btnList" size="large" block
|
||||
@change="tabChange">
|
||||
<template #default="{item}">
|
||||
<div class="c-btn flex flex-col items-center gap-2 p-2">
|
||||
<i class="iconfont" :class="item.icon" :style="item.style" />
|
||||
<span>{{item.label}}</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-segmented>
|
||||
</div>
|
||||
</transition>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -41,7 +43,7 @@ import { onMounted, ref, reactive, watchEffect } from 'vue'
|
|||
import { useRoute } from 'vue-router';
|
||||
import { ElMessageBox, ElMessage, ElLoading } from 'element-plus'
|
||||
import * as classManageApi from '@/api/classManage'
|
||||
import logo from '@root/resources/icon.png' // logo
|
||||
import logo from '@root/resources/logo.png' // logo
|
||||
import boardVue from './components/board.vue' // 画板-子组件
|
||||
import sideVue from './components/side.vue' // 画板-子组件
|
||||
import upvoteVue from './components/upvote.vue' // 点赞-子组件
|
||||
|
@ -109,6 +111,23 @@ const tabChange = (val) => {
|
|||
const logoHandle = (e,t) => {
|
||||
if (Date.now() - dragtime.value < 200) {
|
||||
isFold.value = !isFold.value
|
||||
setTimeout(() => {
|
||||
// 处理: 工具被拖动到右侧时功能被遮挡
|
||||
const dom = document.querySelector('.tool-bottom-all')
|
||||
const { x } = dom.getBoundingClientRect()
|
||||
const w = window.innerWidth - (470 || 80)
|
||||
// if (x > w) dom.style.left = `${w}px`
|
||||
if (x > w) { // 动画
|
||||
let left = x
|
||||
const animatFn = () => {
|
||||
left-=30
|
||||
if (left < w) left == w
|
||||
dom.style.left = `${left}px`
|
||||
if (left > w) requestAnimationFrame(animatFn)
|
||||
}
|
||||
requestAnimationFrame(animatFn)
|
||||
}
|
||||
}, 20);
|
||||
}
|
||||
}
|
||||
// 底部工具栏:移入移出-是否穿透
|
||||
|
@ -262,4 +281,15 @@ watchEffect(() => {
|
|||
}
|
||||
}
|
||||
}
|
||||
.a-fade-leave-active,.a-fade-enter-active{
|
||||
transition: all .3s;
|
||||
}
|
||||
.a-fade-enter-from,.a-fade-leave-to{
|
||||
width: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
.a-fade-enter-to,.a-fade-leave-from{
|
||||
width: 350px;
|
||||
opacity: 1;
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Reference in New Issue