|
|
@@ -551,31 +551,30 @@ const tolist = (id: number, non: boolean = false) => {
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
|
- <div class="grid grid-rows-[128px_1fr] gap-4 h-full min-h-0">
|
|
|
- <div class="grid grid-cols-8 gap-8">
|
|
|
+ <div class="grid grid-rows-[96px_1fr] gap-2 h-full min-h-0">
|
|
|
+ <div class="grid grid-cols-8 gap-4">
|
|
|
<div
|
|
|
v-for="info in totalWorkKeys"
|
|
|
:key="info[0]"
|
|
|
- class="bg-white dark:bg-[#1d1e1f] rounded-lg shadow p-4 flex flex-col items-center justify-center gap-2"
|
|
|
- >
|
|
|
- <div class="size-7.5" :class="info[3]"></div>
|
|
|
+ class="bg-white dark:bg-[#1d1e1f] rounded-lg shadow px-1 py-2 flex flex-col items-center justify-center gap-0.5 min-w-0">
|
|
|
+ <div class="size-6.5" :class="info[3]"></div>
|
|
|
<count-to
|
|
|
- class="text-2xl font-medium"
|
|
|
+ class="text-xl font-medium leading-6"
|
|
|
:start-val="0"
|
|
|
:end-val="totalWork[info[0]]"
|
|
|
:decimals="info[4]"
|
|
|
- @click="info[2] === '未填报' ? openUnfilledDialog() : ''"
|
|
|
- >
|
|
|
+ @click="info[2] === '未填报' ? openUnfilledDialog() : ''">
|
|
|
<span class="text-xs leading-8 text-[var(--el-text-color-regular)]">暂无数据</span>
|
|
|
</count-to>
|
|
|
- <div class="text-sm font-medium text-[var(--el-text-color-regular)] whitespace-nowrap">
|
|
|
+ <div
|
|
|
+ class="text-xs font-medium leading-5 text-[var(--el-text-color-regular)] whitespace-nowrap">
|
|
|
{{ info[1] ? info[2] + '(' + info[1] + ')' : info[2] }}
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
- <div class="bg-white dark:bg-[#1d1e1f] rounded-lg shadow flex flex-col p-4 gap-2 min-h-0">
|
|
|
- <div class="flex h-12 items-center justify-between">
|
|
|
+ <div class="bg-white dark:bg-[#1d1e1f] rounded-lg shadow flex flex-col p-3 gap-2 min-h-0">
|
|
|
+ <div class="flex h-10 items-center justify-between">
|
|
|
<el-button-group>
|
|
|
<el-button
|
|
|
size="default"
|
|
|
@@ -600,8 +599,7 @@ const tolist = (id: number, non: boolean = false) => {
|
|
|
as="div"
|
|
|
:style="{ position: 'relative', overflow: 'hidden' }"
|
|
|
:animate="{ height: `${height}px`, width: `100%` }"
|
|
|
- :transition="{ type: 'spring', stiffness: 200, damping: 25, duration: 0.3 }"
|
|
|
- >
|
|
|
+ :transition="{ type: 'spring', stiffness: 200, damping: 25, duration: 0.3 }">
|
|
|
<AnimatePresence :initial="false" mode="sync">
|
|
|
<Motion
|
|
|
:key="currentTab"
|
|
|
@@ -610,29 +608,25 @@ const tolist = (id: number, non: boolean = false) => {
|
|
|
:animate="{ x: '0%', opacity: 1 }"
|
|
|
:exit="{ x: direction === 'left' ? '50%' : '-50%', opacity: 0 }"
|
|
|
:transition="{ type: 'tween', stiffness: 300, damping: 30, duration: 0.3 }"
|
|
|
- :style="{ position: 'absolute', left: 0, right: 0, top: 0 }"
|
|
|
- >
|
|
|
+ :style="{ position: 'absolute', left: 0, right: 0, top: 0 }">
|
|
|
<div :style="{ width: `100%`, height: `${height}px` }">
|
|
|
<zm-table
|
|
|
v-if="currentTab === '表格'"
|
|
|
:loading="listLoading"
|
|
|
:data="list"
|
|
|
:height="height"
|
|
|
- show-border
|
|
|
- >
|
|
|
+ show-border>
|
|
|
<template v-for="item in columns(type)" :key="item.prop">
|
|
|
<zm-table-column
|
|
|
v-if="item.prop !== 'name' && item.prop !== 'nonProductiveTime'"
|
|
|
:label="item.label"
|
|
|
:prop="item.prop"
|
|
|
:formatter="formatter"
|
|
|
- :action="item.action"
|
|
|
- />
|
|
|
+ :action="item.action" />
|
|
|
<zm-table-column
|
|
|
v-else-if="item.prop === 'name'"
|
|
|
:label="item.label"
|
|
|
- :prop="item.prop"
|
|
|
- >
|
|
|
+ :prop="item.prop">
|
|
|
<template #default="{ row }">
|
|
|
<el-button text type="primary" @click.prevent="tolist(row.id)">{{
|
|
|
row.name
|
|
|
@@ -645,8 +639,7 @@ const tolist = (id: number, non: boolean = false) => {
|
|
|
v-if="row.nonProductiveTime > 0"
|
|
|
text
|
|
|
type="primary"
|
|
|
- @click.prevent="tolist(row.id, true)"
|
|
|
- >
|
|
|
+ @click.prevent="tolist(row.id, true)">
|
|
|
{{ (Number(row.nonProductiveTime ?? 0) * 100).toFixed(2) + '%' }}
|
|
|
</el-button>
|
|
|
<span v-else>
|
|
|
@@ -661,8 +654,7 @@ const tolist = (id: number, non: boolean = false) => {
|
|
|
v-loading="chartLoading"
|
|
|
:key="dayjs().valueOf()"
|
|
|
v-else
|
|
|
- :style="{ width: `100%`, height: `${height}px` }"
|
|
|
- >
|
|
|
+ :style="{ width: `100%`, height: `${height}px` }">
|
|
|
</div>
|
|
|
</div>
|
|
|
</Motion>
|