Zimo 7 ore fa
parent
commit
299b10b74d

+ 5 - 1
src/api/pms/iotopeationfill/index.ts

@@ -85,10 +85,14 @@ export const IotOpeationFillApi = {
   },
 
   // 新增运行记录填报
-  insertLog: async (data: IotOpeationFillVO) => {
+  insertLog: async (data: any) => {
     return await request.post({ url: `/rq/iot-opeation-fill/insertLog`, data })
   },
 
+  getReportDetails: async (id: any) => {
+    return await request.get({ url: `/rq/iot-opeation-fill/prod/detail/${id}` })
+  },
+
   // 修改运行记录填报
   updateIotOpeationFill: async (data: IotOpeationFillVO) => {
     return await request.put({ url: `/rq/iot-opeation-fill/update`, data })

+ 269 - 8
src/views/pms/iotopeationfill/index1.vue

@@ -44,7 +44,7 @@
             size="default"
             label-width="120px"
             class="scrollable-form"
-            :model="{ attrList: attrList }"
+            :model="{ attrList: attrList, reportDetails }"
           >
             <div style="margin-left: 24px">
               <el-form class="demo-form-inline" :inline="true">
@@ -106,7 +106,13 @@
                   style="width: 320px"
                 />
               </div>
-              <el-form-item :label="attrItem.name" prop="deviceId" label-position="top">
+
+              <el-form-item
+                v-if="attrItem.description !== 'productionStatus'"
+                :label="attrItem.name"
+                prop="deviceId"
+                label-position="top"
+              >
                 <div v-if="fillStatus === '1'">
                   <el-select
                     disabled
@@ -200,6 +206,7 @@
                   :controls="false"
                   align="left"
                   placeholder="请输入数字"
+                  :disabled="fillStatus === '1'"
                 />
               </el-form-item>
 
@@ -214,13 +221,192 @@
                   class="w-80!"
                   v-model="attrItem.fillContent"
                   placeholder="请输入其他非生产原因"
+                  :disabled="fillStatus === '1'"
                 />
               </el-form-item>
             </div>
+
+            <div v-if="companyName === 'ry'">
+              <div class="flex items-center justify-between mb-6">
+                <div class="flex items-center gap-2">
+                  <div class="bg-[var(--el-color-primary)] w-1 h-5 rounded-full"></div>
+                  <div class="text-lg font-medium text-[var(--el-text-color-primary)]"
+                    >生产动态</div
+                  >
+                </div>
+                <el-button
+                  :disabled="fillStatus === '1'"
+                  type="primary"
+                  link
+                  :icon="Plus"
+                  @click="addProductionStatusRow"
+                >
+                  添加一行
+                </el-button>
+              </div>
+              <el-form-item prop="reportDetails" class="table-form-item">
+                <ZmTable :data="reportDetails" :loading="false" class="mb-4">
+                  <ZmTableColumn
+                    label="日期"
+                    :width="105"
+                    cover-formatter
+                    :real-value="() => createTime"
+                  />
+
+                  <ZmTableColumn :width="130" label="开始时间" prop="startTime">
+                    <template #default="{ row, $index }">
+                      <el-form-item
+                        v-if="$index >= 0"
+                        class="mb-0!"
+                        :prop="`reportDetails.${$index}.startTime`"
+                        :rules="{
+                          required: true,
+                          message: '请选择开始时间',
+                          trigger: ['change', 'blur']
+                        }"
+                      >
+                        <el-time-picker
+                          v-model="row.startTime"
+                          placeholder="选择开始时间"
+                          clearable
+                          format="HH:mm"
+                          value-format="HH:mm"
+                          class="w-full!"
+                          @change="calculateDuration(row)"
+                          :disabled="fillStatus === '1'"
+                        />
+                      </el-form-item>
+                    </template>
+                  </ZmTableColumn>
+                  <ZmTableColumn :width="130" label="结束时间" prop="endTime">
+                    <template #default="{ row, $index }">
+                      <el-form-item
+                        v-if="$index >= 0"
+                        class="mb-0!"
+                        :prop="`reportDetails.${$index}.endTime`"
+                        :rules="{
+                          required: true,
+                          message: '请选择结束时间',
+                          trigger: ['change', 'blur']
+                        }"
+                      >
+                        <el-time-picker
+                          v-model="row.endTime"
+                          placeholder="选择结束时间"
+                          clearable
+                          format="HH:mm"
+                          value-format="HH:mm"
+                          class="w-full!"
+                          @change="calculateDuration(row)"
+                          :disabled="fillStatus === '1'"
+                        />
+                      </el-form-item>
+                    </template>
+                  </ZmTableColumn>
+                  <ZmTableColumn :width="80" label="时长(H)" prop="duration" />
+
+                  <ZmTableColumn label="工况" min-width="140">
+                    <template #default="{ row, $index }">
+                      <el-form-item
+                        v-if="$index >= 0"
+                        :prop="`reportDetails.${$index}.currentOperation`"
+                        :rules="{
+                          required: true,
+                          message: '请输入工况',
+                          trigger: ['change', 'blur']
+                        }"
+                        class="mb-0!"
+                      >
+                        <el-input
+                          v-model="row.currentOperation"
+                          type="textarea"
+                          :autosize="{ minRows: 1 }"
+                          show-word-limit
+                          :maxlength="1000"
+                          placeholder="请输入工况"
+                          :disabled="fillStatus === '1'"
+                        />
+                      </el-form-item>
+                    </template>
+                  </ZmTableColumn>
+
+                  <ZmTableColumn v-if="showDepth" label="结束井深(m)" min-width="80">
+                    <template #default="{ row, $index }">
+                      <el-form-item
+                        v-if="$index >= 0"
+                        :prop="`reportDetails.${$index}.currentDepth`"
+                        :rules="[
+                          {
+                            required: true,
+                            message: '请输入结束井深',
+                            trigger: ['blur']
+                          }
+                          // { validator: validateLastCurrentDepth, trigger: ['change', 'blur'] }
+                        ]"
+                        class="mb-0!"
+                      >
+                        <el-input-number
+                          v-model="row.currentDepth"
+                          :min="0"
+                          :controls="false"
+                          class="!w-full"
+                          align="left"
+                          placeholder="请输入结束井深"
+                          @input="(val) => inputCurrentDepth(val, $index)"
+                          :disabled="fillStatus === '1'"
+                        >
+                          <template #suffix> m </template>
+                        </el-input-number>
+                      </el-form-item>
+                    </template>
+                  </ZmTableColumn>
+
+                  <ZmTableColumn label="详细描述" min-width="200" align="center">
+                    <template #default="{ row, $index }">
+                      <el-form-item
+                        v-if="$index >= 0"
+                        :prop="`reportDetails.${$index}.constructionDetail`"
+                        :rules="{ required: true, message: '请输入详细描述', trigger: 'blur' }"
+                        class="mb-0!"
+                      >
+                        <el-input
+                          v-model="row.constructionDetail"
+                          type="textarea"
+                          :autosize="{ minRows: 1 }"
+                          show-word-limit
+                          :maxlength="1000"
+                          placeholder="请输入详细描述"
+                          :disabled="fillStatus === '1'"
+                        />
+                      </el-form-item>
+                    </template>
+                  </ZmTableColumn>
+
+                  <ZmTableColumn label="操作" width="80" fixed="right" align="center">
+                    <template #default="{ $index }">
+                      <el-button
+                        link
+                        type="danger"
+                        :icon="Delete"
+                        @click="removeProductionStatusRow($index)"
+                        :disabled="fillStatus === '1'"
+                      >
+                        删除
+                      </el-button>
+                    </template>
+                  </ZmTableColumn>
+                </ZmTable>
+              </el-form-item>
+            </div>
+
             <el-form-item>
