pms 瑞都日报 查看 审批 编辑 模式

src/views/pms/iotrddailyreport/FillDailyReportForm.vue

@@ -2,10 +2,10 @@
   <ContentWrap v-loading="formLoading">
     <!-- 第一部分：日报标题 -->
     <div class="daily-report-title">
-      <h2>{{ isApprovalMode ? dailyReportApprovalTitle : dailyReportTitle }}</h2>
+      <h2>{{ pageTitle  }}</h2>
       <!-- 在审批模式下显示审批状态提示 -->
-      <div v-if="isApprovalMode" class="approval-notice">
-        <el-alert title="审批模式：所有字段均为只读" type="info" :closable="false" />
+      <div v-if="isReadonlyMode" class="approval-notice">
+        <el-alert :title="modeNotice" type="info" :closable="false" />
       </div>
     </div>
 
@@ -120,11 +120,11 @@
       <el-form
         ref="formRef"
         :model="formData"
-        :rules="isApprovalMode ? {} : formRules"
+        :rules="isReadonlyMode ? {} : formRules"
         v-loading="formLoading"
         style="margin-top: 1em"
         label-width="200px"
-        :disabled="isApprovalMode"
+        :disabled="isReadonlyMode"
       >
         <!-- 第一行：时间节点、施工状态 -->
         <el-row :gutter="30">
@@ -138,13 +138,15 @@
                 end-placeholder="结束时间"
                 placeholder="选择时间范围"
                 style="width: 100%"
-                :readonly="isApprovalMode"
+                :readonly="isReadonlyMode"
+                :disabled="isReadonlyMode"
               />
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="施工状态" prop="rdStatus">
-              <el-select v-model="formData.rdStatus" placeholder="请选择施工状态" style="width: 100%" :disabled="isApprovalMode">
+              <el-select v-model="formData.rdStatus" placeholder="请选择施工状态"
+                         style="width: 100%" :disabled="isReadonlyMode">
                 <el-option
                   v-for="dict in rdStatusOptions"
                   :key="dict.value"
@@ -161,7 +163,7 @@
           <el-col :span="24">
             <el-form-item label="施工工艺" prop="techniqueIds">
               <el-select v-model="formData.techniqueIds" placeholder="请选择施工工艺"
-                         style="width: 100%" multiple :disabled="isApprovalMode">
+                         style="width: 100%" multiple :disabled="isReadonlyMode">
                 <el-option
                   v-for="dict in techniqueOptions"
                   :key="dict.value"
@@ -183,14 +185,14 @@
             <el-form-item
               :label="attr.name + (attr.unit ? `(${attr.unit})` : '')"
               :prop="'dynamicFields.' + attr.identifier"
-              :rules="isApprovalMode ? [] : getDynamicAttrRules(attr)"
+              :rules="isReadonlyMode ? [] : getDynamicAttrRules(attr)"
             >
               <!-- 文本类型 -->
               <el-input
                 v-if="attr.dataType === 'text'"
                 v-model="formData.dynamicFields[attr.identifier]"
                 :placeholder="`请输入${attr.name}`"
-                :readonly="isApprovalMode"
+                :readonly="isReadonlyMode"
               />
 
               <!-- 文本域类型 -->
@@ -200,7 +202,7 @@
                 :placeholder="`请输入${attr.name}`"
                 type="textarea"
                 :rows="3"
-                :readonly="isApprovalMode"
+                :readonly="isReadonlyMode"
               />
 
               <!-- 数字类型 -->
@@ -211,7 +213,7 @@
                 type="number"
                 :min="attr.minValue || undefined"
                 :max="attr.maxValue || undefined"
-                :readonly="isApprovalMode"
+                :readonly="isReadonlyMode"
               />
 
               <!-- 日期类型 -->
@@ -222,7 +224,7 @@
                 value-format="x"
                 :placeholder="`选择${attr.name}`"
                 style="width: 100%"
-                :readonly="isApprovalMode"
+                :readonly="isReadonlyMode"
               />
 
               <!-- 默认文本输入 -->
