<template>
  <div>
    <p-card title="路径方向方案下发">
      <p-grid-form :label-col="{ span: 8 }" :span="8" :items="config.items" @submit="hanlderSubmit" />
      <p-table ref="table" row-key="key" bordered :columns="config.columns" :remoteParams="remoteParams"
        :remoteUrl="config.remoteUrl" :rowSelectType="false" :data-source="data" key="key">
        <template slot="operation" slot-scope="text, record">
          <a v-if="text.isIssue==0" @click="down(text)">下发</a>
          <a v-else="text.isIssue==1" @click="cancle(text)">取消</a>
        </template>
      </p-table>
    </p-card>
  </div>
</template>

<script>
  import config from './config.js'
  import {
    down,
    cancle
  } from './api.js'
  export default {
    data() {
      return {
        intervalId: null,
        config,
        data: [],
        remoteParams: {
          planName: '',
          remark: ''
        },
      }
    },
    created() {

    },
    activated() {
      this.dataRefreh();
    },
    deactivated() {
      console.log('被销毁了')
      this.clear();
    },
    methods: {
      dataRefreh() {
        // 计时器正在进行中，退出函数
        if (this.intervalId != null) {
          return;
        }
        // 计时器为空，操作
        this.intervalId = setInterval(() => {
          console.log("刷新" + new Date());
         this.remoteParams = {
           ...this.remoteParams
         } //加载数据函数
        }, 10000);
      },
      // 停止定时器
      clear() {
        clearInterval(this.intervalId); //清除计时器
        this.intervalId = null; //设置为null
      },
      async down(text) {
        console.log(text)
        let res = await down({
          id: text.id
        })
        console.log(res)
        if (res.success) {
          this.visible = false
          this.$message.success(res.message)
          this.remoteParams = {
            ...this.remoteParams
          }
        } else {
          this.visible = false
          this.$exception(res)
        }
      },
      async cancle(text) {
        let res = await cancle({
          id: text.id
        })
        console.log(res)
        if (res.success) {
          this.visible = false
          this.$message.success(res.message)
          this.remoteParams = {
            ...this.remoteParams
          }
        } else {
          this.visible = false
          this.$exception(res)
        }
      },
      hanlderSubmit(e, form) {
        e.preventDefault()
        form.validateFields((error, values) => {
          console.log(error, values, 'valuesvaluesvaluesvaluesvalues')
          if (!error) {
            this.remoteParams = {
              ...this.remoteParams,
              ...values
            }
          }
        })
      }
    }
  }
</script>

<style>
</style>
