@xfu0401/form-generator 1.0.21 → 1.0.22

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

@@ -1,63 +0,0 @@
-<template>
-  <!-- 颜色选择器 -->
-  <div class="pho-form-item" :style="newStyle">
-    <van-field
-      v-bind="$attrs"
-      :label="showLabel ? $attrs.label : ''"
-      :name="$attrs.__vModel__"
-      :required="$attrs.required"
-      :rules="$attrs.regList"
-      :placeholder="$attrs.placeholder"
-      input-align="right"
-    >
-      <span v-if="showLabel" slot="label" :style="newStyle.font">{{$attrs.label}}</span>
-      <template #input></template>
-    </van-field>
-  </div>
-</template>
-
-<script>
-import { comMixin } from "../../../utils/comMixins";
-export default {
-  mixins: [comMixin],
-  name: "phone-form-color-picker",
-  model: {
-    prop: "value", // 绑定的值，通过父组件传递
-    event: "update",
-  },
-  props: {
-    value: {
-      type: [Number, String],
-      default: "",
-    },
-    // 是否展示标题
-    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></style>

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

@@ -1,100 +0,0 @@
-<template>
-  <!-- 日期时间选择器 -->
-  <div class="pho-form-item" :style="newStyle">
-    <van-field
-      :value="value"
-      :label="showLabel ? $attrs.label : ''"
-      :name="$attrs.__vModel__"
-      :required="$attrs.required"
-      :rules="$attrs.rules"
-      input-align="right"
-      :disabled="$attrs.disabled"
-      :clearable="$attrs.clearable"
-      :is-link="!isTop"
-      :placeholder="$attrs.placeholder"
-      readonly
-      @click="handleClick"
-    >
-      <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>
-
-    <DatePicker
-      ref="DatePicker"
-      :type="$attrs.type"
-      :format="$attrs.format"
-      @callBack="handleConfirm"
-    />
-  </div>
-</template>
-
-<script>
-import DatePicker from "../components/datePicker.vue";
-import { comMixin } from "../../../utils/comMixins";
-export default {
-  mixins: [comMixin],
-  name: "phone-form-date-picker",
-  components: {
-    DatePicker,
-  },
-  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 || "";
-      },
-    },
-  },
-
-  methods: {
-    handleClick() {
-      if (this.$attrs.disabled || this.$attrs.readonly || this.$attrs.onlyShow)
-        return;
-      this.$refs.DatePicker.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/formDateRangePicker.vue

@@ -1,136 +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__"
-      readonly
-      input-align="right"
-      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="right-box form-range-picker" 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>
-      <DatePicker
-        ref="DatePicker"
-        :type="$attrs.type"
-        :format="$attrs.format"
-        @callBack="handleConfirm"
-      />
-    </template>
-  </div>
-</template>
-
-<script>
-import DatePicker from "../components/datePicker.vue";
-import { comMixin } from "../../../utils/comMixins";
-import TextShow from "../components/textShow.vue";
-export default {
-  mixins: [comMixin],
-  name: "phone-form-daterange-picker",
-  components: {
-    DatePicker,
-    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 || ["", ""];
-      },
-    },
-  },
-
-  methods: {
-    // type 0-开始时间 1-结束时间
-    handleClick(type) {
-      this.type = type;
-      if (this.$attrs.disabled || this.$attrs.readonly) return;
-      this.$refs.DatePicker.open(this.formValue[type]);
-    },
-    handleConfirm(val) {
-      this.$set(this.formValue, this.type, val);
-      this.$emit("update", this.formValue);
-      this.$emit("change", this.formValue);
-      this.onChange(this.formValue);
-      this.$emit("confirm", this.formValue);
-    },
-    handleClear() {
-      this.$emit("update", "");
-      this.$emit("clear");
-      this.onClear();
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped></style>

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

@@ -1,278 +0,0 @@
-<template>
-  <!-- 文件上传 -->
-  <div class="pho-form-item" :style="newStyle">
-    <div
-      style="display: flex; justify-content: space-between"
-      :style="isTop ? 'flex-direction: column;' : ''"
-    >
-      <van-field
-        class="form-input-hidden"
-        v-bind="$attrs"
-        :value="value"
-        :name="$attrs.__vModel__"
-        readonly
-        :label="showLabel ? label : ''"
-        :label-width="labelWidth"
-        :required="required"
-        input-align="right"
-      >
-        <span v-if="showLabel" slot="label" :style="newStyle.font">{{label}}</span>
-      </van-field>
-    </div>
-    <ImageShow
-      :value.sync="fileList"
-      :onlyShow="$attrs.onlyShow"
-      :readonly="readonly || disabled"
-      @change="handleChange"
-    >
-      <template v-if="!$attrs.onlyShow && fileList.length!==limit">
-        <van-uploader
-          :readonly="readonly"
-          :disabled="disabled"
-          :multiple="multiple"
-          :max-size="maxSize"
-          :max-count="limit"
-          accept="image/*"
-          :preview-image="false"
-          :after-read="afterRead"
-          @oversize="onOversize"
-        />
-      </template>
-    </ImageShow>
-    <div
-      class="form-upload-tips"
-      v-if="showTip && !$attrs.onlyShow"
-      :style="newStyle.font"
-    >*{{ tips }}</div>
-  </div>
-</template>
-
-<script>
-import { formatFile } from "../../../utils/index";
-import { Toast } from "vant";
-import ImageShow from "../components/imageShow";
-import { comMixin } from "../../../utils/comMixins";
-import { requestPost2 } from "@/api/data";
-
-export default {
-  mixins: [comMixin],
-  name: "phone-form-image",
-  components: {
-    ImageShow,
-  },
-  model: {
-    prop: "value", // 绑定的值，通过父组件传递
-    event: "update",
-  },
-  props: {
-    // value 和 formValue 存储的都是选择的文件，前者是字符串形式，后者为数组形式
-    // 选择的文件的字符串形式
-    value: {
-      default: "",
-    },
-    // 是否为上下布局
-    isTop: {
-      type: Boolean,
-      default: false,
-    },
-    // 标签
-    label: {
-      type: String,
-      default: "",
-    },
-    // 是否必填
-    required: {
-      type: Boolean,
-      default: false,
-    },
-    // 文件上传地址
-    action: {
-      type: String,
-      default: "",
-    },
-
-    // 文件大小
-    fileSize: {
-      type: [String, Number],
-      default: 50,
-    },
-    // 文件单位
-    sizeUnit: {
-      type: String,
-      default: "MB",
-    },
-    // 是否只读，仅作展示
-    readonly: {
-      type: Boolean,
-      default: false,
-    },
-    // 是否展示文件提示语,默认展示
-    showTip: {
-      type: Boolean,
-      default: true,
-    },
-
-    // 是否多选
-    multiple: {
-      type: Boolean,
-      default: false,
-    },
-    // 禁用
-    disabled: {
-      type: Boolean,
-      default: false,
-    },
-    // label标题的宽度
-    labelWidth: {
-      type: [String, Number],
-      default: "100%",
-    },
-    // 	上传的文件字段名
-    name: {
-      type: String,
-      default: "",
-    },
-    // 最大允许上传个数
-    limit: {
-      type: Number,
-      default: 10,
-    },
-    // 是否展示标题
-    showLabel: {
-      type: Boolean,
-      default: true,
-    },
-  },
-  data() {
-    return {
-      files: [],
-      fileList: [
-        // {
-        //   name: "food.jpeg",
-        //   url: "https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100",
-        // },
-        // {
-        //   name: "food2.jpeg",
-        //   url: "https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100",
-        // },
-      ],
-      formatFile,
-    };
-  },
-
-  computed: {
-    maxSize() {
-      const fileSize = this.fileSize; // 文件大小
-      const fileUnit = this.sizeUnit; // 文件单位
-      // 实际上传的文件大小单位为B，需要将文件大小限制的单位转换为B
-      const maxSize =
-        fileSize *
-        { KB: 1024, MB: Math.pow(1024, 2), GB: Math.pow(1024, 3) }[fileUnit];
-      return maxSize;
-    },
-    tips() {
-      // 最大上传文件+单位
-      const sizeUnit = this.fileSize + this.sizeUnit;
-      return `只能上传不超过${sizeUnit}的图片${this.$attrs.remark || ""}`;
-    },
-  },
-  watch: {
-    value: {
-      immediate: true,
-      deep: true,
-      handler: function (nd, od) {
-        try {
-          // 回显
-          this.fileList = JSON.parse(nd || "[]");
-        } catch (error) {
-          console.log("error", error);
-        }
-      },
-    },
-  },
-
-  methods: {
-    onOversize() {
-      Toast.fail("图片大小不允许上传！");
-    },
-
-    // 文件读取完成后的回调函数
-    afterRead(file) {
-      if (this.fileList.length >= this.limit) {
-        return Toast(`最多允许上传${this.limit}个图片`);
-      }
-      // 只能上传一个文件，将原文件清空再添加
-      if (!this.multiple) this.fileList = [];
-      let formData = new FormData();
-      if (Array.isArray(file)) {
-        // 选择多个文件
-        file.forEach((item) => {
-          formData.append(this.name, item.file);
-          this.fileList.push({
-            id: item.file?.lastModified,
-            name: item.file?.name,
-            url: "",
-          });
-        });
-      } else {
-        // 选择单个文件
-        formData.append(this.name, file.file);
-        this.fileList.push({
-          id: file.file?.lastModified,
-          name: file.file?.name,
-          url: "",
-        });
-      }
-      requestPost2(this.action, formData)
-        .then((res) => {
-          if (res.code == 1) {
-            let fileArr = [];
-            if (this.multiple) {
-              fileArr = JSON.parse(this.value || "[]");
-            }
-            Toast.success("上传成功！");
-            try {
-              res.result.mFilePath.forEach((path, index) => {
-                fileArr.push({
-                  id: res.result.idList[index],
-                  name: res.result.mFileName[index],
-                  url: path,
-                  size: res.result.fileLengths[index] || "", // 文件大小
-                });
-                this.handleChange(fileArr);
-              });
-            } catch (error) {
-              this.onError(error);
-            }
-          } else {
-            this.onError(res);
-          }
-        })
-        .catch((err) => {
-          this.onError(err);
-        });
-    },
-    // 上传失败
-    onError(err) {
-      Toast.fail(err.msg || `上传失败！`);
-      this.fileList = JSON.parse(this.value || "[]");
-    },
-    handleChange(fileArr) {
-      const value = fileArr.length ? JSON.stringify(fileArr) : null;
-      this.$emit("update", value);
-      this.$emit("change", value);
-      this.onChange(value);
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-@import "@/style/color";
-.form-upload-tips {
-  padding: 0 16px;
-  padding-bottom: 10px;
-  font-size: 13px;
-  color: $blue;
-}
-</style>

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

@@ -1,107 +0,0 @@
-<template>
-  <div class="pho-form-item" :style="newStyle">
-    <van-field
-      class="form-input-hidden"
-      v-bind="$attrs"
-      :name="$attrs.__vModel__"
-      :value="selected.length ? value : ''"
-      :label="$attrs.showLabel ? $attrs.label : ''"
-      input-align="right"
-      readonly
-      right-icon="plus"
-    >
-      <span v-if="$attrs.showLabel" slot="label" :style="newStyle.font">{{$attrs.label}}</span>
-    </van-field>
-    <div v-if="!$attrs.onlyShow" class="user-picker-add form-placeholder" @click="handleClick">
-      {{ $attrs.placeholder }}
-      <van-icon name="plus" />
-    </div>
-    <!-- 展示栏 -->
-    <NameShow
-      v-if="selected.length"
-      style="padding: 0 12px 12px 12px"
-      v-model="selected"
-      :props="dataObj.props"
-      :onlyShow="$attrs.onlyShow"
-      :readonly="$attrs.readonly"
-      @change="callBack"
-    />
-    <OrgPicker
-      ref="OrgPicker"
-      :data="dataObj"
-      :multiple="$attrs.multiple"
-      type="dept"
-      :search="search"
-      @callBack="callBack"
-    />
-  </div>
-</template>
-
-<script>
-import OrgPicker from "../components/orgPicker.vue";
-import NameShow from "../components/nameShow.vue";
-import { comMixin } from "../../../utils/comMixins";
-export default {
-  mixins: [comMixin],
-  name: "phone-form-org-picker",
-  components: {
-    OrgPicker,
-    NameShow,
-  },
-  model: {
-    prop: "value", // 绑定的值，通过父组件传递
-    event: "update",
-  },
-  props: {
-    // 绑定的输入值
-    value: {
-      type: [String],
-      default: "",
-    },
-
-    // 搜索配置
-    search: {
-      type: Object,
-      default: () => {},
-    },
-  },
-  data() {
-    return {
-      selected: JSON.parse(this.values || "[]"),
-    };
-  },
-
-  watch: {
-    value: {
-      immediate: true,
-      deep: true,
-      handler(newValue, oldValue) {
-        this.selected = JSON.parse(newValue || "[]");
-      },
-    },
-  },
-  methods: {
-    // 此处是为了不调用comMixins混入中的init方法
-    init() {},
-    handleClick() {
-      if (this.$attrs.disabled || this.$attrs.readonly) return;
-      this.$refs.OrgPicker.open(this.selected);
-    },
-    callBack(value) {
-      const newValue = value.length ? JSON.stringify(value) : null;
-      this.$emit("update", newValue);
-      this.$emit("confirm", newValue);
-      this.onConfirm(newValue);
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-.user-picker-add {
-  padding: 12px 16px;
-  padding-top: 0;
-  cursor: pointer;
-  font-size: 13px;
-}
-</style>