saber/src/views/tentative/parameter.vue

<template>
  <basic-container>
     
            <el-tabs v-model="activeName" @tab-click="handleClick">
                <el-tab-pane label="压实度评标参数" name="first">
                  <div style="height:100%;">
                     <avue-crud 
                    :before-open="beforeOpen"
                    :table-loading="loading"
                    :data="tableData" 
                    :option="option" 
                    v-model="form"
                    @row-save="rowSave"  
                    @row-update="rowUpdate"  
                    @selection-change="selectionChange"
                    @refresh-change="refreshChange"
                    @current-change="currentChange"
                    @size-change="sizeChange"
                    @on-load="onLoad"
                    :page.sync="page" 
                    ref="crud"
                    > 
                        <template slot="menuRight"> 
                                <el-button
                                    type="danger"
                                    size="small"
                                    icon="el-icon-delete"
                                    plain
                                    @click="handleDelete">删除
                                </el-button>
                                <el-button
                                size="small"
                                type="primary"
                                plain
                                 icon="el-icon-plus"
                                @click="importdata"
                                >导入
                                </el-button> 
                        </template>
                    </avue-crud>
                  </div>
                   
                </el-tab-pane>
                <el-tab-pane label="温度及密度参数" name="second">
                  <temperature/>
                </el-tab-pane>
                <!-- 导入参数弹窗 -->
              <importDialog ref="importDialog" @paramLoad="onLoad"  :importDialogType="importDialogType" :parmpage="page" />
            </el-tabs>
     
 
  </basic-container>
  
</template>

<script>
import importDialog from './importDialog.vue';
import temperature from './temperature.vue';
import {getList,add, update, remove,getDetail} from "@/api/tentative/testpram";
export default {
  components:{
    importDialog,
    temperature
  },
     data() {
      return {
        activeName: 'first',
        importDialogType:1,
        page: {
          pageSize: 20,
          currentPage:1
        },
        loading:false,
        tableData: [],
        selectionList:[],
        query:{},
        form:{},
        option:{
          height: 630,
          calcHeight: 30,
          tip: false,
          searchShow:false,
          searchMenuSpan: 6,
          border: true,
          index: true,
          viewBtn: false,
          selection: true,
          editBtn:true,
          delBtn:false,
          addBtn:true,
          menu:true,
          labelWidth:150,
          indexFixed:false,
          selectionFixed:false,
          expandFixed:false,

          dialogClickModal: false,
          column:[
             {
              label:'N值',
              prop:'valueN'
            }, {
              label:'保证率99%',
              prop:'assuranceRateNinetyNinePercent'
            },{
              label:'保证率95%',
              prop:'assuranceRateNinetyFivePercent'
            },{
              label:'保证率90%',
              prop:'assuranceRateNinetyPercent'
            }

          ]
        },
      };
    },
    computed:{
     ids () {
      let ids = [];
      this.selectionList.forEach(ele => {
        ids.push(ele.id);
      });
      return ids.join(",");
    }
  },
    methods: {
    onLoad(page, params = {}) {
      this.loading = true;
      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
        const data = res.data.data;
        this.page.total = data.total;
        this.tableData = data.records;
        this.loading = false;
        this.selectionClear();
      });
    },
      refreshChange() {
        this.onLoad(this.page, this.query);
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize;
      },
      currentChange(currentPage) {
        this.page.currentPage = currentPage;
      },
      handleClick(tab, event) {
        console.log(tab, event);
        setTimeout(() => {
          this.$nextTick(() => {
            this.$refs.crud.doLayout();
          });
        }, 1);
      },
      rowSave (row, done, loading) {
          console.log(row,'row');
        add(row).then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!"
          });
        done();
      }, error => {
        loading();
        window.console.log(error);
      });
    },
    rowUpdate(row, index, done, loading) {
      update(row).then(() => {
        this.onLoad(this.page);
        this.$message({
          type: "success",
          message: "操作成功!"
        });
        done();
      }, error => {
        loading();
        console.log(error);
      });
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        getDetail(this.form.id).then(res => {
          this.form = res.data.data;
        });
      }
      done();
    },

      handleDelete () {
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          return remove(this.ids);
      
        })
        .then(() => {
          this.onLoad(this.page);//刷新表格数据
          this.$message({
            type: "success",
            message: "操作成功!"
          });
          this.$refs.crud.toggleSelection();
        });
      },
      selectionChange (list) {
        this.selectionList = list;
      },
      selectionClear () {
            this.selectionList = [];
            this.$refs.crud.toggleSelection();
     },
      importdata(){
        console.log('导入');
        this.$refs.importDialog.show()
      },
      
  
  
    }
}
</script>

<style>

</style>