zhangwencui
8 天以前 d8bc554368a78a0ad218b0f5903939fcc344b93a
src/pages/safeProduction/safeQualifications/index.vue
@@ -26,7 +26,8 @@
          v-if="visitList.length > 0">
      <view v-for="(item, index) in visitList"
            :key="index">
        <view class="ledger-item">
        <view class="ledger-item"
              :class="{ 'expiring-soon': isExpiringSoon(item.effectiveTime) }">
          <view class="item-header">
            <view class="item-left">
              <view class="document-icon">
@@ -68,7 +69,7 @@
                      @click="viewDetail(item)">
              查看详情
            </u-button>
            <u-button type="primary"
            <!-- <u-button type="primary"
                      size="small"
                      class="action-btn"
                      @click="editVisit(item)">
@@ -79,7 +80,7 @@
                      class="action-btn"
                      @click="deleteVisit(item)">
              删除
            </u-button>
            </u-button> -->
          </view>
        </view>
      </view>
@@ -89,12 +90,12 @@
      <text>暂无拜访记录</text>
    </view>
    <!-- 浮动新增按钮 -->
    <view class="fab-button"
    <!-- <view class="fab-button"
          @click="addVisit">
      <up-icon name="plus"
               size="24"
               color="#ffffff"></up-icon>
    </view>
    </view> -->
  </view>
</template>
@@ -105,12 +106,7 @@
  import { delCustomer } from "@/api/cooperativeOffice/clientVisit";
  import {
    qualificationsListPage,
    safeCertificationAdd,
    safeCertificationUpdate,
    safeCertificationDel,
    fileListPage,
    safeCertificationFileAdd,
    safeCertificationFileDel,
  } from "@/api/safeProduction/safeQualifications";
  import useUserStore from "@/store/modules/user";
@@ -127,6 +123,17 @@
  import dayjs from "dayjs";
  const userStore = useUserStore();
  // 检查资质是否即将到期(到期前15天)
  const isExpiringSoon = effectiveTime => {
    if (!effectiveTime) return false;
    const today = dayjs();
    const expireDate = dayjs(effectiveTime);
    const daysDiff = expireDate.diff(today, "day");
    return daysDiff >= 0 && daysDiff <= 15;
  };
  // 搜索关键词
  const customerName = ref("");
@@ -259,5 +266,20 @@
    background: #667eea; // 保持页面特有的背景色
    box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3); // 保持页面特有的阴影效果
  }
  // 即将到期的资质卡片样式
  .expiring-soon {
    border: 2rpx solid #ff4d4f;
    box-shadow: 0 2rpx 16rpx rgba(255, 77, 79, 0.2);
  }
  .expiring-soon .item-header {
    background-color: rgba(255, 77, 79, 0.05);
  }
  .expiring-soon .detail-row:last-child .detail-value {
    color: #ff4d4f;
    font-weight: 500;
  }
</style>