feat(mobile): 专项资金、项目管理、需求详情页面增加手机端驳回提示

- 在专项资金详情、项目管理详情和需求详情页面中添加了手机端驳回提示 - 提示内容为："当前版本不支持手机端驳回重新提交，请在电脑网页上执行重新提交操作" - 该提示在数据状态为 3 时显示
2025-08-29 12:00:13 +08:00
parent 05ac715461
commit 8c20ecacab
4 changed files with 326 additions and 173 deletions
--- a/src/views/project-demand/requirement/moblieDetail/index.vue
+++ b/src/views/project-demand/requirement/moblieDetail/index.vue
@@ -8,6 +8,13 @@
          <div class="alert-message">当前版本不支持手机端需求上报，请在电脑网页上执行需求上报操作</div>
        </div>
      </div>
+      <div v-if="formData && formData.state == 3" class="notice">
+        <div class="alert-icon">⚠️</div>
+        <div class="alert-content">
+          <div class="alert-title">操作限制提示</div>
+          <div class="alert-message">当前版本不支持手机端驳回重新提交，请在电脑网页上执行重新提交操作。</div>
+        </div>
+      </div>
    </div>

    <div style="padding: 0 10px;" >
--- a/src/views/project-management/mobledetail/SpecialFundDetailMobile.vue
+++ b/src/views/project-management/mobledetail/SpecialFundDetailMobile.vue
@@ -1,7 +1,14 @@
 <template>
-<!--  <special-fund-detail :formData="fundData.formData" :data="fundData" :showTable="showTable" :processViewer="fundProcessViewer"-->
-<!--                       :loading="loading"/>-->
-
+  <div class="page-container">
+    <div class="notice-wrapper">
+      <div v-if="fundData && fundData.state == 3" class="notice">
+        <div class="alert-icon">⚠️</div>
+        <div class="alert-content">
+          <div class="alert-title">操作限制提示</div>
+          <div class="alert-message">当前版本不支持手机端驳回重新提交，请在电脑网页上执行重新提交操作。</div>
+        </div>
+      </div>
+    </div>
    <div v-loading="loading" style="padding: 0 10px;">
      <baseTitle title="专项资金详情"></baseTitle>
      <el-form :model="formData" ref="form" label-width="left">
@@ -21,15 +28,15 @@
              <span>{{ toThousands(formData.residualAmount) }}</span>
            </el-form-item>
          </el-col>
-<!--        <baseTitle title="介绍"></baseTitle>-->
-<!--        <el-col :span="24">-->
-<!--          <el-form-item>-->
-<!--            <el-card style="width: 100%">-->
-<!--              <div v-html="formData.introduce">-->
-<!--              </div>-->
-<!--            </el-card>-->
-<!--          </el-form-item>-->
-<!--        </el-col>-->
+  <!--        <baseTitle title="介绍"></baseTitle>-->
+  <!--        <el-col :span="24">-->
+  <!--          <el-form-item>-->
+  <!--            <el-card style="width: 100%">-->
+  <!--              <div v-html="formData.introduce">-->
+  <!--              </div>-->
+  <!--            </el-card>-->
+  <!--          </el-form-item>-->
+  <!--        </el-col>-->
          <el-col :span="24">
            <el-form-item label="专项资金情况说明" >
              <div style="white-space: pre-wrap">{{formData.introduce}}
@@ -101,6 +108,7 @@
      <file-preview ref="filePreviewRef" :fullscreen="true"  v-if="filePreviewShow" :fileName="filePreviewParam.fileName" :fileUrl="filePreviewParam.fileUrl"
                    :fileType="filePreviewParam.fileType"/>
    </div>
+  </div>
 </template>

 <script setup lang="jsx">
