@ebiz/designer-components 0.1.11 → 0.1.13

package/src/components/EbizSelect.vue

@@ -1,85 +1,85 @@
-<template>
-  <div>
-    <t-select
-      v-model="selectedValue"
-      filterable
-      :loading="loading"
-      loading-text="Loading..."
-      :remote="true"
-      @search="remoteSearch"
-      @change="onChange"
-      style="width: 280px;"
-    >
-      <t-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
-    </t-select>
-  </div>
-</template>
-
-<script setup>
-import { onMounted, ref, toRefs } from 'vue'
-import { Select as TSelect, Option as TOption } from 'tdesign-vue-next'
-import request from '@/apiService/simpleDataService';
-
-const props = defineProps({
-  apiConfig: {
-    type: Object,
-    default: () => ({
-      apiId: null,
-      apiType: ''
-    })
-  }
-})
-
-const emit = defineEmits(['formSubmitted'])
-
-const loading = ref(false)
-const selectedValue = ref('')
-const options = ref([])
-
-const { apiConfig } = toRefs(props);
-
-const remoteSearch = (query) => {
-  if (!apiConfig.value.apiId) return;
-  
-  loading.value = true;
-  request.fetch({
-    "queryParams": { "name": query }
-  }, {
-    apiId: apiConfig.value.apiId,
-  }, '/appdata/select')
-    .then((val) => {
-      options.value = val.data.map((item) => {
-        return { value: item.name, label: item.name }
-      })
-    })
-    .catch((_err) => {
-      // 错误处理
-    })
-    .finally(() => {
-      loading.value = false;
-    });
-}
-
-const onChange = () => {
-  emit('formSubmitted', selectedValue.value);
-}
-
-// 初始加载数据
-onMounted(() => {
-  remoteSearch('');
-})
-</script>
-
-<style lang="less" scoped>
-/* TDesign主题样式定制 */
-:deep(.t-select) {
-  &.t-is-focused {
-    border-color: #5e7ce0;
-  }
-}
-
-:deep(.t-select__panel) {
-  max-height: 300px;
-  overflow-y: auto;
-}
-</style>
+<template>
+  <div>
+    <t-select
+      v-model="selectedValue"
+      filterable
+      :loading="loading"
+      loading-text="Loading..."
+      :remote="true"
+      @search="remoteSearch"
+      @change="onChange"
+      style="width: 280px;"
+    >
+      <t-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
+    </t-select>
+  </div>
+</template>
+
+<script setup>
+import { onMounted, ref, toRefs } from 'vue'
+import { Select as TSelect, Option as TOption } from 'tdesign-vue-next'
+import request from '@/apiService/simpleDataService';
+
+const props = defineProps({
+  apiConfig: {
+    type: Object,
+    default: () => ({
+      apiId: null,
+      apiType: ''
+    })
+  }
+})
+
+const emit = defineEmits(['formSubmitted'])
+
+const loading = ref(false)
+const selectedValue = ref('')
+const options = ref([])
+
+const { apiConfig } = toRefs(props);
+
+const remoteSearch = (query) => {
+  if (!apiConfig.value.apiId) return;
+  
+  loading.value = true;
+  request.fetch({
+    "queryParams": { "name": query }
+  }, {
+    apiId: apiConfig.value.apiId,
+  }, '/appdata/select')
+    .then((val) => {
+      options.value = val.data.map((item) => {
+        return { value: item.name, label: item.name }
+      })
+    })
+    .catch((_err) => {
+      // 错误处理
+    })
+    .finally(() => {
+      loading.value = false;
+    });
+}
+
+const onChange = () => {
+  emit('formSubmitted', selectedValue.value);
+}
+
+// 初始加载数据
+onMounted(() => {
+  remoteSearch('');
+})
+</script>
+
+<style lang="less" scoped>
+/* TDesign主题样式定制 */
+:deep(.t-select) {
+  &.t-is-focused {
+    border-color: #5e7ce0;
+  }
+}
+
+:deep(.t-select__panel) {
+  max-height: 300px;
+  overflow-y: auto;
+}
+</style>

