[新增]8.25文档第四条

proxy.config.json

@@ -1,11 +1,11 @@
 {
   "/api": {
-    "target": "https://znaq.sinochemoilmarketing.com",
+    "target": "http://121.36.37.70:8906",
     "secure": false,
     "changeOrigin": true
   },
   "/signalr": {
-    "target": "https://znaq.sinochemoilmarketing.com",
+    "target": "http://121.36.37.70:8906",
     "secure": false,
     "ws": true,
     "logLevel": "debug"

src/app/pages/plan-admin/plan-admin.component.html

@@ -15,7 +15,10 @@
         <ng-template #elseTemplate>
           <img src="../../../assets/images/point.png" alt="">
         </ng-template>
-        <span>{{ node.title }}</span>
+        <span>{{ node.title }}
+          <span *ngIf="!node.origin.isGasStation">({{node.origin.products?node.origin.products.stationsCount
+            :0}})</span>
+        </span>
         <img (click)="expand($event,node)" *ngIf="node.isExpanded && node.children.length != 0 "
           src="../../../assets/images/expand.png" alt="">
         <img (click)="expand($event,node)" *ngIf="!node.isExpanded && node.children.length != 0"

src/app/pages/plan-admin/plan-admin.component.ts

@@ -64,6 +64,7 @@ export class PlanAdminComponent implements OnInit {
   nzExpandAll = false
   nzSelectedKeys: any = []
   orSpin: boolean = false
+  organization: any
   getAllOrganization() {
     this.orSpin = true
     let OrganizationUnitId = JSON.parse(sessionStorage.getItem('userdata')).organization.id
@@ -74,25 +75,56 @@ export class PlanAdminComponent implements OnInit {
     this.http.get('/api/services/app/Organization/GetAll', {
       params: params
     }).subscribe((data: any) => {
-      data.result.items.forEach(element => {
-        if (element.id == OrganizationUnitId) {
-          element.parentId = null
-        }
-      });
       data.result.items = data.result.items.filter((item, i) => {
         return !item.isGasStation
       })
-      for (let index = 0; index < data.result.items.length; index++) {
+      this.organization = data.result.items
-        const element = data.result.items[index];
+      this.getStationsNum(data.result.items)
-        element.key = element.id
+
-        element.title = element.displayName
+      // data.result.items.forEach(element => {
+      //   if (element.id == OrganizationUnitId) {
+      //     element.parentId = null
+      //   }
+      // });
+      // for (let index = 0; index < data.result.items.length; index++) {
+      //   const element = data.result.items[index];
+      //   element.key = element.id
+      //   element.title = element.displayName
+      // }
+      // this.orSpin = false
+      // this.nodes = [...this.toTree.toTree(data.result.items)]
+      // this.nzExpandedKeys = [OrganizationUnitId]
+      // this.nzSelectedKeys = [OrganizationUnitId]
+      // sessionStorage.setItem('planAdminOrid', OrganizationUnitId)
+      // this.oilStationListComponent.onChildMethod()
+    })
+  }
+
+
+  //获得组织机构下有多少油站
+  stationsList
+  getStationsNum(e) {
+    let OrganizationUnitId = JSON.parse(sessionStorage.getItem('userdata')).organization.id
+    this.http.get('/api/services/app/GasStation/GetCountsByOrganizations?IsContainsChildren=true').subscribe((data: any) => {
+      this.stationsList = data.result
+      const arrs = e.map(item => {
+        const data = this.stationsList.find(i => item.id == i.organizationId)
+        return {
+          ...item,
+          products: data ? data : false
+        }
+      })
+      for (let index = 0; index < arrs.length; index++) {
+        if (arrs[index].id == OrganizationUnitId) {
+          arrs[index].parentId = null
+        }
+        arrs[index].title = arrs[index].displayName
+        arrs[index].key = arrs[index].id
       }
-      // console.log('组织机构', data.result.items)
       this.orSpin = false
-      this.nodes = [...this.toTree.toTree(data.result.items)]
+      this.nodes = [...this.toTree.toTree(arrs)]
       this.nzExpandedKeys = [OrganizationUnitId]
       this.nzSelectedKeys = [OrganizationUnitId]
-
       sessionStorage.setItem('planAdminOrid', OrganizationUnitId)
       this.oilStationListComponent.onChildMethod()
     })
@@ -100,6 +132,8 @@ export class PlanAdminComponent implements OnInit {
 
 
 
+
+
   nzExpandedKeys: any = []
   activatedNode?: NzTreeNode;
   //点击tree节点

src/app/pages/today-warning/get-out-of-line-details/get-out-of-line-details.component.html

@@ -49,7 +49,9 @@
         <div class="title">
             <span>处置内容</span>
             <ng-container *ngIf="!data.positive; else elseTemplate">
-                <span *ngIf="data.appealStatus == 5" style="color: #4BFFD4;">申诉成功</span>
+                <span *ngIf="data.appealStatus == 5"
+                    style="color: #4BFFD4;">申诉成功 ( 处理人 : {{data.handleUserName}}&nbsp; 处理时间 : {{data.lastModificationTime |
+                    date:"yyyy-MM-dd HH:mm:ss"}} ) </span>
                 <span style="color: #4BFFD4;cursor: default;">已进行误报处置</span>
             </ng-container>
             <ng-template #elseTemplate>

src/app/system-management/organization/organization.component.html

@@ -1,4 +1,7 @@
 <div class="orbox" id="orbox">
+  <div class="spin" *ngIf="isLoading">
+    <nz-spin nzSimple></nz-spin>
+  </div>
   <div class="topbox">
     <div class="lefttop">
       <span>组织机构列表</span>
@@ -23,9 +26,14 @@
   </nz-tree>
   <ng-template #nzTreeTemplate let-node let-origin="origin">
     <div class="nodebox">
-      <span class="name">{{ node.title }}</span>
+      <span class="name">
+        {{ node.title }}
+        <span *ngIf="!node.origin.isGasStation">({{node.origin.products? node.origin.products.stationsCount :
+          0}})</span>
+      </span>
       <span class="operation">
         <span (click)="addOr(node)" *ngIf="!node.origin.isGasStation">新增</span>
+        <span (click)="waring(node)" *ngIf="node.origin.isGasStation">配置预警事件</span>
         <span (click)="editOr(node)">编辑</span>
         <span [ngClass]="{'grey':node.origin.children && node.origin.children.length != 0}"
           (click)="deleteOr(node)">删除</span>

src/app/system-management/organization/organization.component.scss

@@ -6,6 +6,7 @@
   box-sizing: border-box;
   padding: 20px;
   font-size: 15px;
+  position: relative;
 }
 
 .topbox {

src/app/system-management/organization/organization.component.ts

@@ -3,7 +3,7 @@ import { Component, OnInit, AfterViewInit, ViewChild, ViewContainerRef } from '@
 import { TreeService } from 'src/app/service/tree.service';
 import { NzFormatEmitEvent, NzTreeComponent, NzTreeNodeOptions } from 'ng-zorro-antd/tree';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
-import { NzModalService } from 'ng-zorro-antd/modal';
+import { ModalButtonOptions, NzModalService } from 'ng-zorro-antd/modal';
 import { NzMessageService } from 'ng-zorro-antd/message';
 import { AddorComponent } from './addor/addor.component';
 import { EditorComponent } from './editor/editor.component';
@@ -11,6 +11,7 @@ import { EditorComponent } from './editor/editor.component';
 import { NzFormatBeforeDropEvent } from 'ng-zorro-antd/tree';
 import { Observable, of } from 'rxjs';
 import { delay } from 'rxjs/operators';
+import { WarningEventsComponent } from './warning-events/warning-events.component';
 @Component({
   selector: 'app-organization',
   templateUrl: './organization.component.html',
@@ -40,7 +41,10 @@ export class OrganizationComponent implements OnInit {
   totalCount: string
 
   allOrList: any
+  organization: any
+  isLoading = false
   getAllOrganization() {
+    this.isLoading = true
     let OrganizationUnitId = sessionStorage.getItem('isGasStation') == 'true' ? JSON.parse(sessionStorage.getItem('userdataOfgasstation')).organization.id : JSON.parse(sessionStorage.getItem('userdata')).organization.id
     let params = {
       OrganizationUnitId: OrganizationUnitId,
@@ -49,19 +53,37 @@ export class OrganizationComponent implements OnInit {
     this.http.get('/api/services/app/Organization/GetAll', {
       params: params
     }).subscribe((data: any) => {
+      this.organization = data.result.items
+      this.getStationsNum(data.result.items)
       this.totalCount = data.result.totalCount
-      data.result.items.forEach(element => {
+    })
-        if (element.id == OrganizationUnitId) {
+  }
-          element.parentId = null
+
+
+  //获得组织机构下有多少油站
+  stationsList
+  getStationsNum(e) {
+    let OrganizationUnitId = sessionStorage.getItem('isGasStation') == 'true' ? JSON.parse(sessionStorage.getItem('userdataOfgasstation')).organization.id : JSON.parse(sessionStorage.getItem('userdata')).organization.id
+    this.http.get('/api/services/app/GasStation/GetCountsByOrganizations?IsContainsChildren=true').subscribe((data: any) => {
+      this.stationsList = data.result
+      const arrs = e.map(item => {
+        const data = this.stationsList.find(i => item.id == i.organizationId)
+        return {
+          ...item,
+          products: data ? data : false
         }
-        element.key = element.id
+      })
-        element.title = element.displayName
+      for (let index = 0; index < arrs.length; index++) {
-        element.selectable = false
+        if (arrs[index].id == OrganizationUnitId) {
-      });
+          arrs[index].parentId = null
-      this.allOrList = data.result.items
+        }
-      this.nodes = [...this.toTree.toTree(data.result.items)]
+        arrs[index].title = arrs[index].displayName
+        arrs[index].key = arrs[index].id
+        arrs[index].selectable = false
+      }
+      this.nodes = [...this.toTree.toTree(arrs)]
       this.defaultExpandedKeys.length == 0 ? this.defaultExpandedKeys = [this.nodes[0].id] : this.defaultExpandedKeys = [...this.defaultExpandedKeys]
-      console.log(this.nodes)
+      this.isLoading = false
     })
   }
 
@@ -156,6 +178,32 @@ export class OrganizationComponent implements OnInit {
     });
     const instance = modal.getContentComponent();
   }
+
+  waring(node) {
+    const modal = this.modal.create({
+      nzTitle: '油站预警事件接收情况',
+      nzContent: WarningEventsComponent,
+      nzViewContainerRef: this.viewContainerRef,
+      nzWidth: 388,
+      nzFooter: [{
+        label: '确定', // 按钮文本
+        type: 'primary', // 类型
+        // 按钮点击回调
+        onClick(this: ModalButtonOptions, contentComponentInstance?: object): void {
+          modal.close()
+        }
+      }],
+      nzMaskClosable: false,
+      nzComponentParams: {
+        data: node.origin,
+      },
+      nzOnOk: () => {
+
+      }
+    });
+    const instance = modal.getContentComponent();
+  }
+
   deleteOr(item) {
     console.log(item)
     if (item.origin.children && item.origin.children.length != 0) {

src/app/system-management/organization/warning-events/warning-events.component.html

@@ -0,0 +1,15 @@
+<ul style="margin-bottom: 0;position: relative;">
+    <div class="spin" *ngIf="isLoading">
+        <nz-spin nzSimple class="nzspin"></nz-spin>
+    </div>
+   
+    <li *ngFor="let item of warningList;let key = index">
+        <span>
+            {{item.violation.eventSystemName}}
+        </span>
+        <span>
+            <nz-switch [name]="key" [(ngModel)]="item.enable" nzCheckedChildren="开" nzUnCheckedChildren="关"
+                (ngModelChange)="change(item)"></nz-switch>
+        </span>
+    </li>
+</ul>

src/app/system-management/organization/warning-events/warning-events.component.scss

@@ -0,0 +1,5 @@
+li{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}

src/app/system-management/organization/warning-events/warning-events.component.ts

@@ -0,0 +1,50 @@
+import { HttpClient } from '@angular/common/http';
+import { Component, Input, OnInit } from '@angular/core';
+import { NzMessageService } from 'ng-zorro-antd/message';
+
+@Component({
+  selector: 'app-warning-events',
+  templateUrl: './warning-events.component.html',
+  styleUrls: ['./warning-events.component.scss']
+})
+export class WarningEventsComponent implements OnInit {
+  @Input() data?: any;
+  constructor(private http: HttpClient, private message: NzMessageService) { }
+
+  ngOnInit(): void {
+    // console.log(this.data)
+    this.getWarningList()
+  }
+
+  warningList: any
+  getWarningList() {
+    this.http.get('/api/services/app/Violation/GetStationViolationConfig', {
+      params: {
+        organizationId: this.data.id
+      }
+    }).subscribe((data: any) => {
+
+      data.result.forEach(element => {
+        element.enable = !element.disabled
+      });
+      this.warningList = data.result
+      // console.log('预警列表', this.warningList)
+    })
+  }
+
+  isLoading = false
+  change(item) {
+    this.isLoading = true
+    // console.log(item)
+    let body = {
+      stationId: item.stationId,
+      violationId: item.violation.id,
+      disabled: !item.enable
+    }
+    this.http.post('/api/services/app/Violation/UpdateStationViolation', body).subscribe(data => {
+      this.isLoading = false
+      this.message.create('success', '修改成功');
+    })
+  }
+
+}

src/app/system-management/system-management.module.ts

@@ -45,8 +45,10 @@ import { AddmenuComponent } from './menu/addmenu/addmenu.component';
 import { EditmenuComponent } from './menu/editmenu/editmenu.component';
 import { MenusComponent } from './role/menus/menus.component';
 import { PagesModule } from '../pages/pages.module';
+import { WarningEventsComponent } from './organization/warning-events/warning-events.component';
+import { NzSwitchModule } from 'ng-zorro-antd/switch';
 @NgModule({
-  declarations: [OrganizationComponent, UserComponent, RoleComponent, NavigationComponent, AdduserComponent, EdituserComponent, AddroleComponent, EditroleComponent, AddorComponent, EditorComponent, AnalysisOfTheHostComponent, AddhostComponent, EdithostComponent, AddcameraComponent, EditcameraComponent, PushComponent, EditPushItemComponent, FileOfLicenseComponent, UpdateOfLicenseComponent, AddFileOfLicenseComponent, EditFileOfLicenseComponent, AddUpdateOfLicenseComponent, EditUpdateOfLicenseComponent, MenuComponent, AddmenuComponent, EditmenuComponent, MenusComponent],
+  declarations: [OrganizationComponent, UserComponent, RoleComponent, NavigationComponent, AdduserComponent, EdituserComponent, AddroleComponent, EditroleComponent, AddorComponent, EditorComponent, AnalysisOfTheHostComponent, AddhostComponent, EdithostComponent, AddcameraComponent, EditcameraComponent, PushComponent, EditPushItemComponent, FileOfLicenseComponent, UpdateOfLicenseComponent, AddFileOfLicenseComponent, EditFileOfLicenseComponent, AddUpdateOfLicenseComponent, EditUpdateOfLicenseComponent, MenuComponent, AddmenuComponent, EditmenuComponent, MenusComponent, WarningEventsComponent],
   imports: [
     CommonModule,
     SystemRoutingModule,
@@ -67,9 +69,10 @@ import { PagesModule } from '../pages/pages.module';
     NzSpinModule,
     NzTreeSelectModule,
     NzCheckboxModule,
-    PagesModule
+    PagesModule,
+    NzSwitchModule
   ],
-  entryComponents: [AdduserComponent, EdituserComponent, AddroleComponent, EditroleComponent, AddorComponent, EditorComponent, AddhostComponent, EdithostComponent, AddcameraComponent, EditcameraComponent, EditPushItemComponent, AddFileOfLicenseComponent, EditFileOfLicenseComponent, AddUpdateOfLicenseComponent, EditUpdateOfLicenseComponent, AddmenuComponent, EditmenuComponent, MenusComponent]
+  entryComponents: [AdduserComponent, EdituserComponent, AddroleComponent, EditroleComponent, AddorComponent, EditorComponent, AddhostComponent, EdithostComponent, AddcameraComponent, EditcameraComponent, EditPushItemComponent, AddFileOfLicenseComponent, EditFileOfLicenseComponent, AddUpdateOfLicenseComponent, EditUpdateOfLicenseComponent, AddmenuComponent, EditmenuComponent, MenusComponent,WarningEventsComponent]
 
 })
 export class SystemManagementModule { }

src/styles.scss

@@ -103,45 +103,123 @@ h1 {
 }
 
 //三维场景
-.dropDown{
+.dropDown {
   border: 1px solid #23D9FF;
   background: linear-gradient(180deg, #000D21 0%, #006E85 100%);
-  li:hover { background-color: transparent; }
+
-  li { text-align: center; }
+  li:hover {
-  .ant-checkbox-wrapper { color: #fff; }
+    background-color: transparent;
+  }
+
+  li {
+    text-align: center;
+  }
+
+  .ant-checkbox-wrapper {
+    color: #fff;
+  }
 }
-.dropDownPlan{
+
+.dropDownPlan {
   background: linear-gradient(360deg, #000D21 0%, rgba(0, 59, 110, 0.8) 100%);
   box-shadow: 0px 0px 6px #2399FF;
-  li { color: #fff; }
+
+  li {
+    color: #fff;
+  }
 }
+
 //任务弹窗
-.taskDialog{
+.taskDialog {
-  .ant-modal-header,.ant-modal-content { background: radial-gradient(circle, #004988 0%, #00122D 100%); }
+
-  .ant-modal-header,.ant-modal-footer { border: none; }
+  .ant-modal-header,
-  .ant-modal-title,.ant-form-item-label > label,.ant-input { color: #C4E2FC; }
+  .ant-modal-content {
-  .ant-modal-footer .ant-btn:first-child { color: #C4E2FC; background: #000D21; border: 1px solid #C4E2FC; }
+    background: radial-gradient(circle, #004988 0%, #00122D 100%);
-  .ant-modal-footer .ant-btn:last-child { color: #C4E2FC; background: rgba(0, 129, 255, 0.6); border: 1px solid #36A2FF; }
+  }
-  .ant-input { background: rgba(145, 204, 255, 0.41); border: 1px solid #91CCFF; }
+
-  textarea { resize: none; outline: none; }
+  .ant-modal-header,
-}
+  .ant-modal-footer {
-.baseInfoDialog{
+    border: none;
+  }
+
+  .ant-modal-title,
+  .ant-form-item-label>label,
+  .ant-input {
+    color: #C4E2FC;
+  }
+
+  .ant-modal-footer .ant-btn:first-child {
+    color: #C4E2FC;
+    background: #000D21;
+    border: 1px solid #C4E2FC;
+  }
+
+  .ant-modal-footer .ant-btn:last-child {
+    color: #C4E2FC;
+    background: rgba(0, 129, 255, 0.6);
+    border: 1px solid #36A2FF;
+  }
+
+  .ant-input {
+    background: rgba(145, 204, 255, 0.41);
+    border: 1px solid #91CCFF;
+  }
+
+  textarea {
+    resize: none;
+    outline: none;
+  }
+}
+
+.baseInfoDialog {
   height: 80%;
-  .ant-modal-footer { padding: 0; }
+
-  .ant-modal-body,.ant-modal-content { height: 100%; background: radial-gradient(closest-side at 50% 55%, #004988 0%, #00122D 100%); }
+  .ant-modal-footer {
+    padding: 0;
+  }
+
+  .ant-modal-body,
+  .ant-modal-content {
+    height: 100%;
+    background: radial-gradient(closest-side at 50% 55%, #004988 0%, #00122D 100%);
+  }
 }
-.videoDialog{
+
+.videoDialog {
   height: 80%;
-  .ant-modal-body,.ant-modal-footer { padding: 0; }
+
-  .ant-modal-body,.ant-modal-content { height: 100%; }
+  .ant-modal-body,
-  canvas{ width: 100%; height: 100%; border: none; outline: none; }
+  .ant-modal-footer {
+    padding: 0;
+  }
+
+  .ant-modal-body,
+  .ant-modal-content {
+    height: 100%;
+  }
+
+  canvas {
+    width: 100%;
+    height: 100%;
+    border: none;
+    outline: none;
+  }
+}
+
+#embed-host {
+  input {
+    color: #000;
+  }
 }
-#embed-host{ input{color: #000;} } //bbl 内置color
+
+//bbl 内置color
 #threeDimensional {
+
   //可展开面板
-  #disposalPlan{
+  #disposalPlan {
     font-size: 15px;
-    .ant-collapse-header{
+
+    .ant-collapse-header {
       width: 100%;
       height: 35px;
       line-height: 35px;
@@ -150,41 +228,101 @@ h1 {
       background: rgba(35, 153, 255, 0.41);
       border: 1px solid rgba(35, 217, 255, 0.4);
     }
-    .ant-collapse { background-color: transparent; }
+
-    .ant-collapse-content { background-color: transparent; width: 100% }
+    .ant-collapse {
+      background-color: transparent;
+    }
+
+    .ant-collapse-content {
+      background-color: transparent;
+      width: 100%
+    }
   }
 
-  .ant-tree{ color: #C4E2FC; } //tree
+  .ant-tree {
-  .ant-tree,.ant-tree-node-content-wrapper:hover,.ant-tree-node-content-wrapper.ant-tree-node-selected { background-color: transparent; } //tree
+    color: #C4E2FC;
-  .ant-tree-node-content-wrapper { width: 100%; } //tree
+  }
 
-  .ant-select-disabled.ant-select-single:not(.ant-select-customize-input) .ant-select-selector { color: #fff; } //select
+  //tree
-  .ant-select-single:not(.ant-select-customize-input) .ant-select-selector { border: none; border-radius: 0px; } //select
+  .ant-tree,
+  .ant-tree-node-content-wrapper:hover,
+  .ant-tree-node-content-wrapper.ant-tree-node-selected {
+    background-color: transparent;
+  }
+
+  //tree
+  .ant-tree-node-content-wrapper {
+    width: 100%;
+  }
 
-  .ant-collapse,.ant-collapse-item,.ant-collapse-header,.ant-collapse-content{ border-radius: 0px; border: none; } //可展开面板
+  //tree
-  .ant-collapse-content{ background: rgba(0, 59, 110, 0.9); color: #fff; } //可展开面板
+
-  .ant-collapse-content-box{ padding: 0; } //可展开面板
+  .ant-select-disabled.ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
-  .ant-collapse-header{ //可展开面板
+    color: #fff;
+  }
+
+  //select
+  .ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
+    border: none;
+    border-radius: 0px;
+  }
+
+  //select
+
+  .ant-collapse,
+  .ant-collapse-item,
+  .ant-collapse-header,
+  .ant-collapse-content {
+    border-radius: 0px;
+    border: none;
+  }
+
+  //可展开面板
+  .ant-collapse-content {
+    background: rgba(0, 59, 110, 0.9);
+    color: #fff;
+  }
+
+  //可展开面板
+  .ant-collapse-content-box {
+    padding: 0;
+  }
+
+  //可展开面板
+  .ant-collapse-header {
+    //可展开面板
     padding: 0 0 0 25px;
     height: 30px;
     line-height: 28px;
     background: linear-gradient(360deg, #000D21 0%, rgba(0, 59, 110, 0.8) 100%);
     border: 1px solid rgba(35, 217, 255, 0.4);
     color: #23D9FF;
-    .ant-collapse-arrow{ left: 5px; } //可展开面板
+
+    .ant-collapse-arrow {
+      left: 5px;
+    }
+
+    //可展开面板
   }
 
-  .ant-steps-dot .ant-steps-item-tail, .ant-steps-dot.ant-steps-small .ant-steps-item-tail{ top: 15px; } //步骤条
+  .ant-steps-dot .ant-steps-item-tail,
+  .ant-steps-dot.ant-steps-small .ant-steps-item-tail {
+    top: 15px;
+  }
+
+  //步骤条
 
   //滚动条样式	
   ::-webkit-scrollbar {
-    width: 5px;	
+    width: 5px;
   }
+
   ::-webkit-scrollbar-thumb {
-    background-image: linear-gradient(#2495f8,#1c73c2,#02233f,);	
+    background-image: linear-gradient(#2495f8, #1c73c2, #02233f, );
   }
+
   ::-webkit-scrollbar-track {
-    background-color: #0d4070;	
+    background-color: #0d4070;
   }
 }
 
@@ -242,3 +380,16 @@ ul {
   }
 
 }
+
+.spin {
+  background: rgb(134, 131, 131, 0.2);
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 999;
+  left: 0;
+  top: 0;
+}

src/theme.less

@@ -673,6 +673,8 @@
   transform: translate(-50%, -50%);
 }
 
+
+
 .ant-pagination-prev,
 .ant-pagination-next {
   overflow: hidden;
@@ -728,6 +730,7 @@
   .btn {
     position: relative;
     flex: 1;
+
     input {
       opacity: 0;
       width: 82px;