初始

package.json

@@ -15,6 +15,7 @@
   },
   "main": "background.js",
   "dependencies": {
+    "axios": "^0.24.0",
     "core-js": "^3.6.5",
     "element-ui": "^2.15.6",
     "vue": "^2.6.11",

src/App.vue

@@ -30,3 +30,7 @@
   }
 }
 </style>
+<style>
+@import './assets/css/normalize.css'; /*引入样式*/
+@import './assets/css/common.less'; /*引入公共样式*/
+</style>

src/assets/css/common.less

+html {
+    background-color: antiquewhite;
+}
\ No newline at end of file

src/assets/css/normalize.css

+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
+
+/* Document
+   ========================================================================== */
+
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in iOS.
+ */
+
+ html {
+    line-height: 1.15; /* 1 */
+    -webkit-text-size-adjust: 100%; /* 2 */
+  }
+  
+  /* Sections
+     ========================================================================== */
+  
+  /**
+   * Remove the margin in all browsers.
+   */
+  
+  body {
+    margin: 0;
+  }
+  
+  /**
+   * Render the `main` element consistently in IE.
+   */
+  
+  main {
+    display: block;
+  }
+  
+  /**
+   * Correct the font size and margin on `h1` elements within `section` and
+   * `article` contexts in Chrome, Firefox, and Safari.
+   */
+  
+  h1 {
+    font-size: 2em;
+    margin: 0.67em 0;
+  }
+  
+  /* Grouping content
+     ========================================================================== */
+  
+  /**
+   * 1. Add the correct box sizing in Firefox.
+   * 2. Show the overflow in Edge and IE.
+   */
+  
+  hr {
+    box-sizing: content-box; /* 1 */
+    height: 0; /* 1 */
+    overflow: visible; /* 2 */
+  }
+  
+  /**
+   * 1. Correct the inheritance and scaling of font size in all browsers.
+   * 2. Correct the odd `em` font sizing in all browsers.
+   */
+  
+  pre {
+    font-family: monospace, monospace; /* 1 */
+    font-size: 1em; /* 2 */
+  }
+  
+  /* Text-level semantics
+     ========================================================================== */
+  
+  /**
+   * Remove the gray background on active links in IE 10.
+   */
+  
+  a {
+    background-color: transparent;
+  }
+  
+  /**
+   * 1. Remove the bottom border in Chrome 57-
+   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+   */
+  
+  abbr[title] {
+    border-bottom: none; /* 1 */
+    text-decoration: underline; /* 2 */
+    text-decoration: underline dotted; /* 2 */
+  }
+  
+  /**
+   * Add the correct font weight in Chrome, Edge, and Safari.
+   */
+  
+  b,
+  strong {
+    font-weight: bolder;
+  }
+  
+  /**
+   * 1. Correct the inheritance and scaling of font size in all browsers.
+   * 2. Correct the odd `em` font sizing in all browsers.
+   */
+  
+  code,
+  kbd,
+  samp {
+    font-family: monospace, monospace; /* 1 */
+    font-size: 1em; /* 2 */
+  }
+  
+  /**
+   * Add the correct font size in all browsers.
+   */
+  
+  small {
+    font-size: 80%;
+  }
+  
+  /**
+   * Prevent `sub` and `sup` elements from affecting the line height in
+   * all browsers.
+   */
+  
+  sub,
+  sup {
+    font-size: 75%;
+    line-height: 0;
+    position: relative;
+    vertical-align: baseline;
+  }
+  
+  sub {
+    bottom: -0.25em;
+  }
+  
+  sup {
+    top: -0.5em;
+  }
+  
+  /* Embedded content
+     ========================================================================== */
+  
+  /**
+   * Remove the border on images inside links in IE 10.
+   */
+  
+  img {
+    border-style: none;
+  }
+  
+  /* Forms
+     ========================================================================== */
+  
+  /**
+   * 1. Change the font styles in all browsers.
+   * 2. Remove the margin in Firefox and Safari.
+   */
+  
+  button,
+  input,
+  optgroup,
+  select,
+  textarea {
+    font-family: inherit; /* 1 */
+    font-size: 100%; /* 1 */
+    line-height: 1.15; /* 1 */
+    margin: 0; /* 2 */
+  }
+  
+  /**
+   * Show the overflow in IE.
+   * 1. Show the overflow in Edge.
+   */
+  
+  button,
+  input { /* 1 */
+    overflow: visible;
+  }
+  
+  /**
+   * Remove the inheritance of text transform in Edge, Firefox, and IE.
+   * 1. Remove the inheritance of text transform in Firefox.
+   */
+  
+  button,
+  select { /* 1 */
+    text-transform: none;
+  }
+  
+  /**
+   * Correct the inability to style clickable types in iOS and Safari.
+   */
+  
+  button,
+  [type="button"],
+  [type="reset"],
+  [type="submit"] {
+    -webkit-appearance: button;
+  }
+  
+  /**
+   * Remove the inner border and padding in Firefox.
+   */
+  
+  button::-moz-focus-inner,
+  [type="button"]::-moz-focus-inner,
+  [type="reset"]::-moz-focus-inner,
+  [type="submit"]::-moz-focus-inner {
+    border-style: none;
+    padding: 0;
+  }
+  
+  /**
+   * Restore the focus styles unset by the previous rule.
+   */
+  
+  button:-moz-focusring,
+  [type="button"]:-moz-focusring,
+  [type="reset"]:-moz-focusring,
+  [type="submit"]:-moz-focusring {
+    outline: 1px dotted ButtonText;
+  }
+  
+  /**
+   * Correct the padding in Firefox.
+   */
+  
+  fieldset {
+    padding: 0.35em 0.75em 0.625em;
+  }
+  
+  /**
+   * 1. Correct the text wrapping in Edge and IE.
+   * 2. Correct the color inheritance from `fieldset` elements in IE.
+   * 3. Remove the padding so developers are not caught out when they zero out
+   *    `fieldset` elements in all browsers.
+   */
+  
+  legend {
+    box-sizing: border-box; /* 1 */
+    color: inherit; /* 2 */
+    display: table; /* 1 */
+    max-width: 100%; /* 1 */
+    padding: 0; /* 3 */
+    white-space: normal; /* 1 */
+  }
+  
+  /**
+   * Add the correct vertical alignment in Chrome, Firefox, and Opera.
+   */
+  
+  progress {
+    vertical-align: baseline;
+  }
+  
+  /**
+   * Remove the default vertical scrollbar in IE 10+.
+   */
+  
+  textarea {
+    overflow: auto;
+  }
+  
+  /**
+   * 1. Add the correct box sizing in IE 10.
+   * 2. Remove the padding in IE 10.
+   */
+  
+  [type="checkbox"],
+  [type="radio"] {
+    box-sizing: border-box; /* 1 */
+    padding: 0; /* 2 */
+  }
+  
+  /**
+   * Correct the cursor style of increment and decrement buttons in Chrome.
+   */
+  
+  [type="number"]::-webkit-inner-spin-button,
+  [type="number"]::-webkit-outer-spin-button {
+    height: auto;
+  }
+  
+  /**
+   * 1. Correct the odd appearance in Chrome and Safari.
+   * 2. Correct the outline style in Safari.
+   */
+  
+  [type="search"] {
+    -webkit-appearance: textfield; /* 1 */
+    outline-offset: -2px; /* 2 */
+  }
+  
+  /**
+   * Remove the inner padding in Chrome and Safari on macOS.
+   */
+  
+  [type="search"]::-webkit-search-decoration {
+    -webkit-appearance: none;
+  }
+  
+  /**
+   * 1. Correct the inability to style clickable types in iOS and Safari.
+   * 2. Change font properties to `inherit` in Safari.
+   */
+  
+  ::-webkit-file-upload-button {
+    -webkit-appearance: button; /* 1 */
+    font: inherit; /* 2 */
+  }
+  
+  /* Interactive
+     ========================================================================== */
+  
+  /*
+   * Add the correct display in Edge, IE 10+, and Firefox.
+   */
+  
+  details {
+    display: block;
+  }
+  
+  /*
+   * Add the correct display in all browsers.
+   */
+  
+  summary {
+    display: list-item;
+  }
+  
+  /* Misc
+     ========================================================================== */
+  
+  /**
+   * Add the correct display in IE 10+.
+   */
+  
+  template {
+    display: none;
+  }
+  
+  /**
+   * Add the correct display in IE 10.
+   */
+  
+  [hidden] {
+    display: none;
+  }
+  
\ No newline at end of file