@@ -276,6 +284,47 @@ const getDetail = async () => {
 getDetail()
 </script>
 <style scoped>
+.page-container {
+  position: relative;
+}
+
+.notice-wrapper {
+  /* 与index页面一致 */
+}
+
+.notice {
+  background: linear-gradient(90deg, #fff3f3 0%, #fff8f8 100%);
+  padding: 15px 20px;
+  border-left: 6px solid #ff7875;
+  display: flex;
+  align-items: center;
+  width: 100%;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  border-radius: 0 4px 4px 0;
+}
+
+.notice .alert-icon {
+  font-size: 24px;
+  margin-right: 15px;
+  flex-shrink: 0;
+}
+
+.notice .alert-content {
+  flex: 1;
+}
+
+.notice .alert-title {
+  font-size: 16px;
+  font-weight: 700;
+  margin-bottom: 4px;
+  color: #d9363e;
+}
+
+.notice .alert-message {
+  font-size: 14px;
+  color: #666;
+}
+
 :deep(.el-table--fit ) {
  height: 300px !important;
 }
--- a/src/views/project-management/mobledetail/index.vue
+++ b/src/views/project-management/mobledetail/index.vue
@@ -1,4 +1,14 @@
 <template>
+  <div class="page-container">
+    <div class="notice-wrapper">
+      <div v-if="detailData && detailData.state == 3" class="notice">
+        <div class="alert-icon">⚠️</div>
+        <div class="alert-content">
+          <div class="alert-title">操作限制提示</div>
+          <div class="alert-message">当前版本不支持手机端驳回重新提交，请在电脑网页上执行重新提交操作。</div>
+        </div>
+      </div>
+    </div>
    <div style="padding: 0 10px;">
      <StepsMoblie :active="route.query.id==='-1'?currentStep-1:currentStep" @setDetail="setDetail"
                   @stepChange="stepChange"
@@ -56,6 +66,7 @@
                      :taskUserOptionList="detailData.taskUserOptionList"
                      v-model:value="auditOpinion"/>
    </div>
+  </div>
 </template>


@@ -175,6 +186,47 @@ const stepChange = (data) => {
 </script>

 <style scoped lang="scss">
+.page-container {
+  position: relative;
+}
+
+.notice-wrapper {
+  /* 与special页面一致 */
+}
+
+.notice {
+  background: linear-gradient(90deg, #fff3f3 0%, #fff8f8 100%);
+  padding: 15px 20px;
+  border-left: 6px solid #ff7875;
+  display: flex;
+  align-items: center;
+  width: 100%;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  border-radius: 0 4px 4px 0;
+}
+
+.notice .alert-icon {
+  font-size: 24px;
+  margin-right: 15px;
+  flex-shrink: 0;
+}
+
+.notice .alert-content {
+  flex: 1;
+}
+
+.notice .alert-title {
+  font-size: 16px;
+  font-weight: 700;
+  margin-bottom: 4px;
+  color: #d9363e;
+}
+
+.notice .alert-message {
+  font-size: 14px;
+  color: #666;
+}
+
 .detail-block {
  padding-top: 15px;
 }
@@ -191,11 +243,6 @@ const stepChange = (data) => {
      flex: 1;
      font-size: 16px;
    }
-
-    //.is-active {
-    //  color: black;
-    //  //background-color: #DED0B2;
-    //}
  }
 }
 </style>
--- a/src/views/project-management/phaseDetailMoblie/index.vue
+++ b/src/views/project-management/phaseDetailMoblie/index.vue
@@ -1,4 +1,14 @@
 <template>
+  <div class="page-container">
+    <div class="notice-wrapper">
+      <div v-if="summaryData && summaryData.state == 3" class="notice">
+        <div class="alert-icon">⚠️</div>
+        <div class="alert-content">
+          <div class="alert-title">操作限制提示</div>
+          <div class="alert-message">当前版本不支持手机端驳回重新提交，请在电脑网页上执行重新提交操作。</div>
+        </div>
+      </div>
+    </div>
    <div style="padding: 0 10px; box-sizing: border-box;">
      <baseTitle title="项目基本信息"></baseTitle>
      <fvForm :schema="schema" @getInstance="(e)=>baseForm = e" label-position="left" label-width="left"></fvForm>
@@ -15,6 +25,7 @@
                      :taskUserOptionList="summaryData.taskUserOptionList"
                      v-model:value="auditOpinion"/>
    </div>
+  </div>
 </template>

 <script setup lang="jsx">
@@ -323,5 +334,44 @@ getInfo()
 </script>

 <style scoped>
+.page-container {
+  position: relative;
+}

+.notice-wrapper {
+  /* 与special页面一致 */
+}
+
+.notice {
+  background: linear-gradient(90deg, #fff3f3 0%, #fff8f8 100%);
+  padding: 15px 20px;
+  border-left: 6px solid #ff7875;
+  display: flex;
+  align-items: center;
+  width: 100%;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  border-radius: 0 4px 4px 0;
+}
+
+.notice .alert-icon {
+  font-size: 24px;
+  margin-right: 15px;
+  flex-shrink: 0;
+}
+
+.notice .alert-content {
+  flex: 1;
+}
+
+.notice .alert-title {
+  font-size: 16px;
+  font-weight: 700;
+  margin-bottom: 4px;
+  color: #d9363e;
+}
+
+.notice .alert-message {
+  font-size: 14px;
+  color: #666;
+}
 </style>