<template>
  <BasicModal v-bind="$attrs" @register="registerModal" destroyOnClose :title="title" :width="1000">
    <div class= "pageTitle">
        {{  cardTitle}}
      </div>
    <a-card :bordered="false" style="max-height: 580px;width:100%">
     
      <table>
        <tr>
          <td colspan="3"  height="40" class="title">行政处罚决定书文号</td>
          <td>{{ curData.docNo }}</td>
        </tr>
        <tr>
          <td rowspan="3" width="80" class="title">被处罚<br>当事人</td>
          <td width="80" colspan="2" class="title">个人姓名</td>
          <td>{{ curData.punishedUsers }} </td>
        </tr>
        <tr>
          <td  rowspan="2"  width="60"  height="60" class="title">单位</td>
          <td width="70" class="title">名称</td>
          <td>{{ curData.punishedOrg }}</td>
        </tr>

        <tr>
          <td width="70" class="title">负责人</td>
          <td>{{ curData.punishedOrgHead }}</td>
        </tr>

        <tr height="80">
          <td colspan="3" style="max-height:200px;min-height:100px" class="title">主要违法违规事实</td>
          <td>{{ curData.violationFact }}</td>
        </tr>
      
        <tr>
          <td colspan="3"  height="80" class="title">行政处罚依据</td>
          <td>{{ curData.punishBasis }}</td>
        </tr>
        <tr>
          <td  colspan="3"  height="80" class="title">行政处罚决定</td>
          <td>{{ curData.punishDecision }}</td>
        </tr>
        <tr>
          <td  colspan="3"  height="40" class="title">作出处罚决定的机关名称</td>
          <td>{{ curData.punishCom }}</td>
        </tr>
        <tr>
          <td  colspan="3"  height="40" class="title">处罚日期</td>
          <td>{{ curData.punishDate }}</td>
        </tr>
      </table>
    </a-card>
  </BasicModal>
</template>

<script setup>

  import { Modal } from 'ant-design-vue';
  import { computed, ref, unref } from 'vue';
  import { BasicModal, useModalInner } from '/@/components/Modal';
 
  import {defHttp} from '/@/utils/http/axios';

    const listUrl = '/compliane.item/stComplianePunish/list';
    const title = ref("详细信息")
    const cardTitle = ref("")
    const rows = ref([])

    const curData = ref({});
    //表单赋值
    const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
     
     setModalProps({ showCancelBtn:false,showOkBtn:false });
     if(data.record) {
      cardTitle.value = data.record.fileName
      

      const params = {"complianeNo":data.record.complianeNo,"pageNo":1,"pageSize":10}
      defHttp.get({url: listUrl, params}).then(response => {
          if(response&&response.records){
            curData.value = response.records[0]
          }
        })
      }

    });

    
 
  
 
</script>

<style lang="less" scoped>
	/** 时间和数字输入框样式 */
  :deep(.ant-input-number){
		width: 100%
	}

	:deep(.ant-calendar-picker){
		width: 100%
	}


table {
  border-collapse: collapse;
  width:100%;
}

th, td {
  border: 1px solid black;
  padding: 8px;
}
.title {
 font-size:17px;
 font-weight: bold;
}
.pageTitle {
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  text-align:center;
  font-weight: bold;
  font-size: 20px;
  height:30px;
}


</style>