package/src/components/EbizSpace.vue

@@ -1,101 +1,101 @@
-<script setup>
-import { ref, computed } from 'vue';
-import { Space } from 'tdesign-vue-next';
-
-/**
- * EbizSpace 间距组件
- * 基于 TDesign Space 组件封装
- * 用于控制相邻组件之间的间距
- */
-
-const props = defineProps({
-  /**
-   * 对齐方式
-   * @values start/end/center/baseline
-   */
-  align: {
-    type: String,
-    default: '',
-    validator: (val) => ['', 'start', 'end', 'center', 'baseline'].includes(val)
-  },
-  /**
-   * 是否自动换行，仅在 horizontal 时有效
-   */
-  breakLine: {
-    type: Boolean,
-    default: false
-  },
-  /**
-   * 间距方向
-   * @values vertical/horizontal
-   */
-  direction: {
-    type: String,
-    default: 'horizontal',
-    validator: (val) => ['vertical', 'horizontal'].includes(val)
-  },
-  /**
-   * 分隔符
-   */
-  separator: {
-    type: [String, Object, Function],
-    default: ''
-  },
-  /**
-   * 间距大小
-   * @values small/medium/large 或具体数值
-   */
-  size: {
-    type: [String, Number, Array],
-    default: 'medium',
-    validator: (val) => {
-      if (typeof val === 'string') {
-        return ['small', 'medium', 'large'].includes(val);
-      }
-      return true;
-    }
-  }
-});
-
-defineEmits([]);
-
-const slots = defineSlots();
-
-/**
- * 计算尺寸大小
- */
-const sizeMap = {
-  small: '8px',
-  medium: '16px',
-  large: '24px'
-};
-
-const computedSize = computed(() => {
-  if (Array.isArray(props.size)) {
-    return props.size.map(item => {
-      if (typeof item === 'string' && sizeMap[item]) {
-        return sizeMap[item];
-      }
-      return item;
-    });
-  }
-
-  if (typeof props.size === 'string' && sizeMap[props.size]) {
-    return sizeMap[props.size];
-  }
-
-  return props.size;
-});
-</script>
-
-<template>
-  <Space
-    :align="align"
-    :breakLine="breakLine"
-    :direction="direction"
-    :separator="separator"
-    :size="computedSize"
-  >
-    <slot></slot>
-  </Space>
+<script setup>
+import { ref, computed } from 'vue';
+import { Space } from 'tdesign-vue-next';
+
+/**
+ * EbizSpace 间距组件
+ * 基于 TDesign Space 组件封装
+ * 用于控制相邻组件之间的间距
+ */
+
+const props = defineProps({
+  /**
+   * 对齐方式
+   * @values start/end/center/baseline
+   */
+  align: {
+    type: String,
+    default: '',
+    validator: (val) => ['', 'start', 'end', 'center', 'baseline'].includes(val)
+  },
+  /**
+   * 是否自动换行，仅在 horizontal 时有效
+   */
+  breakLine: {
+    type: Boolean,
+    default: false
+  },
+  /**
+   * 间距方向
+   * @values vertical/horizontal
+   */
+  direction: {
+    type: String,
+    default: 'horizontal',
+    validator: (val) => ['vertical', 'horizontal'].includes(val)
+  },
+  /**
+   * 分隔符
+   */
+  separator: {
+    type: [String, Object, Function],
+    default: ''
+  },
+  /**
+   * 间距大小
+   * @values small/medium/large 或具体数值
+   */
+  size: {
+    type: [String, Number, Array],
+    default: 'medium',
+    validator: (val) => {
+      if (typeof val === 'string') {
+        return ['small', 'medium', 'large'].includes(val);
+      }
+      return true;
+    }
+  }
+});
+
+defineEmits([]);
+
+const slots = defineSlots();
+
+/**
+ * 计算尺寸大小
+ */
+const sizeMap = {
+  small: '8px',
+  medium: '16px',
+  large: '24px'
+};
+
+const computedSize = computed(() => {
+  if (Array.isArray(props.size)) {
+    return props.size.map(item => {
+      if (typeof item === 'string' && sizeMap[item]) {
+        return sizeMap[item];
+      }
+      return item;
+    });
+  }
+
+  if (typeof props.size === 'string' && sizeMap[props.size]) {
+    return sizeMap[props.size];
+  }
+
+  return props.size;
+});
+</script>
+
+<template>
+  <Space
+    :align="align"
+    :breakLine="breakLine"
+    :direction="direction"
+    :separator="separator"
+    :size="computedSize"
+  >
+    <slot></slot>
+  </Space>
 </template> 

