活动魔方配置及辅助区域，辅助线配置

src/engineer/components/ConfigCurrentView.vue

@@ -41,8 +41,10 @@ const label = computed(()=>{
     <legend>{{ label }}设置</legend>
     <template v-if="styles" v-for="([key, value]) in styles" :key="`${ctx.activeViewId}@${key}`">
       <ColorConfig v-if="key === 'color'" :field="value.slice(2)" label="背景颜色" />
+      <ColorConfig v-if="key === 'textColor'" :field="value.slice(2)" label="字体颜色" />
       <NumberStyle v-if="key === 'radius'" :field="value.slice(2)" label="圆角设置"   />
       <NumberStyle v-if="key === 'fontSize'" :field="value.slice(2)" label="字号设置"   />
+      <NumberStyle v-if="key === 'height'" :field="value.slice(2)" label="高度设置"   />
 <!--      <div v-else>{{ key }}:{{ value }}</div>-->
     </template>
   </fieldset>

src/engineer/utils/dynamic.ts

@@ -1,8 +1,15 @@
 import type { DynamicValue } from "../types"
 import type { EngineContext } from "../context"
 
+const isNumber = (num: number):boolean => {
+  return !isNaN(num)
+}
 export function dynamic<T>(ctx: EngineContext, blockId: string, value: DynamicValue<T>): T {
   if (typeof value === 'string' && value.startsWith('@@')) {
+    const val = ctx.value(blockId,value)
+    if(isNumber(val as number)){
+      return parseFloat(val as string) as T
+    }
     return  ctx.value(blockId, value) as T
   }
   return value as T

src/modules/activity-cube.ts

@@ -0,0 +1,30 @@
+import type { Module } from '../engineer'
+import { createUniqueId } from '../engineer/utils'
+const module: Module = {
+  vid: createUniqueId(),
+  mid: createUniqueId(),
+  title: '活动魔方',
+  configs: [],
+  init:{
+    theme:{
+      color: '#fff',
+      innerColor: 'pink'
+    }
+  },
+  theme:{
+    color: '@@theme.color',
+    padding: 5,
+    radius: '@@theme.radius'
+  },
+  children: {
+      theme:{
+        color: '@@theme.innerColor',
+        radius: '@@theme.radius',
+        height: 20
+      },
+      children:[]
+    }
+
+
+}
+export default module

src/modules/auxiliary-empty.ts

@@ -0,0 +1,25 @@
+import type { Module } from '../engineer'
+import { createUniqueId } from '../engineer/utils'
+
+const module:Module = {
+  mid: createUniqueId(),
+  vid: createUniqueId(),
+  title: '辅助空白',
+  configs:[
+
+  ],
+  init:{
+    theme:{
+      height: 10,
+      color: 'white'
+    }
+  },
+  theme:{
+    height: '@@theme.height',
+    color: '@@theme.color'
+  },
+  children:{
+
+  }
+}
+export default module

src/modules/auxiliary-line.ts

@@ -0,0 +1,32 @@
+import type { Module } from '../engineer'
+import { createUniqueId } from '../engineer/utils'
+
+const module: Module = {
+  vid: createUniqueId(),
+  mid: createUniqueId(),
+  title: '辅助线',
+  configs: [],
+  init:{
+    theme:{
+      innerColor: '#dedede',
+      height:10,
+      color: 'white'
+    }
+  },
+  theme:{
+    height: '@@theme.height',
+    flexible: true,
+    mainAlign:'center',
+    crossAlign: 'center',
+    textColor: '@@theme.innerColor',
+    color: '@@theme.color'
+  },
+  children:{
+    theme:{
+      width: 345,
+      height: 0.8,
+      color: '@@theme.innerColor'
+    }
+  }
+}
+export default module

src/modules/diy-title.ts

@@ -0,0 +1,45 @@
+import { createUniqueId } from '../engineer/utils'
+import { Module } from '../engineer'
+
+const module: Module = {
+  title: '自定义标题',
+  vid: createUniqueId(),
+  mid: createUniqueId(),
+  maxReferenceCount: -1,
+  referenceCount: 0,
+  image: undefined,
+  configs: [
+    {
+      type: 'text',
+      field: 'Title',
+      label: '标题',
+      help: '自定义标题', // 自动生成："请输入${label}"
+    },
+  ],
+  init: {
+    Title: '猜你喜欢',
+    theme:{
+      color: '#fff',
+      textColor: '#333'
+    }
+  },
+  theme: {
+    padding: {
+      vertical: 15,
+      horizontal: 15,
+    },
+    color: '@@theme.color',
+    textColor: '@@theme.textColor',
+    fontSize: 18,
+    fontWeight: 900,
+  },
+  children: {
+    type: 'text',
+    key: 'Title'
+  }
+
+}
+export default module
+
+
+

src/modules/index.ts

@@ -5,6 +5,11 @@ import { createUniqueId } from '../engineer/utils'
 import { Category } from '../engineer'
 import categoryBar from './category-bar.ts'
 import searchCube from './search-cube.ts'
+import productColumn from './product-column.ts'
+import diyTitle from './diy-title.ts'
+import auxiliaryEmpty from './auxiliary-empty.ts'
+import auxiliaryLine from './auxiliary-line.ts'
+import activityCube from './activity-cube.ts'
 
 export default {
   icon: 'trash',
@@ -13,99 +18,35 @@ export default {
     swiper,
     productGroup,
     categoryBar,
+    productColumn,
+    diyTitle,
+    searchCube,
+    imageCube,
+    auxiliaryEmpty,
+    auxiliaryLine,
+    activityCube,
     {
-      title: '两列产品卡片',
-      vid: createUniqueId(),
-      mid: createUniqueId(),
-      maxReferenceCount: -1,
-      referenceCount: 0,
-      image: undefined,
-      configs: [],
-      init: {},
-      theme: {
-        color: 'pink',
-        padding: {
-          top: 12.5,
-          left: 12.5,
-          right: 12.5
-        },
-        gap: 10,
-      },
-      children: [
-        {
-          theme: {
-            width: 170,
-            height: 200,
-            color: 'white'
-          },
-          children: '产品'
-        },
-        {
-          theme: {
-            width: 170,
-            height: 200,
-            color: 'white'
-          },
-          children: '产品'
-        }
-      ]
-    },
-    {
-      title: '自定义标题',
+      title: '商品分类',
       vid: createUniqueId(),
       mid: createUniqueId(),
       maxReferenceCount: -1,
       referenceCount: 0,
       image: undefined,
-      configs: [
-        {
-          type: 'text',
-          field: 'Title',
-          label: '标题',
-          help: '自定义标题', // 自动生成："请输入${label}"
-        },
-      ],
       init: {
-        Title: '猜你喜欢',
         theme:{
-          fontSize: 18,
-          color: '#fff'
-        }
-      },
-      theme: {
-        padding: {
-          vertical: 15,
-          horizontal: 15,
-        },
-        color: '@@theme.color',
-        textColor: '#333',
-        fontSize: '@@theme.fontSize',
-        fontWeight: 900,
+          color: 'white',
+          textColor: '#333'
         },
-      children: {
-        type: 'text',
-        key: 'Title'
-      }
-
       },
-    searchCube,
-    imageCube,
-    {
-      title: '商品分类',
-      vid: createUniqueId(),
-      mid: createUniqueId(),
-      maxReferenceCount: -1,
-      referenceCount: 0,
-      image: undefined,
-      init: {},
       templates:{},
       configs:[],
       theme:{
-        color: 'white',
+        color: '@@theme.color',
         gap: 15,
         fontSize:14,
         fontWeight: 400,
         padding:10,
+        textColor: '@@theme.textColor'
       },
       children:[
         {children:'产品分类',theme:{fontWeight:600}},
@@ -115,7 +56,5 @@ export default {
         {children:'产品分类'},
       ],
     }
-
-
   ],
 } as Category

src/modules/product-column.ts

@@ -0,0 +1,53 @@
+import { createUniqueId } from '../engineer/utils'
+import { Module } from '../engineer'
+
+const module: Module = {
+  title: '两列产品卡片',
+  vid: createUniqueId(),
+  mid: createUniqueId(),
+  maxReferenceCount: -1,
+  referenceCount: 0,
+  image: undefined,
+  configs: [],
+  init: {
+    theme:{
+      color: 'pink',
+      innerRadius: 12
+    }
+  },
+  theme: {
+    color: '@@theme.color',
+    padding: {
+      top: 12.5,
+      left: 12.5,
+      right: 12.5
+    },
+    gap: 10,
+  },
+  children: [
+    {
+
+      vid: createUniqueId(),
+      theme: {
+        width: 170,
+        height: 200,
+        color: 'white',
+        radius: '@@theme.innerRadius',
+        clip: 'hidden'
+      },
+      children: '产品'
+    },
+    {
+      vid: createUniqueId(),
+      theme: {
+        width: 170,
+        height: 200,
+        color: 'white',
+        radius: '@@theme.innerRadius',
+        clip: 'hidden'
+      },
+      children: '产品'
+    }
+  ]
+}
+export default module