xyyd-fatfox/src/layout/grid/WidgetBlock.tsx

45 lines
1.2 KiB
TypeScript

import { defineComponent } from 'vue'
import widgetList from '@/widgets'
import { useMenuStore } from '../GlobalMenu'
import type { Block } from '../layout.types'
import useRouterStore from '@/useRouterStore'
export default defineComponent({
props: {
block: {
type: Object as () => Block,
required: true
}
},
setup(props) {
const menu = useMenuStore()
const router = useRouterStore()
return () => {
const placeholder = (
<div class="w-full h-full flex justify-center items-center text-black/60"></div>
)
const selected = widgetList.find((el) => el.name === props.block.name)
if (!selected) return placeholder
const compo = selected.list.find(
(el) => el.w === props.block.w && el.h === props.block.h
)?.component
if (!compo) return placeholder
return (
<div
class="w-full h-full relative"
onContextmenu={(e) => {
e.preventDefault()
menu.open(props.block)
}}
onClick={() => {
if (!selected.modal) return
router.go(`widget-${props.block.name}`)
}}
>
<compo />
</div>
)
}
}
})