3333

src/views/report/project/Index.vue

@@ -69,7 +69,7 @@
 import { getType, getComplete, setComplete } from '@/views/utils/auth'
 import moment from 'moment'
 import { isEmptyParams, filterExportExcelData, tableColumnsName, checkEmail, personGender, personBirthday, checkImageFileType, checkDocumentFileType } from "@/views/utils/common"
-import projectCreate from '@/views/report/project/components/projectCreate'
+import projectCreate from '@/views/report/project/components/edit/projectCreate'
 import projectView from '@/views/report/project/components/projectView'
 import previewFile from '@/views/components/common/previewFile'
 import knowledgeSelect from '@/views/components/common/knowledgeSelect'

src/views/report/project/components/edit/projectCreate.vue

@@ -2,18 +2,20 @@
 <template>
   <div class="app-content" style="height: 76vh;overflow: auto;">
     <a-spin :spinning="loading" style="width: 100%;height: 100%;">
-      <div>
-        <a-steps size="small" @change="stepsChange" :initial="0">
-          <a-step :status="item" v-for="(item,index) in completeStatus" :key="index+'completeStatus'" :disabled="false" />
+      <div class="page-steps">
+        <a-steps size="small" :current="current">
+          <a-step :status="item.status" v-for="(item,index) in completeStatus" :key="index+'completeStatus'" :title="item.title" />
         </a-steps>
       </div>
       <div class="page-content">
-        <project-edit v-model="value" @close="closeWindow" @load="onLoad" ref="projCreate" v-if="projType"></project-edit>
-        <project-edit-key v-model="value" @close="closeWindow" @load="onLoad" ref="projCreate" v-else></project-edit-key>
+        <project-edit v-model="value" @close="closeWindow" @load="onLoad" :showStatus.sync="showStatus" ref="projCreate" v-if="projType"></project-edit>
+        <project-edit-key v-model="value" @close="closeWindow" @load="onLoad" :showStatus.sync="showStatus" ref="projCreate" v-else></project-edit-key>
       </div>
       <div class="page-footer">
-        <a-button @click="save">保存</a-button>
-        <a-button style="margin-left: 10px" type="primary" @click="submit">完成填写</a-button>
+        <a-button v-if="currSteps > 0" style="margin-left: 40px" type="primary" @click="prev">上一步</a-button>
+        <a-button style="margin-left: 40px" type="primary" @click="save">保 存</a-button>
+        <a-button v-if="currSteps < completeStatus.length - 1" style="margin-left: 40px" type="primary" @click="next">下一步</a-button>
+        <a-button v-if="currSteps == completeStatus.length - 1" style="margin-left: 40px" type="primary" @click="submit">完成填写</a-button>
       </div>
     </a-spin>
   </div>
