feat(workbench): separate stale progress items
This commit is contained in:
@@ -553,6 +553,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.progress-row {
|
.progress-row {
|
||||||
|
position: relative;
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: minmax(78px, 0.44fr) minmax(138px, 0.86fr) minmax(300px, 1.46fr) minmax(92px, auto);
|
grid-template-columns: minmax(78px, 0.44fr) minmax(138px, 0.86fr) minmax(300px, 1.46fr) minmax(92px, auto);
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@@ -563,6 +564,41 @@
|
|||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.progress-row.has-long-duration-divider {
|
||||||
|
margin-top: 13px;
|
||||||
|
padding-top: 13px;
|
||||||
|
border-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.progress-row.has-long-duration-divider::before {
|
||||||
|
content: "10日以上";
|
||||||
|
position: absolute;
|
||||||
|
top: -9px;
|
||||||
|
left: 0;
|
||||||
|
z-index: 1;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
height: 18px;
|
||||||
|
padding-right: 8px;
|
||||||
|
background: var(--workbench-surface);
|
||||||
|
color: var(--workbench-muted);
|
||||||
|
font-size: 11px;
|
||||||
|
font-weight: 850;
|
||||||
|
line-height: 1;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.progress-row.has-long-duration-divider::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
height: 1px;
|
||||||
|
background: var(--workbench-line-soft);
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
.progress-time,
|
.progress-time,
|
||||||
.progress-identity,
|
.progress-identity,
|
||||||
.progress-result {
|
.progress-result {
|
||||||
|
|||||||
@@ -203,6 +203,7 @@
|
|||||||
:key="item.id"
|
:key="item.id"
|
||||||
type="button"
|
type="button"
|
||||||
class="progress-row"
|
class="progress-row"
|
||||||
|
:class="{ 'has-long-duration-divider': item.hasLongDurationDivider }"
|
||||||
@click="openWorkbenchTarget(item)"
|
@click="openWorkbenchTarget(item)"
|
||||||
>
|
>
|
||||||
<span class="progress-time">
|
<span class="progress-time">
|
||||||
@@ -464,12 +465,21 @@ const visibleProgressItems = computed(() => {
|
|||||||
const rows = Array.isArray(props.workbenchSummary.progressItems)
|
const rows = Array.isArray(props.workbenchSummary.progressItems)
|
||||||
? props.workbenchSummary.progressItems
|
? props.workbenchSummary.progressItems
|
||||||
: []
|
: []
|
||||||
return rows.slice(0, 5).map((item) => ({
|
const progressRows = rows.slice(0, 5).map((item) => ({
|
||||||
...item,
|
...item,
|
||||||
displayTime: formatProgressTime(item?.updatedAt)
|
displayTime: formatProgressTime(item?.updatedAt),
|
||||||
|
isLongDuration: isLongDurationProgress(item?.updatedAt)
|
||||||
|
}))
|
||||||
|
|
||||||
|
return progressRows.map((item, index) => ({
|
||||||
|
...item,
|
||||||
|
hasLongDurationDivider: item.isLongDuration && !progressRows[index - 1]?.isLongDuration
|
||||||
}))
|
}))
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const LONG_DURATION_DAYS = 10
|
||||||
|
const DAY_MS = 24 * 60 * 60 * 1000
|
||||||
|
|
||||||
function formatProgressTime(value) {
|
function formatProgressTime(value) {
|
||||||
const text = String(value || '').trim()
|
const text = String(value || '').trim()
|
||||||
if (!text) {
|
if (!text) {
|
||||||
@@ -484,6 +494,34 @@ function formatProgressTime(value) {
|
|||||||
return text
|
return text
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function parseProgressDate(value) {
|
||||||
|
const text = String(value || '').trim()
|
||||||
|
if (!text) {
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
|
||||||
|
const localDateMatch = /^(\d{4})-(\d{2})-(\d{2})$/.exec(text)
|
||||||
|
if (localDateMatch) {
|
||||||
|
return new Date(
|
||||||
|
Number(localDateMatch[1]),
|
||||||
|
Number(localDateMatch[2]) - 1,
|
||||||
|
Number(localDateMatch[3])
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
const date = new Date(text)
|
||||||
|
return Number.isNaN(date.getTime()) ? null : date
|
||||||
|
}
|
||||||
|
|
||||||
|
function isLongDurationProgress(value) {
|
||||||
|
const date = parseProgressDate(value)
|
||||||
|
if (!date) {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
return (Date.now() - date.getTime()) / DAY_MS >= LONG_DURATION_DAYS
|
||||||
|
}
|
||||||
|
|
||||||
function buildSelectedFileKey(file) {
|
function buildSelectedFileKey(file) {
|
||||||
return [file?.name, file?.size, file?.lastModified, file?.type].join('__')
|
return [file?.name, file?.size, file?.lastModified, file?.type].join('__')
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -145,10 +145,15 @@ test('workbench submit shows intent recognition feedback before assistant opens'
|
|||||||
|
|
||||||
test('workbench progress rows show update time first', () => {
|
test('workbench progress rows show update time first', () => {
|
||||||
assert.match(workbench, /class="progress-time"/)
|
assert.match(workbench, /class="progress-time"/)
|
||||||
|
assert.match(workbench, /has-long-duration-divider/)
|
||||||
|
assert.match(workbench, /hasLongDurationDivider/)
|
||||||
|
assert.match(workbench, /const LONG_DURATION_DAYS = 10/)
|
||||||
|
assert.match(workbench, /isLongDurationProgress\(item\?\.updatedAt\)/)
|
||||||
assert.match(workbench, /<time :datetime="item\.updatedAt \|\| ''">\{\{ item\.displayTime \}\}<\/time>/)
|
assert.match(workbench, /<time :datetime="item\.updatedAt \|\| ''">\{\{ item\.displayTime \}\}<\/time>/)
|
||||||
assert.match(workbench, /displayTime: formatProgressTime\(item\?\.updatedAt\)/)
|
assert.match(workbench, /displayTime: formatProgressTime\(item\?\.updatedAt\)/)
|
||||||
assert.match(workbench, /function formatProgressTime\(value\)/)
|
assert.match(workbench, /function formatProgressTime\(value\)/)
|
||||||
assert.match(workbenchStyles, /\.progress-row\s*\{[\s\S]*grid-template-columns:\s*minmax\(78px,\s*0\.44fr\)/)
|
assert.match(workbenchStyles, /\.progress-row\s*\{[\s\S]*grid-template-columns:\s*minmax\(78px,\s*0\.44fr\)/)
|
||||||
|
assert.match(workbenchStyles, /\.progress-row\.has-long-duration-divider::before\s*\{[\s\S]*content:\s*"10日以上"/)
|
||||||
assert.match(workbenchStyles, /\.progress-time\s*\{[\s\S]*color:\s*var\(--workbench-muted\);/)
|
assert.match(workbenchStyles, /\.progress-time\s*\{[\s\S]*color:\s*var\(--workbench-muted\);/)
|
||||||
assert.match(workbenchResponsiveStyles, /grid-template-areas:[\s\S]*"time identity result"[\s\S]*"steps steps steps"/)
|
assert.match(workbenchResponsiveStyles, /grid-template-areas:[\s\S]*"time identity result"[\s\S]*"steps steps steps"/)
|
||||||
})
|
})
|
||||||
|
|||||||
Reference in New Issue
Block a user