-              <el-button type="primary" @click="getFillInfo" v-show="showStatus">{{
-                t('operationFillForm.confirm')
-              }}</el-button>
+              <el-button
+                :loading="submitLoading"
+                type="primary"
+                @click="getFillInfo"
+                v-show="showStatus"
+                >{{ t('operationFillForm.confirm') }}</el-button
+              >
               <el-button type="info" @click="deleteFillInfo" v-show="showStatus">{{
                 t('operationFill.clear')
               }}</el-button>
@@ -238,6 +424,9 @@ import { ElMessage, FormInstance, FormRules } from 'element-plus'
 import moment from 'moment'
 import { getIntDictOptions, getStrDictOptions } from '@/utils/dict'
 import { useRoute } from 'vue-router'
+import { calculateDuration, formatT } from '@/utils/formatTime'
+import { Delete, Plus } from '@element-plus/icons-vue'
+import { useDebounceFn } from '@vueuse/core'
 
 /** 运行记录填报 列表 */
 defineOptions({ name: 'FillOrderInfo' })
@@ -284,6 +473,50 @@ const queryParams = reactive<any>({
   isSum: undefined
 })
 
+interface ReportDetail {
+  startTime: string
+  endTime: string
+  duration: number
+  currentDepth: number
+  currentOperation: string
+  constructionDetail: string
+}
+
+const reportDetails = ref<ReportDetail[]>([])
+
+const addProductionStatusRow = () => {
+  if (!reportDetails.value) {
+    reportDetails.value = []
+  }
+  reportDetails.value.push({
+    startTime: '',
+    endTime: '',
+    duration: 0,
+    currentDepth: 0,
+    currentOperation: '',
+    constructionDetail: ''
+  })
+}
+
+const removeProductionStatusRow = (index: number) => {
+  if (index === 0) {
+    message.warning('至少填写一条生产动态')
+    return
+  }
+  reportDetails.value.splice(index, 1)
+}
+
+const inputCurrentDepth = useDebounceFn(function inputCurrentDepth(val: any, index: number) {
+  if (reportDetails.value && index === reportDetails.value.length - 1) {
+    const currentDepth = attrList.value.find((item) => item.description === 'currentDepth')
+    if (currentDepth) currentDepth.fillContent = val
+  }
+}, 300)
+
+const showDepth = computed(() => {
+  return attrList.value.some((item) => item.description === 'currentDepth')
+})
+
 const NON_KEYS = [
   'repairTime',
   'selfStopTime',
@@ -496,7 +729,21 @@ const getList = async () => {
       queryParams.deviceName = list.value[0].deviceName
       queryParams.deviceId = list.value[0].deviceId
     }
-    getAttrList()
+    await getAttrList()
+    IotOpeationFillApi.getReportDetails(deptId.split(',')[3]).then((res) => {
+      reportDetails.value = (res ? (res as any[]) : []).map((item) => ({
+        startTime: formatT(item.startTime),
+        endTime: formatT(item.endTime),
+        duration: item.duration,
+        currentDepth: item.currentDepth,
+        currentOperation: item.currentOperation,
+        constructionDetail: item.constructionDetail
+      }))
+
+      if (!reportDetails.value.length) {
+        addProductionStatusRow()
+      }
+    })
   } finally {
     loading.value = false
   }
