tire-platform-ui/src/views/landTransportation/placeAnOrder/index.vue

<template>
  <div>
    <basic-container v-if="show">
      <avue-crud :table-loading="loading" :data="dataList" :page.sync="page" ref="crud" :option="option" @on-load="onLoad" @search-change="searchChange">
        <template slot="menuLeft" slot-scope="{size}">
          <el-button type="primary" :size="size" @click="rowSave">新增</el-button>
        </template>
        <template slot-scope="{row,index}" slot="menu">
          <el-button type="text"
                     icon="el-icon-edit"
                     size="small"
                     @click.stop="$refs.crud.rowEdit(row,index)">编辑</el-button>
          <el-button type="text"
                     icon="el-icon-delete"
                     size="small"
                     @click.stop="$refs.crud.rowDelete(row,index)">删除</el-button>
        </template>
      </avue-crud>
    </basic-container>
    <detail-page v-else @backToList="backToList"></detail-page>
  </div>
</template>

<script>
import detailPage from './detailPage'
import {selectInvoiceList} from "@/api/landTransportation";
export default {
  name: "index",
  components: {
    detailPage
  },
  data(){
    return{
      show:true,
      loading:false,
      dataList:[],
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
        pageSizes: [10,50,100,200,300]
      },
      option:{
        align:'center',
        index: true,
        addBtn: false,
        editBtn: false,
        delBtn:false,
        height:"auto",
        column:[{
            label: '订单号',
            prop: 'id',
            index: 1,
            width: 140,
            cell: true,
            overHidden: true,
            search:true,
          }]
      }
    }
  },
  methods:{
    onLoad(page, params) {
      let queryParams = {
        size: page.pageSize,
        current: page.currentPage,
        ...params
      }
      this.loading = true;
      selectInvoiceList(queryParams).then(res => {
        this.dataList = res.data.data.records
        this.page.total = res.data.data.total
      }).finally(() => {
        this.loading = false;
      })
    },
    //搜索
    searchChange(params,done) {
      this.onLoad(this.page,params)
      done();
    },
    rowSave(){
      this.show = false
    },
    backToList(){
      this.show = true
    }
  }
}
</script>

<style scoped>

</style>