单井队添加生产动态

src/components/DailyTableColumn/index.vue

@@ -19,11 +19,339 @@
         <el-tag :type="tagType(row[col.prop!])" v-else>{{ col.formatter?.(row) || '' }}</el-tag>
       </template>
     </el-table-column>
+    <el-table-column
+      v-else-if="col.label === '生产动态'"
+      v-bind="col"
+      align="center"
+      resizable
+      :show-overflow-tooltip="false"
+    >
+      <template v-if="company === 'rd'" #default="{ row }">
+        <div v-if="row.reportDetails && row.reportDetails.length > 0" class="py-2">
+          <el-popover placement="right" trigger="hover" width="320" popper-class="!p-0">
+            <template #reference>
+              <el-badge :value="row.reportDetails.length" type="primary" class="max-w-full">
+                <div
+                  class="w-58 flex flex-col bg-gray-200/80 hover:bg-blue-100 transition-colors relative group cursor-pointer p-2 rounded gap-y-2"
+                >
+                  <div class="flex items-center gap-x-2">
+                    <div class="flex items-center">
+                      <div class="i-carbon-calendar mr-1 -translate-y-[0.5px]"></div>
+                      <div class="font-medium mr-2">{{
+                        dayjs(row.createTime).format('YYYY-MM-DD')
+                      }}</div>
+                      <div class="flex items-center">
+                        <span>{{ formatT(row.reportDetails[0].startTime) }}</span>
+                        <span class="mx-1">-</span>
+                        <span>{{ formatT(row.reportDetails[0].endTime) }}</span>
+                      </div>
+                    </div>
+
+                    <div class="ml-auto group-hover:text-blue-600 font-medium">
+                      {{ row.reportDetails[0].duration }} H
+                    </div>
+                  </div>
+                  <!--
+                            <div class="flex items-center">
+                              <div class="font-medium flex-shrink-0">施工详情：</div>
+                              <el-tooltip
+                                effect="dark"
+                                :content="row.reportDetails[0].constructionDetail"
+                                placement="top"
+                                popper-class="max-w-100"
+                              >
+                                <span
+                                  class="font-medium truncate group-hover:text-blue-600 transition-colors"
+                                >
+                                  {{ row.reportDetails[0].constructionDetail || '-' }}
+                                </span>
+                              </el-tooltip>
+                            </div> -->
+                </div>
+              </el-badge>
+            </template>
+            <el-scrollbar max-height="480px" view-class="!p-3 flex flex-col gap-y-2">
+              <div
+                v-for="(item, index) in row.reportDetails"
+                :key="index"
+                class="flex flex-col bg-gray-200/80 hover:bg-blue-100 transition-colors relative group cursor-pointer p-2 rounded gap-y-2 max-w-80"
+              >
+                <div class="flex items-center gap-x-2">
+                  <div class="flex items-center">
+                    <div class="i-carbon-calendar mr-1 -translate-y-[0.5px]"></div>
+                    <div class="font-medium mr-2">{{
+                      dayjs(row.createTime).format('YYYY-MM-DD')
+                    }}</div>
+                    <div class="flex items-center">
+                      <span>{{ formatT(item.startTime) }}</span>
+                      <span class="mx-1">-</span>
+                      <span>{{ formatT(item.endTime) }}</span>
+                    </div>
+                  </div>
+
+                  <div class="ml-auto group-hover:text-blue-600 font-medium">
+                    {{ item.duration }} H
+                  </div>
+                </div>
+
+                <div class="flex items-center">
+                  <div class="font-medium flex-shrink-0">施工详情：</div>
+                  <span
+                    class="font-medium group-hover:text-blue-600 transition-colors break-all whitespace-pre-wrap"
+                  >
+                    {{ item.constructionDetail || '-' }}
+                  </span>
+                </div>
+              </div>
+            </el-scrollbar>
+          </el-popover>
+        </div>
+        <span v-else class="text-gray-300">-</span>
+      </template>
+      <template v-else-if="company === 'ry'" #default="{ row }">
+        <div v-if="row.reportDetails && row.reportDetails.length > 0" class="py-2">
+          <el-popover placement="right" trigger="hover" width="320" popper-class="!p-0">
+            <template #reference>
+              <el-badge :value="row.reportDetails.length" type="primary" class="max-w-full">
+                <div
+                  class="w-72 flex flex-col bg-gray-200/80 hover:bg-blue-100 transition-colors relative group cursor-pointer p-2 rounded gap-y-2"
+                >
+                  <div class="flex items-center gap-x-2">
+                    <div class="flex items-center">
+                      <div class="i-carbon-calendar mr-1 -translate-y-[0.5px]"></div>
+                      <div class="font-medium mr-2">{{
+                        dayjs(row.reportDetails[0].reportDate).format('YYYY-MM-DD')
+                      }}</div>
+                      <div class="flex items-center">
+                        <span>{{ formatT(row.reportDetails[0].startTime) }}</span>
+                        <span class="mx-1">-</span>
+                        <span>{{ formatT(row.reportDetails[0].endTime) }}</span>
+                      </div>
+                    </div>
+
+                    <div class="ml-auto group-hover:text-blue-600 font-medium">
+                      {{ row.reportDetails[0].duration }} H
+                    </div>
+                  </div>
+
+                  <!-- <div class="flex items-center">
+                            <div class="font-medium flex-shrink-0">结束井深(m)：</div>
+                            <span
+                              class="font-medium truncate group-hover:text-blue-600 transition-colors"
+                              >{{ row.reportDetails[0].currentDepth || '-' }} m
+                            </span>
+                          </div>
+
+                          <div class="flex items-center">
+                            <div class="font-medium flex-shrink-0">工况：</div>
+                            <el-tooltip
+                              effect="dark"
+                              :content="row.reportDetails[0].currentOperation"
+                              placement="top"
+                              popper-class="max-w-100"
+                            >
+                              <span
+                                class="font-medium truncate group-hover:text-blue-600 transition-colors"
+                              >
+                                {{ row.reportDetails[0].currentOperation || '-' }}
+                              </span>
+                            </el-tooltip>
+                          </div>
+
+                          <div class="flex items-center">
+                            <div class="font-medium flex-shrink-0">详细描述：</div>
+                            <el-tooltip
+                              effect="dark"
+                              :content="row.reportDetails[0].constructionDetail"
+                              placement="top"
+                              popper-class="max-w-100"
+                            >
+                              <span
+                                class="font-medium truncate group-hover:text-blue-600 transition-colors"
+                              >
+                                {{ row.reportDetails[0].constructionDetail || '-' }}
+                              </span>
+                            </el-tooltip>
+                          </div> -->
+                </div>
+              </el-badge>
+            </template>
+            <el-scrollbar max-height="480px" view-class="!p-3 flex flex-col gap-y-2">
+              <div
+                v-for="(item, index) in row.reportDetails"
+                :key="index"
+                class="flex flex-col bg-gray-200/80 hover:bg-blue-100 transition-colors relative group cursor-pointer p-2 rounded gap-y-2"
+              >
+                <div class="flex items-center gap-x-2">
+                  <div class="flex items-center">
+                    <div class="i-carbon-calendar mr-1 -translate-y-[0.5px]"></div>
+                    <div class="font-medium mr-2">{{
+                      dayjs(item.reportDate).format('YYYY-MM-DD')
+                    }}</div>
+                    <div class="flex items-center">
+                      <span>{{ formatT(item.startTime) }}</span>
+                      <span class="mx-1">-</span>
+                      <span>{{ formatT(item.endTime) }}</span>
+                    </div>
+                  </div>
+
+                  <div class="ml-auto group-hover:text-blue-600 font-medium">
+                    {{ item.duration }} H
+                  </div>
+                </div>
+
+                <div class="flex items-center">
+                  <div class="font-medium flex-shrink-0">结束井深(m)：</div>
+                  <span class="font-medium truncate group-hover:text-blue-600 transition-colors"
+                    >{{ item.currentDepth || '-' }} m
+                  </span>
+                </div>
+
+                <div class="flex items-center">
+                  <div class="font-medium flex-shrink-0">工况：</div>
+                  <span class="font-medium group-hover:text-blue-600 transition-colors">
+                    {{ item.currentOperation || '-' }}
+                  </span>
+                </div>
+
+                <div class="flex items-center">
+                  <div class="font-medium flex-shrink-0">详细描述：</div>
+                  <span
+                    class="font-medium break-all whitespace-pre-wrap group-hover:text-blue-600 transition-colors"
+                  >
+                    {{ item.constructionDetail || '-' }}
+                  </span>
+                </div>
+              </div>
+            </el-scrollbar>
+          </el-popover>
+        </div>
+        <span v-else class="text-gray-300">-</span>
+      </template>
+      <template v-else #default="{ row }">
+        <div v-if="row.reportDetails && row.reportDetails.length > 0" class="py-2">
+          <el-popover placement="right" trigger="hover" width="320" popper-class="p-0!">
+            <template #reference>
+              <el-badge :value="row.reportDetails.length" type="primary" class="max-w-full">
+                <div
+                  class="w-72 flex flex-col bg-gray-200/80 hover:bg-blue-100 transition-colors relative group cursor-pointer p-2 rounded gap-y-2"
+                >
+                  <div class="flex items-center gap-x-2">
+                    <div class="flex items-center">
+                      <div class="i-carbon-calendar mr-1 -translate-y-[0.5px]"></div>
+                      <div class="font-medium mr-2">{{
+                        dayjs(row.reportDetails[0].reportDate).format('YYYY-MM-DD')
+                      }}</div>
+                      <div class="flex items-center">
+                        <span>{{ formatT(row.reportDetails[0].startTime) }}</span>
+                        <span class="mx-1">-</span>
+                        <span>{{ formatT(row.reportDetails[0].endTime) }}</span>
+                      </div>
+                    </div>
+
+                    <div class="ml-auto group-hover:text-blue-600 font-medium">
+                      {{ row.reportDetails[0].duration }} H
+                    </div>
+                  </div>
+
+                  <!-- <div class="flex items-center">
+                            <div class="font-medium flex-shrink-0">结束井深(m)：</div>
+                            <span
+                              class="font-medium truncate group-hover:text-blue-600 transition-colors"
+                              >{{ row.reportDetails[0].currentDepth || '-' }} m
+                            </span>
+                          </div> -->
+
+                  <!-- <div class="flex items-center">
+                            <div class="font-medium flex-shrink-0">工况：</div>
+                            <el-tooltip
+                              effect="dark"
+                              :content="row.reportDetails[0].currentOperation"
+                              placement="top"
+                              popper-class="max-w-100"
+                            >
+                              <span
+                                class="font-medium truncate group-hover:text-blue-600 transition-colors"
+                              >
+                                {{ row.reportDetails[0].currentOperation || '-' }}
+                              </span>
+                            </el-tooltip>
+                          </div>
+
+                          <div class="flex items-center">
+                            <div class="font-medium flex-shrink-0">详细描述：</div>
+                            <el-tooltip
+                              effect="dark"
+                              :content="row.reportDetails[0].constructionDetail"
+                              placement="top"
+                              popper-class="max-w-100"
+                            >
+                              <span
+                                class="font-medium truncate group-hover:text-blue-600 transition-colors"
+                              >
+                                {{ row.reportDetails[0].constructionDetail || '-' }}
+                              </span>
+                            </el-tooltip>
+                          </div> -->
+                </div>
+              </el-badge>
+            </template>
+            <el-scrollbar max-height="480px" view-class="!p-3 flex flex-col gap-y-2">
+              <div
+                v-for="(item, index) in row.reportDetails"
+                :key="index"
+                class="flex flex-col bg-gray-200/80 hover:bg-blue-100 transition-colors relative group cursor-pointer p-2 rounded gap-y-2"
+              >
+                <div class="flex items-center gap-x-2">
+                  <div class="flex items-center">
+                    <div class="i-carbon-calendar mr-1 -translate-y-[0.5px]"></div>
+                    <div class="font-medium mr-2">{{
+                      dayjs(item.reportDate).format('YYYY-MM-DD')
+                    }}</div>
+                    <div class="flex items-center">
+                      <span>{{ formatT(item.startTime) }}</span>
+                      <span class="mx-1">-</span>
+                      <span>{{ formatT(item.endTime) }}</span>
+                    </div>
+                  </div>
+
+                  <div class="ml-auto group-hover:text-blue-600 font-medium">
+                    {{ item.duration }} H
+                  </div>
+                </div>
+
+                <div class="flex items-center">
+                  <div class="font-medium flex-shrink-0">工况：</div>
+                  <span
+                    class="font-medium break-all whitespace-pre-wrap group-hover:text-blue-600 transition-colors"
+                  >
+                    {{ item.currentOperation || '-' }}
+                  </span>
+                </div>
+
+                <div class="flex items-center">
+                  <div class="font-medium flex-shrink-0">详细描述：</div>
+                  <span
+                    class="font-medium break-all whitespace-pre-wrap group-hover:text-blue-600 transition-colors"
+                  >
+                    {{ item.constructionDetail || '-' }}
+                  </span>
+                </div>
+              </div>
+            </el-scrollbar>
+          </el-popover>
+        </div>
+        <span v-else class="text-gray-300">-</span>
+      </template>
+    </el-table-column>
     <el-table-column v-else v-bind="col" align="center" resizable />
   </template>
 </template>
 
 <script setup lang="ts">