@@ -680,10 +927,14 @@ const getAttrList = async () => {
 }
 const formRef = ref<FormInstance[] | null>(null)
 
+const submitLoading = ref(false)
+
 /** 获取填写信息保存到后台*/
 const getFillInfo = async () => {
   if (!formRef.value) return
 
+  submitLoading.value = true
+
   try {
     const validations = formRef.value.map((form) => form.validate())
     await Promise.all(validations)
@@ -699,6 +950,7 @@ const getFillInfo = async () => {
           (item.fillContent === undefined || item.fillContent === '')
         )
       })
+
       if (emptyFields.length > 0) {
         ElMessage.error(t('operationFillForm.fill'))
         return
@@ -757,8 +1009,9 @@ const getFillInfo = async () => {
     })
     const data = attrList2.value as unknown as IotOpeationFillVO
 
-    console.log('data :>> ', data)
-    await IotOpeationFillApi.insertLog(data)
+    const reqData = { createReqVO: data, reportDetails: reportDetails.value }
+
+    await IotOpeationFillApi.insertLog(reqData)
     message.success(t('common.createSuccess'))
     // 发送操作成功的事件
     emit('success')
@@ -766,6 +1019,8 @@ const getFillInfo = async () => {
     getList()
   } catch (error) {
     console.error('保存失败:', error)
+  } finally {
+    submitLoading.value = false
   }
 }
 
