<template>
  <div class="ghzc ResourceShare">
    <div class="innerContainer" v-drag>
      <custom-form ref="formRef" :model="model" :config="formConfig">
        <template #time>
          <el-date-picker
            v-model="model.sj"
            type="daterange"
            value-format="yyyy-MM-dd"
            range-separator="~"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            class="datepicker"
            size="mini"
            @change="changedate"
          >
          </el-date-picker>
        </template>
        <template #state>
          <el-select v-model="model.state" placeholder="申请状态" clearable>
            <el-option
              v-for="item in optionList"
              :key="item.code"
              :label="item.name"
              :value="item.code"
            >
            </el-option>
          </el-select>
        </template>
        <template #action>
          <!-- v-hasPermi="['monitor:job:add']" -->
          <el-button size="mini" @click="getTableData">查询</el-button>
          <el-button size="mini" @click="reset()">重置</el-button>
        </template>
      </custom-form>
      <!-- :total="table.total"
    :tableArrDate="table.data" -->
      <customForm></customForm>
      <tablePage
        class="tablePage"
        :cloumn="cloumn"
        :table="table"
        ref="tableDialogRef"
        @currentChange="searchFun"
      >
        <template #state="{ row }">
          <div :class="`state${row.state}`">
            {{ optionList[row.state].name }}
          </div>
        </template>
        <template #url="{ row }">
          <div v-if="row.zymlUrl" @click="copyText(row.zymlUrl)">
            {{ row.zymlUrl }}
            <i class="el-icon-document-copy usable"></i>
          </div>
        </template>
        <template #action="{ row }">
          <span class="usable" @click="detail(row)">详情</span>
          <span
            :class="row.state == 0 || row.state == 1 ? 'usable' : 'disable'"
            @click="review(row)"
            >审核</span
          >
        </template>
      </tablePage>
    </div>
    <addEdt ref="addEdtModal" @close="closeMdel"></addEdt>
    <review ref="reviewModal" @close="closeMdel"></review>
  </div>
</template>

<script>
import Clipboard from "clipboard";
import tablePage from "@/components/mapView/tablePage.vue";
import customForm from "@/components/mapView/custom-form.vue";
import addEdt from "../myApplication/components/addEdtModal.vue";
import review from "./components/reviewModal";
import { stateMap, FormConfig, TableHeader } from "../myApplication/config";
import { Getexaminelist } from "@/api/shared.js";
export default {
  components: {
    tablePage,
    customForm,
    addEdt,
    review,
  },
  props: {},
  data() {
    return {
      model: {
        zymlBy: "",
        state: "",
        startTime: "",
        endTime: "",
        sj: ["", ""],
        pageNum: 1,
        pageSize: 10,
      },
      formConfig: FormConfig,
      cloumn: TableHeader,
      optionList: stateMap,
      table: { data: [], total: 0 },
    };
  },
  methods: {
    searchFun(page) {
      this.getTableData(page);
    },
    async getTableData(page = { pageIndex: 1, size: 10 }) {
      this.model.pageNum = page.pageIndex;
      this.model.pageSize = page.size;
      this.model.startTime = this.model.sj[0];
      this.model.endTime = this.model.sj[1];
      let data = await Getexaminelist(this.model);
      // this.active_dableData = data.data;
      this.table = {
        data: data.rows,
        total: data.total,
      };
    },
    reset() {
      this.model = {
        zymlBy: "",
        state: "",
        startTime: "",
        endTime: "",
        sj: ["", ""],
        pageNum: 1,
        pageSize: 10,
      };
      this.searchFun();
    },
    // 详情
    detail(row) {
      this.$refs.addEdtModal.Init("info", row);
    },
    review(row) {
      if (row.state == 0 || row.state == 1)
        this.$refs.reviewModal.Init("reviewModal", row);
    },
    copyText(text) {
      this.$copyText(text).then(
        () => {
          this.$message.success("复制成功");
        },
        () => {
          this.$message.error("该浏览器不支持自动复制");
        }
      );
    },
    closeMdel() {
      this.searchFun();
    },
  },
  computed: {},
  watch: {},
  mounted() {
    this.searchFun();
  },
};
</script>
<style lang="scss" scoped>
@import "../resource.scss";
</style>
<style lang="scss">
@import "../../cockpit/datePicker.scss";
</style>