<template>
      <el-dialog title="选取标准" :visible.sync="chooseVisible_" width="80%">
    <div>
      <el-select
        v-model="listQuery.type"
        placeholder="标准状态"
        clearable
        style="width: 200px"
        class="filter-item"
        @change="handleFilter"
      >
        <el-option
          v-for="item in statusOptions"
          :key="item.key"
          :label="item.display_name"
          :value="item.key"
        />
      </el-select>
      <el-input
        v-model="listQuery.search"
        placeholder="编号/名称"
        style="width: 300px;"
        class="filter-item"
        @keyup.enter.native="handleFilter"
      />
      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">搜索</el-button>
      <el-button
        class="filter-item"
        style="margin-left: 10px;"
        type="primary"
        icon="el-icon-refresh-left"
        @click="resetFilter"
      >刷新重置</el-button>
    </div>
    <el-table
      v-loading="listLoading"
      :data="standardList.results"
      style="width: 100%;margin-top:10px;"
      border
      fit
      stripe
      highlight-current-row
      max-height="400"
      @row-dblclick="chooseComplete"
    >
      <el-table-column type="index" width="50" />
      <el-table-column label="标准编号">
        <template slot-scope="scope">{{ scope.row.code }}</template>
      </el-table-column>
      <el-table-column label="标准名称">
        <template slot-scope="scope">
          <el-link
            type="primary"
            :href="scope.row.path"
            target="_blank"
            v-if="scope.row.path"
          >{{ scope.row.name }}</el-link>
          <span v-else>{{ scope.row.name }}</span>
        </template>
      </el-table-column>
      <el-table-column align="header-center" label="发布日期">
        <template slot-scope="scope">{{ scope.row.publish_date }}</template>
      </el-table-column>
      <el-table-column align="header-center" label="实施日期">
        <template slot-scope="scope">{{ scope.row.implement_date }}</template>
      </el-table-column>
      <el-table-column align="header-center" label="状态">
        <template slot-scope="scope">{{ scope.row.status }}</template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="standardList.count>0"
      :total="standardList.count"
      :page.sync="listQuery.page"
      :limit.sync="listQuery.page_size"
      @pagination="getList"
    />
    </el-dialog>

  
</template>
<script>
import {
  getStandardList,
  createStandard,
  updateStandard,
  deleteStandard
} from "@/api/standard";
import Pagination from "@/components/Pagination";
export default {
  name: "Standardchoose",
  components: { Pagination },
  props:['chooseVisible'],
  data() {
    return {
      standardList: { count: 0 },
      listLoading: true,
      listQuery: {
        page: 1,
        page_size: 20
      },
      statusOptions: [
        { key: "现行", display_name: "现行" },
        { key: "即将实施", display_name: "即将实施" },
        { key: "作废", display_name: "作废" },
        { key: "废止", display_name: "废止" }
      ]
    };
  },
  computed:{
    chooseVisible_: {
        get() {
          return this.chooseVisible;
        },
        set(val) {
          this.$emit('chooseComplete',false);
        }
      }
  },
  created() {
    this.getList();
  },
  methods: {
    getList() {
      this.listLoading = true;
      getStandardList(this.listQuery).then(response => {
        if (response.data) {
          this.standardList = response.data;
        }
        this.listLoading = false;
      });
    },
    resetFilter() {
      this.listQuery = {
        page: 1,
        page_size: 20
      };
      this.getList();
    },
    handleFilter() {
      this.listQuery.page = 1;
      this.getList();
    },
    chooseComplete(row) {
        console.log(row)
      this.$emit('chooseComplete',row);
    }
  }
};
</script>
