feat(eims): 优化保养计划和点检记录功能

baoshiwei

2025-06-09 2ab727eb8a56077d9ad52112a9c8e97010b84b6d

 eims-ui-mobile/src/pages/maint/maint-st.vue

@@ -11,18 +11,19 @@
<template>
  <z-paging ref="paging" v-model="dataList" @query="queryList" show-refresher-update-time>
    <template #top>
      <wd-drop-menu>
        <wd-drop-menu-item v-model="equName" :options="equList" @change="handleEquName" />
        <wd-drop-menu-item
          v-model="filterDate"
          :options="filterDateList"
          @change="handleFilterDate"
        />
        <wd-drop-menu-item v-model="status" :options="statusList" @change="handleStatus" />
      </wd-drop-menu>
      <wd-tabs v-model="activeTab" @change="handleTabChange">
        <wd-tab title="待保养"></wd-tab>
        <wd-tab title="待确认"></wd-tab>
        <wd-tab title="已完成"></wd-tab>
      </wd-tabs>
    </template>
    <view class="bg-base">
      <wd-card type="rectangle" v-for="(item, index) in dataList" :key="item.id">
      <wd-card
        type="rectangle"
        v-for="(item, index) in dataList"
        :key="item.id"
        :class="[getCardColorClass(item.planTime)]"
      >
        <template #title>
          <view class="flex justify-between">
            <view class="flex items-center menu-title-box">
@@ -40,7 +41,7 @@
            </view>
          </view>
        </template>
        <view class="flex h-[140rpx]" items-center>
        <view class="flex" items-center>
          <image class="slot-img text-center" src="/static/images/camera.png" />
          <view class="flex-1">
            <view class="text-color-gray text-sm mt-1 flex">
@@ -52,14 +53,18 @@
              <text class="mr-3">待保养: {{ item.dbyCount }}</text>
              |
              <text class="mx-3">保养中: {{ item.byCount }}</text>
              |
              <text class="ml-3">待验证: {{ item.dyzCount }}</text>
<!--              |-->
<!--              <text class="ml-3">待验证: {{ item.dyzCount }}</text>-->
            </view>
            <view class="text-color-gray text-sm mt-2 flex">
              <text>状态：</text>
              <template v-if="item.status === '1'">
                <wd-icon class="icon-color-success" name="check-outline" size="34rpx"></wd-icon>
                <text class="ml-1">已完成</text>
              </template>
              <template v-else-if="item.status === '2'">
                <wd-icon class="icon-color-warning" name="check-outline" size="34rpx"></wd-icon>
                <text class="ml-1">已确认</text>
              </template>
              <template v-else>
                <wd-icon class="icon-color-base" name="detection" size="40rpx"></wd-icon>
@@ -76,7 +81,7 @@
</template>

<script setup lang="ts">
import { ref } from 'vue'
import { ref, computed } from 'vue'
import { getMaintStList } from '@/service/maint'
import dayjs from 'dayjs'

@@ -99,12 +104,37 @@
  params?: NonNullable<unknown>
}

// 计算工单卡片的背景颜色类
function getCardColorClass(planTime) {
  if (!planTime) return ''

  const now = dayjs()
  const planDate = dayjs(planTime)
  const diffDays = planDate.diff(now, 'day')

  if (diffDays < 0) {
    // 超过计划时间，红色背景
    return 'card-overdue'
  } else if (diffDays <= 3) {
    // 距离计划时间三天以内，黄色背景
    return 'card-urgent'
  } else {
    // 正常状态，背景颜色不变
    return ''
  }
}

// 页面参数，上个页面传递过来的参数
const option = reactive<PageParams>({
  assetNo: '',
  from: '',
})
const status = ref<string>('-1')

// 标签页相关
const activeTab = ref(0) // 默认选中第一个标签页（待保养）

// 原有状态
const status = ref<string>('0') // 默认为待保养状态
const equName = ref<string>('-1')
const filterDate = ref<string>('1')

@@ -121,6 +151,25 @@
  { label: '已完成', value: '3' },
])
const equList = ref<Record<string, any>[]>([{ label: '所有设备', value: '-1' }])

// 标签页切换处理函数
function handleTabChange({ index }) {
  // 根据标签页索引设置对应的状态值
  if (index === 0) {
    // 待保养
    status.value = '0'
  } else if (index === 1) {
    // 待确认
    status.value = '1'
  } else if (index === 2) {
    // 已完成
    status.value = '2'
  }
  // 重新加载数据
  reloadData()
}

// 原有函数
function handleStatus({ value }) {}
function handleEquName({ value }) {
  console.log(value)
@@ -185,6 +234,8 @@
function reloadData() {
  paging.value.reload()
}


onLoad((options) => {
  Object.assign(option, options)
  uni.$on('maint-st-refresh', reloadData)
@@ -223,4 +274,12 @@
:deep(.wd-card__title-content) {
  padding: 24rpx 0 !important;
}

/* 工单卡片背景颜色 */
.card-urgent {
  background-color: rgba(255, 204, 0, 0.1); /* 黄色背景 */
}
.card-overdue {
  background-color: rgba(255, 0, 0, 0.1); /* 红色背景 */
}
</style>