feat: 新增尺寸控件

src/components/ChartItemSetting/SizeSetting.vue

@@ -0,0 +1,37 @@
+<template>
+  <SettingItemBox name="尺寸">
+    <n-input-number
+      v-model:value="chartAttr.w"
+      :min="50"
+      size="small"
+      placeholder="px"
+    >
+      <template #prefix>
+        <n-text depth="3">宽度</n-text>
+      </template>
+    </n-input-number>
+    <n-input-number
+      v-model:value="chartAttr.h"
+      :min="50"
+      size="small"
+      placeholder="px"
+    >
+      <template #prefix>
+        <n-text depth="3">高度</n-text>
+      </template>
+    </n-input-number>
+  </SettingItemBox>
+</template>
+
+<script setup lang="ts">
+import { PropType } from 'vue'
+import { PickCreateComponentType } from '@/packages/index.d'
+import { SettingItemBox } from '@/components/ChartItemSetting/index'
+
+const props = defineProps({
+  chartAttr: {
+    type: Object as PropType<Omit<PickCreateComponentType<'attr'>, 'node'>>,
+    required: true
+  }
+})
+</script>

src/components/ChartItemSetting/index.ts

@@ -3,9 +3,11 @@ import SettingItem from './SettingItem.vue'
 import SettingItemBox from './SettingItemBox.vue'
 import CollapseItem from './CollapseItem.vue'
 
-// 全局配置属性通用模板
+// 全局配置属性
 import GlobalSetting from './GlobalSetting.vue'
-// 方向通用模板
+// 方向
 import PositionSetting from './PositionSetting.vue'
+// 尺寸
+import SizeSetting from './SizeSetting.vue'
 
-export { CollapseItem, SettingItemBox, SettingItem, GlobalSetting, PositionSetting }
+export { CollapseItem, SettingItemBox, SettingItem, GlobalSetting, PositionSetting, SizeSetting }