src/background.js

+"use strict";
+
+import { app, protocol, BrowserWindow } from "electron";
+import { createProtocol } from "vue-cli-plugin-electron-builder/lib";
+import installExtension, { VUEJS_DEVTOOLS } from "electron-devtools-installer";
+const isDevelopment = process.env.NODE_ENV !== "production";
+
+// Scheme must be registered before the app is ready
+protocol.registerSchemesAsPrivileged([
+  { scheme: "app", privileges: { secure: true, standard: true } },
+]);
+
+async function createWindow() {
+  // Create the browser window.
+  const win = new BrowserWindow({
+    width: 800,
+    height: 600,
+    webPreferences: {
+      // Required for Spectron testing
+      enableRemoteModule: !!process.env.IS_TEST,
+
+      // Use pluginOptions.nodeIntegration, leave this alone
+      // See nklayman.github.io/vue-cli-plugin-electron-builder/guide/security.html#node-integration for more info
+      nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION,
+      contextIsolation: !process.env.ELECTRON_NODE_INTEGRATION,
+    },
+  });
+
+  if (process.env.WEBPACK_DEV_SERVER_URL) {
+    // Load the url of the dev server if in development mode
+    await win.loadURL(process.env.WEBPACK_DEV_SERVER_URL);
+    if (!process.env.IS_TEST) win.webContents.openDevTools();
+  } else {
+    createProtocol("app");
+    // Load the index.html when not in development
+    win.loadURL("app://./index.html");
+  }
+}
+
+// Quit when all windows are closed.
+app.on("window-all-closed", () => {
+  // On macOS it is common for applications and their menu bar
+  // to stay active until the user quits explicitly with Cmd + Q
+  if (process.platform !== "darwin") {
+    app.quit();
+  }
+});
+
+app.on("activate", () => {
+  // On macOS it's common to re-create a window in the app when the
+  // dock icon is clicked and there are no other windows open.
+  if (BrowserWindow.getAllWindows().length === 0) createWindow();
+});
+
+// This method will be called when Electron has finished
+// initialization and is ready to create browser windows.
+// Some APIs can only be used after this event occurs.
+app.on("ready", async () => {
+  // 不加载VUEJS_DEVTOOLS
+  // if (isDevelopment && !process.env.IS_TEST) {
+  //   // Install Vue Devtools
+  //   try {
+  //     await installExtension(VUEJS_DEVTOOLS);
+  //   } catch (e) {
+  //     console.error("Vue Devtools failed to install:", e.toString());
+  //   }
+  // }
+  createWindow();
+});
+
+// Exit cleanly on request from parent process in development mode.
+if (isDevelopment) {
+  if (process.platform === "win32") {
+    process.on("message", (data) => {
+      if (data === "graceful-exit") {
+        app.quit();
+      }
+    });
+  } else {
+    process.on("SIGTERM", () => {
+      app.quit();
+    });
+  }
+}

