2222

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

@@ -2,15 +2,19 @@
 <template>
   <div class="app-content layoutEmbedded" style="height: 76vh;overflow: auto;">
     <a-spin :spinning="loading" style="width: 100%;height: 100%;">
+      <a-tabs type="card" hideAdd size="small" @change="callback">
+        <a-tab-pane :key="item.key" :tab="item.title" v-for="(item) in tabsData">
+        </a-tab-pane>
+      </a-tabs>
       <!-- 申报项目详情 -->
       <!-- <a-button type="primary" @click="onExport">导出</a-button> -->
-      <project-info v-model="projectInfo" v-if="projType" />
-      <project-info-Key v-model="projectInfo" v-else />
+      <project-info v-model="projectInfo" :tabsData="tabsData" v-if="projType" />
+      <project-info-Key v-model="projectInfo" :tabsData="tabsData" v-else />
     </a-spin>
   </div>
 </template>
 <script>
-const projectKPI = { 
+const projectKPI = {
   reportYear: "",
   projName: "",
   appUnitName: "",
@@ -49,6 +53,20 @@ export default {
   },
   data () {
     return {
+      tabsData: [
+        { title: '全部', key: '0', isShow: true },
+        { title: '基本情况', key: '1', isShow: false },
+        { title: '项目人员情况', key: '2', isShow: false },
+        { title: '项目可行性研究情况', key: '3', isShow: false },
+        { title: '项目实施目标', key: '4', isShow: false },
+        { title: '项目考核指标', key: '5', isShow: false },
+        { title: '项目经费', key: '6' },
+        { title: '项目绩效目标表', key: '7', isShow: false },
+        { title: '项目课题设置', key: '8' },
+        { title: '附件清单', key: '9' },
+        { title: '单位科研项目及资金管理制度', key: '10', isShow: false },
+        { title: '诚信承诺书', key: '11', isShow: false },
+      ],
       projectInfo: {
         id: null,
         organizationCode: null,
@@ -142,7 +160,19 @@ export default {
         document.body.removeChild(downloadElement); //下载完成移除元素
         window.URL.revokeObjectURL(href); //释放blob
       })
-    }
+    },
+    callback (key) {
+      var index = parseInt(key)
+      this.tabsData.forEach(e => {
+        if (key == '0')
+          e.isShow = true
+        else
+          e.isShow = false
+      })
+      this.tabsData[0].isShow = true;
+      this.tabsData[index].isShow = true;
+      console.log(this.tabsData);
+    },
   },
 }
 </script>