xuyue/webpreview
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

update
Some checks failed
Deploy / deploy (build, debian, 22) (push) Has been cancelled
Details
Deploy / deploy (build:staging, school, 8822) (push) Has been cancelled
Details

Browse Source
This commit is contained in:
yuetsh
2026-04-07 19:24:09 -06:00
parent 3697078fc3
commit 58f462bb3b
11 changed files with 146 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
src/components/editor/Preview.vue
View File

@@ -68,14 +68,31 @@ const emits = defineEmits(["afterScore", "showCode", "clear"])
type Layout = "desktop" | "mobile" | "tablet"
const layouts: Layout[] = ["desktop", "mobile", "tablet"]
const layoutConfig: Record<Layout, { icon: string; label: string; width: string }> = {
desktop: { icon: "material-symbols:desktop-windows-outline", label: "桌面", width: "100%" },
mobile: { icon: "material-symbols:smartphone-outline", label: "移动端 (375px)", width: "375px" },
tablet: { icon: "material-symbols:tablet-outline", label: "平板 (768px)", width: "768px" },
const layoutConfig: Record<
Layout,
{ icon: string; label: string; width: string }
> = {
desktop: {
icon: "material-symbols:desktop-windows-outline",
label: "桌面",
width: "100%",
},
mobile: {
icon: "material-symbols:smartphone-outline",
label: "移动端 (375px)",
width: "375px",
},
tablet: {
icon: "material-symbols:tablet-outline",
label: "平板 (768px)",
width: "768px",
},
}
const layoutIndex = ref(0)
const layoutIcon = computed(() => layoutConfig[layouts[layoutIndex.value]].icon)
const layoutLabel = computed(() => layoutConfig[layouts[layoutIndex.value]].label)
const layoutLabel = computed(
() => layoutConfig[layouts[layoutIndex.value]].label,
)
const iframeWrapperStyle = computed(() => ({
maxWidth: layoutConfig[layouts[layoutIndex.value]].width,
}))