src/libs/config.js

+export default {
+    server: "http://192.168.1.13:5006",
+    apiversion: "v1", //系统api版本
+    apimethod: { //接口method集合
+        login: "/api/login",
+    }
+};
\ No newline at end of file

src/libs/request/api.js

+import Vue from 'vue';
+import Config from '../config.js';
+import {post,get,patch,put,del} from './index';
+Vue.prototype.$post=post;
+Vue.prototype.$get=get;
+Vue.prototype.$patch=patch;
+Vue.prototype.$put=put;
+Vue.prototype.$del=del;
+
+
+//登录方法
+export const loginApi = function(params) {
+  return Vue.prototype.$post( Config.apimethod.login, {"email":params.username,"password":params.password} )
+};
+
+
+

src/libs/request/index.js

+import * as Vue from 'vue'
+import axios from 'axios';
+import Config from '../config.js';
+
+import { Message } from 'element-ui';// 我用的mint的框架来弹出我的错误返回 大家可以用别的提示
+// import router from '../router'
+// Message('这是一条消息提示');
+
+const _baseUrl = Config.server; //请求域名
+
+// 默认超时设置
+axios.defaults.timeout = 50000;
+
+// 相对路径设置
+axios.defaults.baseURL ='/api';
+//设置默认请求头
+// axios.defaults.headers = {
+//     'X-Requested-With': 'XMLHttpRequest'
+// }
+
+//http request 拦截器
+axios.interceptors.request.use(
+  config => {
+    // 获取token
+    const token = localStorage.getItem('cc_token');
+    // url
+    if(!config.url.startsWith('http') && config.url.startsWith('/api/')) {
+        config.url = _baseUrl + config.url;
+    }
+    // 设置参数格式
+    if(!config.headers['Content-Type']){
+      config.headers = {
+        'Content-Type':'application/json',
+      };
+    }
+    // 添加token到headers
+    if(token){
+      config.headers.token = token
+    }
+    // 鉴权参数设置
+    if(config.method === 'get'){
+       //get请求下 参数在params中，其他请求在data中
+      config.params = config.params || {};
+      let json = JSON.parse(JSON.stringify(config.params));
+      //一些参数处理
+    }else{
+      config.data = config.data || {};
+      //一些参数处理
+    }
+    return config;
+  },
+  err => {
+    return Promise.reject(err);
+  }
+);
+
+//http response 拦截器
+axios.interceptors.response.use(
+    response => {
+        //一些统一code的返回处理
+        if(response.data.code === 501){
+            // 登录验证
+            //做了个示例跳转项目中登录，并记录下相对路径
+            // router.push({
+            //     name:'login',//从哪个页面跳转
+            //     query:{
+            //         retUrl:window.location.href.split('#')[1] || '',
+            //         is_new_user_url:1
+            //     }
+            // })
+        }
+        return response;
+    },
+    error => {
+        return Promise.reject(error)
+    }
+);
+
+
+/**
+ * 封装get方法
+ * @param url
+ * @param params
+ * @returns {Promise}
+ */
+ export function get(url,params={}){
+    return new Promise((resolve,reject) => {
+        axios.get(url,{
+            params:params
+        })
+        .then(response => {
+            if(response.data.code === 200){
+                //返回成功处理  这里传的啥 后续调用的时候 res就是啥
+                resolve(response.data.data);//我们后台所有数据都是放在返回的data里所以这里统一处理了
+            }else{
+                //错误处理
+                Message(response.data.msg)
+            }
+        })
+        .catch(err => {
+            reject(err);
+            let message = '请求失败！请检查网络';
+            //错误返回
+            if(err.response) message=err.response.data.message;
+            Message(message)
+        })
+    })
+}
+  
+/**
+ * 封装post请求
+ * @param url
+ * @param data
+ * @returns {Promise}
+ */
+export function post(url,data = {}){
+    return new Promise((resolve,reject) => {
+        axios.post(url,data)
+        .then(response => {
+            if(response.data.code === 200){
+                resolve(response.data.data);
+            }else{
+                Message(response.data.msg)
+            }
+        },err => {
+            reject(err);
+            let message = '请求失败！请检查网络';
+            if(err.response) message=err.response.data.message;
+            Message(message)
+        })
+    })
+}
+  
+/**
+ * 封装patch请求
+ * @param url
+ * @param data
+ * @returns {Promise}
+ */
+export function patch(url,data = {}){
+    return new Promise((resolve,reject) => {
+        axios.patch(url,data)
+        .then(response => {
+            if(response.data.code === 200){
+                resolve(response.data.data);
+            }else{
+                Message(response.data.msg)
+            }
+        },err => {
+            reject(err);
+            let message = '请求失败！请检查网络';
+            if(err.response) message=err.response.data.message;
+            Message(message)
+        })
+    })
+}
+  
+/**
+ * 封装put请求
+ * @param url
+ * @param data
+ * @returns {Promise}
+ */
+export function put(url,data = {}){
+    return new Promise((resolve,reject) => {
+        axios.put(url,data)
+        .then(response => {
+            if(response.data.code === 200){
+                resolve(response.data.data);
+            }else{
+                Message(response.data.msg)
+            }
+        },err => {
+            reject(err);
+            let message = '请求失败！请检查网络';
+            if(err.response) message=err.response.data.message;
+            Message(message)
+        })
+    })
+}
+  
+export function del(url,data = {}){
+    return new Promise((resolve,reject) => {
+        axios.delete(url,data)
+        .then(response => {
+            if(response.data.code === 200){
+                resolve(response.data.data);
+            }else{
+                Message(response.data.msg)
+            }
+        },err => {
+            reject(err);
+            let message = '请求失败！请检查网络';
+            if(err.response) message=err.response.data.message;
+            Message(message)
+        })
+    })
+}
+  
+  
+