@@ -230,7 +232,7 @@
                 v-else
                 v-model="formData.dynamicFields[attr.identifier]"
                 :placeholder="`请输入${attr.name}`"
-                :readonly="isApprovalMode"
+                :readonly="isReadonlyMode"
               />
             </el-form-item>
           </el-col>
@@ -245,7 +247,7 @@
                 type="textarea"
                 :rows="3"
                 placeholder="请输入当日生产动态"
-                :readonly="isApprovalMode"
+                :readonly="isReadonlyMode"
               />
             </el-form-item>
           </el-col>
@@ -260,7 +262,7 @@
                 type="textarea"
                 :rows="3"
                 placeholder="请输入下步工作计划"
-                :readonly="isApprovalMode"
+                :readonly="isReadonlyMode"
               />
             </el-form-item>
           </el-col>
@@ -275,7 +277,7 @@
                 type="textarea"
                 :rows="3"
                 placeholder="请输入外租设备信息"
-                :readonly="isApprovalMode"
+                :readonly="isReadonlyMode"
               />
             </el-form-item>
           </el-col>
@@ -287,7 +289,7 @@
             <el-form-item label="附件">
               <!-- 文件上传组件 -->
               <FileUpload
-                v-if="!isApprovalMode"
+                v-if="!isReadonlyMode"
                 ref="fileUploadRef"
                 :device-id="deviceId"
                 :show-folder-button="false"
@@ -306,7 +308,7 @@
                     {{ attachment.filename }}
                   </a>
                   <el-button
-                    v-if="!isApprovalMode"
+                    v-if="!isReadonlyMode"
                     type="danger"
                     link
                     size="small"
@@ -354,7 +356,7 @@
     </ContentWrap>
 
     <!-- 操作按钮 -->
-    <ContentWrap class="section-padding" v-if="!isApprovalMode">
+    <ContentWrap class="section-padding" v-if="isEditMode">
       <el-form>
         <el-form-item style="float: right">
           <el-button @click="submitForm" type="primary" :disabled="formLoading">
@@ -380,6 +382,15 @@
       </el-form>
     </ContentWrap>
 
