tire-platform-ui/src/views/workManagement/main-items/list.vue

<template>
  <basic-container>
    <avue-crud
      ref="crud"
      :data="data"
      :option="optionTable"
      :page.sync="page"
      :table-loading="loading"
      @row-del="rowDel"
      @row-update="rowUpdate"
      @row-save="rowSave"
      @size-change="sizeChange"
      @current-change="currentChange"
      @search-change="searchChange"
      @refresh-change="refreshChange"
      @on-load="getList"
      @saveColumn="saveColumn"
    >
      <template slot="menuLeft">
        <el-button type="primary"
                   size="small"
                   icon="el-icon-plus"
                   @click="addMainItems">新 单
        </el-button>
        <el-button icon="el-icon-printer"
                   size="small"
                   type="primary"
                   @click.stop="openReport()"
          >报 表
        </el-button>
      </template>
      <template slot-scope="scope" slot="menu">
        <el-button
          type="text"
          icon="el-icon-edit"
          size="small"
          @click.stop="editOpen(scope.row, scope.index)"
        >编辑
        </el-button>
        <el-button
          type="text"
          icon="el-icon-delete"
          size="small"
          @click.stop="rowDel(scope.row, scope.index)"
        >删除
        </el-button>
      </template>
      <report-dialog
        :switchDialog="switchDialog"
        @onClose="onClose()"
      ></report-dialog>
    </avue-crud>
  </basic-container>
</template>

<script>
  import option from "./configuration/mainList.json";
  import { getList,deleteMain } from "@/api/workManagement/mainProject";
  import reportDialog from "@/components/report-dialog/main";

export default {
  data() {
    return {
      switchDialog:false,
      loading: false,
      data: [],
      optionTable: option,
      page: {
        currentPage: 1,
        total: 0,
        pageSize: 10
      }
    };
  },
  created() {

  },
  mounted() {
    option.height = window.innerHeight - 380 ;
  },
  components: {
    reportDialog
  },
  methods: {
    //打印
    openReport() {
      this.switchDialog =! this.switchDialog;
    },
    //关闭打印
    onClose(val) {
      this.switchDialog = val;
    },
    //flag:0 判断是主营项目还是结算
    getList(page,params = { flag : 0 }) {
      this.loading = true;
      getList(page.currentPage, page.pageSize,params).then(res =>{
        this.data = res.data.data.records
        this.page.total = res.data.data.total
        this.loading = false
      })
    },
    //新单打开
    addMainItems(){
      this.$router.push({
        path: "/mainItems_detailsPage",
        query: {id: ''},
      });
    },
    //编辑打开
    editOpen(row, index){
      console.log(row)
      this.$router.push({
        path: "/mainItems_detailsPage",
        query: {id:row.id},
      });
    },
    searchChange(params, done) {
      this.getList(this.page, params = { flag : 0 });
      done();
    },
    refreshChange(page,params) {
      console.log(page,params)
      this.getList(page,params);
    },
    //删除列表后面的删除按钮触发触发(row, index, done)
    rowDel(row, index, done) {
      if(row.allowDelete){
        this.$confirm("确定将选择数据删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          deleteMain(row.id).then(res =>{
            this.$message({
              type: "success",
              message: "操作成功!"
            });
          })
          // 数据回调进行刷新
          done(row);
        });
      }else{
        this.$message({
          type: "warning",
          message: "当前项目存在已请核任务 不能删除!"
        });
      }
    },
    //修改时的修改按钮点击触发
    rowUpdate(row, index, done, loading) {
      setTimeout(() => {
        this.$message.success("修改成功");
        loading();
        done();
      }, 1000);
    },
    //新增修改时保存触发
    rowSave(row, done, loading) {
      setTimeout(() => {
        this.$message.success("保存成功");
        loading();
        done();
      }, 1000);
    },
    saveColumn(row, column) {
      console.log(row, column);
    },
    //打开详情页
    beforeOpenPage(row, index) {
      this.$router.push({
        path: "/mainItems_detailsPage",
        query: { id: JSON.stringify(row.prop1) }
      });
    }
  }
};
</script>

<style></style>