element 表格编辑保存新增删除修改批量删除

   <el-table :data="tabledatas"

                    @selection-change="handleSelectionChange"

                    style="width: 100%;margin-top:20px;">

            <el-table-column type="selection"

                             width="55">

            </el-table-column>

            <el-table-column type="index"

                             width="70"

                             :label="$t('common.sequence_number')">

            </el-table-column>

            <el-table-column :label="$t('askingInformation.failure_rate')">

              <template slot-scope="scope">

                <span>

                  <el-input size="mini"

                            maxlength="10"

                            :placeholder="$t('common.input')"

                            οninput="value=value.replace(/[^\w]/g,'')"

                            v-model.trim="scope.row.fault_code"></el-input>

                </span>

                <!-- <span v-else>{{scope.row.fault_code}}</span> -->

              </template>

            </el-table-column>

            <el-table-column :label="$t('askingInformation.describe')">

              <template slot-scope="scope">

                <span>

                  <el-input size="mini"

                            :placeholder="$t('common.input')"

                            v-model="scope.row.fault_description"></el-input>

                </span>

                <!-- <span v-else>{{scope.row.fault_description}}</span> -->

              </template>

            </el-table-column>

            <el-table-column prop=""

                             :label="this.$t('common.operation')"

                             min-width="80">

              <template slot-scope="scope">

                <!-- <el-button @click="edit(scope.row,scope.$index)">{{scope.row.show?`${$t('common.save')}`: `${$t('askingInformation.editor')}`}}</el-button> -->

                <!-- <el-button @click="cope(scope.row,scope.$index)">单个复制</el-button> -->

                <el-button class="btn"

                           type="primary"

                           @click="addAllNum">

                  <svg-icon icon-class="addfill"

                            class-name="button-icon"></svg-icon>

                  <!-- {{$t('askingInformation.a_single_increase')}} -->

                </el-button>

                <el-button class="btn"

                           @click="delect(scope.$index)">

                  <svg-icon icon-class="deletefill"

                            class-name="button-icon"></svg-icon>

                  <!-- {{$t('menu.delete')}} -->

                </el-button>

              </template>

            </el-table-column>

          </el-table>

 //单个新增

    addAllNum() {

      if (this.multipleSelection.length == 0) {

        let list = {

          fault_code: '',

          fault_description: '',

        }

        this.tabledatas.push(list)

      } else {

        this.multipleSelection.forEach((val, index) => {

          this.tabledatas.splice(index, 0, JSON.parse(JSON.stringify(val)))

        })

      }

    },

   //批量删除

    delectAll() {

      for (let i = 0; i < this.tabledatas.length; i++) {

        const element = this.tabledatas[i]

        element.id = i

      }

      if (this.multipleSelection.length == 0)

        this.$message.error(this.$t('askingInformation.choose_at_least_one'))

      this.multipleSelection.forEach((element) => {

        this.tabledatas.forEach((e, i) => {

          if (element.id == e.id) {

            this.tabledatas.splice(i, 1)

          }

        })

      })

      if (this.tabledatas.length == 0) {

        setTimeout(() => {

          this.addAllNum()

        }, 500)

      }

    },

 // //批量新增

    // addAll() {

    //   if (this.multipleSelection.length == 0) {

    //     let list = [

    //       {

    //         fault_code: '',

    //         fault_description: '',

    //       },

    //       {

    //         fault_code: '',

    //         fault_description: '',

    //       },

    //       {

    //         fault_code: '',

    //         fault_description: '',

    //       },

    //       {

    //         fault_code: '',

    //         fault_description: '',

    //       },

    //       {

    //         fault_code: '',

    //         fault_description: '',

    //       },

    //     ]

    //     list.forEach((item, index) => {

    //       this.tabledatas.push(item)

    //     })

    //   } else {

    //     this.multipleSelection.forEach((val, index) => {

    //       this.tabledatas.splice(index, 0, JSON.parse(JSON.stringify(val)))

    //     })

    //   }

    // },