<template>
  <el-card class="box">
    <content-box ref="contentRef" :loading="loading" :showButtons="showButtons" :tableData="tableData" :pagination="pagination" @getData="getData"></content-box>
  </el-card>
</template>
<script>
  import contentBox from "./components/content";
  import {
    mapState
  } from "vuex";
  export default {
    data() {
      return {
        params: {},
        menuId: "",
        routeId:null,
        highRow:{}, // 高亮行数据
      };
    },
    computed: {
      ...mapState({
        tableData: state => state.approvalManagement.tableData,
        pagination: state => state.approvalManagement.pagination,
        showButtons: (state) => state.approvalManagement.showButtons,
      }),
      loading: {
        get() {
          return this.$store.state.approvalManagement.loading;
        },
        set(val) {
          this.$store.state.approvalManagement.loading = val;
        }
      }
    },
    components: {
      contentBox
    },
    methods: {
      highCurrentRow(){
        this.tableData.find(item=>{
          if(item.id == this.routeId){
            this.highRow = item;
            this.$refs.contentRef.$refs.tableRef.setCurrentRow(item);
          }
        })
      },
      getData() {
        this.loading = true;
        this.params = {
          page: this.pagination.pageNum,
          limit: this.pagination.pageSize,
          userId: sessionStorage.getItem("userid")
        };
        this.$store
          .dispatch("approvalManagement/getData", this.params)
          .catch(err => {
            this.loading = false;
          });
      }
    },
    created() {
      this.getData();
      
      this.menuId = this.$getMenuId(
        sessionStorage.getItem("routerIdList"),
        this.$route.path
      );
      let btnData = {
        menuid: this.$getMenuId(sessionStorage.getItem("routerIdList"), this.$route.path),
        roleid: sessionStorage.getItem("roleid")
      }
      this.$store.dispatch("approvalManagement/getButtonList", btnData);
    },

    mounted(){
      this.routeId = this.$route.params.id;
      this.highCurrentRow();
    }
  };

</script>
<style lang="scss" scoped>
  .box {
    background: #f6f8fc;
    height: 1000px;
  }

</style>
