eims-master.git

			@@ -11,15 +11,25 @@
			<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="status" :options="statusList" @change="handleStatus" />
			</wd-drop-menu>
			<wd-divider></wd-divider>
			<!-- 增加一个搜索栏 -->
			<wd-search v-model="searchValue" @search="handleSearch">
			<template #right-icon>
			<wd-icon name="scan" size="34rpx"></wd-icon>
			</template>
			</wd-search>
			<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">
			<view class="w-full h-[24rpx]"></view>
			<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">
			@@ -37,24 +47,30 @@
			</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-xs mt-1 flex">
			<text class="mr-3">工单总数: {{ item.orderCount }}</text>
			<view class="text-color-gray text-sm mt-1 flex">
			<text class="mr-3">总数: {{ item.orderCount }}</text>
			\|
			<text class="mx-3">已完成: {{ item.wcCount }}</text>
			<text class="mx-3">已完成: {{ item.dyzCount }}</text>
			\|
			<text class="mx-3">待保养: {{ item.dbyCount }}</text>
			</view>
			<view class="text-color-gray text-xs mt-2 flex">
			<text class="mr-3">待保养: {{ item.dbyCount }}</text>
			\|
			<text class="mx-3">保养中: {{ item.byCount }}</text>
			\|
			<text class="ml-3">待验证: {{ item.dyzCount }}</text>
			</view>
			<view class="text-color-gray text-xs mt-2 flex">
			<!-- <view class="text-color-gray text-sm mt-2 flex">-->
			<!-- <text class="mr-3">待保养: {{ item.dbyCount }}</text>-->
			<!-- \|-->
			<!--<!– <text class="mx-3">保养中: {{ item.byCount }}</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'">
			<template v-if="item.status === '1'">
			<wd-icon class="icon-color-warning" 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-success" name="check-outline" size="34rpx"></wd-icon>
			<text class="ml-1">已完成</text>
			</template>
			@@ -63,9 +79,7 @@
			<text class="ml-1">进行中</text>
			</template>
			</view>
			<view class="text-color-gray text-xs mt-2 flex">
			创建时间: {{item.createTime}}
			</view>
			<view class="text-color-gray text-sm mt-2 flex">创建时间: {{ item.createTime }}</view>
			</view>
			<wd-button size="small" icon="edit-outline" @click.stop="itemClick(item)">明细</wd-button>
			</view>
			@@ -75,18 +89,75 @@
			</template>

			<script setup lang="ts">
			import { ref } from 'vue'
			import { ref, computed } from 'vue'
			import { getMaintStList } from '@/service/maint'
			import dayjs from 'dayjs'
			const searchValue = ref<string>('')
			/**
			* 其他页面传过来的数据
			* assetNo: 资产编号
			* from: 是否是扫码进来的，如果是扫码进来，只能查询固定设备的数据
			*/
			interface PageParams {
			assetNo?: string
			from?: string
			}

			interface QueryParams {
			pageNum: number
			pageSize: number
			assetNo?: string
			equName?: string
			status?: string
			params?: NonNullable<unknown>
			}

			const status = ref<string>('-1')
			// 计算工单卡片的背景颜色类
			function getCardColorClass(planTime) {
			if (!planTime) return ''

			const now = dayjs()
			const planDate = dayjs(planTime)

			// 获取计划日期所在月份的最后一天
			const planMonthEnd = planDate.endOf('month')

			// 计算当前日期与计划月月底的差值（天数）
			const diffDays = planMonthEnd.diff(now, 'day')

			if (diffDays < 0) {
			// 已经过了计划月的月底，红色背景
			return 'card-overdue'
			} else if (diffDays <= 3) {
			// 距离计划月月底3天以内，红色背景
			return 'card-overdue'
			} else if (diffDays <= 10) {
			// 距离计划月月底10天以内，黄色背景
			return 'card-urgent'
			} else {
			// 正常状态，背景颜色不变
			return ''
			}
			}

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

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

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

			const filterDateList = ref<Record<string, any>[]>([
			{ label: '所有数据', value: '0' },
			{ label: '当月数据', value: '1' },
			])

			const statusList = ref<Record<string, any>[]>([
			{ label: '所有状态', value: '-1' },
			@@ -96,9 +167,31 @@
			{ 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)
			}
			function handleFilterDate({ value }) {
			reloadData()
			}

			const paging = ref(null)
			@@ -107,23 +200,39 @@
			const queryList = (pageNum?: number, pageSize?: number) => {
			// 这里的pageNo和pageSize会自动计算好，直接传给服务器即可
			// 这里的请求只是演示，请替换成自己的项目的网络请求，并在网络请求回调中通过paging.value.complete(请求回来的数组)将请求结果传给z-paging
			const params: QueryParams = {
			const queryParams: QueryParams = {
			pageNum,
			pageSize,
			equName: equName.value,
			status: status.value,
			params: {},
			}
			if (equName.value === '-1') {
			delete params.equName
			}
			if (status.value === '-1') {
			delete params.status
			if (filterDate.value === '1') {
			// 获取当前日期
			const now = dayjs()
			queryParams.params = {
			beginPlanTime: now.startOf('month').format('YYYY-MM-DD 00:00:00'),
			endPlanTime: now.endOf('month').format('YYYY-MM-DD 23:59:59'),
			}
			} else {
			queryParams.params = {}
			}

			getMaintStList(params)
			if (equName.value === '-1') {
			delete queryParams.equName
			}
			if (status.value === '-1') {
			delete queryParams.status
			}
			// 如果是从扫码页面过来，只能查询固定设备的数据
			if (option?.from === 'scan') {
			queryParams.assetNo = option.assetNo
			}
			queryParams.params.searchValue = searchValue.value
			getMaintStList(queryParams)
			.then((res: any) => {
			// 请勿在网络请求回调中给dataList赋值！！只需要调用complete就可以了
			paging.value.complete(res.rows)
			paging.value.completeByTotal(res.rows, res.total)
			})
			.catch((res) => {
			// 如果请求失败写paging.value.complete(false)，会自动展示错误页面
			@@ -139,11 +248,18 @@
			})
			}

			function handleSearch () {
			console.log('handleSearch')
			paging.value.reload()
			}

			function reloadData() {
			paging.value.reload()
			}
			onLoad(() => {
			queryList()


			onLoad((options) => {
			Object.assign(option, options)
			uni.$on('maint-st-refresh', reloadData)
			})
			onUnload(() => {
			@@ -165,7 +281,7 @@
			height: 40rpx;
			}
			.text-mini {
			font-size: 22rpx;
			font-size: 24rpx;
			}

			.menu-indicator {
			@@ -180,4 +296,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>