@@ -32,8 +34,17 @@ export default {
     return {
       loading: false,
       projType: getType() == "1",
-      current: 0,
-      completeStatus: ["process", "finish", "process", "process", "", "", "", "", "", ""],
+      current: 10,
+      currSteps: 0,
+      completeStatus: [
+        { status: "", title: '基本信息' },
+        { status: "", title: '项目组成员及单位' },
+        { status: "", title: '经费预算及设备明细' },
+        { status: "", title: '阶段目标及课题设置' },
+        { status: "", title: '绩效指标' },
+        { status: "", title: '附件' }
+      ],
+      showStatus: [true, false, false, false, false, false],
       stepStyle: {
         marginBottom: '60px',
         boxShadow: '0px -1px 0 0 #e8e8e8 inset',
@@ -46,16 +57,38 @@ export default {
       default: () => {
         return null
       }
-    }
+    },
   },
   created () {
   },
   methods: {
     stepsChange (e) {
+      debugger
+      this.currSteps = e
+      this.changeSteps(this.currSteps)
+      console.log(this.currSteps, 'stepsChange')
+    },
+    next () {
+      this.currSteps++;
+      this.changeSteps(this.currSteps)
+      console.log(this.currSteps, 'next')
+    },
+    prev () {
+      this.currSteps--;
+      this.changeSteps(this.currSteps)
+      console.log(this.currSteps, 'prev')
+    },
+    changeSteps (e) {
       var clone = [].concat(this.completeStatus)
-      clone[e] = "process"
+      clone[e].status = "process"
       this.completeStatus = clone
-      console.log(this.completeStatus)
+      this.changeShowStatus(e)
+    },
+    changeShowStatus (e) {
+      var clone = [false, false, false, false, false, false]
+      clone[e] = true;
+      this.showStatus = clone
+      console.log(this.showStatus)
     },
     save () {
       this.$refs.projCreate.save()
@@ -81,9 +114,16 @@ export default {
   width: 8px;
   height: 6px;
 }
+.page-steps {
+  width: 100%;
+  height: 40px;
+  padding: 8px 20px 5px 20px;
+  background: rgb(248, 248, 248);
+  border: 1px 1px 0px 1px solid #e8e8e8;
+}
 .page-content {
   width: 100%;
-  height: calc(100% - 40px);
+  height: calc(100% - 80px);
   overflow: auto;
 }
 .page-footer {

src/views/report/project/components/edit/projectEdit.vue

 <template>
   <div>
     <a-form-model ref="form" :model="formData" :rules="rules" style="border-top: 0px" class="from-table font-line-space">
-      <div v-if="true">
+      <div v-if="showStatus[0]">
         <a-row>
           <a-col :span="24" style="border-top: 0px;text-align: center;">
             <div class="main-title">
@@ -388,28 +388,36 @@
             </a-form-model-item>
           </a-col>
         </a-row>
-      </div>
-      <div v-if="false">
         <a-row>
           <a-col :span="24" style="border-top: 0px">
             <div class="main-title">
-              <span>项目人员情况</span>
+              <span>申请书正文</span>
             </div>
           </a-col>
         </a-row>
-        <!-- 项目组成员 -->
-        <project-member-edit :dataList.sync="formData.members" />
         <a-row type="flex">
-          <a-col :span="24" style="text-align: center;">
-            <div class="special-middle">
-              &nbsp;
+          <a-col :span="24" class="bg-gray">
+            <div class="special-middle" style="font-weight: bold;text-align: center;">
+              <a :href="'/downloadFile/textTemplate.docx'" download="申请书正文.docx">
+                <a-icon type="download"></a-icon>&nbsp;<span style="color:green;text-decoration:underline;font-size: 16px;">正文模板下载</span>
+              </a>
+              <span style="color: red;margin-left: 42px;">注：正文部分需要下载模版，填写完成后上传到系统中,格式 .doc,.docx。</span>
             </div>
           </a-col>
         </a-row>
-        <!-- 项目主要参与单位及分工 -->
-        <participate-units-edit :participateUnits.sync="formData.participateUnits" />
-      </div>
-      <div v-if="false">
+        <a-row type="flex">
+          <a-col :span="24">
+            <div style="min-height:34px;line-height: 40px;text-align: center;">
+              <up-load :isUpload="true" :file.sync="formData" :format="['doc', 'docx']" message="请上传申请书正文" />
+            </div>
+          </a-col>
+        </a-row>
+        <a-row type="flex">
+          <a-col :span="24">
+            <!-- <document-view :fileUrl="formData.downloadUrl" :fileName="formData.fileName" :imageArray="[formData.downloadUrl]"></document-view>
+          <preview-file v-model="formData.downloadUrl" :fileName="formData.fileName"></preview-file> -->
+          </a-col>
+        </a-row>
         <a-row>
           <a-col :span="24" style="border-top: 0px">
             <div class="main-title">
@@ -504,39 +512,27 @@
           </a-col>
         </a-row>
       </div>
-      <div v-if="false">
+      <div v-if="showStatus[1]">
         <a-row>
           <a-col :span="24" style="border-top: 0px">
             <div class="main-title">
-              <span>申请书正文</span>
-            </div>
-          </a-col>
-        </a-row>
-        <a-row type="flex">
-          <a-col :span="24" class="bg-gray">
-            <div class="special-middle" style="font-weight: bold;text-align: center;">
-              <a :href="'/downloadFile/textTemplate.docx'" download="申请书正文.docx">
-                <a-icon type="download"></a-icon>&nbsp;<span style="color:green;text-decoration:underline;font-size: 16px;">正文模板下载</span>
-              </a>
-              <span style="color: red;margin-left: 42px;">注：正文部分需要下载模版，填写完成后上传到系统中,格式 .doc,.docx。</span>
+              <span>项目人员情况</span>
             </div>
           </a-col>
         </a-row>
+        <!-- 项目组成员 -->
+        <project-member-edit :dataList.sync="formData.members" />
         <a-row type="flex">
-          <a-col :span="24">
-            <div style="min-height:34px;line-height: 40px;text-align: center;">
-              <up-load :isUpload="true" :file.sync="formData" :format="['doc', 'docx']" message="请上传申请书正文" />
+          <a-col :span="24" style="text-align: center;">
+            <div class="special-middle">
+              &nbsp;
             </div>
           </a-col>
         </a-row>
-        <a-row type="flex">
-          <a-col :span="24">
-            <!-- <document-view :fileUrl="formData.downloadUrl" :fileName="formData.fileName" :imageArray="[formData.downloadUrl]"></document-view>
-          <preview-file v-model="formData.downloadUrl" :fileName="formData.fileName"></preview-file> -->
-          </a-col>
-        </a-row>
+        <!-- 项目主要参与单位及分工 -->
+        <participate-units-edit :participateUnits.sync="formData.participateUnits" />
       </div>
-      <div v-if="false">
+      <div v-if="showStatus[2]">
         <!-- 经费预算 -->
         <budget-edit :budget.sync="formData.budget" @save="budgetSave" />
         <a-row type="flex">
@@ -576,7 +572,13 @@
         <!-- 项目承担单位研究资金支出预算明细表 -->
         <unit-payment-edit :unitPayment.sync="formData.unitPayment" />
       </div>
-      <div v-if="false">
+      <div v-if="showStatus[3]">
+        <!-- 项目安排及阶段目标 -->
+        <proj-stage-goals-edit :stageGoals.sync="formData.stageGoals" />
+        <!-- 项目课题设置 -->
+        <project-sub-edit :projectSubList.sync="formData.projectSubList" />
+      </div>
+      <div v-if="showStatus[4]">
         <a-row type="flex">
           <a-col :span="24" style="text-align: center;">
             <div class="special-middle">
@@ -587,13 +589,7 @@
         <!-- 项目绩效指标 -->
         <project-kpi-edit :projectKPI.sync="formData.projectKPI" />
       </div>
-      <div v-if="false">
-        <!-- 项目安排及阶段目标 -->
-        <proj-stage-goals-edit :stageGoals.sync="formData.stageGoals" />
-        <!-- 项目课题设置 -->
-        <project-sub-edit :projectSubList.sync="formData.projectSubList" />
-      </div>
-      <div v-if="false">
+      <div v-if="showStatus[5]">
         <!-- 附件 -->
         <file-edit :fileList.sync="formData.fileList" />
       </div>
@@ -681,8 +677,15 @@ export default {
         return null
       }
     },
+    showStatus: {
+      type: Array,
+      default () {
+        return [true, false, false, false, false, false]
+      }
+    },
   },
   created () {
+    console.log(this.showStatus)
     this.getProject()
   },
   data () {
@@ -889,7 +892,7 @@ export default {
             })
           }
         } else {
-          this.$message.warn('项目信息未填写完全！')
+          this.$message.error('项目信息未填写完全！')
           return false
         }
       })

src/views/report/project/components/fileEdit.vue

@@ -10,8 +10,8 @@
     <a-row type="flex">
       <a-col :span="24" class="bg-gray">
         <div class="special-middle">
-        <a href="/downloadFile/202412130901.docx" download="单位承诺书模版.docx" style="margin-right: 20px;">
-          <a-icon type="download"></a-icon>&nbsp;<span style="color:green;text-decoration:underline;">单位承诺书模版</span>
+        <a href="/downloadFile/202412130901.docx" download="临床医学中心承诺书模版.docx" style="margin-right: 20px;">
+          <a-icon type="download"></a-icon>&nbsp;<span style="color:green;text-decoration:underline;">临床医学中心承诺书模版</span>
         </a>
         <a href="/downloadFile/202412130902.docx" download="个人承诺书模版.docx" style="margin-right: 20px;">
           <a-icon type="download"></a-icon>&nbsp;<span style="color:green;text-decoration:underline;">个人承诺书模版</span>

static/css/common.less

@@ -251,7 +251,7 @@
     }
 
     .ant-modal-body {
-        padding: 8px !important;
+        padding: 4px !important;
     }
 }