tabs 加入 keep-alive 缓存页面

重新封装upload,download components.
补全components name
加入charts图表。

src/components/UploadAffix/index.vue

@@ -3,7 +3,7 @@
 <el-upload
   ref="upload"
   class="upload-demo"
-  :action="Params['Url']"
+  :action="baseUrl"
    :data="Params['Param']"
   :headers="token"
    v-if="!Params.IsDetail" 
@@ -40,10 +40,10 @@
 
 
 <script>
-import { getToken } from "@/utils/auth"
-import { download, GetFileList, deletefile } from "@/api/public/file"
-import { timestampToTime } from "@/utils/index"
-
+import { getToken } from "@/utils/auth";
+import {  GetFileList, deletefile } from "@/api/public/file";
+import { timestampToTime } from "@/utils/index";
+import download from '@/utils/download'
 export default {
   name: "UploadAffix",
   data() {
@@ -52,19 +52,19 @@ export default {
       token: {
         auth: getToken()
       },
-      listLoading: false
-    }
+      listLoading: false,
+      baseUrl:`${process.env.BASE_API}file/upload`
+    };
   },
 
   props: {
     Params: {
-      type: Object
+      type: Object    //  IsDetail true则   只显示文件list以及download button
     }
-   
   },
   methods: {
     exportfile(id) {
-      download(id)
+      download(id);
     },
     delete_file(id) {
       this.$confirm("确认删除?", "提示", {
@@ -73,41 +73,35 @@ export default {
         type: "warning"
       }).then(() => {
         deletefile(id).then(res => {
-          this.fetchData_File(id)
-        })
-      })
+          this.fetchData_File(id);
+        });
+      });
     },
-    uploadSuccess(response, file, fileList){
-      console.log(response)
-            console.log(file)
-            console.log(fileList)
-
-            this.$refs.upload.clearFiles()
-
+    uploadSuccess(response, file, fileList) {
+      this.fetchData_File(this.Params.Param.MasterID);
+      this.$refs.upload.clearFiles();
     },
     fetchData_File(id) {
-    this.listLoading = true
+      this.listLoading = true;
 
       GetFileList(id).then(response => {
-        this.filelist = response.data.list
-        this.listLoading = false
-      })
+        this.filelist = response.data.list;
+        this.listLoading = false;
+      });
     },
     timestampToTime
   },
   watch: {
     "Params.Param.MasterID": {
       handler: function(id) {
-        console.log(id)
         this.$nextTick(() => {
-          this.fetchData_File(id)
-        })
+          this.fetchData_File(id);
+        });
       },
-          immediate: true
-
+      immediate: true
     }
   }
-}
+};
 </script>
 
 

src/router/index.js