+    <!-- 详情模式下的操作按钮 - 只有关闭按钮 -->
+    <ContentWrap class="section-padding" v-if="isDetailMode">
+      <el-form>
+        <el-form-item style="float: right">
+          <el-button @click="close">{{ t('common.close') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </ContentWrap>
+
   </ContentWrap>
 </template>
 
@@ -414,6 +425,41 @@ const id = params.id // 瑞都日报id
 // 日报数据
 const dailyReportData = ref<any>({})
 
+// 添加模式判断计算属性
+const isApprovalMode = computed(() => params.mode === 'approval')
+const isDetailMode = computed(() => params.mode === 'detail')
+const isEditMode = computed(() => params.mode === 'fill' || !params.mode) // 默认为编辑模式
+
+// 只读模式判断：审批模式或详情模式都为只读
+const isReadonlyMode = computed(() => isApprovalMode.value || isDetailMode.value)
+
+// 页面标题计算
+const pageTitle = computed(() => {
+  if (isApprovalMode.value) {
+    return dailyReportData.value.wellName && dailyReportData.value.constructionStartDate
+      ? `${dailyReportData.value.wellName} - ${formatDate(dailyReportData.value.constructionStartDate)} 日报审批`
+      : '日报审批'
+  } else if (isDetailMode.value) {
+    return dailyReportData.value.wellName && dailyReportData.value.constructionStartDate
+      ? `${dailyReportData.value.wellName} - ${formatDate(dailyReportData.value.constructionStartDate)} 日报详情`
+      : '日报详情'
+  } else {
+    return dailyReportData.value.wellName && dailyReportData.value.constructionStartDate
+      ? `${dailyReportData.value.wellName} - ${formatDate(dailyReportData.value.constructionStartDate)} 生产日报`
+      : '日报填报'
+  }
+})
+
+// 模式提示信息
+const modeNotice = computed(() => {
+  if (isApprovalMode.value) {
+    return '审批模式：所有字段均为只读'
+  } else if (isDetailMode.value) {
+    return '详情模式：所有字段均为只读'
+  }
+  return ''
+})
+
 // 动态属性相关变量
 const dynamicAttrs = ref<any[]>([]) // 存储动态属性列表
 
@@ -592,9 +638,6 @@ const queryParams = reactive({
   techniqueIds: [],
 })
 
-// 添加审批模式判断
-const isApprovalMode = computed(() => params.mode === 'approval')
-
 // 下拉选项
 const rdStatusOptions = getStrDictOptions(DICT_TYPE.PMS_PROJECT_RD_STATUS)   // 施工状态
 const techniqueOptions = getStrDictOptions(DICT_TYPE.PMS_PROJECT_RD_TECHNOLOGY) // 瑞都施工工艺
@@ -920,6 +963,11 @@ onMounted(async () => {
 
 /** 审批操作 */
 const handleApprove = async (action: 'pass' | 'reject') => {
+  // 只有在审批模式下才执行审批操作
+  if (!isApprovalMode.value) {
+    message.warning('当前不是审批模式')
+    return
+  }
   try {
     // 验证审批表单（如果需要）
     // await approvalFormRef.value.validate()
@@ -1151,6 +1199,23 @@ const handleApprove = async (action: 'pass' | 'reject') => {
   cursor: not-allowed;
 }
 
+/* 只读模式下表单字段的样式 */
+:deep(.el-form-item.is-disabled .el-input__inner),
+:deep(.el-form-item.is-disabled .el-textarea__inner),
+:deep(.el-form-item.is-disabled .el-select .el-input__inner),
+:deep(.el-form-item.is-disabled .el-date-editor .el-input__inner) {
+  background-color: #f5f7fa;
+  border-color: #e4e7ed;
+  color: #606266; /* 保持文字可读性 */
+  cursor: not-allowed;
+}
+
+/* 详情模式下的特殊样式 */
+.detail-mode .cell-value {
+  color: #303133;
+  font-weight: normal;
+}
+
 /* 添加审批意见区域的样式 */
 .approval-opinion-section {
   margin-top: 20px;

src/views/pms/iotrddailyreport/fillDailyReport.vue

@@ -113,7 +113,7 @@
           <el-button
             link
             type="success"
-            @click="handleDelete(scope.row.id)"
+            @click="handleDetail(scope.row.id)"
             v-hasPermi="['pms:iot-rd-daily-report:query']"
           >
             查看
@@ -223,7 +223,7 @@ const resetQuery = () => {
 /** 添加/修改操作 */
 const formRef = ref()
 const openForm = (type: string, id?: number) => {
-  push({ name: 'FillDailyReportForm', params:{ id: id,mode: 'fill' } })
+  push({ name: 'FillDailyReportForm', params:{ id: id, mode: 'fill' } })
 }
 
 /** 删除按钮操作 */
@@ -239,6 +239,22 @@ const handleDelete = async (id: number) => {
   } catch {}
 }
 
+/** 查看日报详情 */
+const handleDetail = async (id: number) => {
+  try {
+    // 跳转到 FillDailyReportForm 页面，传递审批模式和ID
+    push({
+      name: 'FillDailyReportForm',
+      params: {
+        id: id.toString(),
+        mode: 'detail'  // 添加详情模式标识
+      }
+    })
+  } catch (error) {
+    console.error('跳转详情页面失败:', error)
+  }
+}
+
 /** 导出按钮操作 */
 const handleExport = async () => {
   try {

src/views/pms/iotrddailyreport/index.vue

@@ -117,6 +117,7 @@
       />
       <el-table-column label="操作" align="center" min-width="120px" fixed="right">
         <template #default="scope">
+          <!--
           <el-button
             link
             type="primary"
@@ -124,7 +125,7 @@
             v-hasPermi="['pms:iot-rd-daily-report:update']"
           >
             编辑
-          </el-button>
+          </el-button> -->
           <el-button
             link
             type="warning"