input输入框根据匹配字符进行整体移除

业务场景：输入框内需要匹配字符模版，如果用户在固定字符模板中间添加或删除字符时，后端无法进行变量的匹配，所以需要监听是否在固定字符创内是否有删除和增加，然后进行整体删除。

逻辑思路：获取输入框内增加或删除的位置索引，再去匹配输入框内是够有固定模板字符并获取相应的位置，然后再判断变化的位置是否在匹配固定字符串内，然后根据固定字符串的长度进行整体删除。（代码中有些变量是写的，需后期自行变换）

<el-input
   v-model.trim="formInline.berthCode"
   @input="Integrated()"
   placeholder="请输入泊位编号"
 ></el-input>

data() {
   return {
     b: '',
     formInline: {
     	berthCode:'',
     }
   }
}

Integrated () {
      // 更改后的值
      let data1 = this.formInline.berthCode
      data1 = data1.split('')
      
      // 更改前的值
      let data2 = this.b
      data2 = data2.split('')

      console.log(data1, 'data1--------')
      console.log(data2, 'data2----------')

      // 删除的位置
      let ccIndex = 0
      // 获取字符串所在位置
      let k = null

      // 匹配的索引
      // eslint-disable-next-line no-template-curly-in-string
      let aPi = '${plateNumber}'

      // 两个数据重新赋值，避免影响原有数据
      let copydata = this.b
      let adata = this.formInline.berthCode
      
      // 删除逻辑
      if (data1.length < data2.length) { 
        let num = 0
        data2.forEach((item, index) => {
          if (item != data1[index]) { 
            ccIndex = num
            return ccIndex
          }
          num += 1
        });
        console.log(ccIndex, '删除的位置')
        if (data2.length > 0 && ccIndex == 0) { 
          ccIndex = data2.length - 1
        }
        // 获取匹配字符所在位置，返回数组
        k = this.getIndex(this.b, aPi)

        if (k.length > 0) { 
          k.forEach(item => {
            if (ccIndex >= item && ccIndex <= item + 13) { 
              let indicesToRemove = []
              for (let k = 0; k < 14; k++) { 
                indicesToRemove.push(item, item + k)
              }
              this.formInline.berthCode = this.removeCharAt(copydata, ...indicesToRemove);
            }
          })
        }
        this.b = this.formInline.berthCode
      }
      // 增加逻辑
      if (data1.length > data2.length) { 
        let num = 0
        data1.forEach((item, index) => {
          if (item != data2[index]) { 
            ccIndex = num
            return ccIndex
          }
          num += 1
        });
        // 获取删除的索引
        console.log(ccIndex, '增加的逻辑')
        k = this.getIndex(this.b, aPi)
        console.log(k, '匹配的位置')
        if (k.length > 0) { 
          k.forEach(item => {
            if (ccIndex > item && ccIndex <= item + 13) { 
              let indicesToRemove = []
              for (let k = 0; k <= 14; k++) { 
                indicesToRemove.push(item, item + k)
              }
              this.formInline.berthCode = this.removeCharAt(adata, ...indicesToRemove);
            }
          })
        }
        this.b = this.formInline.berthCode
      }
      // if (data1.length < data2.length) {
      // } else { 
      //   k = this.getIndex(this.formInline.berthCode, aPi)
      // }
    },
	//删除数据
    removeCharAt(str, ...indices) {
      let result = '';
      let currentIndex = 0;
    
      indices.sort((a, b) => a - b); // 确保索引从小到大排序
    
      for (let i = 0; i < indices.length; i++) {
        result += str.slice(currentIndex, indices[i]); // 添加从上次切割到索引之间的字符
        currentIndex = indices[i] + 1; // 更新当前索引位置
      }
    
      result += str.slice(currentIndex); // 添加剩余的字符
      return result;
    },
    //获取匹配字符所在的位置，返回数组
    getIndex (str, stra) { 
      let list = []
      // eslint-disable-next-line no-template-curly-in-string
      var index = str.indexOf(stra); // 首先找出第一次寻找到o的位置
      var num = 0;
      while (index !== -1) {
        console.log(index); // 把每次找到o的位置返回
        list.push(index)
        num++; // 找到o的次数
        index = str.indexOf(stra, index + 1);// 寻找下一个o
      }
      console.log(list, 'suoikoanhs')
      return list
    },