@ebiz/designer-components 0.0.18-beta.2 → 0.0.18-beta.3

package/src/components/TdesignDatePicker.vue

@@ -1,125 +1,125 @@
-<template>
-    <t-date-picker
-        :allowInput="allowInput"
-        :clearable="clearable"
-        :disabled="disabled"
-        :enableTimePicker="enableTimePicker"
-        :format="format"
-        :mode="mode"
-        :placeholder="placeholder"
-        :presetsPlacement="presetsPlacement"
-        :presets="presets"
-        :size="size"
-        :status="status"
-        :valueType="valueType"
-        :value="modelValue"
-        @change="handleChange"
-    >
-        <template v-if="$slots.prefixIcon" #prefixIcon>
-            <slot name="prefixIcon"></slot>
-        </template>
-        
-        <template v-if="$slots.suffixIcon" #suffixIcon>
-            <slot name="suffixIcon"></slot>
-        </template>
-        
-        <template v-if="$slots.panel" #panel>
-            <slot name="panel"></slot>
-        </template>
-    </t-date-picker>
-</template>
-
-<script>
-export default {
-    name: "EbizTdesignDatePicker"
-}
-</script>
-
-<script setup>
-import { defineProps, defineEmits } from 'vue';
-import { DatePicker as TDatePicker } from 'tdesign-vue-next';
-
-defineProps({
-    // 是否允许直接输入日期
-    allowInput: {
-        type: Boolean,
-        default: false
-    },
-    // 是否显示清除按钮
-    clearable: {
-        type: Boolean,
-        default: true
-    },
-    // 是否禁用组件
-    disabled: {
-        type: Boolean,
-        default: false
-    },
-    // 是否启用时间选择
-    enableTimePicker: {
-        type: Boolean,
-        default: false
-    },
-    // 日期格式
-    format: {
-        type: String,
-        default: 'YYYY-MM-DD'
-    },
-    // 选择器模式
-    mode: {
-        type: String,
-        default: 'date',
-        validator: (val) => ['date', 'month', 'year', 'week', 'quarter'].includes(val)
-    },
-    // 输入框占位符
-    placeholder: {
-        type: String,
-        default: '请选择日期'
-    },
-    // 预设快捷日期显示位置
-    presetsPlacement: {
-        type: String,
-        default: 'bottom',
-        validator: (val) => ['left', 'top', 'right', 'bottom'].includes(val)
-    },
-    // 预设快捷日期选择
-    presets: {
-        type: Object,
-        default: () => ({})
-    },
-    // 组件尺寸
-    size: {
-        type: String,
-        default: 'medium',
-        validator: (val) => ['small', 'medium', 'large'].includes(val)
-    },
-    // 输入框状态
-    status: {
-        type: String,
-        default: 'default',
-        validator: (val) => ['default', 'success', 'warning', 'error'].includes(val)
-    },
-    // 用于格式化日期的值
-    valueType: {
-        type: String,
-        default: '',
-        validator: (val) => ['', 'time-stamp', 'Date', 'YYYY', 'YYYY-MM', 'YYYY-MM-DD'].includes(val)
-    },
-    // 日期选择器的值
-    modelValue: {
-        type: [String, Number, Date, Array],
-        default: ''
-    }
-});
-
-const emit = defineEmits(['change', 'update:modelValue']);
-
-const handleChange = (value, context) => {
-    emit('change', value, context);
-    emit('update:modelValue', value);
-};
-</script>
-
-<style lang="less" scoped>
-/* 自定义样式 */
+<template>
+    <t-date-picker
+        :allowInput="allowInput"
+        :clearable="clearable"
+        :disabled="disabled"
+        :enableTimePicker="enableTimePicker"
+        :format="format"
+        :mode="mode"
+        :placeholder="placeholder"
+        :presetsPlacement="presetsPlacement"
+        :presets="presets"
+        :size="size"
+        :status="status"
+        :valueType="valueType"
+        :value="modelValue"
+        @change="handleChange"
+    >
+        <template v-if="$slots.prefixIcon" #prefixIcon>
+            <slot name="prefixIcon"></slot>
+        </template>
+        
+        <template v-if="$slots.suffixIcon" #suffixIcon>
+            <slot name="suffixIcon"></slot>
+        </template>
+        
+        <template v-if="$slots.panel" #panel>
+            <slot name="panel"></slot>
+        </template>
+    </t-date-picker>
+</template>
+
+<script>
+export default {
+    name: "EbizTdesignDatePicker"
+}
+</script>
+
+<script setup>
+import { defineProps, defineEmits } from 'vue';
+import { DatePicker as TDatePicker } from 'tdesign-vue-next';
+
+defineProps({
+    // 是否允许直接输入日期
+    allowInput: {
+        type: Boolean,
+        default: false
+    },
+    // 是否显示清除按钮
+    clearable: {
+        type: Boolean,
+        default: true
+    },
+    // 是否禁用组件
+    disabled: {
+        type: Boolean,
+        default: false
+    },
+    // 是否启用时间选择
+    enableTimePicker: {
+        type: Boolean,
+        default: false
+    },
+    // 日期格式
+    format: {
+        type: String,
+        default: 'YYYY-MM-DD'
+    },
+    // 选择器模式
+    mode: {
+        type: String,
+        default: 'date',
+        validator: (val) => ['date', 'month', 'year', 'week', 'quarter'].includes(val)
+    },
+    // 输入框占位符
+    placeholder: {
+        type: String,
+        default: '请选择日期'
+    },
+    // 预设快捷日期显示位置
+    presetsPlacement: {
+        type: String,
+        default: 'bottom',
+        validator: (val) => ['left', 'top', 'right', 'bottom'].includes(val)
+    },
+    // 预设快捷日期选择
+    presets: {
+        type: Object,
+        default: () => ({})
+    },
+    // 组件尺寸
+    size: {
+        type: String,
+        default: 'medium',
+        validator: (val) => ['small', 'medium', 'large'].includes(val)
+    },
+    // 输入框状态
+    status: {
+        type: String,
+        default: 'default',
+        validator: (val) => ['default', 'success', 'warning', 'error'].includes(val)
+    },
+    // 用于格式化日期的值
+    valueType: {
+        type: String,
+        default: '',
+        validator: (val) => ['', 'time-stamp', 'Date', 'YYYY', 'YYYY-MM', 'YYYY-MM-DD'].includes(val)
+    },
+    // 日期选择器的值
+    modelValue: {
+        type: [String, Number, Date, Array],
+        default: ''
+    }
+});
+
+const emit = defineEmits(['change', 'update:modelValue']);
+
+const handleChange = (value, context) => {
+    emit('change', value, context);
+    emit('update:modelValue', value);
+};
+</script>
+
+<style lang="less" scoped>
+/* 自定义样式 */
 </style> 