src/main.js

@@ -2,14 +2,18 @@ import Vue from "vue";
 import App from "./App.vue";
 import router from "./router";
 import store from "./store";
-import { Button, Drawer, MessageBox } from 'element-ui';
+import { Button, Drawer, Message, MessageBox, Row, Col } from 'element-ui';
+
 
 Vue.config.productionTip = false;
 
 Vue.use(Button);
 Vue.use(Drawer);
+Vue.use(Row);
+Vue.use(Col);
 
 Vue.prototype.$confirm = MessageBox.confirm;
+Vue.prototype.$message = Message;
 
 new Vue({
   router,

tests/unit/electron.spec.js

+import testWithSpectron from "vue-cli-plugin-electron-builder/lib/testWithSpectron";
+import chai from "chai";
+import chaiAsPromised from "chai-as-promised";
+// eslint-disable-next-line no-undef
+const spectron = __non_webpack_require__("spectron");
+
+chai.should();
+chai.use(chaiAsPromised);
+
+describe("Application launch", function () {
+  this.timeout(30000);
+
+  beforeEach(function () {
+    return testWithSpectron(spectron).then((instance) => {
+      this.app = instance.app;
+      this.stopServe = instance.stopServe;
+    });
+  });
+
+  beforeEach(function () {
+    chaiAsPromised.transferPromiseness = this.app.transferPromiseness;
+  });
+
+  afterEach(function () {
+    if (this.app && this.app.isRunning()) {
+      return this.stopServe();
+    }
+  });
+
+  it("opens a window", function () {
+    return Promise.all([
+      this.app.client.getWindowCount().should.eventually.have.at.least(1),
+      this.app.client.browserWindow.isMinimized().should.eventually.be.false,
+      this.app.client.browserWindow.isVisible().should.eventually.be.true,
+      this.app.client.browserWindow
+        .getBounds()
+        .should.eventually.have.property("width")
+        .and.be.above(0),
+      this.app.client.browserWindow
+        .getBounds()
+        .should.eventually.have.property("height")
+        .and.be.above(0),
+    ]);
+  });
+});

yarn.lock

@@ -2391,6 +2391,13 @@ aws4@^1.8.0:
   resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.11.0.tgz#d61f46d83b2519250e2784daf5b09479a8b41c59"
   integrity sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==
 
+axios@^0.24.0:
+  version "0.24.0"
+  resolved "https://registry.npmmirror.com/axios/download/axios-0.24.0.tgz#804e6fa1e4b9c5288501dd9dff56a7a0940d20d6"
+  integrity sha1-gE5voeS5xSiFAd2d/1anoJQNINY=
+  dependencies:
+    follow-redirects "^1.14.4"
+
 babel-eslint@^10.1.0:
   version "10.1.0"
   resolved "https://registry.yarnpkg.com/babel-eslint/-/babel-eslint-10.1.0.tgz#6968e568a910b78fb3779cdd8b6ac2f479943232"
@@ -5447,7 +5454,7 @@ flush-write-stream@^1.0.0:
     inherits "^2.0.3"
     readable-stream "^2.3.6"
 
-follow-redirects@^1.0.0:
+follow-redirects@^1.0.0, follow-redirects@^1.14.4:
   version "1.14.5"
   resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.14.5.tgz#f09a5848981d3c772b5392309778523f8d85c381"
   integrity sha512-wtphSXy7d4/OR+MvIFbCVBDzZ5520qV8XfPklSN5QtxuMUJZ+b0Wnst1e1lCDocfzuCkHqj8k0FpZqO+UIaKNA==