<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"
  >
    <div class="table-part" v-if="tablePartShow">
      <my-table border
                :has-operation="true"
                :table-data="tableData"
                :headers="headerConfig">
        <template #operation="{data}">
          <el-button  type="info" @click="showSingleDetail('detail',data)">查看</el-button>
        </template>
      </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>
    </div>
    <div class="form-part" v-else >
      <diy-el-form ref="formRef"  v-model:model-form="forms" :forms="formConfig">
        <template #searchBtn>
          <el-button  type="primary" :icon="Search" @click="initSearch">查询</el-button>
        </template>
      </diy-el-form>
    </div>
    <template v-if="!tablePartShow" #footer>
      <el-button  v-if="dialogOperationType != 'detail'" :icon="SuccessFilled" @click="conform">确定</el-button>
      <el-button @click="formClose" :icon="Close">返回</el-button>
    </template>
  </el-dialog>
</template>

<script>
import {Close,Search, Delete, Edit, Plus, SuccessFilled} from "@element-plus/icons-vue";
import DiyElForm from "@/components/common/DiyElForm.vue";
import ElePagination from "@/components/common/ElePagination.vue";
import MyTable from "@/components/common/MyTable.vue";
import {onBeforeMount, ref} from "vue";
import {combinedRewardAndPunishmentsMeasureManageCaseHistorySettingDialogHeader} from "@/data/all-table-header";
import {combinedRewardAndPunishmentsMeasureManageCaseHistory} from "@/data/all-form";
import {usePagination} from "@/units/use-method/usePagination";
import {
  proSelectXyxxJgfk
} from "@/service/combined-rewards-and-punishments/combined-rewards-and-punishments-case-information/combined-rewards-and-punishments-case-information";

export default {
  name: "CombinedRewardAndPunishmentsMeasureManageCaseHistorySettingDialog",
  components: {DiyElForm, 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 formRef = ref(null);
    const forms = ref({});
    const formConfig = ref({...combinedRewardAndPunishmentsMeasureManageCaseHistory});
    const headerConfig = ref([...combinedRewardAndPunishmentsMeasureManageCaseHistorySettingDialogHeader]);
    const {pageIndex,pageSize,tableData,totalCount,initSearch,handleSizeChange,refEl}  = usePagination(getTableData.bind(null));
    const tablePartShow =ref(true);
    function getTableData(){
      debugger
      proSelectXyxxJgfk({
        id:"",
        dxmc:"",
        dxdm:props.currentDialogObj.DXDM,
        saxx:"",
        start_time:"",
        end_time:"",
        pageIndex:pageIndex.value,
        pageSize:pageSize.value
      }).then(res =>{
        let msg = res.msg[0];
        if(msg.TotalRowCount  > 0){
          let tempData = msg.Rows;
          tableData.value = tempData;
          totalCount.value = res.msg[0].TotalRowCount;
        }
      })
    }
    function handleClose(){
      emit('update:dialogVisible',false);
    }
    function conform(){

    }
    function formClose(){
      tablePartShow.value = true;
      getTableData()
    }
    function showSingleDetail(type,data){
      tablePartShow.value = false;
      formConfig.value.formAttrs.disabled=type === 'detail';
      forms.value = data;
    }
    onBeforeMount(()=>{
      getTableData()
    })
    return {
      formRef,
      forms,
      formConfig,
      headerConfig,
      pageIndex,pageSize,tableData,totalCount,handleSizeChange,refEl,initSearch,
      handleClose,
      conform,
      formClose,
      tablePartShow,
      showSingleDetail
    }
  }
}
</script>

<style scoped>

</style>