@@ -41,13 +41,15 @@ export default new Router({
     {
       path: '/Archive',
       component: Layout,
-      redirect: '/Archive/person',
+      redirect: '/Archive/person_edit',
       name:"Archive",
       title:"廉政档案",
       icon:'yonghuming',
       children: [
-        { path: 'person', name: 'person',title:"廉政档案编辑", component: ()=>import('@/views/Archive/person'),meta:{title:"廉政档案编辑"}},
-        { path: 'person_detail', name: 'person_detail',title:"廉政档案查看", component: ()=>import('@/views/Archive/person_detail'),meta:{title:"廉政档案查看"}}
+        { path: 'person_edit', name: 'person_edit',title:"档案编辑", component: ()=>import('@/views/Archive/person_edit'),meta:{title:"廉政档案编辑"}},
+        { path: 'person_detail', name: 'person_detail',title:"档案查看", component: ()=>import('@/views/Archive/person_detail'),meta:{title:"廉政档案查看"}},
+        { path: 'person_count', name: 'person_count',title:"数据统计", component: ()=>import('@/views/Archive/person_count'),meta:{title:"廉政档案统计"}}
+
       ]
     },
     {

src/utils/download.js

@@ -0,0 +1,43 @@
+import axios from 'axios'
+import {getToken} from '@/utils/auth'
+
+export default function  (AffixID){
+
+    console.log(AffixID)
+    return new Promise((resolve,reject)=>{
+        axios.get(`${process.env.BASE_API}file/download`,
+        {
+            headers:{
+                auth:getToken()
+            },
+
+            responseType: 'blob', // 表明返回服务器返回的数据类型, 没有会乱码
+
+            params: {
+                AffixID,
+            }
+
+            }
+        ).then((response)=>{
+            let date = new Date();
+            let filefix = date.getFullYear() + '-' + date.getMonth() + '-' + date.getDate() + ' ' + date.getHours() + ':' + date.getMinutes() + ':' + date.getSeconds();
+            let blob = new Blob([response.data],{
+
+        type: response.headers['Content-Type']
+
+        }); //创建一个blob对象
+            let a = document.createElement('a'); //创建一个<a></a>标签
+            a.href = URL.createObjectURL(blob); // response is a blob
+            a.download = filefix + "下载文件.docx";  //文件名称
+            a.style.display = 'none';
+            document.body.appendChild(a);
+            a.click();
+            a.remove();
+
+    resolve()
+
+        }).catch(e=>{
+            reject(e)
+        })
+    })
+}

src/utils/fetch.js

@@ -38,16 +38,17 @@ service.interceptors.response.use(
     const res = response.data
     if(response.headers["content-type"]=="application/octet-stream")
     {
-       let date = new Date();
-            let filefix = date.getFullYear() + '-' + date.getMonth() + '-' + date.getDate() + ' ' + date.getHours() + ':' + date.getMinutes() + ':' + date.getSeconds();
-            let blob = new Blob([response.data]); //创建一个blob对象
-            let a = document.createElement('a'); //创建一个<a></a>标签
-            a.href = URL.createObjectURL(blob); // response is a blob
-            a.download = filefix + "下载文件.docx";  //文件名称
-            a.style.display = 'none';
-            document.body.appendChild(a);
-            a.click();
-            a.remove();
+  //      let date = new Date();
+  //           let filefix = date.getFullYear() + '-' + date.getMonth() + '-' + date.getDate() + ' ' + date.getHours() + ':' + date.getMinutes() + ':' + date.getSeconds();
+  //           let blob = new Blob([response.data]); //创建一个blob对象
+  //           let a = document.createElement('a'); //创建一个<a></a>标签
+  //           a.href = URL.createObjectURL(blob); // response is a blob
+  //           a.download = filefix + "下载文件.docx";  //文件名称
+  //           a.style.display = 'none';
+  //           document.body.appendChild(a);
+  //           a.click();
+  //           a.remove();
+          return res
     }
     // 401 403 :帐号信息与token不匹配  需要重新拉取token
     if (res.code === 401 || res.code === 403) {

src/views/Archive/person_count.vue

@@ -0,0 +1,28 @@
+<template>
+  <div id="person_count" style="width:100%">
+      <mix-chart id="chart1" width="100%" height="600px" ></mix-chart>
+      <line-marker id="chart2"  width="100%" height="600px"></line-marker>
+      <keyboard id="chart3"  width="100%" height="600px"></keyboard>
+  </div>
+</template>
+
+<script>
+import mixChart from "@/components/Charts/mixChart";
+import lineMarker from "@/components/Charts/lineMarker";
+import keyboard from "@/components/Charts/keyboard";
+
+export default {
+  name: "person_count",
+  data() {
+    return {}
+  },
+  components: {
+    mixChart,
+    lineMarker,
+    keyboard
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+</style>

src/views/Archive/person_detail.vue

@@ -97,7 +97,7 @@ import { GetFormDetail } from "@/api/system/form"
 import { GenerateForm } from "form-making";
 
 export default {
-  name:"Person_Detail",
+  name:"person_detail",
   data() {
     return {
       jsonData: null,

src/views/Archive/person.vue → src/views/Archive/person_edit.vue

@@ -104,7 +104,7 @@ import { GenerateForm } from "form-making";
 import { GetFormDetail } from "@/api/system/form";
 import { newGuid } from "@/utils/index";
 export default {
-  //
+  name:"person_edit",
   data() {
     return {
       jsonData: null,
@@ -125,8 +125,7 @@ export default {
         Param: {
           MasterID: ""
         },
-        IsDetail: false,
-        Url: "http://localhost:8089/file/Upload"
+        IsDetail: false
       },
 
       dialogFormVisible: false,

src/views/DouBan/book.vue

@@ -56,6 +56,7 @@
 <script>
   import axios from "axios";
   export default {
+    name:"book",
     data() {
       return {
         //表格当前页数据

src/views/DouBan/movie.vue

@@ -47,6 +47,8 @@
 <script>
   import axios from "axios";
   export default {
+        name:"movie",
+
     data() {
       return {
         //表格当前页数据

src/views/DouBan/music.vue

@@ -49,6 +49,8 @@
 <script>
   import axios from "axios";
   export default {
+        name:"music",
+
     data() {
       return {
         //表格当前页数据

src/views/layout/components/AppMain.vue

@@ -1,20 +1,24 @@
 <template>
-  <section class="app-main" style="height:100%">
-    <transition name="fade" mode="out-in">
-      <router-view :key="key"></router-view>
+  <section class="app-main">
+    <transition name="fade-transform" mode="out-in">
+      <keep-alive :include="cachedViews">
+        <router-view :key="key"/>
+      </keep-alive>
     </transition>
-
   </section>
-
 </template>
 
+
 <script>
 import BackToTop from '@/components/BackToTop' 
 export default {
   name: 'AppMain',
   computed: {
+    cachedViews() {
+      return this.$store.state.tagsView.cachedViews
+    },
     key() {
-      return this.$route.name !== undefined ? this.$route.name + +new Date() : this.$route + +new Date()
+      return this.$route.fullPath
     }
   },
   components:{
@@ -24,8 +28,8 @@ export default {
 </script>
 <style scoped>
 .app-main {
-  /*84 = navbar + tags-view = 50 +34 */
   width: 100%;
+  height:100%;
   position: relative;
   overflow: auto;
 }

src/views/system/dept.vue

@@ -70,6 +70,7 @@
   } from "@/api/system/dept";
 
   export default {
+    name:"dept",
     data() {
       return {
         textMap: {

src/views/system/role.vue

@@ -77,6 +77,8 @@ import {asyncRouterMap} from '@/router/index'
 import { mapGetters } from "vuex"
 import store from '@/store'
 export default {
+      name:"role",
+
   data() {
     return {
       textMap: {