<template>
  <div>
    <el-dialog title="填报" width="860px" :visible.sync="visible">

      <xy-table style="width: 820px"
                stripe
                ref="xyTable"
                :req-opt="select"
                :is-first-req="false"
                :height="500"
                :action="getByCategory"
                :table-item="table"
                :destroy-action="destroy">
      </xy-table>
    </el-dialog>
  </div>
</template>

<script>
import { getByCategory, destroy } from "@/api/h5/form";
export default {
  data() {
    return {
      auth: ['delete'],
      visible: false,
      select: {
        category_id: ""
      },
      table: [
        {
          prop: "title",
          label: "标题",
          fixed: "left",
          width: 180
        },
        {
          prop: "created_at",
          label: "填报日期",
          width: 160
        },
        {
          prop: "content",
          label: "内容",
          align: "left",
          minWidth: 200
        },
        {
          prop: "operate",
          label: "操作",
          align: "left",
          width: 140,
          customFn: row => {
            const _this = this
            return (
              <div>
                <Button type="primary"
                        size="small"
                        on={{
                          ['click']:_ => {
                            this.$emit('edit', row.id)
                          }
                        }}>编辑</Button>
                <Button type="error"
                        size="small"
                        on={{
                          ['click']:_ => {
                            this.$confirm('此操作将永久删除该填报, 是否继续?', '提示', {
                              confirmButtonText: '确定',
                              cancelButtonText: '取消',
                              type: 'warning'
                            }).then(() => {
                              destroy({
                                id: row.id
                              }).then(_ => {
                                this.$message({
                                  type: 'success',
                                  message: '删除成功!'
                                });
                                _this.$refs['xyTable'].getTableData()
                                this.$emit('destroyed')
                              })
                            })
                          }
                        }}>删除</Button>
              </div>
            )
          }
        }
      ]
    }
  },
  methods: {
    getByCategory,destroy,
    show () {
      this.visible = true;
    },
    hide () {
      this.visible = false;
    },
    setId (id) {
      this.select.category_id = id;
    },
    getData () {
      this.$refs['xyTable'].getTableData()
    }

  },
  computed: {},
  watch: {
    visible (newVal) {
      if (newVal) {
        this.$nextTick(_ => {
          this.$refs['xyTable'].getTableData(true)
        })
      } else {

      }
    }
  },
  created() {
  }
}
</script>

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