+import { formatT } from '@/utils/formatTime'
+import { dayjs } from 'element-plus'
+
 defineOptions({
   name: 'DailyTableColumn'
 })
@@ -40,9 +368,10 @@ interface ColumnProps {
 
 const props = defineProps<{
   columns: ColumnProps[]
+  company: string
 }>()
 
-const { columns } = toRefs(props)
+const { columns, company } = toRefs(props)
 
 const tagType = (status: number) => {
   switch (status) {

src/views/report-statistics/rd-daily-report.vue

@@ -32,7 +32,7 @@ interface List {
   waterVolume: number // 水方量
   hourCount: number // 时间H
   dailyFuel: number // 油耗(L)
-  productionStatus: string // 当日生产动态
+  reportDetails: any // 当日生产动态
   nextPlan: string // 下步工作计划
   externalRental: string // 外租设备
   malfunction: string // 故障情况
@@ -45,6 +45,7 @@ interface Column {
   label: string
   'min-width'?: string
   isTag?: boolean
+  isDay?: boolean
   fixed?: 'left' | 'right'
   formatter?: (row: List) => any
   children?: Column[]
@@ -134,9 +135,10 @@ const columns = ref<Column[]>([
     'min-width': '120px'
   },
   {
-    label: '当日生产动态',
-    prop: 'productionStatus',
-    'min-width': '120px'
+    label: '生产动态',
+    prop: 'reportDetails',
+    'min-width': '120px',
+    isDay: true
   },
   {
     label: '下步工作计划',
@@ -209,7 +211,7 @@ const calculateColumnWidths = (colums: Column[]) => {
         ]
       ) + 'px'
 
-    col['min-width'] = minWidth
+    col['min-width'] = col.isDay ? '250px' : minWidth
   }
 }
 
@@ -494,7 +496,7 @@ const handleExport = () => {
                   </div>
                 </template>
               </el-table-column>
-              <DailyTableColumn :columns="columns" />
+              <DailyTableColumn :columns="columns" company="rd" />
               <!-- <el-table-column label="操作" width="120px" align="center" fixed="right">
                 <template #default="{ row }">
                   <el-button link type="success" v-hasPermi="['pms:iot-rh-daily-report:query']">

src/views/report-statistics/ry-daily-report.vue

@@ -46,7 +46,7 @@ interface List {
   winterBreakTime: number
   constructionStartDate: number
   constructionEndDate: number
-  productionStatus: string
+  reportDetails: string
   currentOperation: string
   nextPlan: string
   rigStatus: string
@@ -83,6 +83,7 @@ interface Column {
   label: string
   'min-width'?: string
   isTag?: boolean
+  isDay?: boolean
   fixed?: 'left' | 'right'
   formatter?: (row: List) => any
   children?: Column[]
@@ -238,8 +239,9 @@ const columns = ref<Column[]>([
   },
   {
     label: '生产动态',
-    prop: 'productionStatus',
-    'min-width': '120px'
+    prop: 'reportDetails',
+    'min-width': '250px',
+    isDay: true
   },
   {
     label: '项目',
@@ -352,7 +354,7 @@ const calculateColumnWidths = (colums: Column[]) => {
         ]
       ) + 'px'
 
-    col['min-width'] = minWidth
+    col['min-width'] = col.isDay ? '250px' : minWidth
   }
 }
 
@@ -665,7 +667,7 @@ const handleExport = () => {
                   </div>
                 </template>
               </el-table-column>
-              <DailyTableColumn :columns="columns" />
+              <DailyTableColumn :columns="columns" company="ry" />
               <!-- <el-table-column label="操作" width="120px" align="center" fixed="right">
                 <template #default="{ row }">
                   <el-button link type="success" v-hasPermi="['pms:iot-rh-daily-report:query']">

src/views/report-statistics/ry-xj-daily-report.vue

@@ -46,7 +46,7 @@ interface List {
   winterBreakTime: number
   constructionStartDate: number
   constructionEndDate: number
-  productionStatus: string
+  reportDetails: string
   currentOperation: string
   nextPlan: string
   rigStatus: string
@@ -90,6 +90,7 @@ interface Column {
   label: string
   'min-width'?: string
   isTag?: boolean
+  isDay?: boolean
   fixed?: 'left' | 'right'
   formatter?: (row: List) => any
   children?: Column[]
@@ -218,8 +219,9 @@ const columns = ref<Column[]>([
   },
   {
     label: '生产动态',
-    prop: 'productionStatus',
-    'min-width': '120px'
+    prop: 'reportDetails',
+    'min-width': '250px',
+    isDay: true
   },
   {
     label: '项目',
@@ -293,7 +295,7 @@ const calculateColumnWidths = (colums: Column[]) => {
         ]
       ) + 'px'
 
-    col['min-width'] = minWidth
+    col['min-width'] = col.isDay ? '250px' : minWidth
   }
 }
 
@@ -606,7 +608,7 @@ const handleExport = () => {
                   </div>
                 </template>
               </el-table-column>
-              <DailyTableColumn :columns="columns" />
+              <DailyTableColumn :columns="columns" company="ry-xj" />
               <!-- <el-table-column label="操作" width="120px" align="center" fixed="right">
                 <template #default="{ row }">
                   <el-button link type="success" v-hasPermi="['pms:iot-rh-daily-report:query']">