From 2d27ec8c10d9be5d151e634f059eb4813623a4a3 Mon Sep 17 00:00:00 2001
From: gaoshuaixing <gaoshuaixing@bilibili.com>
Date: Thu, 24 Dec 2020 18:23:09 +0800
Subject: [PATCH] example open dir

---
 app/controller/v1/example.js         | 29 +++++++++---
 app/service/example.js               |  4 +-
 frontend/package.json                |  2 +
 frontend/src/api/main.js             | 31 +++++++++++++
 frontend/src/config/router.config.js | 49 ++++++++++++--------
 frontend/src/main.js                 |  3 ++
 frontend/src/utils/axios.js          | 35 ++++++++++++++
 frontend/src/utils/request.js        | 61 +++++++++++++++++++++++++
 frontend/src/utils/util.js           | 68 ++++++++++++++++++++++++++++
 frontend/src/views/Layout.vue        | 10 ++--
 frontend/src/views/file/OpenDir.vue  | 66 +++++++++++++++++++++++++++
 11 files changed, 324 insertions(+), 34 deletions(-)
 create mode 100644 frontend/src/api/main.js
 create mode 100644 frontend/src/utils/axios.js
 create mode 100644 frontend/src/utils/request.js
 create mode 100644 frontend/src/utils/util.js
 create mode 100644 frontend/src/views/file/OpenDir.vue

