更新只读状态

zrch-risk-client-39/src/views/flowable/task/components/ShowFormModal.vue

@@ -21,28 +21,29 @@
         <div class="tab-content readonly-content">
           <component
             :is="getComponent(node.formUrl || node.formListUrl)"
-            :disabled="true"
-            :readonly="true"
+            :disabled="innerDisabled"
+            :readonly="innerReadonly"
             :form-data="getFormData(node.id)"
             :current-flow-node="node"
           />
         </div>
       </a-tab-pane>
 
-      <!-- 可编辑选项卡：索引等于 currentNodeIndex 的节点 -->
+      <!-- 当前节点选项卡：根据disabled/readonly状态决定是否可编辑 -->
       <a-tab-pane v-if="editableNode" :key="editableNode.id" :tab="editableNode.name">
         <template #tab>
           <span>
             {{ editableNode.name }}
-            <a-tag color="green" size="small" class="tab-tag">可编辑</a-tag>
+            <a-tag v-if="innerDisabled || innerReadonly" color="blue" size="small" class="tab-tag">只读</a-tag>
+            <a-tag v-else color="green" size="small" class="tab-tag">可编辑</a-tag>
           </span>
         </template>
         <div class="tab-content editable-content">
           <component
             :is="getComponent(editableNode.formUrl || editableNode.formListUrl)"
             :ref="setEditableFormRef"
-            :disabled="false"
-            :readonly="false"
+            :disabled="innerDisabled"
+            :readonly="innerReadonly"
             :form-data="currentFormData"
             :current-flow-node="editableNode"
             @update:form-data="handleFormDataUpdate"
@@ -124,6 +125,16 @@
       type: String,
       default: '',
     },
+    // 表单是否禁用
+    disabled: {
+      type: Boolean,
+      default: false,
+    },
+    // 表单是否只读
+    readonly: {
+      type: Boolean,
+      default: false,
+    },
   });
 
   const emit = defineEmits(['update:visible', 'submit', 'close', 'form-data-update', 'register']);
@@ -165,6 +176,8 @@
   const innerExternalFormData = ref<Record<string, any>>(props.externalFormData || {});
   const innerTitle = ref<string>(props.title || '表单处理');
   const innerProcDefId = ref<string>(props.procDefId || '');
