feat：任务/产品查看更多页面
parent
d3dfc45074
commit
b1e6d3af72
@ -0,0 +1,273 @@
|
||||
<template>
|
||||
<view class="page-container">
|
||||
<view class="task-list">
|
||||
<view v-for="(task, index) in taskList" :key="index" class="task-card" @click="handleTaskClick(task)">
|
||||
<view class="task-header">
|
||||
<text class="task-code">{{ task.code }}</text>
|
||||
<view class="task-status" :class="'status-' + task.statusType">
|
||||
<text>{{ task.statusText }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="task-body">
|
||||
<view class="task-row">
|
||||
<text class="task-label">{{ t('taskList.taskType') }}</text>
|
||||
<text class="task-value">{{ task.taskType || '-' }}</text>
|
||||
</view>
|
||||
<view class="task-row">
|
||||
<text class="task-label">{{ t('taskList.orderDate') }}</text>
|
||||
<text class="task-value">{{ task.orderDateText }}</text>
|
||||
</view>
|
||||
<view class="task-row">
|
||||
<text class="task-label">{{ t('taskList.deliveryDate') }}</text>
|
||||
<text class="task-value">{{ task.deliveryDateText }}</text>
|
||||
</view>
|
||||
<view class="task-row">
|
||||
<text class="task-label">{{ t('taskList.totalNumber') }}</text>
|
||||
<text class="task-value task-num">{{ task.totalNumber }}</text>
|
||||
</view>
|
||||
<view class="task-row">
|
||||
<text class="task-label">{{ t('taskList.planNumber') }}</text>
|
||||
<text class="task-value task-num">{{ task.planNumber }}</text>
|
||||
</view>
|
||||
<view class="task-row">
|
||||
<text class="task-label">{{ t('taskList.unPlanNumber') }}</text>
|
||||
<text class="task-value task-num">{{ task.unPlanNumber }}</text>
|
||||
</view>
|
||||
<view class="task-row">
|
||||
<text class="task-label">{{ t('taskList.storedPlanNumber') }}</text>
|
||||
<text class="task-value task-num">{{ task.storedPlanNumber }}</text>
|
||||
</view>
|
||||
<view v-if="task.isUrgent === 1" class="task-urgent">
|
||||
<text class="urgent-text">{{ t('taskList.urgent') }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="loading" class="loading-state">
|
||||
<text class="loading-text">{{ t('functionCommon.loading') }}</text>
|
||||
</view>
|
||||
<view v-else-if="taskList.length === 0" class="empty-state">
|
||||
<text class="empty-text">{{ t('taskList.noData') }}</text>
|
||||
</view>
|
||||
<view v-else-if="noMore" class="no-more-state">
|
||||
<text class="no-more-text">{{ t('functionCommon.noMoreData') }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted } from 'vue'
|
||||
import { onReachBottom, onShow } from '@dcloudio/uni-app'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import request from '@/utils/request'
|
||||
import { setNavigationTitle } from '@/locales'
|
||||
|
||||
const { t } = useI18n()
|
||||
|
||||
const taskList = reactive([])
|
||||
const pageNo = ref(1)
|
||||
const pageSize = ref(10)
|
||||
const total = ref(0)
|
||||
const loading = ref(false)
|
||||
const noMore = ref(false)
|
||||
|
||||
function formatDate(dateStr) {
|
||||
if (!dateStr) return '-'
|
||||
const date = new Date(dateStr)
|
||||
if (Number.isNaN(date.getTime())) return '-'
|
||||
const pad2 = (n) => String(n).padStart(2, '0')
|
||||
return `${date.getFullYear()}-${pad2(date.getMonth() + 1)}-${pad2(date.getDate())}`
|
||||
}
|
||||
|
||||
function mapTaskStatus(status) {
|
||||
const v = status === '' || status === null || status === undefined ? undefined : String(status)
|
||||
if (v === '1') return { statusText: t('dashboard.pending'), statusType: 'pending' }
|
||||
if (v === '2') return { statusText: t('dashboard.running'), statusType: 'running' }
|
||||
if (v === '3') return { statusText: t('dashboard.finished'), statusType: 'finished' }
|
||||
return { statusText: '-', statusType: 'pending' }
|
||||
}
|
||||
|
||||
function handleTaskClick(task) {
|
||||
uni.showToast({ title: t('taskList.viewTask', { code: task.code }), icon: 'none' })
|
||||
}
|
||||
|
||||
async function loadTaskList(reset = false) {
|
||||
if (loading.value) return
|
||||
if (reset) {
|
||||
pageNo.value = 1
|
||||
noMore.value = false
|
||||
taskList.splice(0, taskList.length)
|
||||
}
|
||||
if (noMore.value && !reset) return
|
||||
loading.value = true
|
||||
try {
|
||||
const res = await request({
|
||||
url: '/admin-api/mes/task/pagePlanTask',
|
||||
method: 'get',
|
||||
params: { pageNo: pageNo.value, pageSize: pageSize.value }
|
||||
})
|
||||
const list = res?.data?.list || []
|
||||
total.value = res?.data?.total || 0
|
||||
const mapped = list.map((item) => {
|
||||
const statusInfo = mapTaskStatus(item?.status)
|
||||
return {
|
||||
id: item?.id,
|
||||
code: item?.code ?? '-',
|
||||
taskType: item?.taskType ?? '-',
|
||||
orderDateText: formatDate(item?.orderDate),
|
||||
deliveryDateText: formatDate(item?.deliveryDate),
|
||||
isUrgent: item?.isUrgent,
|
||||
isScheduled: item?.isScheduled,
|
||||
status: item?.status,
|
||||
statusText: statusInfo.statusText,
|
||||
statusType: statusInfo.statusType,
|
||||
totalNumber: item?.totalNumber ?? 0,
|
||||
planNumber: item?.planNumber ?? 0,
|
||||
unPlanNumber: item?.unPlanNumber ?? 0,
|
||||
storedPlanNumber: item?.storedPlanNumber ?? 0,
|
||||
remark: item?.remark ?? ''
|
||||
}
|
||||
})
|
||||
taskList.splice(taskList.length, 0, ...mapped)
|
||||
if (taskList.length >= total.value) {
|
||||
noMore.value = true
|
||||
} else {
|
||||
pageNo.value++
|
||||
}
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
loadTaskList(true)
|
||||
})
|
||||
|
||||
onReachBottom(() => {
|
||||
loadTaskList()
|
||||
})
|
||||
|
||||
onShow(() => {
|
||||
setNavigationTitle('dashboard.productionPlan')
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page-container {
|
||||
min-height: 100vh;
|
||||
background-color: #f0f2f5;
|
||||
padding: 24rpx;
|
||||
}
|
||||
|
||||
.task-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.task-card {
|
||||
background: #ffffff;
|
||||
border-radius: 16rpx;
|
||||
padding: 24rpx;
|
||||
margin-bottom: 20rpx;
|
||||
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.05);
|
||||
|
||||
&:active {
|
||||
background: #e8f4ff;
|
||||
}
|
||||
}
|
||||
|
||||
.task-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.task-code {
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
color: #1a3a5c;
|
||||
}
|
||||
|
||||
.task-status {
|
||||
padding: 8rpx 20rpx;
|
||||
border-radius: 20rpx;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
.status-pending {
|
||||
background: rgba(255, 140, 0, 0.15);
|
||||
color: #ff8c00;
|
||||
}
|
||||
|
||||
.status-running {
|
||||
background: rgba(24, 188, 55, 0.15);
|
||||
color: #18bc37;
|
||||
}
|
||||
|
||||
.status-finished {
|
||||
background: rgba(74, 144, 194, 0.15);
|
||||
color: #4a90c2;
|
||||
}
|
||||
|
||||
.task-body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.task-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 12rpx;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.task-label {
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.task-value {
|
||||
font-size: 26rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.task-num {
|
||||
font-weight: 600;
|
||||
color: #1a3a5c;
|
||||
}
|
||||
|
||||
.task-urgent {
|
||||
margin-top: 12rpx;
|
||||
padding: 8rpx 16rpx;
|
||||
background: rgba(255, 59, 48, 0.1);
|
||||
border-radius: 8rpx;
|
||||
align-self: flex-start;
|
||||
}
|
||||
|
||||
.urgent-text {
|
||||
font-size: 22rpx;
|
||||
color: #ff3b30;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.loading-state,
|
||||
.empty-state,
|
||||
.no-more-state {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 200rpx;
|
||||
}
|
||||
|
||||
.loading-text,
|
||||
.empty-text,
|
||||
.no-more-text {
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue