@xfu0401/form-generator 1.0.21 → 1.0.22

package/src/plugins/richEditor/richEditorPhone.vue

@@ -1,520 +0,0 @@
-<template>
-  <div class="phone-richText">
-    <quill-editor
-      class="quill-editor"
-      :id="id"
-      v-model="content"
-      :ref="'QuillEditor' + id"
-      :options="editorOption"
-      @blur="onEditorBlur($event)"
-      @focus="onEditorFocus($event)"
-      @change="onEditorChange($event)"
-      @click.native="onEditorClick"
-    ></quill-editor>
-  </div>
-</template>
-
-<script>
-// 富文本全局样式引入
-import "quill/dist/quill.core.css";
-import "quill/dist/quill.snow.css";
-import "quill/dist/quill.bubble.css";
-import { quillEditor, Quill } from "vue-quill-editor";
-const fontSizeStyle = Quill.import("attributors/style/size"); // 引入这个后会把样式写在style上
-fontSizeStyle.whitelist = ["14px", "18px", "24px", "28px", "32px", "36px"];
-Quill.register(fontSizeStyle, true);
-
-// 设置字体样式
-const Font = Quill.import("attributors/style/font"); // 引入这个后会把样式写在style上
-// 客户提供的字体文件勿动 2022/7/19
-const fonts = ["仿宋", "方正小标宋简", "simhei", "simkai"];
-Font.whitelist = fonts; // 将字体加入到白名单
-Quill.register(Font, true);
-export default {
-  components: {
-    quillEditor,
-  },
-  props: {
-    value: {
-      // 传入的原始数据
-      type: String,
-      default: "",
-    },
-    placeholder: {
-      // 传入的占位符
-      type: String,
-      default: "请输入...",
-    },
-    maxlength: {
-      type: [Number, String],
-      default: 3000,
-    },
-    // 是否开启转码
-    transcoding: {
-      type: Boolean,
-      default: true,
-    },
-    // 是否只读
-    readonly: {
-      type: Boolean,
-      default: false,
-    },
-    height: {
-      type: [String, Number],
-      default: "",
-    },
-  },
-  data() {
-    return {
-      id: "quill-" + +new Date() + ((Math.random() * 1000).toFixed(0) + ""),
-      content: ``, //双向数据绑定数据
-      valueLength: 0, // 输入字符长度
-      editorOption: {
-        //编辑器配置项
-        modules: {
-          toolbar: [
-            //[{ header: [1, 2, 3, 4, 5, 6, false] }], //几级标题
-            [
-              "bold",
-              "italic",
-              "underline",
-              "strike",
-              { header: 1 },
-              { header: 2 },
-              { color: [] },
-            ], //加粗，斜体，下划线，删除线
-            //["blockquote", "code-block"], //引用，代码块
-            // [{ header: 1 }, { header: 2 }], // 标题，键值对的形式；1、2表示字体大小
-            //[{ list: "ordered" }, { list: "bullet" }], //列表
-            //[{ script: "sub" }, { script: "super" }], // 上下标
-            //[{ indent: "-1" }, { indent: "+1" }], // 缩进
-            //[{ direction: "rtl" }], // 文本方向
-            // [{ color: [] }], // 字体颜色，字体背景颜色
-            [{ background: [] }, { align: [] }], //对齐方式
-            [
-              // { font: fonts },
-              { size: fontSizeStyle.whitelist },
-            ], // 字体大小
-
-            //["clean"], //清除字体样式
-          ],
-        },
-        placeholder: this.placeholder,
-      },
-    };
-  },
-  mounted() {
-    this.init();
-    this.maxWindow();
-  },
-  watch: {
-    value: {
-      handler(nd, od) {
-        if (nd && nd !== od) {
-          // 是否开启转码
-          if (this.transcoding) {
-            this.$nextTick(() => {
-              this.content = decodeURIComponent(
-                nd.replace(/%(?!\d|[ABCDEF]+)/g, "%25")
-              );
-            });
-          } else {
-            this.content = nd;
-          }
-        } else {
-          this.content = "";
-        }
-      },
-      deep: true,
-      immediate: true,
-    },
-  },
-  methods: {
-    init() {
-      // 如果设置了最大长度
-      if (this.maxlength) {
-        this.$nextTick(() => {
-          // 给富文本右下角添加计数功能
-          const el = this.$refs["QuillEditor" + this.id].$el;
-          let dom = document.createElement("span");
-          dom.className = "hu-number";
-          dom.innerHTML = `${this.valueLength}/${this.maxlength}`;
-          el.appendChild(dom);
-        });
-      }
-      // 1. 初始化时令vue-quill-editor失效
-      this.$refs["QuillEditor" + this.id].quill.enable(false);
-      // if (this.value) {
-      //   // 是否开启转码
-      //   if (this.transcoding) {
-      //     this.$nextTick(() => {
-      //       let content = decodeURIComponent(
-      //         this.value.replace(/%(?!\d|[ABCDEF]+)/g, "%25")
-      //       );
-      //       this.content =
-      //         content.length > this.maxlength
-      //           ? content.substr(0, this.maxlength)
-      //           : content;
-      //     });
-      //   } else {
-      //     this.content =
-      //       this.value.length > this.maxlength
-      //         ? this.value.substr(0, this.maxlength)
-      //         : this.value;
-      //   }
-      // } else {
-      //   this.content = "";
-      // }
-      // 1. 初始化时令vue-quill-editor失效
-      // this.$refs["QuillEditor" + this.id].quill.enable(false);
-    },
-    // 2. 点击富文本框时令quill-editor生效，并聚焦
-    onEditorClick() {
-      this.$refs["QuillEditor" + this.id].quill.enable(true);
-      this.$refs["QuillEditor" + this.id].quill.focus();
-    },
-
-    onEditorBlur(event) {
-      this.$emit("blur", event);
-    }, // 失去焦点触发事件
-
-    // 获取焦点
-    onEditorFocus(event) {
-      // 当为只读时，设置富文本编辑器不可编辑
-      if (this.readonly) {
-        event.enable(false); //设置富文本编辑器不可编辑
-      }
-      this.$emit("focus", event);
-    }, // 获得焦点触发事件
-
-    // 内容改变触发事件
-    onEditorChange(event) {
-      // 如果是 <p> </p> 空标签 就清空内容
-      if (this.isRichTextEmpit(this.content)) {
-        this.content = "";
-      }
-      // 是否开启转码 并且不为空
-      if (this.transcoding && this.content != "") {
-        this.$emit("input", encodeURIComponent(this.content));
-      } else {
-        this.$emit("input", this.content);
-      }
-      const el = this.$refs["QuillEditor" + this.id];
-      let qlCount = el.$el.querySelector(".hu-number");
-
-      // 如果设置了最大长度
-      if (this.maxlength) {
-        // 右下角显示输入的字符长度
-        if (this.content === "") {
-          this.valueLength = 0;
-        } else {
-          this.valueLength = event.quill.getLength() - 1;
-        }
-        qlCount.innerHTML = `${this.valueLength}/${this.maxlength}`;
-        // 限制输入最长字符
-        event.quill.deleteText(this.maxlength, 1, this.content);
-      }
-    },
-
-    // 正则匹配 <p> </p> 空标签
-    isRichTextEmpit(s) {
-      let re = /^(<p>)(\s*)(<\/p>)/;
-      return re.test(s);
-    },
-
-    // 添加全屏功能
-    maxWindow() {
-      const domList = [
-        {
-          dom: `<svg t="1669630560143" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6049" ><path d="M924 616a36 36 0 0 0-36 36v236H652a36 36 0 0 0 0 72h272a36 36 0 0 0 36-36V652a36 36 0 0 0-36-36zM372 64H100a36 36 0 0 0-36 36v272a36 36 0 0 0 72 0V136h236a36 36 0 0 0 0-72zM924 64H652a36 36 0 0 0 0 72h185.09L626.54 346.54a36 36 0 1 0 50.92 50.91L888 186.91V372a36 36 0 0 0 72 0V100a36 36 0 0 0-36-36zM372 616a35.87 35.87 0 0 0-25.46 10.55L136 837.09V652a36 36 0 0 0-72 0v272a36 36 0 0 0 36 36h272a36 36 0 0 0 0-72H186.91l210.55-210.54A36 36 0 0 0 372 616z" p-id="6050" fill="#727888"></path></svg>`,
-          tit: "最大化",
-          id: "maxId",
-          display: "block",
-        },
-        {
-          dom: `<svg t="1669702510511" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4513"><path d="M351.665658 639.937506h0.699931c17.398301 0 31.696905 14.298604 31.696905 31.696905v320.668684c0 17.398301-14.298604 31.696905-31.696905 31.696905h-0.699931c-17.398301 0-31.696905-14.298604-31.696905-31.696905V671.634411c0-17.398301 14.298604-31.696905 31.696905-31.696905z" fill="#727888" p-id="4514"></path><path d="M0 672.234352v-0.699932C0 654.23611 14.198613 639.937506 31.696905 639.937506h320.668684c17.398301 0 31.696905 14.298604 31.696905 31.696905v0.699931c0 17.398301-14.298604 31.696905-31.696905 31.696905H31.696905C14.198613 703.931257 0 689.732643 0 672.234352z" fill="#727888" p-id="4515"></path><path d="M374.263451 649.136608l0.499951 0.499951c12.298799 12.298799 12.298799 32.496826 0 44.795625L55.494581 1013.601016c-12.298799 12.298799-32.496826 12.298799-44.795626 0l-0.499951-0.499952c-12.298799-12.298799-12.298799-32.496826 0-44.795625l319.168831-319.168831c12.398789-12.298799 32.596817-12.298799 44.895616 0z" fill="#727888" p-id="4516"></path><path d="M672.234352 639.937506h-0.699932c-17.398301 0-31.696905 14.298604-31.696904 31.696905v320.668684c0 17.398301 14.298604 31.696905 31.696904 31.696905h0.699932c17.398301 0 31.696905-14.298604 31.696905-31.696905V671.634411c0-17.398301-14.198613-31.696905-31.696905-31.696905z" fill="#727888" p-id="4517"></path><path d="M1023.90001 672.234352v-0.699932c0-17.398301-14.298604-31.696905-31.696905-31.696904H671.634411c-17.398301 0-31.696905 14.298604-31.696905 31.696904v0.699932c0 17.398301 14.298604 31.696905 31.696905 31.696905h320.668684c17.398301 0 31.596914-14.198613 31.596915-31.696905z" fill="#727888" p-id="4518"></path><path d="M649.636559 649.136608l-0.499951 0.499951c-12.298799 12.298799-12.298799 32.496826 0 44.795625l319.168831 319.168832c12.298799 12.298799 32.496826 12.298799 44.795625 0l0.499952-0.499952c12.298799-12.298799 12.298799-32.496826 0-44.795625L694.432184 649.136608c-12.298799-12.298799-32.496826-12.298799-44.795625 0z" fill="#727888" p-id="4519"></path><path d="M351.665658 383.962504h0.699931c17.398301 0 31.696905-14.298604 31.696905-31.696905V31.696905C383.962504 14.198613 369.76389 0 352.265599 0h-0.699932C334.267357 0 319.968753 14.198613 319.968753 31.696905v320.668684c0 17.398301 14.298604 31.596914 31.696905 31.596915z" fill="#727888" p-id="4520"></path><path d="M0 351.665658v0.699931C0 369.76389 14.198613 383.962504 31.696905 383.962504h320.668684c17.398301 0 31.696905-14.298604 31.696905-31.696905v-0.699932c0-17.398301-14.298604-31.696905-31.696905-31.696904H31.696905C14.198613 319.968753 0 334.267357 0 351.665658z" fill="#727888" p-id="4521"></path><path d="M374.263451 374.763402l0.499951-0.499951c12.298799-12.298799 12.298799-32.496826 0-44.795626L55.494581 10.298994C43.195782-1.999805 22.997754-1.999805 10.698955 10.298994l-0.499951 0.499951c-12.298799 12.298799-12.298799 32.496826 0 44.795626l319.168831 319.168831c12.398789 12.298799 32.596817 12.298799 44.895616 0z" fill="#727888" p-id="4522"></path><path d="M672.234352 383.962504h-0.699932c-17.398301 0-31.696905-14.298604-31.696904-31.696905V31.696905C639.937506 14.198613 654.23611 0 671.634411 0h0.699931C689.732643 0 703.931257 14.198613 703.931257 31.696905v320.668684c0 17.398301-14.198613 31.596914-31.696905 31.596915z" fill="#727888" p-id="4523"></path><path d="M1023.90001 351.665658v0.699931c0 17.398301-14.298604 31.696905-31.696905 31.696905H671.634411c-17.398301 0-31.696905-14.298604-31.696905-31.696905v-0.699931c0-17.398301 14.298604-31.696905 31.696905-31.696905h320.668684c17.398301 0 31.596914 14.298604 31.596915 31.696905z" fill="#727888" p-id="4524"></path><path d="M649.636559 374.763402l-0.499951-0.499951c-12.298799-12.298799-12.298799-32.496826 0-44.795626L968.405429 10.298994c12.298799-12.298799 32.496826-12.298799 44.795626 0l0.499951 0.499951c12.298799 12.298799 12.298799 32.496826 0 44.795626L694.432184 374.763402c-12.298799 12.298799-32.496826 12.298799-44.795625 0z" fill="#727888" p-id="4525"></path></svg>`,
-          tit: "还原",
-          id: "minId",
-          display: "none",
-        },
-      ];
-
-      this.$nextTick(() => {
-        const el = this.$refs["QuillEditor" + this.id].$el;
-        let dialogHeaderEl = el.querySelector(".ql-formats");
-
-        domList.map((item) => {
-          let dom = document.createElement("span");
-
-          dom.className = "ql-max-min";
-          dom.style.display = item.display;
-
-          dom.innerHTML = `<button title="${item.tit}"  id="${
-            item.id + this.id
-          }" type="button" class="ql-clean">${item.dom}</button>`;
-
-          dialogHeaderEl.insertBefore(dom, dialogHeaderEl.childNodes[7]);
-        });
-
-        let maxId = document.getElementById("maxId" + this.id);
-        let minId = document.getElementById("minId" + this.id);
-        //最大化
-        maxId.onclick = () => {
-          el.style.width = 100 + "vw";
-          el.style.height = 100 + "vh";
-          el.style.position = "fixed";
-          el.style.top = 0;
-          el.style.left = 0;
-          el.style.zIndex = 9999;
-          el.style.background = "white";
-          // maxId.style.display = "none";
-          maxId.parentNode.style.display = "none";
-          // minId.style.display = "block";
-          minId.parentNode.style.display = "block";
-        };
-        //最小化
-        minId.onclick = () => {
-          el.style.width = "auto";
-          el.style.height = "auto";
-          el.style.position = "inherit";
-
-          // maxId.style.display = "block";
-          maxId.parentNode.style.display = "block";
-
-          // minId.style.display = "none";
-          minId.parentNode.style.display = "none";
-        };
-      });
-    },
-  },
-};
-</script>
-
-<style lang="scss">
-@import "@/style/color";
-
-/* ios 会生成默认样式：-webkit-user-select:none;导致无法选中文本框，无法输入 */
-// .quill-editor {
-//   -webkit-touch-callout: text !important;
-//   -webkit-user-select: text !important;
-//   -khtml-user-select: text !important;
-//   -moz-user-select: text !important;
-//   -ms-user-select: text !important;
-// }
-
-.phone-richText {
-  // margin-top: 10px;
-  position: relative;
-  .hu-number {
-    color: #646566;
-    font-size: 12px;
-  }
-  .ql-editor {
-    min-height: 150px;
-    padding: 12px 15px;
-  }
-  .ql-toolbar.ql-snow .ql-formats {
-    margin-right: 0;
-  }
-  .ql-toolbar.ql-snow {
-    border: 0;
-    // 用于十六进制颜色透明设置
-    background: hsla(hue($blue), saturation($blue), lightness($blue), 0.04);
-    text-align: left;
-    padding: 12px;
-  }
-  .ql-container.ql-snow {
-    border: 0;
-  }
-  .ql-snow .ql-stroke {
-    stroke: #727888;
-  }
-  .ql-snow .ql-fill,
-  .ql-snow .ql-stroke.ql-fill {
-    fill: #727888;
-  }
-
-  .ql-snow .ql-picker-label {
-    width: 100%;
-  }
-
-  .ql-formats:first-child {
-    width: 100%;
-    display: grid;
-    grid-template-columns: 12.5% 12.5% 12.5% 12.5% 12.5% 12.5% 12.5% 12.5%; //后面跟几个数据就是一行排几个
-    justify-content: space-between;
-    button {
-      display: flex;
-      justify-content: center;
-    }
-    .ql-max-min {
-      border-left: 1px solid $gray-3;
-      .ql-clean {
-        display: flex;
-        justify-content: flex-end;
-        width: 100%;
-      }
-    }
-    .ql-picker.ql-expanded .ql-picker-options {
-      left: -50px;
-    }
-  }
-  .ql-formats:nth-child(2) {
-    width: 100%;
-    display: grid;
-    grid-template-columns: 12.5% 12.5%;
-  }
-
-  .ql-formats:nth-child(3) {
-    margin-top: 10px;
-    padding-top: 11px;
-    border-top: 1px solid $gray-3;
-    width: 100%;
-    .ql-picker {
-      border-radius: 2px;
-      border: 1px solid rgba(114, 120, 136, 0.24);
-      margin-right: 8px;
-    }
-    .ql-picker:first-child {
-      width: 140px;
-      height: 24px;
-    }
-    .ql-picker:nth-child(2) .ql-size {
-      width: 60px;
-      height: 24px;
-    }
-  }
-}
-
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="10px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="10px"]::before {
-  content: "10px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="12px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="12px"]::before {
-  content: "12px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="14px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="14px"]::before {
-  content: "14px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="16px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="16px"]::before {
-  content: "16px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="18px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="18px"]::before {
-  content: "18px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="20px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="20px"]::before {
-  content: "20px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="22px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="22px"]::before {
-  content: "22px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="24px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="24px"]::before {
-  content: "24px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="26px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="26px"]::before {
-  content: "26px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="28px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="28px"]::before {
-  content: "28px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="30px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="30px"]::before {
-  content: "30px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="32px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="32px"]::before {
-  content: "32px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="36px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="36px"]::before {
-  content: "36px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="38px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="38px"]::before {
-  content: "38px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="40px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="40px"]::before {
-  content: "40px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="45px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="45px"]::before {
-  content: "45px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="50px"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="50px"]::before {
-  content: "50px";
-}
-
-.ql-snow .ql-picker.ql-size .ql-picker-label::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item::before {
-  content: "14px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="small"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before {
-  content: "10px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="large"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="large"]::before {
-  content: "18px";
-}
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="huge"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="huge"]::before {
-  content: "32px";
-}
-
-.ql-snow .ql-picker.ql-header .ql-picker-label::before,
-.ql-snow .ql-picker.ql-header .ql-picker-item::before {
-  content: "标题";
-}
-.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
-.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
-  content: "标题1";
-}
-.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
-.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
-  content: "标题2";
-}
-.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
-.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
-  content: "标题3";
-}
-.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
-.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
-  content: "标题4";
-}
-.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
-.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
-  content: "标题5";
-}
-.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
-.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
-  content: "标题6";
-}
-
-.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="方正小标宋简"]::before,
-.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="方正小标宋简"]::before {
-  content: "方正小标宋简";
-}
-.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="仿宋"]::before,
-.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="仿宋"]::before {
-  content: "仿宋";
-}
-.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="simhei"]::before,
-.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="simhei"]::before {
-  content: "黑体";
-}
-.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="simkai"]::before,
-.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="simkai"]::before {
-  content: "楷体";
-}
-</style>

