From adb016e4492d927ed3eb9fc098294ffc81c06ae3 Mon Sep 17 00:00:00 2001
From: zhou zhou <3272660260@qq.com>
Date: 星期一, 13 四月 2026 14:20:06 +0800
Subject: [PATCH] #页面优化
---
rsf-design/src/views/manager/task/modules/task-detail-drawer.vue | 180 +++++++++++++++++++++++++++++++++++++++++++++++++-----------
1 files changed, 147 insertions(+), 33 deletions(-)
diff --git a/rsf-design/src/views/manager/task/modules/task-detail-drawer.vue b/rsf-design/src/views/manager/task/modules/task-detail-drawer.vue
index 7a65cb6..d67ff02 100644
--- a/rsf-design/src/views/manager/task/modules/task-detail-drawer.vue
+++ b/rsf-design/src/views/manager/task/modules/task-detail-drawer.vue
@@ -1,47 +1,139 @@
<template>
<ElDrawer
:model-value="visible"
- title="浠诲姟璇︽儏"
+ :title="t('pages.task.detail.title')"
size="85%"
@update:model-value="handleVisibleChange"
>
- <div class="flex h-full flex-col gap-4">
- <ElDescriptions :column="4" border>
- <ElDescriptionsItem label="浠诲姟鍙�">{{ detail.taskCode || '--' }}</ElDescriptionsItem>
- <ElDescriptionsItem label="浠诲姟鐘舵��">{{ detail.taskStatusLabel || '--' }}</ElDescriptionsItem>
- <ElDescriptionsItem label="浠诲姟绫诲瀷">{{ detail.taskTypeLabel || '--' }}</ElDescriptionsItem>
- <ElDescriptionsItem label="璁惧绫诲瀷">{{ detail.warehTypeLabel || '--' }}</ElDescriptionsItem>
- <ElDescriptionsItem label="婧愬簱浣�">{{ detail.orgLoc || '--' }}</ElDescriptionsItem>
- <ElDescriptionsItem label="婧愮珯鐐�">{{ detail.orgSiteLabel || '--' }}</ElDescriptionsItem>
- <ElDescriptionsItem label="鐩爣搴撲綅">{{ detail.targLoc || '--' }}</ElDescriptionsItem>
- <ElDescriptionsItem label="鐩爣绔欑偣">{{ detail.targSiteLabel || '--' }}</ElDescriptionsItem>
- <ElDescriptionsItem label="鎵樼洏鐮�">{{ detail.barcode || '--' }}</ElDescriptionsItem>
- <ElDescriptionsItem label="鏈哄櫒浜虹紪鐮�">{{ detail.robotCode || '--' }}</ElDescriptionsItem>
- <ElDescriptionsItem label="浼樺厛绾�">{{ detail.sort ?? '--' }}</ElDescriptionsItem>
- <ElDescriptionsItem label="鐘舵��">{{ detail.statusText || '--' }}</ElDescriptionsItem>
- <ElDescriptionsItem label="鏇存柊鏃堕棿">{{ detail.updateTimeText || '--' }}</ElDescriptionsItem>
- <ElDescriptionsItem label="鍒涘缓鏃堕棿">{{ detail.createTimeText || '--' }}</ElDescriptionsItem>
- <ElDescriptionsItem label="澶囨敞" :span="2">{{ detail.memo || '--' }}</ElDescriptionsItem>
- </ElDescriptions>
+ <ElScrollbar class="h-full">
+ <div class="flex min-h-full min-w-0 flex-col gap-4 pr-2">
+ <div class="grid shrink-0 gap-4 xl:grid-cols-[1.45fr_1fr]">
+ <ElCard
+ shadow="never"
+ class="task-detail-card border border-[var(--el-border-color-lighter)]"
+ >
+ <template #header>
+ <div class="flex items-center justify-between">
+ <span class="font-medium text-[var(--art-text-gray-900)]">{{
+ t('pages.task.detail.baseInfo')
+ }}</span>
+ <ElTag size="small" effect="plain" type="primary">
+ {{ detail.taskCode || '--' }}
+ </ElTag>
+ </div>
+ </template>
- <div class="flex items-center justify-between">
- <div class="text-sm text-[var(--art-gray-600)]">浠诲姟鏄庣粏</div>
- <ElButton :loading="loading" @click="$emit('refresh')">鍒锋柊</ElButton>
+ <ElDescriptions :column="2" border size="small" class="compact-descriptions">
+ <ElDescriptionsItem :label="t('pages.task.detail.taskId')">{{
+ detail.taskId ?? '--'
+ }}</ElDescriptionsItem>
+ <ElDescriptionsItem :label="t('pages.task.detail.taskStatus')">{{
+ detail.taskStatusLabel || '--'
+ }}</ElDescriptionsItem>
+ <ElDescriptionsItem :label="t('pages.task.detail.taskType')">{{
+ detail.taskTypeLabel || '--'
+ }}</ElDescriptionsItem>
+ <ElDescriptionsItem :label="t('pages.task.detail.warehType')">{{
+ detail.warehTypeLabel || '--'
+ }}</ElDescriptionsItem>
+ <ElDescriptionsItem :label="t('pages.task.detail.priority')">{{
+ detail.sort ?? '--'
+ }}</ElDescriptionsItem>
+ <ElDescriptionsItem :label="t('pages.task.detail.status')">{{
+ detail.statusText || '--'
+ }}</ElDescriptionsItem>
+ <ElDescriptionsItem :label="t('pages.task.detail.robotCode')">{{
+ detail.robotCode || '--'
+ }}</ElDescriptionsItem>
+ <ElDescriptionsItem :label="t('pages.task.detail.createBy')">{{
+ detail.createByText || '--'
+ }}</ElDescriptionsItem>
+ <ElDescriptionsItem :label="t('pages.task.detail.createTime')">{{
+ detail.createTimeText || '--'
+ }}</ElDescriptionsItem>
+ <ElDescriptionsItem :label="t('pages.task.detail.updateBy')">{{
+ detail.updateByText || '--'
+ }}</ElDescriptionsItem>
+ <ElDescriptionsItem :label="t('pages.task.detail.updateTime')">{{
+ detail.updateTimeText || '--'
+ }}</ElDescriptionsItem>
+ <ElDescriptionsItem :label="t('pages.task.detail.memo')" :span="2">{{
+ detail.memo || '--'
+ }}</ElDescriptionsItem>
+ </ElDescriptions>
+ </ElCard>
+
+ <ElCard
+ shadow="never"
+ class="task-detail-card border border-[var(--el-border-color-lighter)]"
+ >
+ <template #header>
+ <div class="flex items-center justify-between">
+ <span class="font-medium text-[var(--art-text-gray-900)]">{{
+ t('pages.task.detail.pathInfo')
+ }}</span>
+ <ElButton text type="primary" @click="$emit('flow-step')">{{
+ t('pages.task.detail.flowStep')
+ }}</ElButton>
+ </div>
+ </template>
+
+ <ElDescriptions :column="1" border size="small" class="compact-descriptions">
+ <ElDescriptionsItem :label="t('pages.task.detail.orgLoc')">{{
+ detail.orgLoc || '--'
+ }}</ElDescriptionsItem>
+ <ElDescriptionsItem :label="t('pages.task.detail.orgSite')">{{
+ detail.orgSiteLabel || '--'
+ }}</ElDescriptionsItem>
+ <ElDescriptionsItem :label="t('pages.task.detail.targLoc')">{{
+ detail.targLoc || '--'
+ }}</ElDescriptionsItem>
+ <ElDescriptionsItem :label="t('pages.task.detail.targSite')">{{
+ detail.targSiteLabel || '--'
+ }}</ElDescriptionsItem>
+ <ElDescriptionsItem :label="t('pages.task.detail.barcode')">{{
+ detail.barcode || '--'
+ }}</ElDescriptionsItem>
+ </ElDescriptions>
+ </ElCard>
+ </div>
+
+ <div class="shrink-0 flex items-center justify-between">
+ <div>
+ <div class="text-sm font-medium text-[var(--art-text-gray-900)]">{{
+ t('pages.task.detail.items')
+ }}</div>
+ <div class="mt-1 text-xs text-[var(--art-text-gray-500)]">
+ {{ t('pages.task.detail.itemsHint') }}
+ </div>
+ </div>
+ <div class="flex items-center gap-2">
+ <ElButton :loading="loading" @click="$emit('refresh')">{{
+ t('common.actions.refresh')
+ }}</ElButton>
+ </div>
+ </div>
+
+ <div class="min-w-0">
+ <ArtTable
+ :loading="loading"
+ :data="data"
+ :columns="columns"
+ :pagination="pagination"
+ @pagination:size-change="$emit('size-change', $event)"
+ @pagination:current-change="$emit('current-change', $event)"
+ />
+ </div>
</div>
-
- <ArtTable
- :loading="loading"
- :data="data"
- :columns="columns"
- :pagination="pagination"
- @pagination:size-change="$emit('size-change', $event)"
- @pagination:current-change="$emit('current-change', $event)"
- />
- </div>
+ </ElScrollbar>
</ElDrawer>
</template>
<script setup>
+ import { useI18n } from 'vue-i18n'
+
+ const { t } = useI18n()
+
defineProps({
visible: { type: Boolean, default: false },
loading: { type: Boolean, default: false },
@@ -51,9 +143,31 @@
pagination: { type: Object, default: () => ({ current: 1, size: 20, total: 0 }) }
})
- const emit = defineEmits(['update:visible', 'refresh', 'size-change', 'current-change'])
+ const emit = defineEmits([
+ 'update:visible',
+ 'refresh',
+ 'size-change',
+ 'current-change',
+ 'flow-step'
+ ])
function handleVisibleChange(visible) {
emit('update:visible', visible)
}
</script>
+
+<style scoped>
+ :deep(.task-detail-card .el-card__header) {
+ padding: 12px 16px;
+ }
+
+ :deep(.task-detail-card .el-card__body) {
+ padding: 12px 16px 16px;
+ }
+
+ :deep(.compact-descriptions .el-descriptions__label.el-descriptions__cell),
+ :deep(.compact-descriptions .el-descriptions__content.el-descriptions__cell) {
+ padding-top: 10px;
+ padding-bottom: 10px;
+ }
+</style>
--
Gitblit v1.9.1