From a1d7e81859f554f3a53680cc35f0f49bf1f77098 Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期四, 14 五月 2026 14:37:02 +0800
Subject: [PATCH] 导入项目
---
src/components/DiyEditor/components/mobile/MagicCube/property.vue | 76 ++++++++++++++++++++++++++++++++++++++
1 files changed, 76 insertions(+), 0 deletions(-)
diff --git a/src/components/DiyEditor/components/mobile/MagicCube/property.vue b/src/components/DiyEditor/components/mobile/MagicCube/property.vue
new file mode 100644
index 0000000..dee3117
--- /dev/null
+++ b/src/components/DiyEditor/components/mobile/MagicCube/property.vue
@@ -0,0 +1,76 @@
+<template>
+ <ComponentContainerProperty v-model="formData.style">
+ <!-- 琛ㄥ崟 -->
+ <el-form label-width="80px" :model="formData" class="m-t-8px">
+ <el-text tag="p"> 榄旀柟璁剧疆 </el-text>
+ <el-text type="info" size="small"> 姣忔牸灏哄187 * 187 </el-text>
+ <MagicCubeEditor
+ class="m-y-16px"
+ v-model="formData.list"
+ :rows="4"
+ :cols="4"
+ @hot-area-selected="handleHotAreaSelected"
+ />
+ <template v-for="(hotArea, index) in formData.list" :key="index">
+ <template v-if="selectedHotAreaIndex === index">
+ <el-form-item label="涓婁紶鍥剧墖" :prop="`list[${index}].imgUrl`">
+ <UploadImg v-model="hotArea.imgUrl" height="80px" width="80px" />
+ </el-form-item>
+ <el-form-item label="閾炬帴" :prop="`list[${index}].url`">
+ <AppLinkInput v-model="hotArea.url" />
+ </el-form-item>
+ </template>
+ </template>
+ <el-form-item label="涓婂渾瑙�" prop="borderRadiusTop">
+ <el-slider
+ v-model="formData.borderRadiusTop"
+ :max="100"
+ :min="0"
+ show-input
+ input-size="small"
+ :show-input-controls="false"
+ />
+ </el-form-item>
+ <el-form-item label="涓嬪渾瑙�" prop="borderRadiusBottom">
+ <el-slider
+ v-model="formData.borderRadiusBottom"
+ :max="100"
+ :min="0"
+ show-input
+ input-size="small"
+ :show-input-controls="false"
+ />
+ </el-form-item>
+ <el-form-item label="闂撮殧" prop="space">
+ <el-slider
+ v-model="formData.space"
+ :max="100"
+ :min="0"
+ show-input
+ input-size="small"
+ :show-input-controls="false"
+ />
+ </el-form-item>
+ </el-form>
+ </ComponentContainerProperty>
+</template>
+
+<script setup lang="ts">
+import { useVModel } from '@vueuse/core'
+import { MagicCubeProperty } from '@/components/DiyEditor/components/mobile/MagicCube/config'
+
+/** 骞垮憡榄旀柟灞炴�ч潰鏉� */
+defineOptions({ name: 'MagicCubeProperty' })
+
+const props = defineProps<{ modelValue: MagicCubeProperty }>()
+const emit = defineEmits(['update:modelValue'])
+const formData = useVModel(props, 'modelValue', emit)
+
+// 閫変腑鐨勭儹鍖�
+const selectedHotAreaIndex = ref(-1)
+const handleHotAreaSelected = (_: any, index: number) => {
+ selectedHotAreaIndex.value = index
+}
+</script>
+
+<style scoped lang="scss"></style>
--
Gitblit v1.8.0