@xfu0401/form-generator 1.1.24 → 1.1.25

package/src/components/formGenerator/formComponents/phoneComponents/assistComs/formTag.vue

@@ -1,147 +0,0 @@
-<template>
-  <div>
-    <span v-show="show" :class="tagClass" :style="newStyle">
-      <span>{{ $attrs.value }}</span>
-      <van-icon
-        v-if="$attrs.closable"
-        name="cross"
-        style="margin-left:5px;cursor: pointer;"
-        @click="show=!show"
-      />
-    </span>
-  </div>
-</template>
-
-<script>
-import { comMixin } from "../../../utils/comMixins";
-export default {
-  mixins: [comMixin],
-  name: "phone-form-tag",
-  data() {
-    return {
-      show: true,
-    };
-  },
-  computed: {
-    plain() {
-      return this.$attrs.effect.plain;
-    },
-    tagClass() {
-      const className = "Fg-pho-tag--";
-      const type = className + this.$attrs.type;
-      const size = className + this.$attrs.size;
-      const round = this.$attrs.round ? className + "round" : "";
-      const hit = this.$attrs.hit ? "is-hit" : "";
-      const effect = className + this.$attrs.effect;
-      return `Fg-pho-tag ${size} ${type} ${round} ${hit} ${effect}`;
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-@import "../../../styles/phone.scss";
-$primary: $blue-1;
-$success: $green;
-$danger: $red;
-$info: $gray-6;
-$warning: $orange;
-
-.Fg-pho-tag {
-  background-color: #ecf5ff;
-  display: inline-block;
-  padding: 2px 6px;
-  line-height: 16px;
-  font-size: 12px;
-  color: $primary;
-  border: 1px solid #d9ecff;
-  border-radius: 4px;
-  box-sizing: border-box;
-  white-space: nowrap;
-
-  &.Fg-pho-tag--primary {
-    border-color: #d9ecff;
-    color: $primary;
-    &.is-hit {
-      border-color: $primary;
-    }
-    &.Fg-pho-tag--dark {
-      background-color: $primary;
-    }
-  }
-  &.Fg-pho-tag--success {
-    background-color: #f0f9eb;
-    border-color: #e1f3d8;
-    color: $success;
-    &.is-hit {
-      border-color: $success;
-    }
-    &.Fg-pho-tag--dark {
-      background-color: $success;
-    }
-  }
-  &.Fg-pho-tag--info {
-    background-color: #f4f4f5;
-    border-color: #e9e9eb;
-    color: $info;
-    &.is-hit {
-      border-color: $info;
-    }
-    &.Fg-pho-tag--dark {
-      background-color: $info;
-    }
-  }
-  &.Fg-pho-tag--danger {
-    background-color: #fef0f0;
-    border-color: #fde2e2;
-    color: $danger;
-    &.is-hit {
-      border-color: $danger;
-    }
-    &.Fg-pho-tag--dark {
-      background-color: $danger;
-    }
-  }
-  &.Fg-pho-tag--warning {
-    background-color: #fdf6ec;
-    border-color: #faecd8;
-    color: $warning;
-    &.is-hit {
-      border-color: $warning;
-    }
-    &.Fg-pho-tag--dark {
-      background-color: $warning;
-    }
-  }
-  &.Fg-pho-tag--plain {
-    background-color: #fff;
-  }
-  &.Fg-pho-tag--dark {
-    color: #fff;
-  }
-}
-
-.Fg-pho-tag--dark {
-  background-color: $primary;
-  border-color: $primary;
-}
-.Fg-pho-tag--round {
-  border-radius: 999px;
-}
-
-.Fg-pho-tag--mini {
-  height: 20px;
-  padding: 0 5px;
-  line-height: 19px;
-}
-.Fg-pho-tag--small {
-  height: 24px;
-  padding: 0 8px;
-  line-height: 22px;
-}
-
-.Fg-pho-tag--medium {
-  height: 28px;
-  line-height: 24px;
-}
-</style>

package/src/components/formGenerator/formComponents/phoneComponents/assistComs/formText.vue

@@ -1,27 +0,0 @@
-<template>
-  <!-- 说明组件 -->
-  <div class="Fg-text" :style="newStyle">
-    <span>{{ value }}</span>
-  </div>
-</template>
-
-<script>
-import { comMixin } from "../../../utils/comMixins";
-export default {
-  mixins: [comMixin],
-  name: "phone-form-text",
-  props: {
-    value: {
-      type: [String, Number],
-      default: "",
-    },
-  },
-  computed: {},
-};
-</script>
-
-<style lang="scss" scoped>
-.Fg-text {
-  word-break: break-all;
-}
-</style>

package/src/components/formGenerator/formComponents/phoneComponents/assistComs/formTree.vue

@@ -1,21 +0,0 @@
-<template>
-  <div class="pho-tree pho-empty">移动端暂不支持树组件</div>
-</template>
-
-<script>
-import { comMixin } from "../../../utils/comMixins";
-export default {
-  mixins: [comMixin],
-  name: "phone-form-tree",
-  props: {
-    value: {
-      type: Array,
-      default: () => [],
-    },
-  },
-  computed: {},
-};
-</script>
-
-<style lang="scss" scoped>
-</style>

package/src/components/formGenerator/formComponents/phoneComponents/components/cascaderPicker.vue

@@ -1,81 +0,0 @@
-<template>
-  <!-- 自定义级联选择框 -->
-  <van-popup v-model="show" round position="bottom" get-container="body">
-    <!-- 多选 -->
-    <van-checkbox-group v-if="multiple" :value="checked" shape="square" @change="handleCheck">
-      <van-cascader
-        v-model="formValue"
-        v-bind="$attrs"
-        :options="options"
-        :field-names="fieldNames"
-        active-color="#478df4"
-        @close="show = false"
-        @change="handleChange"
-        @finish="handleConfirm"
-      >
-        <template #option="{option,selected}">
-          <div @click.stop style="width:28px">
-            <van-checkbox :name="option[props.value]" />
-          </div>
-          <span style="width:100%">{{option[props.label]}}</span>
-        </template>
-      </van-cascader>
-    </van-checkbox-group>
-    <van-radio-group v-model="checked" v-else>
-      <van-cascader
-        v-model="formValue"
-        v-bind="$attrs"
-        :options="resData"
-        :field-names="fieldNames"
-        active-color="#478df4"
-        @close="show = false"
-        @change="handleChange"
-        @finish="handleConfirm"
-      >
-        <template #option="{option,selected}">
-          <div @click.stop style="width:28px">
-            <van-radio :name="option[props.value]" />
-          </div>
-          <span style="width:100%">{{option[props.label]}}</span>
-        </template>
-      </van-cascader>
-    </van-radio-group>
-  </van-popup>
-</template>
-
-<script>
-export default {
-  props: {
-    // 是否多选
-    multiple: {
-      type: Boolean,
-      default: false,
-    },
-    // 是否选择任意一级
-    checkStrictly: {
-      type: Boolean,
-      default: false,
-    },
-    fieldNames: {
-      type: Object,
-      default: () => {},
-    },
-  },
-  data() {
-    return {
-      show: true,
-    };
-  },
-  methods: {
-    open() {
-      this.show = true;
-    },
-    close() {
-      this.show = false;
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-</style>

package/src/components/formGenerator/formComponents/phoneComponents/components/datePicker.vue

@@ -1,101 +0,0 @@
-<template>
-  <!-- 弹框选择时间或日期组件 -->
-  <van-popup v-model="showPicker" position="bottom" get-container="body">
-    <van-datetime-picker
-      v-model="currentDate"
-      :type="dateType"
-      :min-date="dMinDate"
-      :max-date="dMaxDate"
-      @confirm="onConfirm"
-      @cancel="showPicker = false"
-    />
-  </van-popup>
-</template>
-
-<script>
-import moment from "moment";
-export default {
-  props: {
-    // 限制时间选择器可以选择的最小日期
-    minDate: {
-      default: "",
-    },
-    maxDate: {
-      default: "",
-    },
-    // datehour 日期和小时，time 小时和分钟
-    // datetime 完整时间，包括年月日和小时、分钟。
-    // month-day 即可选择月份和日期（从 2.8.4 版本开始支持）
-    // year-month 年月
-    // date 年月日
-    type: {
-      type: String,
-      default: "date",
-    },
-    // 时间格式：yyyy-MM-dd
-    format: {
-      type: String,
-      default: "yyyy-MM-dd",
-    },
-  },
-  data() {
-    return {
-      currentDate: "", // 默认日期 当天
-      showPicker: false, // 弹框是否显示
-    };
-  },
-  computed: {
-    // 日期选择器可以选择的最大时间【没有设置的情况下为当前时间100年后】
-    dMaxDate() {
-      if (this.maxDate && new Date(this.maxDate).toString() != "Invalid Date") {
-        return new Date(this.maxDate);
-      }
-      return new Date(new Date().setFullYear(new Date().getFullYear() + 100));
-    },
-    // 日期选择器可以选择的最小时间
-    dMinDate() {
-      if (this.minDate && new Date(this.minDate).toString() != "Invalid Date") {
-        return new Date(this.minDate);
-      }
-      return new Date(1960, 0, 1);
-    },
-    // 日期类型
-    dateType() {
-      return {
-        date: "date",
-        daterange: "date",
-        week: "date",
-        month: "year-month",
-        year: "date",
-        datetime: "datetime",
-      }[this.type];
-    },
-  },
-  methods: {
-    // 从外部打开时间选择器,datetime-回显的时间
-    open(datetime) {
-      this.currentDate = new Date();
-      if (datetime) {
-        this.currentDate = new Date(moment(datetime).format());
-      }
-      this.toggle(true);
-    },
-
-    // 确认选择某一日期/时刻
-    onConfirm(value) {
-      // vant组件与elementUI组件对时间格式显示不一样，vantUI yyyy-mm-dd 必须大写 即 YYYY-MM-DD
-      let formatStr = this.format
-        .replace("yyyy", "YYYY")
-        .replace("mm", "MM")
-        .replace("dd", "DD");
-      let dateValue = moment(value, moment.ISO_8601).format(formatStr);
-      this.$emit("callBack", dateValue);
-      this.toggle(false);
-    },
-
-    toggle(type) {
-      this.showPicker = type;
-    },
-  },
-};
-</script>

package/src/components/formGenerator/formComponents/phoneComponents/components/esignDialog.vue

@@ -1,156 +0,0 @@
-<template>
-  <!-- 签字的弹框 -->
-  <van-popup
-    class="pho-esign-dialog"
-    v-model="show"
-    v-if="show"
-    position="bottom"
-    closeable
-    round
-    get-container="body"
-  >
-    <!-- <div
-      class="pho-esign-content"
-      :style="{width:signHeight+'px',height:signWidth+'px',transform: `rotate(90deg) translateY(-${signWidth}px)`}"
-    >-->
-    <div class="pho-esign-content">
-      <div class="pho-esign-show">
-        <vue-esign
-          class="esign"
-          ref="esignRef"
-          :width="signWidth-32"
-          :height="(signWidth-32)*3/8"
-          :isCrop="isCrop"
-          v-bind="$attrs"
-        />
-      </div>
-      <div class="pho-esign-button">
-        <van-button block round @click="handleGenerate" type="info">生成签字图片</van-button>
-        <van-button block round @click="handleReset" type="warning">清空画板</van-button>
-        <!-- <van-button size="small" @click="handleBack">退出</van-button>
-        <div class="pho-esign-button--right">
-          <span class="pho-esign-button-text">画笔粗细</span>
-          <van-stepper v-model="lineWidth" min="1" max="10" />
-          <van-button size="small" @click="handleGenerate" type="info">生成签字图片</van-button>
-          <van-button size="small" @click="handleReset" type="warning">清空画板</van-button>
-        </div>-->
-      </div>
-    </div>
-    <span slot="footer" class="dialog-footer">
-      <el-button @click="handleGenerate" type="primary">生成签字图片</el-button>
-      <el-button @click="handleReset" type="warning">清空画板</el-button>
-      <el-button @click="show = false">取消</el-button>
-    </span>
-  </van-popup>
-</template>
-
-<script>
-import { Toast } from "vant";
-import VueEsign from "vue-esign";
-
-export default {
-  components: {
-    VueEsign,
-  },
-  data() {
-    return {
-      show: false, // 弹框是否开启
-      showPopover: false,
-      lineWidth: 4,
-      lineColor: "#000000",
-      bgColor: "",
-      isCrop: false,
-      signHeight: 0,
-      signWidth: 0,
-    };
-  },
-  computed: {
-    lineOpts() {
-      return new Array(10).fill(1).map((v, i) => {
-        return { text: ++i };
-      });
-    },
-  },
-  methods: {
-    open() {
-      this.show = true;
-      this.signHeight = document.body.clientHeight;
-      this.signWidth = document.body.clientWidth;
-    },
-    onSelect(action) {
-      Toast(action);
-    },
-    handleBack() {
-      this.show = false;
-    },
-    handleReset() {
-      // 清空画布
-      this.$refs.esignRef.reset();
-    },
-    handleGenerate() {
-      this.$refs.esignRef
-        .generate()
-        .then((res) => {
-          // 得到了签字生成的base64图片
-          Toast.success("生成成功");
-          this.$emit("update", res);
-          this.show = false;
-        })
-        .catch(() => {
-          //  没有签名，点击生成图片时调用
-          Toast.fail("未签名！");
-        });
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-.pho-esign-dialog {
-  // width: 100vw;
-  // height: 50vh;
-  // overflow: hidden;
-  .pho-esign-content {
-    // overflow: auto;
-    /* 设置旋转中心点 */
-    // transform-origin: left top;
-    padding: 16px;
-    padding-top: 53px;
-    box-sizing: border-box;
-    // display: flex;
-    // flex-direction: column;
-    // justify-content: space-between;
-  }
-  .pho-esign-button {
-    margin-top: 12px;
-    display: flex;
-    .van-button {
-      margin: 0 10px;
-    }
-    // display: flex;
-    // align-items: center;
-    // justify-content: center;
-    // font-size: 13px;
-    // .van-button + .van-button {
-    //   margin-left: 10px;
-    // }
-    // .van-stepper,
-    // .el-color-picker {
-    //   margin-right: 10px;
-    // }
-    // .pho-esign-button--right {
-    //   display: flex;
-    // }
-    // .pho-esign-button-text {
-    //   margin-right: 8px;
-    //   display: flex;
-    //   align-items: center;
-    // }
-  }
-  .pho-esign-show {
-    .esign {
-      border: 1px dashed #c2c1c1;
-    }
-  }
-}
-</style>

package/src/components/formGenerator/formComponents/phoneComponents/components/filesShow.vue

@@ -1,129 +0,0 @@
-<template>
-  <div class="file-show">
-    <van-cell
-      class="file-show-item"
-      center
-      v-for="(item, i) in value"
-      :key="i"
-      :title="item.name"
-      @click="openFile(item)"
-    >
-      <template #icon>
-        <svg-icon :iconClass="formatFile(item.name).svg" class="file-show-img" />
-      </template>
-      <template #right-icon v-if="!onlyShow">
-        <div v-if="item.url" @click.stop="clickDelete(i)">
-          <van-icon name="close" class="delete-icon" />
-        </div>
-        <van-loading v-else type="spinner" size="15px">正在上传</van-loading>
-      </template>
-    </van-cell>
-  </div>
-</template>
-
-<script>
-import { formatFile } from "../../../utils/index";
-import { downloadFile } from "@/api/data";
-import { Toast } from "vant";
-export default {
-  props: {
-    // 回显的文件列表
-    value: {
-      type: Array,
-      default: () => []
-    },
-    onlyShow: {
-      type: Boolean,
-      default: false
-    },
-    // 	下载的文件字段名
-    dName: {
-      type: String,
-      default: ""
-    },
-    // 文件下载地址
-    download: {
-      type: String,
-      default: ""
-    },
-    readonly: {
-      type: Boolean,
-      default: false
-    }
-  },
-  data() {
-    return {
-      list: this.value
-    };
-  },
-
-  methods: {
-    formatFile,
-    openFile(item) {
-      if (!item.url) {
-        return;
-      }
-      // 文件下载
-      this.$emit('openUrl', item)
-      // let formDate = new FormData();
-      // formDate.append(this.dName, item.id);
-      // formDate.append('filename', item.name);
-      // Toast.loading({ forbidClick: true, duration: 15000 });
-      // downloadFile(
-      //   this.download,
-      //   formDate,
-      //   () => {
-      //     setTimeout(() => {
-      //       Toast.clear();
-      //     }, 500);
-      //   },
-      //   msg => {
-      //     Toast.fail("下载失败");
-      //   }
-      // );
-    },
-
-    // 删除文件
-    clickDelete(i) {
-      if (this.readonly) return;
-      const newFiles = this.value.filter((item, index) => index !== i);
-      this.$emit("update:value", newFiles);
-      this.$emit("change", newFiles);
-    }
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-@import "@/style/color";
-.file-show {
-  width: 100%;
-  box-sizing: border-box;
-  .file-show-item {
-    text-align: left;
-    cursor: pointer;
-    background-color: rgba($color: $blue, $alpha: 0.05);
-    border-radius: 4px;
-    padding: 8px;
-    margin-bottom: 8px;
-    .file-show-img {
-      font-size: 25px;
-      margin-right: 5px;
-    }
-    .delete-icon {
-      font-size: 22px;
-      color: red;
-    }
-    .van-loading {
-      white-space: nowrap; //禁止换行
-      .van-loading__text {
-        font-size: 12px;
-        color: $blue;
-      }
-    }
-  }
-  .file-show-item:last-child {
-    margin-bottom: 0px;
-  }
-}
-</style>