package/src/plugins/voiceTxtarea/voiceTxtarea.vue

@@ -1,115 +0,0 @@
-<template>
-  <div class="voice-icon-wrap" ref="vc">
-    <div class="hu-voice-icon">
-      <i class="iconfont icon-voice" @click.stop="talkStart"></i>
-    </div>
-    <transition name="fadeShow">
-      <div class="voice-wrap" v-if="show" @click="talkOver">
-        <img src="../../images/speak3.gif" class="img-vc" />
-        <span style="font-size: 16px">语音录入中...</span>
-      </div>
-    </transition>
-  </div>
-</template>
-
-<script>
-import { Toast } from "vant";
-
-export default {
-  props: {
-    isSearch: {
-      default: false,
-    },
-    // 是否只读
-    readOnly: {
-      type: Boolean,
-      default: false,
-    },
-    // 与语音绑定的输入id
-    id: {
-      type: String,
-      default: "textarea",
-    },
-    // 已经输入的内容
-    oldValue: {
-      type: String,
-      default: "",
-    },
-  },
-  data() {
-    return {
-      msg: "",
-      show: false,
-    };
-  },
-  methods: {
-    // 开始录音的代码写在此处
-    talkStart() {
-      // if (this.readOnly) {
-      //   return;
-      // }
-      // if (!this.$store.state.app.isClient) {
-      //   return Toast.fail("检测到当前客户端不可用语音录入功能！");
-      // }
-      // let is = this._props.isSearch;
-      // let self = this;
-      // let val = this.oldValue;
-      // let el;
-      // self.show = true;
-      // if (!is) {
-      //   el = this.$refs.vc.parentNode.parentNode.querySelector(this.id);
-      //   if (el) val = el.value;
-      // }
-      // // 1、开始 2、 停止 3 、 取消   默认 1
-      // _vrvInit.voiceToTxt((v) => {
-      //   if (is) {
-      //     let vv = v
-      //       .toString()
-      //       .replace(
-      //         /[\u3002|\uff1f|\uff01|\uff0c|\u3001|\uff1b|\uff1a|\u201c|\u201d|\u2018|\u2019|\uff08|\uff09|\u300a|\u300b|\u3008|\u3009|\u3010|\u3011|\u300e|\u300f|\u300c|\u300d|\ufe43|\ufe44|\u3014|\u3015|\u2026|\u2014|\uff5e|\ufe4f|\uffe5]/g,
-      //         ""
-      //       );
-      //     _data.bus.$emit("searchVoice", vv);
-      //   } else {
-      //     // el.value = val + v;
-      //     this.$emit("vc", val + v);
-      //   }
-      //   self.talkOver();
-      // }, 1);
-    },
-    talkOver() {
-      // this.show = false;
-      // _vrvInit.voiceToTxt(v => {}, 3);
-    },
-  },
-};
-</script>
-
-<style lang="scss">
-@import "@/style/color";
-.voice-wrap {
-  height: 100%;
-  width: 100%;
-  position: fixed;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-direction: column;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  z-index: 1000;
-  background-color: rgba(0, 0, 0, 0.3);
-  color: #fff;
-  .img-vc {
-    margin-top: 18px;
-    margin-bottom: 20px;
-    height: 80px;
-  }
-}
-.hu-voice-icon {
-  color: $blue;
-  transform: rotate(45deg);
-}
-</style>