| | |
|---|
| | | <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-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"> |
|---|
| | | <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"> |
|---|
| | |
|---|
| | | </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'"> |
|---|
| | | <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> |
|---|
| | |
|---|
| | | <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> |
|---|
| | | </wd-card> |
|---|
| | | </view> |
|---|
| | | |
|---|
| | | <wd-fab |
|---|
| | | v-if="status === '1' && isLeader()" |
|---|
| | | :draggable="true" |
|---|
| | | type="success" |
|---|
| | | position="left-bottom" |
|---|
| | | :expandable="false" |
|---|
| | | inactiveIcon="check" |
|---|
| | | @click="handleBatchComplete" |
|---|
| | | direction="top" |
|---|
| | | /> |
|---|
| | | </z-paging> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script setup lang="ts"> |
|---|
| | | import { ref } from 'vue' |
|---|
| | | import { ref, computed } from 'vue' |
|---|
| | | import { getMaintStList } from '@/service/maint' |
|---|
| | | import dayjs from 'dayjs' |
|---|
| | | import { updateMaintSt } from '@/service/maint' |
|---|
| | | import { useUserStore } from "@/store"; |
|---|
| | | import { isLeader } from '@/utils/RoleUtils' |
|---|
| | | import { useToast } from 'wot-design-uni' |
|---|
| | | |
|---|
| | | const searchValue = ref<string>('') |
|---|
| | | /** |
|---|
| | | * 其他页面传过来的数据 |
|---|
| | | * assetNo: 资产编号 |
|---|
| | |
|---|
| | | assetNo?: string |
|---|
| | | equName?: string |
|---|
| | | status?: string |
|---|
| | | params?: NonNullable<unknown> |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 计算工单卡片的背景颜色类 |
|---|
| | | 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 '' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 页面参数，上个页面传递过来的参数 |
|---|
| | |
|---|
| | | 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>('0') |
|---|
| | | |
|---|
| | | const filterDateList = ref<Record<string, any>[]>([ |
|---|
| | | { label: '所有数据', value: '0' }, |
|---|
| | | { label: '当月数据', value: '1' }, |
|---|
| | | ]) |
|---|
| | | |
|---|
| | | const statusList = ref<Record<string, any>[]>([ |
|---|
| | | { label: '所有状态', value: '-1' }, |
|---|
| | |
|---|
| | | { 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) |
|---|
| | |
|---|
| | | 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 (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 = {} |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (equName.value === '-1') { |
|---|
| | | delete params.equName |
|---|
| | | delete queryParams.equName |
|---|
| | | } |
|---|
| | | if (status.value === '-1') { |
|---|
| | | delete params.status |
|---|
| | | delete queryParams.status |
|---|
| | | } |
|---|
| | | // 如果是从扫码页面过来，只能查询固定设备的数据 |
|---|
| | | if (option?.from === 'scan') { |
|---|
| | | params.assetNo = option.assetNo |
|---|
| | | queryParams.assetNo = option.assetNo |
|---|
| | | } |
|---|
| | | |
|---|
| | | getMaintStList(params) |
|---|
| | | queryParams.params.searchValue = searchValue.value |
|---|
| | | getMaintStList(queryParams) |
|---|
| | | .then((res: any) => { |
|---|
| | | // 请勿在网络请求回调中给dataList赋值！！只需要调用complete就可以了 |
|---|
| | | paging.value.completeByTotal(res.rows, res.total) |
|---|
| | |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | |
|---|
| | | function handleSearch () { |
|---|
| | | console.log('handleSearch') |
|---|
| | | paging.value.reload() |
|---|
| | | } |
|---|
| | | |
|---|
| | | function reloadData() { |
|---|
| | | paging.value.reload() |
|---|
| | | } |
|---|
| | | |
|---|
| | | const userStore = useUserStore() |
|---|
| | | const toast = useToast() |
|---|
| | | |
|---|
| | | async function handleBatchComplete() { |
|---|
| | | console.log('handleBatchComplete', dataList.value.length) |
|---|
| | | if (!isLeader()) { |
|---|
| | | toast.info('无权限操作') |
|---|
| | | return |
|---|
| | | } |
|---|
| | | // 如果待确认工单列表为空，则提示用户无待确认工单 |
|---|
| | | if (dataList.value.length < 1) { |
|---|
| | | toast.info('无待确认工单') |
|---|
| | | return |
|---|
| | | } |
|---|
| | | const now = new Date() |
|---|
| | | const verifyTime = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}-${String(now.getDate()).padStart(2, '0')} ${String(now.getHours()).padStart(2, '0')}:${String(now.getMinutes()).padStart(2, '0')}:${String(now.getSeconds()).padStart(2, '0')}` |
|---|
| | | |
|---|
| | | // 假设 dataList 是当前待确认的工单列表 |
|---|
| | | const promises = dataList.value.map(item => { |
|---|
| | | return updateMaintSt({ |
|---|
| | | id: item.id, |
|---|
| | | status: '2', |
|---|
| | | verifyUser: userStore?.userInfo?.userId, |
|---|
| | | verifyTime |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | |
|---|
| | | try { |
|---|
| | | await Promise.all(promises) |
|---|
| | | toast.success('一键确认完成') |
|---|
| | | reloadData() // 刷新列表 |
|---|
| | | } catch (e) { |
|---|
| | | toast.error('部分工单确认失败，请重试') |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | onLoad((options) => { |
|---|
| | | Object.assign(option, options) |
|---|
| | | uni.$on('maint-st-refresh', reloadData) |
|---|
| | |
|---|
| | | height: 40rpx; |
|---|
| | | } |
|---|
| | | .text-mini { |
|---|
| | | font-size: 22rpx; |
|---|
| | | font-size: 24rpx; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .menu-indicator { |
|---|
| | |
|---|
| | | :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> |
|---|
