[完善]油站的经营类证照增加预警颜色区分

src/app/pages/audit/audit-record/audit-record.component.html

@@ -119,6 +119,7 @@
                         <span *ngIf="item.auditType == 2">经营类证照</span>
                         <span *ngIf="item.auditType == 3">资产类证照</span>
                         <span *ngIf="item.auditType == 4">用户信息</span>
+                        <span *ngIf="item.auditType == 5">预警申诉</span>
                     </td>
                     <td *ngIf="!level"><label *ngIf="item.gasStation">{{item.gasStation.stationName}}</label></td>
                     <td *ngIf="!level"><label *ngIf="item.gasStation">{{item.gasStation.locationName}}</label></td>

src/app/pages/license/update-category/update-category.component.html

@@ -1,4 +1,15 @@
 <div class="box" id="updateLicense">
+    <div class="legendbox">
+        <div class="legendItem">
+            <div style="background: #4BFFD4;box-shadow: 0px 2px 6px 1px #4BFFD4;"></div>办理提醒
+        </div>
+        <div class="legendItem">
+            <div style="background: #FFBD4B;box-shadow: 0px 2px 6px 1px #FFBD4B;"></div>临期提醒
+        </div>
+        <div class="legendItem">
+            <div style="background: #FF4B65;box-shadow: 0px 2px 6px 1px #FF4B65;"></div>逾期提醒
+        </div>
+    </div>
     <div class="tablebox" id="tablebox">
         <nz-table *ngIf="tableScrollHeight" [nzLoading]="tableSpin" [nzPageSize]='9999' #headerTable [nzData]="list"
             [nzShowPagination]="false" [nzScroll]="{ y:tableScrollHeight }" [nzNoResult]='null' nzTableLayout="fixed">
@@ -20,11 +31,12 @@
                 </tr>
             </thead>
             <tbody id="table">
-                <tr *ngFor="let item of headerTable.data;let key = index">
+                <tr *ngFor="let item of headerTable.data;let key = index"
-                    <td>
+                    [ngClass]="{'green': item.licenseViolationType == 1,'yellow': item.licenseViolationType == 2,'red': item.licenseViolationType == 3}">
+                    <td nzEllipsis [title]="item.licenseTypeName">
                         <span style="margin-left: 30px;">{{item.licenseTypeName || ''}}</span>
                     </td>
-                    <td>{{item.licenseCode || ''}}</td>
+                    <td nzEllipsis [title]="item.licenseCode">{{item.licenseCode || ''}}</td>
                     <td>{{item.isLongTerm ? '长期证照' : (item.validityEndTime | date:"yyyy/MM/dd")}}</td>
                     <td>
                         <ng-container *ngIf="item.isLongTerm; else elseTemplate">
@@ -33,7 +45,6 @@
                         <ng-template #elseTemplate>
                             {{item.validityDays ? item.validityDays+'天' : '/'}}
                         </ng-template>
-
                     </td>
                     <td>{{getHandleTypes(item.handleTypesDefault)}}</td>
                     <!-- <td><span *ngIf="item.isYearlyCheck">是</span><span *ngIf="!item.isYearlyCheck">否</span></td>

src/app/pages/license/update-category/update-category.component.scss

@@ -1,21 +1,66 @@
-.box{
+.box {
-    width: 100%;
+  width: 100%;
-    height: 100%;
+  height: 100%;
-    overflow: hidden;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
 }
-.tablebox{
+
-    width: 100%;
+.legendbox {
-    height: 100%;
+  display: flex;
-    .operation{
+  align-items: center;
-        span{
+  color: #FFFFFF;
-            margin-right: 6px;
+  height: 30px;
-        }
+  box-sizing: border-box;
+  padding-bottom: 19px;
+
+  .legendItem {
+    display: flex;
+    align-items: center;
+    margin-right: 12px;
+
+    div {
+      width: 8px;
+      height: 8px;
+      margin-right: 3px;
     }
-    #table{
+  }
-        img{
+}
-            width: 30px;
+
-            height: 30px;
+.tablebox {
-            cursor: pointer;
+  width: 100%;
-        }
+  flex: 1;
+
+  .operation {
+    span {
+      margin-right: 6px;
+    }
+  }
+
+  #table {
+    img {
+      width: 30px;
+      height: 30px;
+      cursor: pointer;
+    }
+
+    .green {
+      td {
+        color: #4BFFD4;
+      }
+
     }
-}
+
+    .yellow {
+      td {
+        color: #FFBD4B;
+      }
+    }
+
+    .red {
+      td {
+        color: #FF4B65;
+      }
+    }
+  }
+}