package/src/components/EbizStatistic.vue

@@ -1,150 +1,150 @@
-<template>
-    <t-statistic
-        ref="statisticRef"
-        :animation="animation"
-        :animation-start="animationStart"
-        :color="color"
-        :decimalPlaces="decimalPlaces"
-        :loading="loading"
-        :prefix="prefix"
-        :suffix="suffix"
-        :title="title"
-        :trend="trend"
-        :trend-placement="trendPlacement"
-        :unit="unit"
-        :value="value"
-        @click="handleClick"
-    >
-        <!-- 加载中状态插槽 -->
-        <template v-if="$slots.loading" #loading>
-            <slot name="loading"></slot>
-        </template>
-        
-        <!-- 前缀插槽 -->
-        <template v-if="$slots.prefix" #prefix>
-            <slot name="prefix"></slot>
-        </template>
-        
-        <!-- 后缀插槽 -->
-        <template v-if="$slots.suffix" #suffix>
-            <slot name="suffix"></slot>
-        </template>
-        
-        <!-- 标题插槽 -->
-        <template v-if="$slots.title" #title>
-            <slot name="title"></slot>
-        </template>
-        
-        <!-- 趋势插槽 -->
-        <template v-if="$slots.trend" #trend>
-            <slot name="trend"></slot>
-        </template>
-        
-        <!-- 单位插槽 -->
-        <template v-if="$slots.unit" #unit>
-            <slot name="unit"></slot>
-        </template>
-        
-        <!-- 默认插槽 -->
-        <slot></slot>
-    </t-statistic>
-</template>
-
-<script>
-export default {
-    name: "EbizStatistic"
-}
-</script>
-
-<script setup>
-import { defineProps, defineEmits, ref, onMounted } from 'vue';
-import { Statistic as TStatistic } from 'tdesign-vue-next';
-
-const props = defineProps({
-    // 数值动画配置
-    animation: {
-        type: Object,
-        default: () => ({}),
-    },
-    // 数值动画开始时间，单位：毫秒
-    animationStart: {
-        type: Boolean,
-        default: false,
-    },
-    // 颜色
-    color: {
-        type: String,
-        default: '',
-    },
-    // 小数位数
-    decimalPlaces: {
-        type: Number,
-        default: 0,
-    },
-    // 加载中状态
-    loading: {
-        type: Boolean,
-        default: false,
-    },
-    // 前缀内容
-    prefix: {
-        type: [String, Function],
-        default: '',
-    },
-    // 后缀内容
-    suffix: {
-        type: [String, Function],
-        default: '',
-    },
-    // 数值显示的标题
-    title: {
-        type: [String, Function],
-        default: '',
-    },
-    // 趋势
-    trend: {
-        type: String,
-        default: '',
-        validator: (val) => ['', 'increase', 'decrease'].includes(val)
-    },
-    // 趋势展示位置
-    trendPlacement: {
-        type: String,
-        default: 'left',
-        validator: (val) => ['left', 'right'].includes(val)
-    },
-    // 单位内容
-    unit: {
-        type: [String, Function],
-        default: '',
-    },
-    // 数值
-    value: {
-        type: Number,
-        default: 0,
-    },
-});
-
-const emit = defineEmits(['click']);
-
-// 引用实例，用于调用组件的start方法
-const statisticRef = ref(null);
-
-// 点击事件
-const handleClick = (e) => {
-    emit('click', e);
-};
-
-// 暴露start方法，用于手动开始动画
-defineExpose({
-    start: () => {
-        if (statisticRef.value) {
-            statisticRef.value.start();
-        }
-    }
-});
-</script>
-
-<style lang="less" scoped>
-/* 自定义样式 */
+<template>
+    <t-statistic
+        ref="statisticRef"
+        :animation="animation"
+        :animation-start="animationStart"
+        :color="color"
+        :decimalPlaces="decimalPlaces"
+        :loading="loading"
+        :prefix="prefix"
+        :suffix="suffix"
+        :title="title"
+        :trend="trend"
+        :trend-placement="trendPlacement"
+        :unit="unit"
+        :value="value"
+        @click="handleClick"
+    >
+        <!-- 加载中状态插槽 -->
+        <template v-if="$slots.loading" #loading>
+            <slot name="loading"></slot>
+        </template>
+        
+        <!-- 前缀插槽 -->
+        <template v-if="$slots.prefix" #prefix>
+            <slot name="prefix"></slot>
+        </template>
+        
+        <!-- 后缀插槽 -->
+        <template v-if="$slots.suffix" #suffix>
+            <slot name="suffix"></slot>
+        </template>
+        
+        <!-- 标题插槽 -->
+        <template v-if="$slots.title" #title>
+            <slot name="title"></slot>
+        </template>
+        
+        <!-- 趋势插槽 -->
+        <template v-if="$slots.trend" #trend>
+            <slot name="trend"></slot>
+        </template>
+        
+        <!-- 单位插槽 -->
+        <template v-if="$slots.unit" #unit>
+            <slot name="unit"></slot>
+        </template>
+        
+        <!-- 默认插槽 -->
+        <slot></slot>
+    </t-statistic>
+</template>
+
+<script>
+export default {
+    name: "EbizStatistic"
+}
+</script>
+
+<script setup>
+import { defineProps, defineEmits, ref, onMounted } from 'vue';
+import { Statistic as TStatistic } from 'tdesign-vue-next';
+
+const props = defineProps({
+    // 数值动画配置
+    animation: {
+        type: Object,
+        default: () => ({}),
+    },
+    // 数值动画开始时间，单位：毫秒
+    animationStart: {
+        type: Boolean,
+        default: false,
+    },
+    // 颜色
+    color: {
+        type: String,
+        default: '',
+    },
+    // 小数位数
+    decimalPlaces: {
+        type: Number,
+        default: 0,
+    },
+    // 加载中状态
+    loading: {
+        type: Boolean,
+        default: false,
+    },
+    // 前缀内容
+    prefix: {
+        type: [String, Function],
+        default: '',
+    },
+    // 后缀内容
+    suffix: {
+        type: [String, Function],
+        default: '',
+    },
+    // 数值显示的标题
+    title: {
+        type: [String, Function],
+        default: '',
+    },
+    // 趋势
+    trend: {
+        type: String,
+        default: '',
+        validator: (val) => ['', 'increase', 'decrease'].includes(val)
+    },
+    // 趋势展示位置
+    trendPlacement: {
+        type: String,
+        default: 'left',
+        validator: (val) => ['left', 'right'].includes(val)
+    },
+    // 单位内容
+    unit: {
+        type: [String, Function],
+        default: '',
+    },
+    // 数值
+    value: {
+        type: Number,
+        default: 0,
+    },
+});
+
+const emit = defineEmits(['click']);
+
+// 引用实例，用于调用组件的start方法
+const statisticRef = ref(null);
+
+// 点击事件
+const handleClick = (e) => {
+    emit('click', e);
+};
+
+// 暴露start方法，用于手动开始动画
+defineExpose({
+    start: () => {
+        if (statisticRef.value) {
+            statisticRef.value.start();
+        }
+    }
+});
+</script>
+
+<style lang="less" scoped>
+/* 自定义样式 */
 </style>