<template>
  <div class="app-container">
    <!-- 搜索 -->
    <SearchBlock v-model="query" :menus="queryOption" @change="queryTable"></SearchBlock>
    <!-- 表格工具按钮 -->
    <div class="table-operate">
      <el-button
        type="primary"
        plain
        icon="el-icon-plus"
        size="mini"
        @click="handleAdd"
        v-hasPermi="['gangkou:driver:add']"
        >新增</el-button
      >
      <el-button
        type="danger"
        plain
        icon="el-icon-delete"
        size="mini"
        :disabled="selection.length === 0"
        @click="handleMultDelete"
        v-hasPermi="['gangkou:driver:remove']"
        >删除选中</el-button
      >
    </div>
    <!-- 表格 -->
    <el-table
      ref="table"
      tooltip-effect="dark"
      v-loading="loading"
      :data="list"
      @selection-change="handleSelectionChange"
      border
      @sort-change="sortChange"
      :default-sort="sort"
    >
      <el-table-column v-hasPermi="['gangkou:driver:remove']" type="selection" width="50" />
      <el-table-column label="工号" align="center" prop="workNumber" sortable='custom' show-overflow-tooltip min-width='120' />
      <el-table-column label="司机姓名" align="center" prop="driverName" show-overflow-tooltip min-width='120' />
      <el-table-column label="出生年月" align="center" prop="birthdate" show-overflow-tooltip min-width='120' />
      <el-table-column label="身份证号" align="center" prop="idNumber" show-overflow-tooltip min-width='180' />
      <el-table-column label="性别" align="center" prop="sex" show-overflow-tooltip min-width='80' />
      <el-table-column label="手机号码" align="center" prop="mobileNumber" show-overflow-tooltip min-width='120' />
      <el-table-column label="是否生成账号" align="center" prop="isGenerate" show-overflow-tooltip min-width='80' />
      <el-table-column label="备注" align="center" prop="remark" show-overflow-tooltip min-width='160' />
      <el-table-column width="86px" align="center" label="操作" fixed="right">
        <template slot-scope="scope">
          <el-link type="primary" v-hasPermi="['gangkou:driver:edit']" @click="handleEdit(scope.row)">编辑</el-link>
          <el-link type="danger" v-hasPermi="['gangkou:driver:remove']" @click="handleDelete(scope.row)">删除</el-link>
        </template>
      </el-table-column>
    </el-table>
    <!-- 表格页脚 -->
    <pagination
      hide-on-single-page
      :total="total"
      :page.sync="page.pageNum"
      :limit.sync="page.pageSize"
      @pagination="getTableList"
    />
    <EditDialog ref="editDialog" @refresh="getTableList"></EditDialog>
  </div>
</template>

<script>
import TableMixin from "@/mixins/table-mixin";
import EditDialog from "./components/EditDialog";
import { pageListDriver, delDriver } from "@/api/gangkou/drvier/driver";

export default {
  name: 'Driver',
  mixins: [TableMixin],
  components: { EditDialog },
  data() {
    return {
      queryOption: [
        {
          label: '工号', 
          prop: 'workNumber',
          type: 'text',
          default: '',
        },
        {
          label: '司机姓名', 
          prop: 'driverName',
          type: 'text',
          default: '',
        },
        {
          label: '身份证号', 
          prop: 'idNumber',
          type: 'text',
          default: '',
        },
        {
          label: '性别', 
          prop: 'sex',
          type: 'text',
          default: '',
        },
        {
          label: '手机号码', 
          prop: 'mobileNumber',
          type: 'text',
          default: '',
        },
        {
          label: '是否生成账号', 
          prop: 'isGenerate',
          type: 'text',
          default: '',
        },
      ]
    };
  },
  methods: {
    mx_pageInfo() {
      return {
        title: '司机档案',
        exportUrl: '',
        pageListApi: pageListDriver,
        deleteApi: delDriver,
        query: {},
      };
    },
  },
};
</script>

<style scoped lang="scss">
</style>

