feat: 新增文字侧边Padding控制

src/packages/components/Informations/Texts/TextCommon/config.ts

@@ -17,7 +17,8 @@ export const option = {
   dataset: '我是一个文本',
   fontSize: 20,
   fontColor: '#ffffffff',
-  padding: 5,
+  paddingX: 10,
+  paddingY: 10,
   // 字间距
   letterSpacing: 5,
   borderRadius: 5,

src/packages/components/Informations/Texts/TextCommon/config.vue

@@ -16,17 +16,21 @@
       <SettingItem name="文本方向">
         <n-select v-model:value="optionData.writingMode" size="small" :options="verticalOptions" />
       </SettingItem>
+      
+      <SettingItem name="X轴内边距">
+        <n-input-number v-model:value="optionData.paddingX" size="small" placeholder="输入内边距"></n-input-number>
+      </SettingItem>
+      <SettingItem name="Y轴内边距">
+        <n-input-number v-model:value="optionData.paddingY" size="small" placeholder="输入内边距"></n-input-number>
+      </SettingItem>
       <SettingItem name="字间距">
         <n-input-number v-model:value="optionData.letterSpacing" size="small" placeholder="输入字间距"></n-input-number>
       </SettingItem>
-      <SettingItem name="内边距">
-        <n-input-number v-model:value="optionData.padding" size="small" placeholder="输入内边距"></n-input-number>
-      </SettingItem>
-
       <SettingItem name="颜色">
         <n-color-picker size="small" :modes="['hex']" v-model:value="optionData.fontColor"></n-color-picker>
       </SettingItem>
     </SettingItemBox>
+    
     <SettingItemBox name="背景">
       <SettingItem name="背景圆角">
         <n-input-number

src/packages/components/Informations/Texts/TextCommon/index.vue

@@ -3,13 +3,15 @@
     <div
       :style="`
       color: ${fontColor};
-      padding: ${padding}px;
+      padding: ${paddingY}px ${paddingX}px;
       font-size: ${fontSize}px;
       letter-spacing: ${letterSpacing}px;
       border-radius: ${borderRadius}px;
       writing-mode: ${writingMode};
       background-color:${backgroundColor}`"
-    >{{ dataset }}</div>
+    >
+      {{ dataset }}
+    </div>
   </div>
 </template>
 <script setup lang="ts">
@@ -24,13 +26,21 @@ const props = defineProps({
 })
 
 const { w, h } = toRefs(props.chartConfig.attr)
-const { dataset, fontColor, fontSize, letterSpacing, padding, borderRadius, writingMode, backgroundColor } = toRefs(
+const {
-  props.chartConfig.option
+  dataset,
-)
+  fontColor,
+  fontSize,
+  letterSpacing,
+  paddingY,
+  paddingX,
+  borderRadius,
+  writingMode,
+  backgroundColor,
+} = toRefs(props.chartConfig.option)
 </script>
 
 <style lang="scss" scoped>
-@include go("text-box") {
+@include go('text-box') {
   display: flex;
   align-items: center;
   justify-content: center;