+  const innerDisabled = ref<boolean>(props.disabled || false);
+  const innerReadonly = ref<boolean>(props.readonly || false);
 
   // useModalInner receives data written by useModal.openModal
   const [registerInner, { setModalProps: innerSetModalProps }] = useModalInner(async (data: any) => {
@@ -174,6 +187,8 @@
     if (data.externalFormData) innerExternalFormData.value = data.externalFormData;
     if (data.procDefId) innerProcDefId.value = data.procDefId;
     if (data.title) innerTitle.value = data.title;
+    if (data.disabled !== undefined) innerDisabled.value = !!data.disabled;
+    if (data.readonly !== undefined) innerReadonly.value = !!data.readonly;
     // ensure drawer opens
     visibleRef.value = true;
     // reset form data for new nodes/data
@@ -200,11 +215,18 @@
   const drawerTitle = computed(() => innerTitle.value || props.title);
   const drawerWidth = computed(() => props.width);
 
-  // 只读节点：索引小于 currentNodeIndex 的节点
+  // 只读节点：根据disabled/readonly状态决定
   const readonlyNodes = computed(() => {
     if (!innerWorkflowNodes.value || innerWorkflowNodes.value.length === 0) {
       return [];
     }
+
+    // 如果设置了disabled或readonly参数，所有节点都视为只读
+    if (innerDisabled.value || innerReadonly.value) {
+      console.log('所有节点都设置为只读，因为disabled:', innerDisabled.value, '或readonly:', innerReadonly.value);
+      return innerWorkflowNodes.value;
+    }
+
     const idx = innerCurrentNodeIndex.value;
     console.log('只读节点 - 当前索引:', idx);
     console.log(
@@ -221,8 +243,14 @@
     return nodes;
   });
 
-  // 可编辑节点：索引等于 currentNodeIndex 的节点
+  // 可编辑节点：根据disabled/readonly状态决定
   const editableNode = computed(() => {
+    // 如果设置了disabled或readonly参数，不显示可编辑节点
+    if (innerDisabled.value || innerReadonly.value) {
+      console.log('不显示可编辑节点，因为disabled:', innerDisabled.value, '或readonly:', innerReadonly.value);
+      return null;
+    }
+
     if (!innerWorkflowNodes.value || innerWorkflowNodes.value.length === 0) {
       return null;
     }

zrch-risk-client-39/src/views/flowable/task/myProcess/components/Detail.vue

@@ -275,6 +275,9 @@
       externalFormData,
       title: data?.taskName || '表单',
       showFooter: false,
+      // 设置表单为只读状态
+      disabled: true,
+      readonly: true,
     });
   };
 

zrch-risk-client-39/src/views/project/plan/components/StPlanExcuteForm.vue

@@ -11,7 +11,7 @@
       <a-form ref="formRef" :model="formFields" layout="vertical" class="styled-form">
         <!-- 执行状态 -->
         <a-form-item label="执行状态" name="executeStatus">
-          <a-select v-model:value="formFields.executeStatus" placeholder="请选择执行状态">
+          <a-select v-model:value="formFields.executeStatus" :disabled="disabled || readonly" placeholder="请选择执行状态">
             <a-select-option value="0">
               <span class="status-option">
                 <span class="status-indicator pending"></span>
@@ -42,28 +42,45 @@
         <!-- 时间选择区域 -->
         <div class="form-row">
           <a-form-item label="实际开始时间" name="actualStartTime" class="form-item-half">
-            <a-date-picker v-model:value="formFields.actualStartTime" placeholder="选择时间" format="YYYY-MM-DD"></a-date-picker>
+            <a-date-picker
+              v-model:value="formFields.actualStartTime"
+              :disabled="disabled || readonly"
+              placeholder="选择时间"
+              format="YYYY-MM-DD"
+            ></a-date-picker>
           </a-form-item>
 
           <a-form-item label="实际结束时间" name="actualEndTime" class="form-item-half" :rules="endDateRules">
-            <a-date-picker v-model:value="formFields.actualEndTime" placeholder="选择时间" format="YYYY-MM-DD"></a-date-picker>
+            <a-date-picker
+              v-model:value="formFields.actualEndTime"
+              :disabled="disabled || readonly"
+              placeholder="选择时间"
+              format="YYYY-MM-DD"
+            ></a-date-picker>
           </a-form-item>
         </div>
 
         <!-- 执行记录 -->
         <a-form-item label="执行记录" name="executeEcord">
-          <a-textarea v-model:value="formFields.executeEcord" :rows="3" placeholder="请输入执行记录和详细说明..." show-count :maxlength="500" />
+          <a-textarea
+            v-model:value="formFields.executeEcord"
+            :disabled="disabled || readonly"
+            :rows="3"
+            placeholder="请输入执行记录和详细说明..."
+            show-count
+            :maxlength="500"
+          />
         </a-form-item>
 
         <!-- 附件上传 -->
         <a-form-item label="相关附件" name="attachments">
-          <JUpload v-model:value="formFields.attachments" desText="支持扩展名: .rar .zip .doc .docx .pdf .jpg..." />
+          <JUpload v-model:value="formFields.attachments" :disabled="disabled || readonly" desText="支持扩展名: .rar .zip .doc .docx .pdf .jpg..." />
         </a-form-item>
       </a-form>
     </div>
 
     <!-- 表单底部按钮 -->
-    <div class="form-footer">
+    <div v-if="!readonly" class="form-footer">
       <a-space :size="12">
         <a-button @click="resetForm">重置</a-button>
         <a-button type="primary" @click="submitForm">保存</a-button>
@@ -278,6 +295,12 @@
 
   const submitForm = async () => {
     try {
+      // 只读模式下不允许提交
+      if (props.readonly) {
+        message.warning('只读模式下无法提交表单');
+        return;
+      }
+
       // 验证表单
       try {
         await formRef.value.validate();
@@ -343,6 +366,11 @@
   };
 
   const resetForm = () => {
+    // 只读模式下不允许重置
+    if (props.readonly) {
+      message.warning('只读模式下无法重置表单');
+      return;
+    }
     formRef.value.resetFields();
     // 重置为初始化的数据
     initFormData();
@@ -357,7 +385,10 @@
     if (props.formData && props.formData.id && Object.keys(props.formData).length > 1) {
       console.log('props.formData已有完整数据，直接使用，不再查询接口');
       initFormData();
+      // 只在非只读模式下注册提交回调
+      if (!props.readonly) {
         planFormStore.registerSubmitCallback(submitForm);
+      }
       return;
     }
 
@@ -382,7 +413,10 @@
       }
     }
 
+    // 只在非只读模式下注册提交回调
+    if (!props.readonly) {
       planFormStore.registerSubmitCallback(submitForm);
+    }
   });
 
   // 监听路由参数变化