@@ -935,4 +1190,10 @@ onMounted(async () => {
   border: 2px solid #42b983; /* 使用Vue标志性的绿色边框 */
   border-radius: 4px;
 }
+
+:deep(.table-form-item) {
+  .el-form-item__content {
+    margin-left: 0 !important;
+  }
+}
 </style>

+ 78 - 39
src/views/pms/iotrddailyreport/index.vue

@@ -303,59 +303,98 @@ function handleOpenForm(id: number, type: 'edit' | 'detail' | 'approval' | 'time
               <zm-table-column
                 prop="reportDetails"
                 label="当日生产动态"
-                width="300"
+                width="320"
                 :show-overflow-tooltip="false"
               >
                 <template #default="{ row }">
-                  <div class="flex flex-col gap-2 py-2">
-                    <div
-                      v-for="(item, index) in row.reportDetails"
-                      :key="index"
-                      class="group flex flex-col gap-1.5 p-2 rounded-md bg-gray-200/80 hover:bg-blue-100 transition-colors"
+                  <div v-if="row.reportDetails && row.reportDetails.length > 0" class="py-2">
+                    <el-popover
+                      placement="right"
+                      trigger="hover"
+                      width="320"
+                      popper-class="!p-3 flex flex-col gap-y-2"
+                      :disabled="row.reportDetails.length <= 1"
                     >
-                      <div class="flex items-center gap-x-3 text-12px text-gray-500">
-                        <div class="flex items-center">
-                          <div class="i-carbon-calendar mr-1 opacity-70"></div>
-                          <span class="font-mono">{{
-                            dayjs(row.createTime).format('YYYY-MM-DD')
-                          }}</span>
-                        </div>
-
-                        <div
-                          class="flex items-center bg-gray-200/50 px-2 py-0.5 rounded text-gray-600"
+                      <template #reference>
+                        <el-badge
+                          :value="row.reportDetails.length"
+                          type="primary"
+                          class="max-w-full"
                         >
-                          <span>{{ formatT(item.startTime) }}</span>
-                          <span class="mx-1 opacity-50">-</span>
-                          <span>{{ formatT(item.endTime) }}</span>
-                        </div>
-
-                        <div class="ml-auto flex items-center gap-1">
-                          <span class="text-gray-400">时长</span>
-                          <span class="text-blue-600 font-bold tracking-tighter"
-                            >{{ item.duration }}<small class="font-normal ml-0.5">H</small></span
+                          <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.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>
+                      <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>
 
-                      <div class="flex items-start items-center min-w-0 p-1.5 rounded-sm">
-                        <span class="flex-shrink-0 text-12px font-bold text-gray-400 mr-2">
-                          施工详情
-                        </span>
-                        <el-tooltip
-                          effect="dark"
-                          :content="item.constructionDetail"
-                          placement="top"
-                          popper-class="max-w-100"
-                        >
+                        <div class="flex items-center">
+                          <div class="font-medium flex-shrink-0">施工详情:</div>
                           <span
-                            class="text-gray-700 truncate cursor-help group-hover:text-blue-600 transition-colors"
+                            class="font-medium group-hover:text-blue-600 transition-colors break-all whitespace-pre-wrap"
                           >
                             {{ item.constructionDetail || '-' }}
                           </span>
-                        </el-tooltip>
+                        </div>
                       </div>
-                    </div>
+                    </el-popover>
                   </div>
+                  <span v-else class="text-gray-300">-</span>
                 </template>
               </zm-table-column>
               <zm-table-column prop="nextPlan" label="下步工作计划" />

+ 1 - 1
src/views/pms/iotrydailyreport/ry-form.vue

@@ -388,7 +388,7 @@ const handleAudit = async (auditStatus: 20 | 30) => {
   try {
     formLoading.value = true
 
-    await formRef.value.validate()
+    await formRef.value.validateField('constructionBrief')
 
     await IotRyDailyReportApi.approvalIotRyDailyReport({
       id: form.value.id!,

+ 109 - 54
src/views/pms/iotrydailyreport/ry-table.vue

@@ -247,78 +247,133 @@ function handleCurrentChange(val: number) {
             <zm-table-column
               prop="reportDetails"
               label="生产动态"
-              width="500"
+              width="320"
               :show-overflow-tooltip="false"
             >
               <template #default="{ row }">
-                <div class="flex flex-col gap-1 py-1">
-                  <div
-                    v-for="(item, index) in row.reportDetails"
-                    :key="index"
-                    class="group flex flex-col gap-1 p-2 rounded-md bg-gray-200/80 hover:bg-blue-100 transition-colors"
+                <div v-if="row.reportDetails && row.reportDetails.length > 0" class="py-2">
+                  <el-popover
+                    placement="right"
+                    trigger="hover"
+                    width="320"
+                    popper-class="!p-3 flex flex-col gap-y-2"
+                    :disabled="row.reportDetails.length <= 1"
                   >
-                    <div class="flex items-center text-12px text-gray-500">
-                      <div class="flex items-center w-100px flex-shrink-0">
-                        <div class="i-carbon-calendar mr-1 opacity-70"></div>
-                        <span class="font-mono">{{
-                          dayjs(row.createTime).format('YYYY-MM-DD')
-                        }}</span>
-                      </div>
-
-                      <div class="flex items-center flex-1 min-w-0 px-2 ml-1">
-                        <span class="text-gray-400 mr-1 flex-shrink-0">工况:</span>
-                        <el-tooltip
-                          :content="item.currentOperation"
-                          placement="top"
-                          :disabled="!item.currentOperation"
-                          popper-class="max-w-100"
+                    <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"
                         >
-                          <span class="truncate text-gray-700 font-600">{{
-                            item.currentOperation || '-'
-                          }}</span>
-                        </el-tooltip>
-                      </div>
+                          <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">结束井深(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 justify-end w-120px flex-shrink-0 ml-auto">
-                        <span class="text-gray-400 mr-1">结束井深:</span>
-                        <span class="font-bold text-blue-600 font-mono">{{
-                          item.currentDepth
-                        }}</span>
-                        <span class="ml-0.5 text-10px">m</span>
+                          <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>
+                    <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(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>
 
-                    <div class="flex items-center text-12px gap-x-3">
-                      <div class="flex items-center w-100px flex-shrink-0 text-gray-400 italic">
-                        <span>{{ formatT(item.startTime) }}-{{ formatT(item.endTime) }}</span>
+                      <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 flex-1 min-w-0">
-                        <span class="text-gray-400 mr-2 font-bold flex-shrink-0">详情:</span>
-                        <el-tooltip
-                          effect="dark"
-                          :content="item.constructionDetail"
-                          placement="top"
-                          popper-class="max-w-100"
-                        >
-                          <span
-                            class="truncate text-gray-600 cursor-help group-hover:text-blue-700 transition-colors"
-                          >
-                            {{ item.constructionDetail || '-' }}
-                          </span>
-                        </el-tooltip>
+                      <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="w-60px flex-shrink-0 text-right">
+                      <div class="flex items-center">
+                        <div class="font-medium flex-shrink-0">详细描述:</div>
                         <span
-                          class="px-1.5 py-0.5 rounded bg-gray-100 group-hover:bg-blue-100 text-gray-500 group-hover:text-blue-600 transition-colors"
+                          class="font-medium break-all whitespace-pre-wrap group-hover:text-blue-600 transition-colors"
                         >
-                          {{ item.duration }}H
+                          {{ item.constructionDetail || '-' }}
                         </span>
                       </div>
                     </div>
-                  </div>
+                  </el-popover>
                 </div>
+                <span v-else class="text-gray-300">-</span>
               </template>
             </zm-table-column>
             <zm-table-column prop="contractName" label="项目" />

+ 101 - 44
src/views/pms/iotrydailyreport/ry-xj-table.vue

@@ -308,54 +308,118 @@ function handleCurrentChange(val: number) {
             <zm-table-column
               prop="reportDetails"
               label="生产动态"
-              width="500"
+              width="320"
               :show-overflow-tooltip="false"
             >
               <template #default="{ row }">
-                <div class="flex flex-col gap-1 py-1">
-                  <div
-                    v-for="(item, index) in row.reportDetails"
-                    :key="index"
-                    class="group flex flex-col gap-1 p-2 rounded-md bg-gray-200/80 hover:bg-blue-100 transition-colors"
+                <div v-if="row.reportDetails && row.reportDetails.length > 0" class="py-2">
+                  <el-popover
+                    placement="right"
+                    trigger="hover"
+                    width="320"
+                    popper-class="!p-3 flex flex-col gap-y-2"
+                    :disabled="row.reportDetails.length <= 1"
                   >
-                    <div class="flex items-center text-12px text-gray-500">
-                      <div class="flex items-center w-100px flex-shrink-0">
-                        <div class="i-carbon-calendar mr-1 opacity-70"></div>
-                        <span class="font-mono">{{
-                          dayjs(row.createTime).format('YYYY-MM-DD')
-                        }}</span>
+                    <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.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">结束井深(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>
+                            <span
+                              class="font-medium break-all whitespace-pre-wrap group-hover:text-blue-600 transition-colors"
+                            >
+                              {{ row.reportDetails[0].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"
+                            >
+                              {{ row.reportDetails[0].constructionDetail || '-' }}
+                            </span>
+                          </div>
+                        </div>
+                      </el-badge>
+                    </template>
+                    <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(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 flex-1 min-w-0 px-2 ml-1">
-                        <span class="text-gray-400 mr-1 flex-shrink-0">工况:</span>
+                      <!-- <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>
                         <el-tooltip
+                          effect="dark"
                           :content="item.currentOperation"
                           placement="top"
-                          :disabled="!item.currentOperation"
                           popper-class="max-w-100"
                         >
-                          <span class="truncate text-gray-700 font-600">{{
-                            item.currentOperation || '-'
-                          }}</span>
+                          <span
+                            class="font-medium truncate group-hover:text-blue-600 transition-colors"
+                          >
+                            {{ item.currentOperation || '-' }}
+                          </span>
                         </el-tooltip>
                       </div>
 
-                      <!-- <div class="flex items-center justify-end w-120px flex-shrink-0 ml-auto">
-                        <span class="text-gray-400 mr-1">结束井深:</span>
-                        <span class="font-bold text-blue-600 font-mono">{{
-                          item.currentDepth
-                        }}</span>
-                        <span class="ml-0.5 text-10px">m</span>
-                      </div> -->
-                    </div>
-
-                    <div class="flex items-center text-12px gap-x-3">
-                      <div class="flex items-center w-100px flex-shrink-0 text-gray-400 italic">
-                        <span>{{ formatT(item.startTime) }}-{{ formatT(item.endTime) }}</span>
-                      </div>
-
-                      <div class="flex items-center flex-1 min-w-0">
-                        <span class="text-gray-400 mr-2 font-bold flex-shrink-0">详情:</span>
+                      <div class="flex items-center">
+                        <div class="font-medium flex-shrink-0">详细描述:</div>
                         <el-tooltip
                           effect="dark"
                           :content="item.constructionDetail"
@@ -363,23 +427,16 @@ function handleCurrentChange(val: number) {
                           popper-class="max-w-100"
                         >
                           <span
-                            class="truncate text-gray-600 cursor-help group-hover:text-blue-700 transition-colors"
+                            class="font-medium truncate group-hover:text-blue-600 transition-colors"
                           >
                             {{ item.constructionDetail || '-' }}
                           </span>
                         </el-tooltip>
                       </div>
-
-                      <div class="w-60px flex-shrink-0 text-right">
-                        <span
-                          class="px-1.5 py-0.5 rounded bg-gray-100 group-hover:bg-blue-100 text-gray-500 group-hover:text-blue-600 transition-colors"
-                        >
-                          {{ item.duration }}H
-                        </span>
-                      </div>
                     </div>
-                  </div>
+                  </el-popover>
                 </div>
+                <span v-else class="text-gray-300">-</span>
               </template>
             </zm-table-column>
             <zm-table-column prop="contractName" label="项目" />