相似项查重规则-表格数据渲染已经增删改查

 Source/UBCS-WEB/src/api/code/codeMatch.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,43 @@
import request from '@/router/axios';

//分页
export const getList = (page, limit) => {
  return request({
    url: '/api/ubcs-code/resembleRuleController/gridCodeResembleRule',
    method: 'get',
    params: {
      page,
      limit
    }
  })
}

//添加
export const add = (row) => {
  return request({
    url: '/api/ubcs-code/resembleRuleController/addSave',
    method: 'post',
    data:row
  })
}

//修改
export const editSave = (row) => {
  return request({
    url: '/api/ubcs-code/resembleRuleController/editSave',
    method: 'put',
    data:row
  })
}

//删除
export const deleteData = (row) => {
  const formData = new FormData();
  formData.append('oid', row.oid);
  formData.append('ts', row.ts);
  return request({
    url: '/api/ubcs-code/resembleRuleController/deleteData',
    method: 'delete',
    data:formData
  })
}

 Source/UBCS-WEB/src/views/code/Match.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,214 @@
<template>
<basic-container>
  <avue-crud :option="option"
             :table-loading="loading"
             :data="data"
             ref="crud"
             v-model="form"
             :page.sync="page"
             @row-del="rowDel"
             @row-update="rowUpdate"
             @row-save="rowSave"
             @selection-change="selectionChange"
             @current-change="currentChange"
             @size-change="sizeChange"
             @refresh-change="refreshChange"
             @on-load="onLoad">
  </avue-crud>
</basic-container>
</template>

<script>
import {getList,add,editSave,deleteData} from "@/api/code/codeMatch";
export default {
name: "Match",
  data(){
    return{
      option:{
        height:700,
        calcHeight: 80,
        tip: false,
        searchShow: true,
        searchMenuSpan: 6,
        columnBtn:false,
        border: true,
        index: true,
        selection: true,
        dialogClickModal: false,
        highlightCurrentRow: true,
        column: [
          {
            label: "编号",
            prop: "id",
            labelWidth: 100,
            rules: [{
              required: true,
              message: "请输入编号",
              trigger: "blur"
            }]
          },
          {
            label: "名称",
            prop: "name",
            rules: [{
              required: true,
              message: "请输入名称",
              trigger: "blur"
            }]
          },
          {
            label: "忽略全部空格",
            prop: "ignoreallspaceflag",
            labelWidth: 100,
            type: 'switch',
            dicData: [{
              label: '否',
              value: 'false'
            }, {
              label: '是',
              value: 'true'
            }],
            formatter:function(row){
              return row.ignoreallspaceflag ==='true' ? '是' : '否'
            }
          },
          {
            label: "忽略大小写",
            prop: "ignorecaseflag",
            type: 'switch',
            dicData: [{
              label: '否',
              value: 'false'
            }, {
              label: '是',
              value: 'true'
            }],
            formatter:function(row){
              return row.ignorecaseflag ==='true' ? '是' : '否'
            }
          },
          {
            label: "忽略空格",
            prop: "ignorespaceflag",
            type: 'switch',
            labelWidth: 100,
            dicData: [{
              label: '否',
              value: 'false'
            }, {
              label: '是',
              value: 'true'
            }],
            formatter:function(row){
              return row.ignorespaceflag ==='true' ? '是' : '否'
            }
          },
          {
            label: "忽略全半角",
            prop: "ignorewidthflag",
            type: 'switch',
            dicData: [{
              label: '否',
              value: 'false'
            }, {
              label: '是',
              value: 'true'
            }],
            formatter:function(row){
              return row.ignorewidthflag ==='true' ? '是' : '否'
            }
          },
          {
            label: "忽略连接字符",
            prop: "linkCharacter",
            type: 'textarea',
            labelWidth: 100,
            span:24

          }
        ]
      },
      loading:true,
      data:[],
      form:{},
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      },
   }
  },
  created() {
    this.onLoad()
  },
  methods:{
    rowDel(row){
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          return deleteData(row);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!"
          });
        });
    },
    rowUpdate(row, index, done, loading){
      console.log(row)
      editSave(row).then(() => {
        this.onLoad(this.page);
        this.$message({
          type: "success",
          message: "操作成功!"
        });
        done();
      }, error => {
        loading();
        console.log(error);
      });
    },
    rowSave(row, done, loading) {
      add(row).then(() => {
        this.onLoad(this.page);
        this.$message({
          type: "success",
          message: "操作成功!"
        });
        done();
      }, error => {
        window.console.log(error);
        loading();
      });
    },
    selectionChange(row){
      console.log(row)
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad( this.page.currentPage,this.page.pageSize);
    },
    onLoad(page){
      getList( this.page.currentPage,this.page.pageSize).then(res=>{
        this.page.total = res.data.total;
        this.data = res.data.data;
        this.loading = false;
      })
    },
  }
}
</script>

<style scoped>

</style>