mirror of
https://gh-proxy.org/https://github.com/klinsmaya/SQLBot.git
synced 2026-11-08 09:17:06 +08:00
refactor: dashboard canvas edit update
This commit is contained in:
@@ -10,12 +10,13 @@ import { useEmitt, useEmittLazy } from '@/utils/useEmitt.ts'
|
||||
import html2canvas from 'html2canvas'
|
||||
import EmptyBackground from '@/views/dashboard/common/EmptyBackground.vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { isMainCanvas } from '@/views/dashboard/utils/canvasUtils.ts'
|
||||
|
||||
const { t } = useI18n()
|
||||
const dashboardStore = dashboardStoreWithOut()
|
||||
const canvasLocked = ref(false) // Is the canvas movement locked, Default false
|
||||
const emits = defineEmits(['parentAddItemBox'])
|
||||
const { curComponentId, curComponent } = storeToRefs(dashboardStore)
|
||||
const { curComponentId, curComponent, fullscreenFlag } = storeToRefs(dashboardStore)
|
||||
let currentInstance: any
|
||||
const props = defineProps({
|
||||
canvasId: {
|
||||
@@ -1178,7 +1179,7 @@ defineExpose({
|
||||
@mousemove="moving()"
|
||||
>
|
||||
<EmptyBackground
|
||||
v-if="!canvasComponentData.length"
|
||||
v-if="!canvasComponentData.length && isMainCanvas(canvasId)"
|
||||
:description="t('dashboard.add_component_tips')"
|
||||
img-type="selectDashboard"
|
||||
/>
|
||||
@@ -1186,6 +1187,7 @@ defineExpose({
|
||||
<CanvasShape
|
||||
v-for="(item, index) in canvasComponentData"
|
||||
:key="'item' + index"
|
||||
:can-edit="!fullscreenFlag"
|
||||
:active="curComponentId === item.id"
|
||||
:config-item="item"
|
||||
:draggable="draggable"
|
||||
|
||||
@@ -12,6 +12,10 @@ const props = defineProps({
|
||||
type: Object as PropType<CanvasItem>,
|
||||
required: true,
|
||||
},
|
||||
canEdit: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
active: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
@@ -69,14 +73,16 @@ const shapeClick = (e: MouseEvent) => {
|
||||
>
|
||||
<component-bar
|
||||
:config-item="configItem"
|
||||
:active="active"
|
||||
:active="active && canEdit"
|
||||
:show-position="'canvas'"
|
||||
:canvas-id="canvasId"
|
||||
></component-bar>
|
||||
<drag-handle></drag-handle>
|
||||
<template v-if="canEdit">
|
||||
<drag-handle></drag-handle>
|
||||
</template>
|
||||
<slot></slot>
|
||||
<resize-handle
|
||||
v-if="active"
|
||||
v-if="active && canEdit"
|
||||
:start-resize="
|
||||
(event: MouseEvent, point: string) => startResize(event, point, configItem, itemIndex)
|
||||
"
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
import { dashboardStoreWithOut } from '@/stores/dashboard/dashboard.ts'
|
||||
|
||||
const dashboardStore = dashboardStoreWithOut()
|
||||
import { nextTick, onBeforeUnmount, onMounted } from 'vue'
|
||||
import { onBeforeUnmount, onMounted } from 'vue'
|
||||
import { useEmitt } from '@/utils/useEmitt.ts'
|
||||
defineProps({
|
||||
themes: {
|
||||
@@ -37,8 +37,7 @@ const toggleFullscreen = () => {
|
||||
}
|
||||
}
|
||||
|
||||
// 针对钉钉windows版无法退出全屏问题 这里主动退出
|
||||
const handleKeydown = (event) => {
|
||||
const handleKeydown = (event: KeyboardEvent) => {
|
||||
if (event.key === 'Escape' && document.fullscreenElement) {
|
||||
document.exitFullscreen()
|
||||
}
|
||||
|
||||
@@ -141,6 +141,7 @@ const addChatChart = (views: any) => {
|
||||
|
||||
const previewInner = () => {
|
||||
if (fullScreeRef.value) {
|
||||
// @ts-expect-error eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
fullScreeRef.value.toggleFullscreen()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -34,6 +34,10 @@ export const load_resource_prepare = (params: any, callBack: (obj: any) => void)
|
||||
})
|
||||
}
|
||||
|
||||
export const isMainCanvas = (canvasId: string) => {
|
||||
return canvasId === 'canvas-main'
|
||||
}
|
||||
|
||||
export const initCanvasData = (params: any, callBack: () => void) => {
|
||||
load_resource_prepare(params, function (result: any) {
|
||||
dashboardStore.setDashboardInfo(result?.dashboardInfo)
|
||||
|
||||
Reference in New Issue
Block a user