Ver Fonte

feat(daily-report): 新增瑞达日报工作量汇总看板

- 展示桥塞、趟数、井数、段数及水方量等汇总指标
- 根据当前查询条件加载工作量统计
- 格式化累计油耗和设备利用率数据
- 调整页面布局以容纳统计指标区域
Zimo há 16 horas atrás
pai
commit
82772b8ea7
1 ficheiros alterados com 133 adições e 3 exclusões
  1. 133 3
      src/views/report-statistics/rd-daily-report.vue

+ 133 - 3
src/views/report-statistics/rd-daily-report.vue

@@ -7,6 +7,7 @@ import { DICT_TYPE, getDictOptions } from '@/utils/dict'
 import { useUserStore } from '@/store/modules/user'
 import { resolveDailyReportDeptId } from '@/utils/dailyReportDept'
 import download from '@/utils/download'
+import CountTo from '@/components/count-to1.vue'
 
 defineOptions({ name: 'DailyReport' })
 
@@ -316,6 +317,114 @@ const loading = ref(false)
 const list = ref<List[]>([])
 const total = ref(0)
 
+const totalWorkKeys: [string, string | undefined, string, string, number][] = [
+  [
+    'cumulativeBridgePlug',
+    undefined,
+    '桥塞',
+    'i-material-symbols:check-circle-outline-rounded text-emerald',
+    0
+  ],
+  [
+    'cumulativeRunCount',
+    undefined,
+    '趟数',
+    'i-material-symbols:check-circle-outline-rounded text-emerald',
+    0
+  ],
+  [
+    'cumulativeWorkingWell',
+    undefined,
+    '井数',
+    'i-material-symbols:check-circle-outline-rounded text-emerald',
+    0
+  ],
+  [
+    'cumulativeWorkingLayers',
+    undefined,
+    '段数',
+    'i-material-symbols:check-circle-outline-rounded text-emerald',
+    0
+  ],
+  [
+    'cumulativeHourCount',
+    undefined,
+    '小时(H)',
+    'i-material-symbols:nest-clock-farsight-analog-outline-rounded text-emerald',
+    2
+  ],
+  [
+    'cumulativeWaterVolume',
+    '方',
+    '水方量',
+    'i-material-symbols:water-drop-outline-rounded text-sky',
+    2
+  ],
+  ['taici', undefined, '台次', 'i-material-symbols:check-circle-outline-rounded text-emerald', 0],
+  [
+    'utilizationRate',
+    '%',
+    '设备利用率',
+    'i-material-symbols:check-circle-outline-rounded text-emerald',
+    0
+  ],
+  [
+    'cumulativeFuels',
+    '万升',
+    '累计油耗',
+    'i-material-symbols:directions-car-outline-rounded text-sky',
+    2
+  ]
+]
+
+const totalWork = ref<Record<string, number>>({
+  cumulativeFuels: 0,
+  taici: 0,
+  cumulativeBridgePlug: 0,
+  cumulativeRunCount: 0,
+  cumulativeWorkingWell: 0,
+  cumulativeWorkingLayers: 0,
+  cumulativeHourCount: 0,
+  cumulativeWaterVolume: 0,
+  utilizationRate: 0
+})
+
+const totalLoading = ref(false)
+
+const loadTotalWorkload = useDebounceFn(async () => {
+  totalLoading.value = true
+  try {
+    const {
+      pageNo: _pageNo,
+      pageSize: _pageSize,
+      wellName: _wellName,
+      ...totalWorkloadQuery
+    } = query.value
+
+    void _pageNo
+    void _pageSize
+    void _wellName
+
+    const data = await IotRdDailyReportApi.totalWorkload(totalWorkloadQuery)
+
+    totalWork.value = {
+      ...totalWork.value,
+      taici: data.taici || 0,
+      cumulativeBridgePlug: data.cumulativeBridgePlug || 0,
+      cumulativeRunCount: data.cumulativeRunCount || 0,
+      cumulativeWorkingWell: data.cumulativeWorkingWell || 0,
+      cumulativeWorkingLayers: data.cumulativeWorkingLayers || 0,
+      cumulativeHourCount: data.cumulativeHourCount || 0,
+      cumulativeWaterVolume: data.cumulativeWaterVolume || 0,
+      ...data,
+      cumulativeFuels: (data.cumulativeFuels || 0) / 10000,
+      utilizationRate: Number(((data.utilizationRate || 0) * 100).toFixed(2))
+    }
+  } finally {
+    totalLoading.value = false
+  }
+}, 500)
+
 const loadList = useDebounceFn(async function () {
   loading.value = true
   try {
@@ -346,6 +455,7 @@ function handleQuery(setPage = true) {
     query.value.pageNo = 1
   }
   loadList()
+  loadTotalWorkload()
 }
 
 function resetQuery() {
@@ -456,15 +566,35 @@ const handleExport = () => {
       v-model="query.deptId"
       :init-select="false"
       title="队伍"
-      class="daily-report-side" />
+      class="daily-report-side row-span-2" />
     <WellSelect
       v-show="tab === '井'"
       :dept-id="deptId"
       v-model="taskName"
       v-model:contract-name="query.contractName"
-      class="daily-report-side" />
+      class="daily-report-side row-span-2" />
     <!-- <div class="p-4 bg-white dark:bg-[#1d1e1f] shadow rounded-lg h-full"> </div> -->
 
+    <div class="grid grid-cols-9 gap-4" v-loading="totalLoading">
+      <div
+        v-for="info in totalWorkKeys"
+        :key="info[0]"
+        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-xl font-medium leading-6"
+          :start-val="0"
+          :end-val="totalWork[info[0]]"
+          :decimals="info[4]">
+          <span class="text-xs leading-8 text-[var(--el-text-color-regular)]">暂无数据</span>
+        </count-to>
+        <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>
+
     <!-- 第二行右侧:自动落入第 2 行第 2 列 -->
     <div
       class="daily-report-table-card bg-white dark:bg-[#1d1e1f] shadow rounded-lg p-4 flex flex-col min-h-0">
@@ -541,7 +671,7 @@ const handleExport = () => {
 
 <style scoped>
 .daily-report-page {
-  grid-template-rows: 62px minmax(0, 1fr);
+  grid-template-rows: 62px 96px minmax(0, 1fr);
 }
 
 .daily-report-side {