aa

src/views/pms/qhse/kanban/index.vue

@@ -12,7 +12,9 @@ import {
   Histogram,
   Odometer,
   Postcard,
-  Warning
+  Warning,
+  Search,
+  Refresh
 } from '@element-plus/icons-vue'
 import { kanbanApi, IotDangerApi, IotInstrumentApi, IotMeasureCertApi } from '@/api/pms/qhse/index'
 import { useUserStore } from '@/store/modules/user'
@@ -70,7 +72,7 @@ const pageTitle = computed(() =>
 
 const summaryCards = ref([
   {
-    title: '人工时',
+    title: '人工时(小时)',
     value: 671987,
     note: '',
     accent: '#4f8dff',
@@ -78,7 +80,7 @@ const summaryCards = ref([
     icon: Clock
   },
   {
-    title: '车辆里程',
+    title: '车辆里程(公里)',
     value: 631128.07,
     note: '',
     accent: '#4f8dff',
@@ -629,7 +631,8 @@ const certQueryParams = reactive({
   type: undefined as string | undefined,
   classify: undefined as string | undefined,
   userName: '',
-  expired: undefined as string | undefined
+  expired: undefined as string | undefined,
+  alertWarn: undefined as string | undefined
 })
 
 function formatDateCorrectly(timestamp: any) {
@@ -677,6 +680,7 @@ function resetCertificateQuery() {
   certQueryParams.classify = undefined
   certQueryParams.userName = ''
   certQueryParams.expired = undefined
+  cerQueryParams.alertWarn = undefined
   getCertificateBoardList()
 }
 
@@ -909,19 +913,6 @@ onUnmounted(() => {
         <div v-else class="certificate-board">
           <section class="panel certificate-filter-panel">
             <div class="certificate-filters">
-              <!-- <div class="certificate-filter-item">
-                <span class="certificate-filter-item__label">证书类型</span>
-                <el-select
-                  v-model="certQueryParams.type"
-                  clearable
-                  placeholder="请选择证书类型"
-                  class="certificate-filter-item__control">
-                  <el-option label="个人证书" value="personal" />
-                  <el-option label="组织证书" value="organization" />
-                  <el-option label="其他" value="other" />
-                </el-select>
-              </div> -->
-
               <div class="certificate-filter-item">
                 <span class="certificate-filter-item__label">证书类别</span>
                 <el-select
@@ -962,9 +953,26 @@ onUnmounted(() => {
                 </el-select>
               </div>
 
+              <div class="certificate-filter-item">
+                <span class="certificate-filter-item__label">是否预警</span>
+                <el-select
+                  v-model="certQueryParams.alertWarn"
+                  clearable
+                  placeholder="请选择是否过期"
+                  class="certificate-filter-item__control">
+                  <el-option
+                    v-for="dict in getBoolDictOptions(DICT_TYPE.INFRA_BOOLEAN_STRING)"
+                    :key="dict.value"
+                    :label="dict.label"
+                    :value="dict.value" />
+                </el-select>
+              </div>
+
               <div class="certificate-filter-actions">
-                <el-button type="primary" @click="handleCertificateQuery">查询</el-button>
-                <el-button @click="resetCertificateQuery">重置</el-button>
+                <el-button type="primary" :icon="Search" @click="handleCertificateQuery"
+                  >查询</el-button
+                >
+                <el-button :icon="Refresh" @click="resetCertificateQuery">重置</el-button>
               </div>
             </div>
           </section>
@@ -1134,7 +1142,7 @@ onUnmounted(() => {
 .summary-tile {
   display: flex;
   height: 136px;
-  padding: 28px 28px 24px;
+  padding: 28px 18px 24px;
   border-radius: 22px;
   align-items: center;
   gap: 22px;
@@ -1163,7 +1171,7 @@ onUnmounted(() => {
 }
 
 .summary-tile__note {
-  font-size: 15px;
+  font-size: 16px;
   font-weight: 700;
 }
 
@@ -1379,13 +1387,28 @@ onUnmounted(() => {
 
 .certificate-filter-item__control {
   flex: 1;
+  height: 42px;
 }
 
+.certificate-filter-item__control :deep(.el-select__wrapper),
 .certificate-filter-item__control :deep(.el-input__wrapper) {
-  height: 42px !important; //
+  height: 42px !important;
+  min-height: 42px !important;
   border-radius: 12px;
 }
 
+.certificate-filter-actions :deep(.el-button) {
+  height: 42px;
+  line-height: 42px;
+  padding: 0 22px;
+  border-radius: 12px;
+}
+
+.certificate-filter-item__control :deep(.el-input__inner) {
+  height: 42px;
+  line-height: 42px;
+}
+
 .certificate-filter-actions {
   display: flex;
   align-items: center;