@xfu0401/form-generator 1.0.21 → 1.0.22

package/src/components/formGenerator/formComponents/phoneComponents/selectComs/formSlider.vue

@@ -1,79 +0,0 @@
-<template>
-  <!-- 计数器 -->
-  <div
-    class="pho-form-item pho-form-flex"
-    :style="{...newStyle,flexDirection:$attrs.isTop ? 'column' : ''}"
-  >
-    <van-field
-      class="form-input-hidden"
-      v-bind="$attrs"
-      :value="value"
-      :label="showLabel ? $attrs.label : ''"
-      :name="$attrs.__vModel__"
-      input-align="right"
-    >
-      <span v-if="showLabel" slot="label" :style="newStyle.font">{{$attrs.label}}</span>
-    </van-field>
-    <TextShow v-if="$attrs.onlyShow" :value="value" />
-    <div v-else class="right-box center" style="height: 24px">
-      <van-slider v-model="formValue" v-bind="$attrs" @change="handleChange" />
-    </div>
-  </div>
-</template>
-
-<script>
-import { Toast } from "vant";
-import { comMixin } from "../../../utils/comMixins";
-import TextShow from "../components/textShow.vue";
-export default {
-  components: { TextShow },
-  mixins: [comMixin],
-  name: "phone-form-slider",
-  model: {
-    prop: "value", // 绑定的值，通过父组件传递
-    event: "update",
-  },
-  props: {
-    value: {},
-    // 是否展示标题
-    showLabel: {
-      type: Boolean,
-      default: true,
-    },
-  },
-  data() {
-    return {
-      formValue: 0,
-    };
-  },
-  watch: {
-    value: {
-      immediate: true,
-      deep: true,
-      handler(newValue) {
-        if (this.$attrs.range) {
-          this.formValue = newValue ? newValue.split(",") : [];
-          return;
-        }
-        this.formValue = parseInt(newValue || 0);
-      },
-    },
-  },
-  methods: {
-    handleChange(value) {
-      Toast("当前值：" + value);
-      if (this.$attrs.range) {
-        this.$emit("update", value.length ? value.join(",") : "");
-        this.$emit("change", value.length ? value.join(",") : "");
-        this.onChange(value.length ? value.join(",") : "");
-        return;
-      }
-      this.$emit("update", value + "");
-      this.$emit("change", value + "");
-      this.onChange(value + "");
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped></style>

package/src/components/formGenerator/formComponents/phoneComponents/selectComs/formSwitch.vue

@@ -1,88 +0,0 @@
-<template>
-  <!-- 开关 -->
-  <div
-    class="pho-form-item pho-form-flex"
-    :style="{...newStyle,flexDirection:$attrs.isTop ? 'column' : ''}"
-  >
-    <van-field
-      class="form-input-hidden"
-      v-bind="$attrs"
-      :value="JSON.stringify(value)"
-      :label="showLabel ? $attrs.label : ''"
-      :name="$attrs.__vModel__"
-      :placeholder="$attrs.placeholder"
-      input-align="right"
-    >
-      <span v-if="showLabel" slot="label" :style="newStyle.font">{{$attrs.label}}</span>
-    </van-field>
-    <!-- 关闭提示 -->
-    <div class="right-box center form-components">
-      <div v-if="$attrs.readonly || $attrs.onlyShow" class="form-readonly"></div>
-      <span
-        v-if="$attrs.inactiveText"
-        class="pho-form-switch-text--close"
-        :style="{ color: $attrs.inactiveColor }"
-      >{{ $attrs.inactiveText }}</span>
-      <van-switch v-model="formValue" size="20" v-bind="$attrs" @change="handleChange" />
-      <!-- 开启提示 -->
-      <span
-        v-if="$attrs.activeText"
-        class="pho-form-switch-text--start"
-        :style="{ color: $attrs.activeColor }"
-      >{{ $attrs.activeText }}</span>
-    </div>
-  </div>
-</template>
-
-<script>
-import { comMixin } from "../../../utils/comMixins";
-export default {
-  mixins: [comMixin],
-  name: "phone-form-switch",
-  model: {
-    prop: "value", // 绑定的值，通过父组件传递
-    event: "update",
-  },
-  props: {
-    value: {
-      type: [Number, String, Boolean],
-      default: false,
-    },
-    // 是否展示标题
-    showLabel: {
-      type: Boolean,
-      default: true,
-    },
-  },
-  data() {
-    return {
-      formValue: "",
-    };
-  },
-  watch: {
-    value: {
-      immediate: true,
-      deep: true,
-      handler(newValue) {
-        this.formValue = newValue;
-      },
-    },
-  },
-  methods: {
-    handleChange(val) {
-      this.$emit("update", val);
-      this.$emit("change", val);
-      this.onChange(val);
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-.pho-form-switch-text--start {
-  margin-left: 10px;
-}
-.pho-form-switch-text--close {
-  margin-right: 10px;
-}
-</style>

package/src/components/formGenerator/formComponents/phoneComponents/selectComs/formTimePicker.vue

@@ -1,112 +0,0 @@
-<template>
-  <!-- 时间选择器 -->
-  <div class="pho-form-item" :style="newStyle">
-    <van-field
-      :value="value"
-      v-bind="$attrs"
-      :label="showLabel ? $attrs.label : ''"
-      :name="$attrs.__vModel__"
-      input-align="right"
-      :is-link="!isTop"
-      readonly
-      @click="handleClick"
-      @clear.stop
-    >
-      <span v-if="showLabel" slot="label" :style="newStyle.font">{{$attrs.label}}</span>
-      <template #right-icon v-if="clearable">
-        <div @click.stop="handleClear">
-          <van-icon name="clear" />
-        </div>
-      </template>
-    </van-field>
-    <TimePicker
-      ref="TimePicker"
-      :minTime="minTime"
-      :maxTime="maxTime"
-      :format="$attrs.format"
-      @callBack="handleConfirm"
-    />
-  </div>
-</template>
-
-<script>
-import TimePicker from "../components/timePicker.vue";
-import { comMixin } from "../../../utils/comMixins";
-export default {
-  mixins: [comMixin],
-  name: "phone-form-time-picker",
-  components: {
-    TimePicker,
-  },
-  model: {
-    prop: "value", // 绑定的值，通过父组件传递
-    event: "update",
-  },
-  props: {
-    value: {
-      type: [String, Array],
-      default: "",
-    },
-    // 是否为上下布局
-    isTop: {
-      type: Boolean,
-      default: false,
-    },
-    // 是否展示标题
-    showLabel: {
-      type: Boolean,
-      default: true,
-    },
-  },
-  data() {
-    return {
-      formValue: "",
-    };
-  },
-  watch: {
-    value: {
-      immediate: true,
-      deep: true,
-      handler(newValue) {
-        this.formValue = newValue || "";
-      },
-    },
-  },
-  computed: {
-    // 获取时间范围
-    selectableRange() {
-      let selectableRange = this.$attrs.pickerOptions?.selectableRange || "";
-      let rangeArray = selectableRange.split("-");
-      return rangeArray;
-    },
-    // 可选择的最小时间，格式为 10:00 不包括秒
-    minTime() {
-      return this.selectableRange[0];
-    },
-    // 可选择的最大时间，格式为 10:00 不包括秒
-    maxTime() {
-      return this.selectableRange[1];
-    },
-  },
-  methods: {
-    handleClick() {
-      if (this.$attrs.disabled || this.$attrs.readonly || this.$attrs.onlyShow)
-        return;
-      this.$refs.TimePicker.open(this.formValue);
-    },
-    handleConfirm(val) {
-      this.$emit("update", val);
-      this.$emit("change", val);
-      this.onChange(val);
-      this.$emit("confirm", val);
-    },
-    handleClear() {
-      this.$emit("update", "");
-      this.$emit("clear");
-      this.onClear();
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped></style>

package/src/components/formGenerator/formComponents/phoneComponents/selectComs/formTimeRangePicker.vue

@@ -1,155 +0,0 @@
-<template>
-  <!-- 时间范围选择器 -->
-  <div class="pho-form-item" :style="newStyle">
-    <van-field
-      class="form-input-hidden"
-      v-bind="$attrs"
-      :value="formValue.join('')"
-      :label="showLabel ? $attrs.label : ''"
-      :name="$attrs.__vModel__"
-      :disabled="$attrs.disabled"
-      input-align="left"
-      label-align="left"
-    >
-      <span v-if="showLabel" slot="label" :style="newStyle.font">{{$attrs.label}}</span>
-      <template #right-icon v-if="clearable">
-        <div @click.stop="handleClear">
-          <van-icon name="clear" />
-        </div>
-      </template>
-    </van-field>
-    <TextShow v-if="$attrs.onlyShow" :value="$utils.getDateText($attrs)" />
-    <template v-else>
-      <div class="form-range-picker right-box" v-if="!isTop">
-        <div @click="handleClick(0)" class="startPlaceholder">
-          <span v-if="formValue[0]">{{ formValue[0] }}</span>
-          <span v-else class="van-gray5">{{ $attrs.startPlaceholder }}</span>
-        </div>
-        <div class="rangeSeparator">{{ $attrs.rangeSeparator }}</div>
-        <div @click="handleClick(1)" class="endPlaceholder">
-          <span v-if="formValue[1]">{{ formValue[1] }}</span>
-          <span v-else class="van-gray5">{{ $attrs.endPlaceholder }}</span>
-        </div>
-      </div>
-      <template v-else>
-        <van-cell
-          class="date-range-cell"
-          :class="{ 'form-cell--disabled': $attrs.disabled }"
-          :title="$attrs.startPlaceholder"
-          :value="formValue[0]"
-          is-link
-          center
-          @click="handleClick(0)"
-        />
-        <van-cell
-          class="date-range-cell"
-          :class="{ 'form-cell--disabled': $attrs.disabled }"
-          :title="$attrs.endPlaceholder"
-          :value="formValue[1]"
-          is-link
-          center
-          @click="handleClick(1)"
-        />
-      </template>
-      <TimePicker
-        ref="TimePicker"
-        :minTime="minTime"
-        :maxTime="maxTime"
-        :format="$attrs.format"
-        @callBack="handleConfirm"
-      />
-    </template>
-  </div>
-</template>
-
-<script>
-import TimePicker from "../components/timePicker.vue";
-import { comMixin } from "../../../utils/comMixins";
-import TextShow from "../components/textShow.vue";
-export default {
-  mixins: [comMixin],
-  name: "phone-form-timerange-picker",
-  components: {
-    TimePicker,
-    TextShow,
-  },
-  model: {
-    prop: "value", // 绑定的值，通过父组件传递
-    event: "update",
-  },
-  props: {
-    value: {
-      type: [String, Array],
-      default: "",
-    },
-    // 是否展示标题
-    showLabel: {
-      type: Boolean,
-      default: true,
-    },
-    // 是否为上下布局
-    isTop: {
-      type: Boolean,
-      default: false,
-    },
-  },
-  data() {
-    return {
-      startDate: "", // 开始时间
-      endDate: "", // 结束时间
-      formValue: ["", ""], // 时间范围
-      type: 0, // 0-开始时间 1-结束时间
-    };
-  },
-  watch: {
-    value: {
-      immediate: true,
-      deep: true,
-      handler(newValue) {
-        this.formValue = newValue || ["", ""];
-      },
-    },
-  },
-
-  computed: {
-    // 获取时间范围
-    selectableRange() {
-      let selectableRange = this.$attrs.pickerOptions?.selectableRange || "";
-      let rangeArray = selectableRange.split("-");
-      return rangeArray;
-    },
-    // 可选择的最小时间，格式为 10:00 不包括秒
-    minTime() {
-      return this.selectableRange[0];
-    },
-    // 可选择的最大时间，格式为 10:00 不包括秒
-
-    maxTime() {
-      return this.selectableRange[1];
-    },
-  },
-
-  methods: {
-    // type 0-开始时间 1-结束时间
-    handleClick(type) {
-      this.type = type;
-      if (this.$attrs.disabled || this.$attrs.readonly) return;
-      this.$refs.TimePicker.open(this.formValue[type]);
-    },
-    handleConfirm(val) {
-      this.$set(this.formValue, this.type, val);
-      this.$emit("update", this.formValue);
-      this.$emit("change", this.formValue);
-      this.$emit("confirm", this.formValue);
-      this.onChange(this.formValue);
-    },
-    handleClear() {
-      this.$emit("update", "");
-      this.$emit("clear");
-      this.onClear();
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped></style>