diff --git a/app/controller/v1/example.js b/app/controller/v1/example.js
index 25f2ead..643eaee 100644
--- a/app/controller/v1/example.js
+++ b/app/controller/v1/example.js
@@ -6,13 +6,30 @@ class ExampleController extends BaseController {
 
   async openLocalDir() {
     const self = this;
-    const { service } = this;
+    const { ctx, service } = this;
+    const body = ctx.request.body;
+    const id = body.id;
+    const data = {};
+    let dir = '';
+    switch (id) {
+      case 'download' :
+        dir = 'C:/Users/Public/Downloads';
+        break;
+      case 'picture' :
+        dir = 'C:/Users/Public/Pictures';
+        break;    
+      case 'video' :
+        dir = 'C:/Users/Public/Videos';
+        break;
+      case 'doc' :
+        dir = 'C:/Users/Public/Documents';
+        break;      
+      case 'music' :
+        dir = 'C:/Users/Public/Music';
+        break;    
+    }
 
-    const data = {
-      title: 'example test'
-    };
-
-    await service.example.openLocalDir();
+    await service.example.openLocalDir(dir);
 
     self.sendSuccess(data);
   }
diff --git a/app/service/example.js b/app/service/example.js
index 1396bfb..203f454 100644
--- a/app/service/example.js
+++ b/app/service/example.js
@@ -3,10 +3,10 @@
 const BaseService = require('./base');
 
 class ExampleService extends BaseService {
-  async openLocalDir() {
+  async openLocalDir(dir) {
     const self = this;
 
-    await self.ipcCall('example.openDir');
+    await self.ipcCall('example.openDir', dir);
 
     return true;
   }
diff --git a/frontend/package.json b/frontend/package.json
index 41cfdfb..1cd6e80 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -9,7 +9,9 @@
   },
   "dependencies": {
     "ant-design-vue": "^1.7.2",
+    "axios": "^0.21.1",
     "core-js": "^3.6.5",
+    "store": "^2.0.12",
     "vue": "^2.6.11",
     "vue-quill-editor": "^3.0.6",
     "vue-router": "^3.4.9",
diff --git a/frontend/src/api/main.js b/frontend/src/api/main.js
new file mode 100644
index 0000000..1037d5a
--- /dev/null
+++ b/frontend/src/api/main.js
@@ -0,0 +1,31 @@
+import request from '@/utils/request'
+// import storage from 'store'
+
+const mainApi = {
+  outApi: '/v1/outApi',
+  openDir: '/v1/example/openLocalDir'
+}
+
+/**
+ * outApi
+ */
+// export function outApi (parameter) {
+//   parameter.data.token = storage.get(ACCESS_TOKEN)
+//   parameter.data.uid = storage.get(USER_INFO) ? storage.get(USER_INFO).uid : ''
+//   return request({
+//     url: mainApi.outApi,
+//     method: 'post',
+//     data: parameter
+//   })
+// }
+
+/**
+ * openDir
+ */
+export function openDir (parameter) {
+  return request({
+    url: mainApi.openDir,
+    method: 'post',
+    data: parameter
+  })
+}
\ No newline at end of file
diff --git a/frontend/src/config/router.config.js b/frontend/src/config/router.config.js
index cf3834c..067441c 100644
--- a/frontend/src/config/router.config.js
+++ b/frontend/src/config/router.config.js
@@ -3,22 +3,33 @@
  * @type { *[] }
  */
 export const constantRouterMap = [
-    {
-      path: '/testc',
-      component: { template: '<div><router-view /></div>' },
-      children: [
-        {
-          path: 'testc',
-          name: 'testc',
-          component: { template: '<div><h1>这是设置内一</h1></div>' }
-        },
-        {
-          path: '/testd',
-          name: 'testd',
-          component: { template: '<div><h1>这是设置内二</h1></div>' }
-        }
-      ]
-    },
-    { path: '/testa', component: () => import('@/views/Contenta') },
-    { path: '/testb', component: () => import('@/views/Contentb') }
-  ]
\ No newline at end of file
+  {
+    path: '/file',
+    component: { template: '<div><router-view /></div>' },
+    children: [
+      {
+        path: 'openDir',
+        name: 'FileOpenDir',
+        component: () => import('@/views/file/OpenDir')
+      }
+    ]
+  },
+  {
+    path: '/testc',
+    component: { template: '<div><router-view /></div>' },
+    children: [
+      {
+        path: 'testc',
+        name: 'testc',
+        component: { template: '<div><h1>这是设置内一</h1></div>' }
+      },
+      {
+        path: '/testd',
+        name: 'testd',
+        component: { template: '<div><h1>这是设置内二</h1></div>' }
+      }
+    ]
+  },
+  { path: '/testa', component: () => import('@/views/Contenta') },
+  { path: '/testb', component: () => import('@/views/Contentb') }
+]
\ No newline at end of file
diff --git a/frontend/src/main.js b/frontend/src/main.js
index c70fc1d..99b8621 100644
--- a/frontend/src/main.js
+++ b/frontend/src/main.js
@@ -3,8 +3,11 @@ import antd from 'ant-design-vue';
 import 'ant-design-vue/dist/antd.css';
 import App from './App';
 import router from './router';
+import { VueAxios } from './utils/request'
 
 Vue.use(antd);
+// mount axios to `Vue.$http` and `this.$http`
+Vue.use(VueAxios)
 
 Vue.config.productionTip = false;
 
diff --git a/frontend/src/utils/axios.js b/frontend/src/utils/axios.js
new file mode 100644
index 0000000..3b91f6b
--- /dev/null
+++ b/frontend/src/utils/axios.js
@@ -0,0 +1,35 @@
+const VueAxios = {
+  vm: {},
+  // eslint-disable-next-line no-unused-vars
+  install (Vue, instance) {
+    if (this.installed) {
+      return
+    }
+    this.installed = true
+
+    if (!instance) {
+      // eslint-disable-next-line no-console
+      console.error('You have to install axios')
+      return
+    }
+
+    Vue.axios = instance
+
+    Object.defineProperties(Vue.prototype, {
+      axios: {
+        get: function get () {
+          return instance
+        }
+      },
+      $http: {
+        get: function get () {
+          return instance
+        }
+      }
+    })
+  }
+}
+
+export {
+  VueAxios
+}
diff --git a/frontend/src/utils/request.js b/frontend/src/utils/request.js
new file mode 100644
index 0000000..787aaa1
--- /dev/null
+++ b/frontend/src/utils/request.js
@@ -0,0 +1,61 @@
+import axios from 'axios'
+import storage from 'store'
+import notification from 'ant-design-vue/es/notification'
+import { VueAxios } from './axios'
+
+// 创建 axios 实例
+const request = axios.create({
+  // API 请求的默认前缀
+  baseURL: 'http://localhost:7068/api',
+  timeout: 6000 // 请求超时时间
+})
+
+// 异常拦截处理器
+const errorHandler = (error) => {
+  if (error.response) {
+    const data = error.response.data
+    if (error.response.status === 403) {
+      notification.error({
+        message: 'Forbidden',
+        description: data.message
+      })
+    }
+    if (error.response.status === 401 && !(data.result && data.result.isLogin)) {
+      notification.error({
+        message: 'Unauthorized',
+        description: 'Authorization verification failed'
+      })
+    }
+  }
+  return Promise.reject(error)
+}
+
+// request interceptor
+request.interceptors.request.use(config => {
+  const token = storage.get('token')
+  // 如果 token 存在
+  // 让每个请求携带自定义 token 请根据实际情况自行修改
+  if (token) {
+    config.headers['Access-Token'] = token
+  }
+  return config
+}, errorHandler)
+
+// response interceptor
+request.interceptors.response.use((response) => {
+  return response.data
+}, errorHandler)
+
+const installer = {
+  vm: {},
+  install (Vue) {
+    Vue.use(VueAxios, request)
+  }
+}
+
+export default request
+
+export {
+  installer as VueAxios,
+  request as axios
+}
diff --git a/frontend/src/utils/util.js b/frontend/src/utils/util.js
new file mode 100644
index 0000000..165630e
--- /dev/null
+++ b/frontend/src/utils/util.js
@@ -0,0 +1,68 @@
+export function timeFix () {
+  const time = new Date()
+  const hour = time.getHours()
+  return hour < 9 ? '早上好' : hour <= 11 ? '上午好' : hour <= 13 ? '中午好' : hour < 20 ? '下午好' : '晚上好'
+}
+
+export function welcome () {
+  const arr = ['休息一会儿吧', '准备吃什么呢?', '要不要打一把 DOTA', '我猜你可能累了']
+  const index = Math.floor(Math.random() * arr.length)
+  return arr[index]
+}
+
+/**
+ * 触发 window.resize
+ */
+export function triggerWindowResizeEvent () {
+  const event = document.createEvent('HTMLEvents')
+  event.initEvent('resize', true, true)
+  event.eventType = 'message'
+  window.dispatchEvent(event)
+}
+
+export function handleScrollHeader (callback) {
+  let timer = 0
+
+  let beforeScrollTop = window.pageYOffset
+  callback = callback || function () {}
+  window.addEventListener(
+    'scroll',
+    event => {
+      clearTimeout(timer)
+      timer = setTimeout(() => {
+        let direction = 'up'
+        const afterScrollTop = window.pageYOffset
+        const delta = afterScrollTop - beforeScrollTop
+        if (delta === 0) {
+          return false
+        }
+        direction = delta > 0 ? 'down' : 'up'
+        callback(direction)
+        beforeScrollTop = afterScrollTop
+      }, 50)
+    },
+    false
+  )
+}
+
+export function isIE () {
+  const bw = window.navigator.userAgent
+  const compare = (s) => bw.indexOf(s) >= 0
+  const ie11 = (() => 'ActiveXObject' in window)()
+  return compare('MSIE') || ie11
+}
+
+/**
+ * Remove loading animate
+ * @param id parent element id or class
+ * @param timeout
+ */
+export function removeLoadingAnimate (id = '', timeout = 1500) {
+  if (id === '') {
+    return
+  }
+  setTimeout(() => {
+    document.body.removeChild(document.getElementById(id))
+  }, timeout)
+}
+  
\ No newline at end of file
diff --git a/frontend/src/views/Layout.vue b/frontend/src/views/Layout.vue
index 866ca46..f8cc889 100644
--- a/frontend/src/views/Layout.vue
+++ b/frontend/src/views/Layout.vue
@@ -55,13 +55,9 @@ export default {
       subMenuList: {
         'menu_1' : {
           'subMenu_1' : {
-            title: '首页菜单1',
-            page: '/testa'
-          },
-          'subMenu_2' : {
-            title: '首页菜单2',
-            page: '/testb'
-          },
+            title: '打开文件夹',
+            page: '/file/openDir'
+          }
         },
         'menu_2' : {
           'subMenu_1' : {
diff --git a/frontend/src/views/file/OpenDir.vue b/frontend/src/views/file/OpenDir.vue
new file mode 100644
index 0000000..6d41c1e
--- /dev/null
+++ b/frontend/src/views/file/OpenDir.vue
@@ -0,0 +1,66 @@
+<template>
+  <div>
+    <h3 :style="{ marginBottom: '16px' }">
+      demo 打开文件夹实现
+    </h3>
+    <a-list bordered :data-source="data">
+      <a-list-item @click="openDirectry(item.id)" slot="renderItem" slot-scope="item">
+        {{ item.content }}
+        <a-button type="link">
+          打开
+        </a-button>
+      </a-list-item>
+    </a-list>
+  </div>
+</template>
+<script>
+import { openDir } from '@/api/main'
+
+const data = [
+  {
+    content: '【下载】目录',
+    id: 'download'
+  },
+  {
+    content: '【图片】目录',
+    id: 'picture'
+  },
+  {
+    content: '【视频】目录',
+    id: 'video'
+  },
+  {
+    content: '【文档】目录',
+    id: 'doc'
+  },
+  {
+    content: '【音乐】目录',
+    id: 'music'
+  }
+];
+
+export default {
+  data() {
+    return {
+      data,
+    };
+  },
+  methods: {
+    openDirectry (id) {
+      console.log('id:', id)
+      const params = {
+        'id': id
+      }
+      openDir(params).then(res => {
+        if (res.code !== 0) {
+          return false
+        }
+
+        }).catch(err => {
+          console.log('err:', err)
+        })
+    },
+  }
+};
+</script>
+<style></style>