|
|
@@ -1,13 +1,182 @@
|
|
|
<template>
|
|
|
-
|
|
|
+ <div class="ent-info" >
|
|
|
+ <i class="ei-close" @click="handleClose"></i>
|
|
|
+ <div class="Tool-Header"><span class="title-dialog">{{warningTitle}}</span></div>
|
|
|
+ <div class="tab-content" >
|
|
|
+ <div class="tab-table table-carousel" >
|
|
|
+ <div v-if="tableData.value.length>0">
|
|
|
+ <el-table :data="tableData.value" class="table-default dw-table" stripe>
|
|
|
+ <el-table-column label="企业名称" prop="cname" min-width="130" show-overflow-tooltip />
|
|
|
+ <el-table-column label="证书编号" prop="certNumber" min-width="150" show-overflow-tooltip />
|
|
|
+ <el-table-column label="证书到期时间" min-width="100" show-overflow-tooltip>
|
|
|
+ <template #default="scope">
|
|
|
+ <span>{{ scope.row.effectiveEndDate.slice(0,10)}}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="提醒内容" prop="type" min-width="80" show-overflow-tooltip />
|
|
|
+ </el-table>
|
|
|
+ <el-pagination
|
|
|
+ class="pagi-default"
|
|
|
+ :current-page="currentPage"
|
|
|
+ :page-size="pageSize"
|
|
|
+ :total="total"
|
|
|
+ layout="prev, pager, next"
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ >
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
+ <div v-else class="no-data">
|
|
|
+ <span>无数据</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
export default {
|
|
|
- name: "UnitJYXK"
|
|
|
+ name: "UnitJYXK",
|
|
|
}
|
|
|
</script>
|
|
|
+<script setup>
|
|
|
|
|
|
-<style scoped>
|
|
|
+ import {ref, reactive, onMounted} from 'vue';
|
|
|
+ import { GetUnitWarningForYun } from '@/apis/yyjg'
|
|
|
+ import { ElTable, ElTableColumn,ElPagination } from 'element-plus'
|
|
|
+ import 'element-plus/es/components/table/style/css'
|
|
|
+ import 'element-plus/es/components/table-column/style/css'
|
|
|
+ import 'element-plus/es/components/pagination/style/css'
|
|
|
+
|
|
|
+ const tableData = reactive({value: []})
|
|
|
+
|
|
|
+ const warningType=defineProps(['unitWarningType'])
|
|
|
+
|
|
|
+ const warningTitle = ref("")
|
|
|
+
|
|
|
+ const typeForName=[
|
|
|
+ {value:"portExpire",name:"港口经营许可证即将到期预警",id:1},
|
|
|
+ {value:"dangerExpire",name:"危险货物作业附证即将到期预警",id:50}
|
|
|
+ ]
|
|
|
+ // 分页信息
|
|
|
+ const currentPage = ref(1)
|
|
|
+ const pageSize = ref(10)
|
|
|
+ const total = ref(0)
|
|
|
+
|
|
|
+ const emit = defineEmits(['closeUnitXuKe'])
|
|
|
+
|
|
|
+
|
|
|
+ function handleClose() {
|
|
|
+ emit('closeUnitXuKe')
|
|
|
+ }
|
|
|
+ // 外部调用切换数据
|
|
|
+ onMounted(() => {
|
|
|
+ console.log(warningType.type)
|
|
|
+ warningTitle.value= typeForName.filter(i=>i.value==warningType.unitWarningType.type)[0].name
|
|
|
+ getList({"certType": typeForName.filter(i=>i.value==warningType.unitWarningType.type)[0].id,"pageSize":pageSize.value,"index":currentPage.value})
|
|
|
+
|
|
|
+ })
|
|
|
+
|
|
|
+ function handleSizeChange(val) {
|
|
|
+ // debugger
|
|
|
+ pageSize.value = val
|
|
|
+ currentPage.value = 1
|
|
|
+ getList()
|
|
|
+
|
|
|
+ }
|
|
|
+ function getList(req) {
|
|
|
+ GetUnitWarningForYun(req).then(res=>{
|
|
|
+ if(res.data.Rows.length>0)
|
|
|
+ {
|
|
|
+ console.log(res.data.Rows)
|
|
|
+ tableData.value= res.data.Rows
|
|
|
+ }else {
|
|
|
+ tableData.value = []
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+</script>
|
|
|
+
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .ent-info {
|
|
|
+ box-sizing: border-box;
|
|
|
+ position: absolute;
|
|
|
+ top: 16vh;
|
|
|
+ right: 18%;
|
|
|
+ width: 849px;
|
|
|
+ height: 531px;
|
|
|
+ padding: 0 25px 15px 15px;
|
|
|
+ background: url('@/assets/imgs/page_yyjg/cbxx-bg.png') no-repeat;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ .Tool-Header{
|
|
|
+ padding-top: 20px;
|
|
|
+ height: 40px;
|
|
|
+ width: 50%;
|
|
|
+ text-align: left;
|
|
|
+ position: relative;
|
|
|
+ padding-left: 20px;
|
|
|
+ span{
|
|
|
+ font-size: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .ei-close {
|
|
|
+ position: absolute;
|
|
|
+ top: 8px;
|
|
|
+ right: 16px;
|
|
|
+ display: block;
|
|
|
+ width: 18px;
|
|
|
+ height: 18px;
|
|
|
+ background: url('@/assets/imgs/common/btn-close.png') no-repeat;
|
|
|
+ background-size: 12px 12px;
|
|
|
+ background-position: center;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+
|
|
|
+ .dialog-tab-fang{
|
|
|
+ div{
|
|
|
+ width: 30%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tab-content {
|
|
|
+ height: 370px;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.ent-info-expand {
|
|
|
+ width: 609px;
|
|
|
+ height: 553px;
|
|
|
+
|
|
|
+ }
|
|
|
+ .el-table {
|
|
|
+ border-right: none !important; /*该样式在有滚动条时去掉右边的border，达到单一border效果*/
|
|
|
+ }
|
|
|
+ .tab-table{
|
|
|
+ height: 100%;
|
|
|
+ .el-th{ text-align: center}
|
|
|
+ .dw-table{
|
|
|
+ width: 100%;
|
|
|
+ overscroll-behavior-x: none;
|
|
|
+ overscroll-behavior-y: none;
|
|
|
+ height: 350px;
|
|
|
+
|
|
|
+ .el-table__body-wrapper{
|
|
|
+ width: 95%;
|
|
|
+ } .el-scrollbar{
|
|
|
+ width: 95%;
|
|
|
+ overflow-x: hidden;
|
|
|
+ overscroll-behavior-x: none;
|
|
|
+ overscroll-behavior-y: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .pagi-default{
|
|
|
+ position: absolute;
|
|
|
+ bottom:5%;
|
|
|
+ left: 45%;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
</style>
|
zk