xt-element-ui 1.3.2 → 1.3.4

package/src/components/xt-step-price/style/index.scss

@@ -1,123 +1,123 @@
-@import '../../../styles/variables.scss';
-
-.xt-step-price {
-  padding: 12px 16px;
-  background-color: var(--xt-fill-color-blank, #ffffff);
-  border: 1px solid var(--xt-border-color-lighter, #ebeef5);
-  border-radius: var(--xt-border-radius-base, 4px);
-
-  &__header {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    margin-bottom: 12px;
-  }
-
-  &__list {
-    display: flex;
-    flex-direction: column;
-    gap: 8px;
-  }
-
-  &__empty {
-    padding: 24px;
-    text-align: center;
-    color: var(--xt-text-color-secondary, #909399);
-    font-size: var(--xt-font-size-small, 13px);
-  }
-
-  &__tip {
-    margin-top: 12px;
-    color: var(--xt-text-color-secondary, #909399);
-    font-size: var(--xt-font-size-extra-small, 12px);
-    line-height: 1.6;
-  }
-
-  &.is-disabled {
-    background-color: var(--xt-fill-color-light, #f5f7fa);
-    opacity: 0.85;
-    pointer-events: none;
-  }
-}
-
-.xt-step-price-item {
-  display: flex;
-  align-items: center;
-  padding: 8px 12px;
-  gap: 8px;
-  background-color: var(--xt-fill-color-light, #f5f7fa);
-  border-radius: var(--xt-border-radius-base, 4px);
-  transition: background-color var(--xt-transition-duration-fast, 0.2s) ease;
-
-  &:hover {
-    background-color: var(--xt-fill-color, #f0f2f5);
-  }
-
-  &__range {
-    display: inline-flex;
-    align-items: center;
-    flex: 0 0 auto;
-    color: var(--xt-text-color-regular, #606266);
-    font-size: var(--xt-font-size-small, 13px);
-  }
-
-  &__name {
-    color: var(--xt-text-color-primary, #303133);
-    font-weight: 600;
-  }
-
-  &__bracket {
-    margin: 0 4px;
-    color: var(--xt-text-color-secondary, #909399);
-    font-weight: 600;
-  }
-
-  &__comma {
-    margin: 0 6px;
-    color: var(--xt-text-color-secondary, #909399);
-  }
-
-  &__infinity {
-    display: inline-block;
-    min-width: 80px;
-    text-align: center;
-    color: var(--xt-text-color-placeholder, #c0c4cc);
-    font-size: var(--xt-font-size-small, 13px);
-  }
-
-  &__arrow {
-    margin: 0 12px;
-    color: var(--xt-color-primary, #1890ff);
-    font-weight: 600;
-  }
-
-  &__price {
-    display: inline-flex;
-    align-items: center;
-    flex: 1;
-  }
-
-  &__unit {
-    margin-left: 8px;
-    color: var(--xt-text-color-regular, #606266);
-    font-size: var(--xt-font-size-small, 13px);
-  }
-
-  &__input {
-    width: 80px;
-    text-align: center;
-
-    &--price {
-      width: 140px;
-    }
-  }
-
-  &__delete {
-    margin-left: 12px;
-    color: var(--xt-color-danger, #f56c6c) !important;
-  }
-
-  &__delete:hover {
-    color: var(--xt-color-danger-light-5, #f57786) !important;
-  }
-}
+@import '../../../styles/variables.scss';
+
+.xt-step-price {
+  padding: 12px 16px;
+  background-color: var(--xt-fill-color-blank, #ffffff);
+  border: 1px solid var(--xt-border-color-lighter, #ebeef5);
+  border-radius: var(--xt-border-radius-base, 4px);
+
+  &__header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: 12px;
+  }
+
+  &__list {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  }
+
+  &__empty {
+    padding: 24px;
+    text-align: center;
+    color: var(--xt-text-color-secondary, #909399);
+    font-size: var(--xt-font-size-small, 13px);
+  }
+
+  &__tip {
+    margin-top: 12px;
+    color: var(--xt-text-color-secondary, #909399);
+    font-size: var(--xt-font-size-extra-small, 12px);
+    line-height: 1.6;
+  }
+
+  &.is-disabled {
+    background-color: var(--xt-fill-color-light, #f5f7fa);
+    opacity: 0.85;
+    pointer-events: none;
+  }
+}
+
+.xt-step-price-item {
+  display: flex;
+  align-items: center;
+  padding: 8px 12px;
+  gap: 8px;
+  background-color: var(--xt-fill-color-light, #f5f7fa);
+  border-radius: var(--xt-border-radius-base, 4px);
+  transition: background-color var(--xt-transition-duration-fast, 0.2s) ease;
+
+  &:hover {
+    background-color: var(--xt-fill-color, #f0f2f5);
+  }
+
+  &__range {
+    display: inline-flex;
+    align-items: center;
+    flex: 0 0 auto;
+    color: var(--xt-text-color-regular, #606266);
+    font-size: var(--xt-font-size-small, 13px);
+  }
+
+  &__name {
+    color: var(--xt-text-color-primary, #303133);
+    font-weight: 600;
+  }
+
+  &__bracket {
+    margin: 0 4px;
+    color: var(--xt-text-color-secondary, #909399);
+    font-weight: 600;
+  }
+
+  &__comma {
+    margin: 0 6px;
+    color: var(--xt-text-color-secondary, #909399);
+  }
+
+  &__infinity {
+    display: inline-block;
+    min-width: 80px;
+    text-align: center;
+    color: var(--xt-text-color-placeholder, #c0c4cc);
+    font-size: var(--xt-font-size-small, 13px);
+  }
+
+  &__arrow {
+    margin: 0 12px;
+    color: var(--xt-color-primary, #1890ff);
+    font-weight: 600;
+  }
+
+  &__price {
+    display: inline-flex;
+    align-items: center;
+    flex: 1;
+  }
+
+  &__unit {
+    margin-left: 8px;
+    color: var(--xt-text-color-regular, #606266);
+    font-size: var(--xt-font-size-small, 13px);
+  }
+
+  &__input {
+    width: 80px;
+    text-align: center;
+
+    &--price {
+      width: 140px;
+    }
+  }
+
+  &__delete {
+    margin-left: 12px;
+    color: var(--xt-color-danger, #f56c6c) !important;
+  }
+
+  &__delete:hover {
+    color: var(--xt-color-danger-light-5, #f57786) !important;
+  }
+}

package/src/components/xt-step-price-item/index.js

@@ -1,8 +1,8 @@
-import XtStepPriceItem from './index.vue'
-
-XtStepPriceItem.install = function (Vue) {
-  Vue.component(XtStepPriceItem.name, XtStepPriceItem)
-}
-
-export default XtStepPriceItem
+import XtStepPriceItem from './index.vue'
+
+XtStepPriceItem.install = function (Vue) {
+  Vue.component(XtStepPriceItem.name, XtStepPriceItem)
+}
+
+export default XtStepPriceItem
 export { XtStepPriceItem }

package/src/components/xt-step-price-item/index.vue

@@ -1,187 +1,187 @@
-<template>
-  <div class="xt-step-price-item">
-    <div class="xt-step-price-item__range">
-      <span class="xt-step-price-item__bracket">{{ finalLeftBracket }}</span>
-      <span v-if="itemsLength > 1" class="xt-step-price-item__name">第{{ index + 1 }}档</span>
-      <span class="xt-step-price-item__bracket">{{ finalRightBracket }}</span>
-      <xt-input
-        v-model.number="minInput"
-        :disabled="disabled || minLocked"
-        size="small"
-        placeholder="下限"
-        class="xt-step-price-item__input"
-        @blur="onMinBlur"
-      />
-      <span class="xt-step-price-item__comma">-</span>
-      <xt-input
-        v-if="!isLast"
-        v-model.number="maxInput"
-        :disabled="disabled"
-        size="small"
-        placeholder="上限"
-        class="xt-step-price-item__input"
-        @blur="onMaxBlur"
-      />
-      <span v-else class="xt-step-price-item__infinity">+∞</span>
-    </div>
-
-
-    <div class="xt-step-price-item__price">
-      <xt-input
-        v-model.number="priceInput"
-        :disabled="disabled"
-        size="small"
-        placeholder="价格"
-        class="xt-step-price-item__input xt-step-price-item__input--price"
-        @blur="onPriceBlur"
-      />
-      <span class="xt-step-price-item__unit">{{ unit }}</span>
-    </div>
-
-    <xt-button
-      v-if="!disabled && removable && itemsLength > 1"
-      text
-      icon="el-icon-delete"
-      class="xt-step-price-item__delete"
-      @click="onDelete"
-    />
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'XtStepPriceItem',
-
-  props: {
-    value: {
-      type: Object,
-      required: true,
-      default: () => ({ min: 0, max: null, price: 0 })
-    },
-    index: { type: Number, default: 0 },
-    isFirst: { type: Boolean, default: false },
-    isLast: { type: Boolean, default: false },
-    itemsLength: { type: Number, default: 1 },
-    removable: { type: Boolean, default: true },
-    disabled: { type: Boolean, default: false },
-    minLocked: { type: Boolean, default: false },
-    unit: { type: String, default: '元' },
-    precision: { type: Number, default: 2 },
-    // 阶梯增量：控制新增/校正时的区间跨度，默认 1
-    step: { type: Number, default: 1 },
-    // 左括号：默认 '['，传空则不显示
-    leftBracket: { type: String, default: '[' },
-    // 右括号：默认 null，走内置规则（只有1条为 ']'，多条为 ')'）；传值则强制使用
-    rightBracket: { type: String, default: null },
-    // 字段名映射：{ min, max, price }，允许传入的 value 使用自定义字段名
-    fieldKeys: {
-      type: Object,
-      default: () => ({ min: 'min', max: 'max', price: 'price' })
-    }
-  },
-
-  computed: {
-    keyMin() { return (this.fieldKeys && this.fieldKeys.min) || 'min' },
-    keyMax() { return (this.fieldKeys && this.fieldKeys.max) || 'max' },
-    keyPrice() { return (this.fieldKeys && this.fieldKeys.price) || 'price' },
-    finalRightBracket() {
-      if (this.rightBracket !== null && this.rightBracket !== undefined && this.rightBracket !== '') return this.rightBracket
-      return this.isLast ? ']' : ')'
-    },
-    finalLeftBracket() {
-      return (this.leftBracket === null || this.leftBracket === undefined) ? '[' : this.leftBracket
-    }
-  },
-
-  data() {
-    const { minVal, maxVal, priceVal } = this.getPriceItem(this.value)
-    return {
-      minInput: minVal,
-      maxInput: maxVal,
-      priceInput: priceVal
-    }
-  },
-
-  watch: {
-    value: {
-      deep: true,
-      immediate: true,
-      handler(val) {
-        const { minVal, maxVal, priceVal } = this.getPriceItem(val)
-        this.minInput = minVal
-        this.maxInput = maxVal
-        this.priceInput = priceVal
-      }
-    },
-    isLast(val) {
-      if (val) {
-        this.maxInput = null
-      } else {
-        const minVal = this.safeNumber(this.minInput, 0)
-        const v = this.value
-        this.maxInput = this.safeNumber(v && v[this.keyMax], minVal + 1)
-      }
-    }
-  },
-
-  methods: {
-    getPriceItem(value) {
-      const v = value
-      const minVal = this.safeNumber(v && v[this.keyMin], 0)
-      const maxVal = this.isLast ? null : this.safeNumber(v && v[this.keyMax], minVal + 1)
-      const priceVal = this.safeNumber(v && v[this.keyPrice], 0)
-      return {
-        minVal,
-        maxVal,
-        priceVal
-      }
-    },
-    // 统一兜底：非数字输入一律转为 fallback（默认 0）
-    safeNumber(v, fallback = 0) {
-      if (v === null || v === undefined || v === '' || v === Infinity || v === -Infinity) return fallback
-      const n = Number(v)
-      return isNaN(n) ? fallback : n
-    },
-
-    emitChange(partial) {
-      const next = {
-        [this.keyMin]: this.minInput,
-        [this.keyMax]: this.isLast ? null : this.maxInput,
-        [this.keyPrice]: this.priceInput,
-        ...partial
-      }
-      this.$emit('input', next)
-      this.$emit('change', next, this.index)
-    },
-
-    onMinBlur() {
-      const v = this.safeNumber(this.minInput, 0)
-      this.minInput = v
-      this.$emit('min-change', v, this.index)
-      this.emitChange({ [this.keyMin]: v })
-    },
-
-    onMaxBlur() {
-      if (this.isLast) return
-      const minVal = this.safeNumber(this.minInput, 0)
-      let v = this.safeNumber(this.maxInput, minVal + 1)
-      if (v <= minVal) v = minVal + 1
-      this.maxInput = v
-      this.$emit('max-change', v, this.index)
-      this.emitChange({ [this.keyMax]: v })
-    },
-
-    onPriceBlur() {
-      let v = this.safeNumber(this.priceInput, 0)
-      if (v < 0) v = 0
-      v = Number(v.toFixed(this.precision))
-      this.priceInput = v
-      this.emitChange({ [this.keyPrice]: v })
-    },
-
-    onDelete() {
-      this.$emit('delete', this.index)
-    }
-  }
-}
-</script>
+<template>
+  <div class="xt-step-price-item">
+    <div class="xt-step-price-item__range">
+      <span class="xt-step-price-item__bracket">{{ finalLeftBracket }}</span>
+      <span v-if="itemsLength > 1" class="xt-step-price-item__name">第{{ index + 1 }}档</span>
+      <span class="xt-step-price-item__bracket">{{ finalRightBracket }}</span>
+      <xt-input
+        v-model.number="minInput"
+        :disabled="disabled || minLocked"
+        size="small"
+        placeholder="下限"
+        class="xt-step-price-item__input"
+        @blur="onMinBlur"
+      />
+      <span class="xt-step-price-item__comma">-</span>
+      <xt-input
+        v-if="!isLast"
+        v-model.number="maxInput"
+        :disabled="disabled"
+        size="small"
+        placeholder="上限"
+        class="xt-step-price-item__input"
+        @blur="onMaxBlur"
+      />
+      <span v-else class="xt-step-price-item__infinity">+∞</span>
+    </div>
+
+
+    <div class="xt-step-price-item__price">
+      <xt-input
+        v-model.number="priceInput"
+        :disabled="disabled"
+        size="small"
+        placeholder="价格"
+        class="xt-step-price-item__input xt-step-price-item__input--price"
+        @blur="onPriceBlur"
+      />
+      <span class="xt-step-price-item__unit">{{ unit }}</span>
+    </div>
+
+    <xt-button
+      v-if="!disabled && removable && itemsLength > 1"
+      text
+      icon="el-icon-delete"
+      class="xt-step-price-item__delete"
+      @click="onDelete"
+    />
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'XtStepPriceItem',
+
+  props: {
+    value: {
+      type: Object,
+      required: true,
+      default: () => ({ min: 0, max: null, price: 0 })
+    },
+    index: { type: Number, default: 0 },
+    isFirst: { type: Boolean, default: false },
+    isLast: { type: Boolean, default: false },
+    itemsLength: { type: Number, default: 1 },
+    removable: { type: Boolean, default: true },
+    disabled: { type: Boolean, default: false },
+    minLocked: { type: Boolean, default: false },
+    unit: { type: String, default: '元' },
+    precision: { type: Number, default: 2 },
+    // 阶梯增量：控制新增/校正时的区间跨度，默认 1
+    step: { type: Number, default: 1 },
+    // 左括号：默认 '['，传空则不显示
+    leftBracket: { type: String, default: '[' },
+    // 右括号：默认 null，走内置规则（只有1条为 ']'，多条为 ')'）；传值则强制使用
+    rightBracket: { type: String, default: null },
+    // 字段名映射：{ min, max, price }，允许传入的 value 使用自定义字段名
+    fieldKeys: {
+      type: Object,
+      default: () => ({ min: 'min', max: 'max', price: 'price' })
+    }
+  },
+
+  computed: {
+    keyMin() { return (this.fieldKeys && this.fieldKeys.min) || 'min' },
+    keyMax() { return (this.fieldKeys && this.fieldKeys.max) || 'max' },
+    keyPrice() { return (this.fieldKeys && this.fieldKeys.price) || 'price' },
+    finalRightBracket() {
+      if (this.rightBracket !== null && this.rightBracket !== undefined && this.rightBracket !== '') return this.rightBracket
+      return this.isLast ? ']' : ')'
+    },
+    finalLeftBracket() {
+      return (this.leftBracket === null || this.leftBracket === undefined) ? '[' : this.leftBracket
+    }
+  },
+
+  data() {
+    const { minVal, maxVal, priceVal } = this.getPriceItem(this.value)
+    return {
+      minInput: minVal,
+      maxInput: maxVal,
+      priceInput: priceVal
+    }
+  },
+
+  watch: {
+    value: {
+      deep: true,
+      immediate: true,
+      handler(val) {
+        const { minVal, maxVal, priceVal } = this.getPriceItem(val)
+        this.minInput = minVal
+        this.maxInput = maxVal
+        this.priceInput = priceVal
+      }
+    },
+    isLast(val) {
+      if (val) {
+        this.maxInput = null
+      } else {
+        const minVal = this.safeNumber(this.minInput, 0)
+        const v = this.value
+        this.maxInput = this.safeNumber(v && v[this.keyMax], minVal + 1)
+      }
+    }
+  },
+
+  methods: {
+    getPriceItem(value) {
+      const v = value
+      const minVal = this.safeNumber(v && v[this.keyMin], 0)
+      const maxVal = this.isLast ? null : this.safeNumber(v && v[this.keyMax], minVal + 1)
+      const priceVal = this.safeNumber(v && v[this.keyPrice], 0)
+      return {
+        minVal,
+        maxVal,
+        priceVal
+      }
+    },
+    // 统一兜底：非数字输入一律转为 fallback（默认 0）
+    safeNumber(v, fallback = 0) {
+      if (v === null || v === undefined || v === '' || v === Infinity || v === -Infinity) return fallback
+      const n = Number(v)
+      return isNaN(n) ? fallback : n
+    },
+
+    emitChange(partial) {
+      const next = {
+        [this.keyMin]: this.minInput,
+        [this.keyMax]: this.isLast ? null : this.maxInput,
+        [this.keyPrice]: this.priceInput,
+        ...partial
+      }
+      this.$emit('input', next)
+      this.$emit('change', next, this.index)
+    },
+
+    onMinBlur() {
+      const v = this.safeNumber(this.minInput, 0)
+      this.minInput = v
+      this.$emit('min-change', v, this.index)
+      this.emitChange({ [this.keyMin]: v })
+    },
+
+    onMaxBlur() {
+      if (this.isLast) return
+      const minVal = this.safeNumber(this.minInput, 0)
+      let v = this.safeNumber(this.maxInput, minVal + 1)
+      if (v <= minVal) v = minVal + 1
+      this.maxInput = v
+      this.$emit('max-change', v, this.index)
+      this.emitChange({ [this.keyMax]: v })
+    },
+
+    onPriceBlur() {
+      let v = this.safeNumber(this.priceInput, 0)
+      if (v < 0) v = 0
+      v = Number(v.toFixed(this.precision))
+      this.priceInput = v
+      this.emitChange({ [this.keyPrice]: v })
+    },
+
+    onDelete() {
+      this.$emit('delete', this.index)
+    }
+  }
+}
+</script>

package/src/components/xt-text/index.js

@@ -1,8 +1,8 @@
-import XtText from './index.vue'
-
-XtText.install = function (Vue) {
-  Vue.component(XtText.name, XtText)
-}
-
-export default XtText
+import XtText from './index.vue'
+
+XtText.install = function (Vue) {
+  Vue.component(XtText.name, XtText)
+}
+
+export default XtText
 export { XtText }

package/src/components/xt-text/index.vue

@@ -151,4 +151,4 @@ export default {
     }
   }
 }
-</script>ss
+</script>