<template>
  <browser :component-loading="componentLoading"
           class="enterpriseInfo"
           style="height: 600px;"
           :api-config="apiConfig"
           :table-config="tableConfig"
           :permissions="permissions"
           :dialog-config="dialogConfig"
           :actions="actions"
           :customQuery="true"
           @custom-query="customQuery"
           @update:actions="actions = $event"
           @update:dialog-config="dialogConfig = $event">
    <el-table-column header-align="center" align="center" prop="checkDate" label="检查日期" min-width="120"/>
    <el-table-column header-align="center" align="center" prop="fillingDate" label="立案日期" min-width="120"/>
    <el-table-column header-align="center" align="left" prop="" label="查出隐患" min-width="120">
      <el-table-column header-align="center" align="center" prop="zdyhs" label="重大事故隐患(项)" min-width="120"/>
      <el-table-column header-align="center" align="center" prop="ybyhs" label="一般事故隐患(项)" min-width="120"/>
      <el-table-column header-align="center" align="center" prop="yhzs" label="合计(项)" min-width="120"/>
    </el-table-column>
    <el-table-column header-align="center" align="left" prop="" label="执法文书使用情况" min-width="120">
      <el-table-column header-align="center" align="center" prop="xcclcss" label="下达现场处理措施(份)" min-width="120"/>
      <el-table-column header-align="center" align="center" prop="zlxqzgs" label="下达责令限期整改指令(份)" min-width="120"/>
      <el-table-column header-align="center" align="center" prop="zgfcyjs" label="下达整改复查意见书(份)" min-width="120"/>
      <el-table-column header-align="center" align="center" prop="xzcfjdss" label="下达行政处罚决定书(份)" min-width="120"/>
      <el-table-column header-align="center" align="center" prop="qtwss" label="下达其他文书(份)" min-width="120"/>
      <el-table-column header-align="center" align="center" prop="wszs" label="合计(份)" min-width="120"/>
    </el-table-column>
  </browser>
</template>

<script setup>
import {reactive, toRefs, watch, computed, ref} from 'vue'
import {useUserStore} from '@/stores/modules/user'
import statisticsApi from '@/api/lawenforcement/Statistics.js'
import Browser from '@/components/Browser.vue'

const userStore = useUserStore()

const props = defineProps({
  dialogData: {type: Object, default: () => ({})},
})

const state = reactive({
  componentLoading: false,
  permissions: {
    query: false,
    add: false,
    modify: false,
    detail: true,
    delete: false,
    importFile: false,
    exportFile: false,
    exportSelectFile: false,
    downloadTemp: false
  },
  tableConfig: {
    usePage: false,
    hasSummary: true,
    hasControlColumn: false,
    controlWidth: '100',
    multipleSelect: false,
    defaultSort: {
      prop: 'checkDate',
      order: 'descending'
    }
  },
  apiConfig: {
    api: statisticsApi,
    modelId: ''
  },
  dialogConfig: {
    show: false,
    mode: 'detail',
    loading: false,
    baseTitle: '隐患数文书数情况',
    formLabelWidth: '90px',
    dialogWidth: '900',
    showFooter: false
  },
  actions: {
  },
  queryParams: {},
})

const {
  componentLoading,
  permissions,
  tableConfig,
  apiConfig,
  dialogConfig,
  actions,
  queryParams
} = toRefs(state)

function customQuery(params) {
  tableConfig.value.tableLoading = true
  let query = Object.assign({}, params, props.dialogData)
  apiConfig.value.api.getjbbwsyhDetail(query).then(res => {
    tableConfig.value.tableLoading = false
    if (res.success) tableConfig.value.tableData = res
  }).catch(() => {
    tableConfig.value.tableLoading = false
  })
}



</script>

<style lang="scss">

.enterpriseInfo .el-dialog {
  margin-bottom: 0;
}

.enterprise-dialog {
  margin-bottom: 0 !important;
}

</style>
