<template>
  <el-dialog :close-on-click-modal="false" custom-class="edit-dialog" append-to-body width="60%" :close-on-press-escape="false"
    :visible.sync="dialogVisible" title="选择RFID">
    <!-- 搜索 -->
    <SearchBlock v-model="query" :menus="queryOption" @change="queryTable"></SearchBlock>
    <el-table
      ref="table"
      v-loading="loading"
      tooltip-effect="dark"
      :data="list"
      border
      @sort-change="sortChange"
      @selection-change="handleSelectionChange"
      :default-sort="sort"
    >
      <el-table-column type="selection" width="50" :selectable="selectable" />
      <el-table-column label="标签编号" align="center" prop="rfidNo" sortable='custom' show-overflow-tooltip
          min-width='120' />
      <el-table-column label="绑定车辆" align="center" prop="vehicleNo" show-overflow-tooltip min-width='120' />
      <el-table-column label="厂商" align="center" prop="manufacturer" show-overflow-tooltip min-width='120' />
      <el-table-column label="是否有效" align="center" prop="isValid" show-overflow-tooltip min-width='120' >
        <template slot-scope="scope">
        <dict-tag :options="dict.type.sys_yes_no" :value="scope.row.isValid"/>
      </template>
      </el-table-column>
      
    </el-table>
    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false">取消</el-button>
      <el-button :disabled="selection.length === 0" type="primary" @click="confirm">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import TableMixin from "@/mixins/table-mixin";
import { pageListRfid } from "@/api/gangkou/device/rfid";

export default {
  name: 'SelectDialog',
  mixins: [TableMixin],
  dicts: ['sys_yes_no'],
  data() {
    return {
      dialogVisible: false,
      queryOption: [
        {
          label: '标签编号',
          prop: 'rfidNo',
          type: 'text',
        },
        {
          label: '是否有效', 
          prop: 'isValid',
          type: 'select',
          getOptions: () => this.dict.type.sys_yes_no,
          optionsProp: 'value',
          optionsLabel: 'label',
        },
      ],
      oldSelection: [],
    }
  },
  methods: {
    mx_pageInfo() {
      return {
        pageListApi: pageListRfid,
        query: {},
      };
    },
    open(curs) {
      this.oldSelection = curs || [];
      this.dialogVisible = true;
    },
    selectable(row) {
      return !this.oldSelection.some(item => item.rfidNo === row.rfidNo);

    },
    confirm() {
      this.$emit('confirm', this.selection);
      this.dialogVisible = false;
      this.$refs.table.clearSelection();
    }
  }
}
</script>

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