From 20e10b9e7feeca72768abd5a804ec184d4991f35 Mon Sep 17 00:00:00 2001 From: Jolan_yu Date: Fri, 30 Sep 2022 18:23:03 +0800 Subject: [PATCH] save --- UI2.0/package.json | 1 + UI2.0/quasar.conf.js | 114 ++++++++++++---------- UI2.0/src/js/service/tuning.js | 17 ++++ UI2.0/src/js/utils/AxiosConfig.js | 112 +++++++++++++++++++++ UI2.0/src/pages/NewCommand/NewCommand.vue | 17 +++- 5 files changed, 206 insertions(+), 55 deletions(-) create mode 100644 UI2.0/src/js/service/tuning.js create mode 100644 UI2.0/src/js/utils/AxiosConfig.js diff --git a/UI2.0/package.json b/UI2.0/package.json index 56ab1ac..358617e 100644 --- a/UI2.0/package.json +++ b/UI2.0/package.json @@ -11,6 +11,7 @@ }, "dependencies": { "@quasar/extras": "^1.0.0", + "axios": "^0.27.2", "core-js": "^3.6.5", "echarts": "^5.3.0", "quasar": "^2.0.0", diff --git a/UI2.0/quasar.conf.js b/UI2.0/quasar.conf.js index 9b125c8..6faee91 100644 --- a/UI2.0/quasar.conf.js +++ b/UI2.0/quasar.conf.js @@ -6,7 +6,7 @@ // Configuration for your app // https://quasar.dev/quasar-cli/quasar-conf-js -const { configure } = require('quasar/wrappers'); +const { configure } = require("quasar/wrappers"); module.exports = configure(function (ctx) { return { @@ -19,13 +19,10 @@ module.exports = configure(function (ctx) { // app boot file (/src/boot) // --> boot files are part of "main.js" // https://quasar.dev/quasar-cli/boot-files - boot: [ - ], + boot: [], // https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-css - css: [ - 'app.scss' - ], + css: ["app.scss"], // https://github.com/quasarframework/quasar/tree/dev/extras extras: [ @@ -37,13 +34,13 @@ module.exports = configure(function (ctx) { // 'line-awesome', // 'roboto-font-latin-ext', // this or either 'roboto-font', NEVER both! - 'roboto-font', // optional, you are not bound to it - 'material-icons', // optional, you are not bound to it + "roboto-font", // optional, you are not bound to it + "material-icons", // optional, you are not bound to it ], // Full list of options: https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-build build: { - vueRouterMode: 'hash', // available values: 'hash', 'history' + vueRouterMode: "hash", // available values: 'hash', 'history' // transpile: false, // publicPath: '/', @@ -64,7 +61,7 @@ module.exports = configure(function (ctx) { // https://quasar.dev/quasar-cli/handling-webpack // "chain" is a webpack-chain object https://github.com/neutrinojs/webpack-chain - chainWebpack (/* chain */) { + chainWebpack(/* chain */) { // }, }, @@ -72,15 +69,28 @@ module.exports = configure(function (ctx) { // Full list of options: https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-devServer devServer: { server: { - type: 'http' + type: "http", }, port: 8080, - open: true // opens browser window automatically + open: true, // opens browser window automatically + proxy: { + "/api": { + target: "http://localhost:5000", + changeOrigin: true, + pathRewrite: { + "^/api": "", + }, + }, + }, }, // https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-framework framework: { - config: {}, + config: { + notify: { + /* look at QuasarConfOptions from the API card */ + }, + }, // iconSet: 'material-icons', // Quasar icon set // lang: 'en-US', // Quasar language pack @@ -93,7 +103,7 @@ module.exports = configure(function (ctx) { // directives: [], // Quasar plugins - plugins: ['AppFullscreen'] + plugins: ["AppFullscreen", "Notify"], }, // animations: 'all', // --- includes all animations @@ -108,29 +118,29 @@ module.exports = configure(function (ctx) { // manualPostHydrationTrigger: true, prodPort: 3000, // The default port that the production server should use - // (gets superseded if process.env.PORT is specified at runtime) + // (gets superseded if process.env.PORT is specified at runtime) maxAge: 1000 * 60 * 60 * 24 * 30, - // Tell browser when a file from the server should expire from cache (in ms) + // Tell browser when a file from the server should expire from cache (in ms) - chainWebpackWebserver (/* chain */) { + chainWebpackWebserver(/* chain */) { // }, middlewares: [ - ctx.prod ? 'compression' : '', - 'render' // keep this as last one - ] + ctx.prod ? "compression" : "", + "render", // keep this as last one + ], }, // https://quasar.dev/quasar-cli/developing-pwa/configuring-pwa pwa: { - workboxPluginMode: 'GenerateSW', // 'GenerateSW' or 'InjectManifest' + workboxPluginMode: "GenerateSW", // 'GenerateSW' or 'InjectManifest' workboxOptions: {}, // only for GenerateSW // for the custom service worker ONLY (/src-pwa/custom-service-worker.[js|ts]) // if using workbox in InjectManifest mode - chainWebpackCustomSW (/* chain */) { + chainWebpackCustomSW(/* chain */) { // }, @@ -138,38 +148,38 @@ module.exports = configure(function (ctx) { name: `Quasar App`, short_name: `Quasar App`, description: `A Quasar Framework app`, - display: 'standalone', - orientation: 'portrait', - background_color: '#ffffff', - theme_color: '#027be3', + display: "standalone", + orientation: "portrait", + background_color: "#ffffff", + theme_color: "#027be3", icons: [ { - src: 'icons/icon-128x128.png', - sizes: '128x128', - type: 'image/png' + src: "icons/icon-128x128.png", + sizes: "128x128", + type: "image/png", }, { - src: 'icons/icon-192x192.png', - sizes: '192x192', - type: 'image/png' + src: "icons/icon-192x192.png", + sizes: "192x192", + type: "image/png", }, { - src: 'icons/icon-256x256.png', - sizes: '256x256', - type: 'image/png' + src: "icons/icon-256x256.png", + sizes: "256x256", + type: "image/png", }, { - src: 'icons/icon-384x384.png', - sizes: '384x384', - type: 'image/png' + src: "icons/icon-384x384.png", + sizes: "384x384", + type: "image/png", }, { - src: 'icons/icon-512x512.png', - sizes: '512x512', - type: 'image/png' - } - ] - } + src: "icons/icon-512x512.png", + sizes: "512x512", + type: "image/png", + }, + ], + }, }, // Full list of options: https://quasar.dev/quasar-cli/developing-cordova-apps/configuring-cordova @@ -179,22 +189,20 @@ module.exports = configure(function (ctx) { // Full list of options: https://quasar.dev/quasar-cli/developing-capacitor-apps/configuring-capacitor capacitor: { - hideSplashscreen: true + hideSplashscreen: true, }, // Full list of options: https://quasar.dev/quasar-cli/developing-electron-apps/configuring-electron electron: { - bundler: 'packager', // 'packager' or 'builder' + bundler: "packager", // 'packager' or 'builder' packager: { // https://github.com/electron-userland/electron-packager/blob/master/docs/api.md#options - // OS X / Mac App Store // appBundleId: '', // appCategoryType: '', // osxSign: '', // protocol: 'myapp://path', - // Windows only // win32metadata: { ... } }, @@ -202,20 +210,20 @@ module.exports = configure(function (ctx) { builder: { // https://www.electron.build/configuration/configuration - appId: 'a-tune-ui-todo' + appId: "a-tune-ui-todo", }, // "chain" is a webpack-chain object https://github.com/neutrinojs/webpack-chain - chainWebpackMain (/* chain */) { + chainWebpackMain(/* chain */) { // do something with the Electron main process Webpack cfg // extendWebpackMain also available besides this chainWebpackMain }, // "chain" is a webpack-chain object https://github.com/neutrinojs/webpack-chain - chainWebpackPreload (/* chain */) { + chainWebpackPreload(/* chain */) { // do something with the Electron main process Webpack cfg // extendWebpackPreload also available besides this chainWebpackPreload }, - } - } + }, + }; }); diff --git a/UI2.0/src/js/service/tuning.js b/UI2.0/src/js/service/tuning.js new file mode 100644 index 0000000..07824fb --- /dev/null +++ b/UI2.0/src/js/service/tuning.js @@ -0,0 +1,17 @@ +import axios from "../utils/AxiosConfig"; + +const Tuning = { + async sendCommand(data) { + return await axios("/V2/echo", data, "post"); + }, + async updateConfig(data) { + const param = new FormData(); + param.append("file", data.file); + const config = { + headers: { "Content-Type": "multipart/form-data" } + }; + return await axios("/V2/tuning/config", param, "post"); + }, +}; + +export default Tuning; diff --git a/UI2.0/src/js/utils/AxiosConfig.js b/UI2.0/src/js/utils/AxiosConfig.js new file mode 100644 index 0000000..55e64c9 --- /dev/null +++ b/UI2.0/src/js/utils/AxiosConfig.js @@ -0,0 +1,112 @@ +import axios from "axios"; + +import { Notify } from "quasar"; + +axios.defaults.baseURL = "/api"; + +axios.defaults.headers.post["Content-Type"] = "application/json;charset=UTF-8"; +axios.defaults.timeout = 10000; + +axios.interceptors.request.use( + config => { + const token = sessionStorage.getItem("access_token"); + config.headers.authorization = token; + return config; + }, + error => { + return Promise.reject(error); + } +); + +axios.interceptors.response.use( + response => { + + return response; + }, + error => { + const defaultNotify = { + title: "网络错误", + message: "未知错误", + icon: "warning", + color: "warning", + position: "top", + duration: 1500, + }; + if (error.code === "ECONNABORTED" || error.message.indexOf("timeout") !== -1 || error.message === "Network Error") { + defaultNotify.message = "网络异常"; + Notify.create(defaultNotify); + return Promise.reject(error); + } + switch (error.response.status) { + case 403: + defaultNotify.message = "拒绝访问(403)"; + Notify.create(defaultNotify); + break; + case 404: + defaultNotify.message = "资源不存在(404)"; + Notify.create(defaultNotify); + break; + case 408: + defaultNotify.message = "请求超时(404)"; + Notify.create(defaultNotify); + break; + case 500: + defaultNotify.message = "服务器错误(500)"; + Notify.create(defaultNotify); + break; + case 501: + defaultNotify.message = "服务未实现(501)"; + Notify.create(defaultNotify); + break; + case 502: + defaultNotify.message = "网络错误(502)"; + Notify.create(defaultNotify); + break; + case 503: + defaultNotify.message = "服务不可用(503)"; + Notify.create(defaultNotify); + break; + case 504: + defaultNotify.message = "网络超时(504)"; + Notify.create(defaultNotify); + break; + case 505: + defaultNotify.message = "HTTP版本不受支持(505)"; + Notify.create(defaultNotify); + break; + default: + break; + } + return Promise.reject(error); + } +); + +export default function axiosApi(url, data, method) { + return new Promise((resolve, reject) => { + if (method === "get") { + axios({ + method, + url, + params: data, + }) + .then(res => { + resolve(res.data); + }) + .catch(err => { + reject(err); + }); + } else { + axios({ + method, + url, + data, + }) + .then(res => { + resolve(res.data); + }) + .catch(err => { + reject(err); + }); + } + }); +} diff --git a/UI2.0/src/pages/NewCommand/NewCommand.vue b/UI2.0/src/pages/NewCommand/NewCommand.vue index f110bdc..2d0a09d 100644 --- a/UI2.0/src/pages/NewCommand/NewCommand.vue +++ b/UI2.0/src/pages/NewCommand/NewCommand.vue @@ -122,10 +122,11 @@
命令
-
+
{{ commandString }}
+
@@ -158,7 +159,7 @@ import { ref, onMounted } from "vue" import 'xterm/css/xterm.css' import { Terminal } from 'xterm' import argumentRadio from './ArgumentRadio.vue' - +import Tuning from "../../js/service/tuning" let tuningMode = ref() @@ -234,8 +235,20 @@ const updateXtrem = () => { setInterval(() => { term.write(' 发送心跳包 \r\n') }, 5000); } +const sendCommand = () => { + let data = {} + data.command = tuningMode.value + data.options = argumentList.value + data.yaml = configFile.value + Tuning.sendCommand() +} + +const updateConfig = () => { + Tuning.updateConfig(configFile.value) +} \ No newline at end of file -- Gitee