package/src/components/TdesignForm.vue

@@ -1,134 +1,134 @@
-<template>
-    <t-form 
-        :class="customClass"
-        :data="data"
-        :colon="colon"
-        :disabled="disabled"
-        :form-controlled="formControlled"
-        :label-align="labelAlign"
-        :label-width="labelWidth"
-        :layout="layout"
-        :prevent-submit-default="preventSubmitDefault"
-        :reset-type="resetType"
-        :required-mark="requiredMark"
-        :rules="rules"
-        :show-error-message="showErrorMessage"
-        :status-icon="statusIcon"
-        :submit-with-warning-message="submitWithWarningMessage"
-        @reset="handleReset"
-        @submit="handleSubmit"
-        @validate="handleValidate"
-    >
-        <slot></slot>
-    </t-form>
-</template>
-
-<script>
-export default {
-    name: "EbizTdesignForm"
-}
-</script>
-
-<script setup>
-import { defineProps, defineEmits } from 'vue';
-import { Form as TForm } from 'tdesign-vue-next';
-
-defineProps({
-    // 自定义类名
-    customClass: {
-        type: String,
-        default: ''
-    },
-    // 数据对象
-    data: {
-        type: Object,
-        default: () => ({})
-    },
-    // 是否在表单标签后面添加冒号
-    colon: {
-        type: Boolean,
-        default: false
-    },
-    // 是否禁用所有表单项
-    disabled: {
-        type: Boolean,
-        default: false
-    },
-    // 表单控件是否为受控模式
-    formControlled: {
-        type: Boolean,
-        default: false
-    },
-    // 标签对齐方式
-    labelAlign: {
-        type: String,
-        default: 'right',
-        validator: (val) => ['left', 'right', 'top'].includes(val)
-    },
-    // 标签宽度
-    labelWidth: {
-        type: [String, Number],
-        default: '100px'
-    },
-    // 表单布局
-    layout: {
-        type: String,
-        default: 'vertical',
-        validator: (val) => ['vertical', 'inline'].includes(val)
-    },
-    // 是否阻止表单提交默认行为
-    preventSubmitDefault: {
-        type: Boolean,
-        default: true
-    },
-    // 重置表单的方式
-    resetType: {
-        type: String,
-        default: 'empty',
-        validator: (val) => ['empty', 'initial'].includes(val)
-    },
-    // 是否显示必填标记
-    requiredMark: {
-        type: Boolean,
-        default: true
-    },
-    // 表单字段验证规则
-    rules: {
-        type: Object,
-        default: () => ({})
-    },
-    // 是否显示校验错误信息
-    showErrorMessage: {
-        type: Boolean,
-        default: true
-    },
-    // 是否显示校验状态图标
-    statusIcon: {
-        type: [Boolean, Function],
-        default: false
-    },
-    // 是否在提交表单且校验不通过时，显示错误信息
-    submitWithWarningMessage: {
-        type: Boolean,
-        default: false
-    }
-});
-
-const emit = defineEmits(['reset', 'submit', 'validate']);
-
-const handleReset = (e) => {
-    emit('reset', e);
-};
-
-const handleSubmit = (e) => {
-    emit('submit', e);
-};
-
-const handleValidate = (params) => {
-    emit('validate', params);
-};
-</script>
-
-<style lang="less" scoped>
-/* 自定义样式 */
+<template>
+    <t-form 
+        :class="customClass"
+        :data="data"
+        :colon="colon"
+        :disabled="disabled"
+        :form-controlled="formControlled"
+        :label-align="labelAlign"
+        :label-width="labelWidth"
+        :layout="layout"
+        :prevent-submit-default="preventSubmitDefault"
+        :reset-type="resetType"
+        :required-mark="requiredMark"
+        :rules="rules"
+        :show-error-message="showErrorMessage"
+        :status-icon="statusIcon"
+        :submit-with-warning-message="submitWithWarningMessage"
+        @reset="handleReset"
+        @submit="handleSubmit"
+        @validate="handleValidate"
+    >
+        <slot></slot>
+    </t-form>
+</template>
+
+<script>
+export default {
+    name: "EbizTdesignForm"
+}
+</script>
+
+<script setup>
+import { defineProps, defineEmits } from 'vue';
+import { Form as TForm } from 'tdesign-vue-next';
+
+defineProps({
+    // 自定义类名
+    customClass: {
+        type: String,
+        default: ''
+    },
+    // 数据对象
+    data: {
+        type: Object,
+        default: () => ({})
+    },
+    // 是否在表单标签后面添加冒号
+    colon: {
+        type: Boolean,
+        default: false
+    },
+    // 是否禁用所有表单项
+    disabled: {
+        type: Boolean,
+        default: false
+    },
+    // 表单控件是否为受控模式
+    formControlled: {
+        type: Boolean,
+        default: false
+    },
+    // 标签对齐方式
+    labelAlign: {
+        type: String,
+        default: 'right',
+        validator: (val) => ['left', 'right', 'top'].includes(val)
+    },
+    // 标签宽度
+    labelWidth: {
+        type: [String, Number],
+        default: '100px'
+    },
+    // 表单布局
+    layout: {
+        type: String,
+        default: 'vertical',
+        validator: (val) => ['vertical', 'inline'].includes(val)
+    },
+    // 是否阻止表单提交默认行为
+    preventSubmitDefault: {
+        type: Boolean,
+        default: true
+    },
+    // 重置表单的方式
+    resetType: {
+        type: String,
+        default: 'empty',
+        validator: (val) => ['empty', 'initial'].includes(val)
+    },
+    // 是否显示必填标记
+    requiredMark: {
+        type: Boolean,
+        default: true
+    },
+    // 表单字段验证规则
+    rules: {
+        type: Object,
+        default: () => ({})
+    },
+    // 是否显示校验错误信息
+    showErrorMessage: {
+        type: Boolean,
+        default: true
+    },
+    // 是否显示校验状态图标
+    statusIcon: {
+        type: [Boolean, Function],
+        default: false
+    },
+    // 是否在提交表单且校验不通过时，显示错误信息
+    submitWithWarningMessage: {
+        type: Boolean,
+        default: false
+    }
+});
+
+const emit = defineEmits(['reset', 'submit', 'validate']);
+
+const handleReset = (e) => {
+    emit('reset', e);
+};
+
+const handleSubmit = (e) => {
+    emit('submit', e);
+};
+
+const handleValidate = (params) => {
+    emit('validate', params);
+};
+</script>
+
+<style lang="less" scoped>
+/* 自定义样式 */
 </style>