优化合并文件夹,需要300毫秒
This commit is contained in:
parent
3a2d4a18e8
commit
a1d97e0c10
|
@ -14,9 +14,12 @@ export const ossCdnBase = import.meta.env.PROD
|
||||||
: 'https://oss.goosetab.com'
|
: 'https://oss.goosetab.com'
|
||||||
|
|
||||||
// 后端地址
|
// 后端地址
|
||||||
|
// export const apiBase = import.meta.env.PROD
|
||||||
|
// ? 'https://goosetab.com/api'
|
||||||
|
// : 'http://192.168.110.28:8300'
|
||||||
export const apiBase = import.meta.env.PROD
|
export const apiBase = import.meta.env.PROD
|
||||||
? 'https://goosetab.com/api'
|
? 'https://goosetab.com/api'
|
||||||
: 'http://192.168.110.28:8300'
|
: 'https://goosetab.com/api'
|
||||||
// eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySWQiOiI2NzJkYjg5OGUxMjY5NDc1ODYwMmYwMTgifQ.8fpdr_HPgxyU0yr-8f6nGdbHYjsFRlBa2lvjc0Zhe-A
|
// eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySWQiOiI2NzJkYjg5OGUxMjY5NDc1ODYwMmYwMTgifQ.8fpdr_HPgxyU0yr-8f6nGdbHYjsFRlBa2lvjc0Zhe-A
|
||||||
// 图片后缀名
|
// 图片后缀名
|
||||||
export const imgArr = [
|
export const imgArr = [
|
||||||
|
|
|
@ -10,6 +10,7 @@ import useSettingsStore from '@/settings/useSettingsStore'
|
||||||
import { useMenuStore } from '../GlobalMenu'
|
import { useMenuStore } from '../GlobalMenu'
|
||||||
import { block } from '@milkdown/kit/plugin/block'
|
import { block } from '@milkdown/kit/plugin/block'
|
||||||
import clsx from 'clsx'
|
import clsx from 'clsx'
|
||||||
|
import dayjs from 'dayjs'
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
props: {
|
props: {
|
||||||
|
@ -28,6 +29,8 @@ export default defineComponent({
|
||||||
const menu = useMenuStore()
|
const menu = useMenuStore()
|
||||||
let it: any = 0
|
let it: any = 0
|
||||||
const hover = ref(false)
|
const hover = ref(false)
|
||||||
|
const canPut = ref(false)
|
||||||
|
let enterTime: any = null;
|
||||||
return () => (
|
return () => (
|
||||||
<div
|
<div
|
||||||
class={clsx(
|
class={clsx(
|
||||||
|
@ -42,19 +45,40 @@ export default defineComponent({
|
||||||
transition: 'border .3s, transform .2s'
|
transition: 'border .3s, transform .2s'
|
||||||
// border: hover.value ? '2px solid rgba(255,255,255,.5)' : '2px solid rgba(255,255,255,0)'
|
// border: hover.value ? '2px solid rgba(255,255,255,.5)' : '2px solid rgba(255,255,255,0)'
|
||||||
}}
|
}}
|
||||||
onDblclick={e=> {
|
onDblclick={e => {
|
||||||
e.stopPropagation()
|
e.stopPropagation()
|
||||||
}}
|
}}
|
||||||
data-transportable={props.block.link && !props.block.link.startsWith('id:') ? '1' : ''}
|
data-transportable={props.block.link && !props.block.link.startsWith('id:') ? '1' : ''}
|
||||||
|
onDragenter={() => {
|
||||||
|
enterTime = Date.now()
|
||||||
|
}}
|
||||||
onDragover={(e) => {
|
onDragover={(e) => {
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
clearTimeout(it)
|
clearTimeout(it)
|
||||||
hover.value = true
|
hover.value = true
|
||||||
|
if (enterTime && (Date.now() - enterTime >= 300)) {
|
||||||
|
// 在这里执行你想要的操作,比如改变目标元素的样式或者触发其他函数
|
||||||
|
canPut.value = true
|
||||||
|
}else {
|
||||||
|
canPut.value = false
|
||||||
|
|
||||||
|
}
|
||||||
it = setTimeout(() => {
|
it = setTimeout(() => {
|
||||||
hover.value = false
|
hover.value = false
|
||||||
|
canPut.value = false
|
||||||
|
|
||||||
}, 300)
|
}, 300)
|
||||||
}}
|
}}
|
||||||
onDrop={() => {
|
onDrop={() => {
|
||||||
|
canPut.value = false
|
||||||
|
if (enterTime && (Date.now() - enterTime < 300)) {
|
||||||
|
// 在这里执行你想要的操作,比如改变目标元素的样式或者触发其他函数
|
||||||
|
return
|
||||||
|
|
||||||
|
}
|
||||||
|
enterTime = null;
|
||||||
|
|
||||||
|
|
||||||
// 处理移入
|
// 处理移入
|
||||||
if (!dragging.id) return
|
if (!dragging.id) return
|
||||||
if (dragging.type === 'dock') {
|
if (dragging.type === 'dock') {
|
||||||
|
@ -126,37 +150,42 @@ export default defineComponent({
|
||||||
layout.checkDir(dragging.type)
|
layout.checkDir(dragging.type)
|
||||||
resetDragging()
|
resetDragging()
|
||||||
}
|
}
|
||||||
}}
|
}
|
||||||
|
}
|
||||||
>
|
>
|
||||||
{menu.isEditPage && (
|
{
|
||||||
<div
|
menu.isEditPage && (
|
||||||
v-outside-click={() => {
|
<div
|
||||||
menu.isEditPage = false
|
v-outside-click={() => {
|
||||||
}}
|
menu.isEditPage = false
|
||||||
onClick={(e) => {
|
}}
|
||||||
e.stopPropagation()
|
onClick={(e) => {
|
||||||
const idx = layout.state.content[layout.state.current].pages[
|
e.stopPropagation()
|
||||||
layout.state.currentPage
|
const idx = layout.state.content[layout.state.current].pages[
|
||||||
].list.findIndex((val) => val.id === props.block.id)
|
layout.state.currentPage
|
||||||
|
].list.findIndex((val) => val.id === props.block.id)
|
||||||
|
|
||||||
if (idx < 0) return
|
if (idx < 0) return
|
||||||
|
|
||||||
layout.state.content[layout.state.current].pages[
|
layout.state.content[layout.state.current].pages[
|
||||||
layout.state.currentPage
|
layout.state.currentPage
|
||||||
].list.splice(idx, 1)
|
].list.splice(idx, 1)
|
||||||
}}
|
}}
|
||||||
class={
|
class={
|
||||||
'rounded-full cursor-pointer backdrop-blur-md absolute w-[20px] h-[20px] top-[8px] right-[12px] z-10 '
|
'rounded-full cursor-pointer backdrop-blur-md absolute w-[20px] h-[20px] top-[8px] right-[12px] z-10 '
|
||||||
}
|
}
|
||||||
style={{
|
style={{
|
||||||
backgroundImage: `url('/tab/bg/del_icon_img.png')`,
|
backgroundImage: `url('/tab/bg/del_icon_img.png')`,
|
||||||
backgroundSize: 'cover'
|
backgroundSize: 'cover'
|
||||||
}}
|
}}
|
||||||
></div>
|
></div>
|
||||||
)}
|
)
|
||||||
|
}
|
||||||
|
|
||||||
<div
|
< div
|
||||||
class="w-full h-full overflow-hidden relative cursor-pointer shadow-lg hover-move "
|
class={clsx("w-full h-full overflow-hidden relative cursor-pointer shadow-lg hover-move ",
|
||||||
|
canPut.value ? "border-[#ddd]/80 border-[4px]" : "border-transparent"
|
||||||
|
)}
|
||||||
style={{
|
style={{
|
||||||
borderRadius: `calc(var(--block-radius) * var(--block-size))`,
|
borderRadius: `calc(var(--block-radius) * var(--block-size))`,
|
||||||
transition: 'transform 0.2s'
|
transition: 'transform 0.2s'
|
||||||
|
@ -166,28 +195,32 @@ export default defineComponent({
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{props.block.link ? (
|
{
|
||||||
props.block.link.startsWith('id:') ? (
|
props.block.link ? (
|
||||||
// 文件夹
|
props.block.link.startsWith('id:') ? (
|
||||||
<DirBlock block={props.block} big={props.block.w !== 1 || props.block.h !== 1} />
|
// 文件夹
|
||||||
|
<DirBlock block={props.block} big={props.block.w !== 1 || props.block.h !== 1} />
|
||||||
|
) : (
|
||||||
|
// 链接
|
||||||
|
<LinkBlock block={props.block} />
|
||||||
|
)
|
||||||
) : (
|
) : (
|
||||||
// 链接
|
// 小组件
|
||||||
<LinkBlock block={props.block} />
|
<WidgetBlock block={props.block} />
|
||||||
)
|
)
|
||||||
) : (
|
}
|
||||||
// 小组件
|
</div >
|
||||||
<WidgetBlock block={props.block} />
|
{
|
||||||
)}
|
settings.state.showBlockLabel && (
|
||||||
</div>
|
<div
|
||||||
{settings.state.showBlockLabel && (
|
class="absolute left-1/2 -translate-x-1/2 -bottom-3 text-sm text-white text-center w-[172px] overflow-hidden text-ellipsis whitespace-nowrap break-all font-bold"
|
||||||
<div
|
style="text-shadow: 0 0 4px rgba(0,0,0,.6)"
|
||||||
class="absolute left-1/2 -translate-x-1/2 -bottom-3 text-sm text-white text-center w-[172px] overflow-hidden text-ellipsis whitespace-nowrap break-all font-bold"
|
>
|
||||||
style="text-shadow: 0 0 4px rgba(0,0,0,.6)"
|
{layout.getLabel(props.block)}
|
||||||
>
|
</div>
|
||||||
{layout.getLabel(props.block)}
|
)
|
||||||
</div>
|
}
|
||||||
)}
|
</div >
|
||||||
</div>
|
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
@ -85,9 +85,24 @@ export default defineStore('user', () => {
|
||||||
},
|
},
|
||||||
{ immediate: true }
|
{ immediate: true }
|
||||||
)
|
)
|
||||||
|
const comineData = () => {
|
||||||
|
if (!remoteAddList.value) return
|
||||||
|
remoteAddList.value.map((item) => {
|
||||||
|
if (item.link)
|
||||||
|
layout.state.content[layout.state.current].pages[layout.state.currentPage].list.push(item)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
const coverageData = () => {
|
||||||
|
if (!remoteData.value) return
|
||||||
|
Object.assign(layout.state.content, remoteData.value.content)
|
||||||
|
Object.assign(layout.state.dock, remoteData.value.dock)
|
||||||
|
Object.assign(layout.state.dir, remoteData.value.dir)
|
||||||
|
}
|
||||||
|
watch(() => profile.username, async (val, pre) => {
|
||||||
|
console.log(val);
|
||||||
|
|
||||||
watch(token, async (val) => {
|
|
||||||
if (!val) return
|
if (!val) return
|
||||||
|
console.log('开始比较');
|
||||||
|
|
||||||
const data = await request<Layout>('GET', '/api/backup')
|
const data = await request<Layout>('GET', '/api/backup')
|
||||||
if (!data) {
|
if (!data) {
|
||||||
|
@ -113,27 +128,17 @@ export default defineStore('user', () => {
|
||||||
// TODO: 交给张阳
|
// TODO: 交给张阳
|
||||||
// remoteAddList.value = addList
|
// remoteAddList.value = addList
|
||||||
remoteData.value = data
|
remoteData.value = data
|
||||||
|
coverageData()
|
||||||
|
|
||||||
useRouterStore().go('global-backup')
|
|
||||||
}
|
}
|
||||||
|
}, {
|
||||||
|
immediate: true
|
||||||
})
|
})
|
||||||
const logout = () => {
|
const logout = () => {
|
||||||
token.value = ''
|
token.value = ''
|
||||||
Object.assign(profile, { ...defaultUserInfo })
|
Object.assign(profile, { ...defaultUserInfo })
|
||||||
}
|
}
|
||||||
const comineData = () => {
|
|
||||||
if (!remoteAddList.value) return
|
|
||||||
remoteAddList.value.map((item) => {
|
|
||||||
if (item.link)
|
|
||||||
layout.state.content[layout.state.current].pages[layout.state.currentPage].list.push(item)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
const coverageData = () => {
|
|
||||||
if (!remoteData.value) return
|
|
||||||
Object.assign(layout.state.content, remoteData.value.content)
|
|
||||||
Object.assign(layout.state.dock, remoteData.value.dock)
|
|
||||||
Object.assign(layout.state.dir, remoteData.value.dir)
|
|
||||||
}
|
|
||||||
const updateProfile = () => {
|
const updateProfile = () => {
|
||||||
request('PUT', '/api/profile', {
|
request('PUT', '/api/profile', {
|
||||||
returnType: 'text',
|
returnType: 'text',
|
||||||
|
|
Loading…
Reference in New Issue