<template>
  <el-dialog
      :modal="true"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      destroy-on-close
      title="事项详情"
      :model-value="dialogVisible"

      :before-close="handleClose"
  >
    <my-table border
              :has-operation="false"
              :table-data="tableData"
              :headers="headerConfig">
    </my-table>
    <ele-pagination  ref="refEl"
                     @sizeOrPageChange="handleSizeChange"
                     class="page"
                     :default-page-size="pageSize"
                     :layout="'slot,sizes,prev,pager,next'"
                     :total-count="totalCount">
      <template #default>
        <div class="m-s">
          显示第 {{pageSize * (pageIndex -1) + 1 }} 到第 {{pageSize * pageIndex}} 条记录，总共 {{totalCount}} 条记录 共显示

        </div>
      </template>
    </ele-pagination>
  </el-dialog>
</template>

<script>
import ElePagination from "@/components/common/ElePagination.vue";
import MyTable from "@/components/common/MyTable.vue";
import {Close, Delete, Edit, Plus, Search, SuccessFilled} from "@element-plus/icons-vue";
import {onBeforeMount, ref} from "vue";
import {matterDetailSettingDialogHeader} from "@/data/all-table-header";
import {usePagination} from "@/units/use-method/usePagination";
import {useRootStore} from "@/pinia/useStore";
import {selectAdsZjwXyxfSqxfbPageList} from "@/service/credit-data/credit-repair/credit-repair";
import {proSelectXyxxXxsxDetail} from "@/service/credit-data/data-imputation-push/data-imputation-push";

export default {
  name: "MatterDetailSettingDialog",
  components: {ElePagination, MyTable},
  computed: {
    Delete() {
      return Delete
    },
    Edit() {
      return Edit
    },
    Plus() {
      return Plus
    },
    SuccessFilled() {
      return SuccessFilled
    },
    Close() {
      return Close
    },
    Search(){
      return Search
    }
  },
  props:{
    dialogVisible:{  //是否可见

    },
    dialogOperationType:{   //操作类型

    },
    currentDialogObj:{   //当前选中信息

    },
  },
  setup(props,{emit}){
    const headerConfig = ref([...matterDetailSettingDialogHeader]);
    const {pageIndex,pageSize,tableData,totalCount,initSearch,handleSizeChange,refEl}  = usePagination(getTableData.bind(null));
    const store = useRootStore();
    function getTableData(){
      let paraJson ={
        startC:props.currentDialogObj.START_DATE,
        endC:props.currentDialogObj.END_DATE,
        XXSX:props.currentDialogObj.XXSX,
        pageIndex:pageIndex.value,
        pageSize:pageSize.value
      }
      proSelectXyxxXxsxDetail(paraJson).then(res =>{
        let msg = res.msg[0];
        if(msg.TotalRowCount  > 0){
          let tempData = msg.Rows;
          tableData.value = tempData;
          totalCount.value = res.msg[0].TotalRowCount;
        }else{
          tableData.value = [];
          totalCount.value = 0;
        }
      })
    }
    function handleClose(){
      emit('update:dialogVisible',false);
    }
    onBeforeMount(()=>{
      getTableData()
    })
    return{
      headerConfig,
      handleClose,
      pageIndex,pageSize,tableData,totalCount,handleSizeChange,refEl,initSearch,
    }
  }
}
</script>

<style scoped>

</style>