[#1778][Improvement] Dashboard adds the ability to automatically form…

…at code.

dashboard/src/main/webapp/.eslintignore

@@ -0,0 +1,4 @@
+/node_modules
+/package-lock.json
+/dist
+.DS_Store

dashboard/src/main/webapp/.eslintrc.js

@@ -20,12 +20,14 @@ module.exports = {
     browser: true,
     commonjs: true,
     es2021: true,
-    node: true,
+    node: true
   },
-  extends: ["plugin:vue/essential", "standard", "@vue/prettier"],
+  extends: ['plugin:vue/essential', 'standard', '@vue/prettier'],
   parserOptions: {
-    ecmaVersion: 12,
+    ecmaVersion: 13
   },
-  plugins: ["vue"],
-  rules: {},
-};
+  plugins: ['vue'],
+  rules: {
+    quotes: [2, 'single']
+  }
+}

dashboard/src/main/webapp/.prettierrc.json

@@ -0,0 +1,26 @@
+{
+  "___asflicense__": [
+    "",
+    "Licensed to the Apache Software Foundation (ASF) under one",
+    "or more contributor license agreements.  See the NOTICE file",
+    "distributed with this work for additional information",
+    "regarding copyright ownership.  The ASF licenses this file",
+    "to you under the Apache License, Version 2.0 (the",
+    "\"License\"); you may not use this file except in compliance",
+    "with the License.  You may obtain a copy of the License at",
+    "",
+    "     http://www.apache.org/licenses/LICENSE-2.0",
+    "",
+    "Unless required by applicable law or agreed to in writing, software",
+    "distributed under the License is distributed on an \"AS IS\" BASIS,",
+    "WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.",
+    "See the License for the specific language governing permissions and",
+    "limitations under the License."
+  ],
+
+  "semi": false,
+  "tabWidth": 2,
+  "singleQuote": true,
+  "printWidth": 100,
+  "trailingComma": "none"
+}

dashboard/src/main/webapp/babel.config.js

@@ -16,5 +16,5 @@
  */
 
 module.exports = {
-  presets: ["@vue/cli-plugin-babel/preset"],
-};
+  presets: ['@vue/cli-plugin-babel/preset']
+}

dashboard/src/main/webapp/jsconfig.json

@@ -23,15 +23,8 @@
     "baseUrl": "./",
     "moduleResolution": "node",
     "paths": {
-      "@/*": [
-        "src/*"
-      ]
+      "@/*": ["src/*"]
     },
-    "lib": [
-      "esnext",
-      "dom",
-      "dom.iterable",
-      "scripthost"
-    ]
+    "lib": ["esnext", "dom", "dom.iterable", "scripthost"]
   }
 }

dashboard/src/main/webapp/packagescript/cleanfile.js

@@ -15,19 +15,19 @@
  * limitations under the License.
  */
 
-const fs = require("fs");
-const p = require("path");
+const fs = require('fs')
+const p = require('path')
 
-const nodeModulesPath = p.join(__dirname, "../node_modules");
-const lockJsonPath = p.join(__dirname, "../package-lock.json");
+const nodeModulesPath = p.join(__dirname, '../node_modules')
+const lockJsonPath = p.join(__dirname, '../package-lock.json')
 
 if (fs.existsSync(nodeModulesPath)) {
-  const fileUtil = require("./fileutils");
+  const fileUtil = require('./fileutils')
 
   // fileUtil.deleteFolderByRimraf(nodeModulesPath)
-  fileUtil.deleteFolder(nodeModulesPath);
-  console.log("Deleted node_modules successfully!");
+  fileUtil.deleteFolder(nodeModulesPath)
+  console.log('Deleted node_modules successfully!')
 
-  fileUtil.deleteFile(lockJsonPath);
-  console.log("Delete package-lock.json successfully!");
+  fileUtil.deleteFile(lockJsonPath)
+  console.log('Delete package-lock.json successfully!')
 }

dashboard/src/main/webapp/packagescript/filecopy.js

@@ -15,12 +15,12 @@
  * limitations under the License.
  */
 
-const fileUtil = require("./fileutils");
+const fileUtil = require('./fileutils')
 
 // Destination folder
-const staticDirectory = "../resources/static";
+const staticDirectory = '../resources/static'
 // Delete
-fileUtil.deleteFolder(staticDirectory);
+fileUtil.deleteFolder(staticDirectory)
 // Copy
-fileUtil.copyFolder("./dist", staticDirectory);
-console.log("File copy successful!");
+fileUtil.copyFolder('./dist', staticDirectory)
+console.log('File copy successful!')

dashboard/src/main/webapp/packagescript/fileutils.js

@@ -15,29 +15,29 @@
  * limitations under the License.
  */
 
-const fs = require("fs");
-const pathName = require("path");
+const fs = require('fs')
+const pathName = require('path')
 
 /**
  * Delete folder
  * @param path Path of the folder to be deleted
  */
 function deleteFolder(path) {
-  let files = [];
+  let files = []
   if (fs.existsSync(path)) {
     if (fs.statSync(path).isDirectory()) {
-      files = fs.readdirSync(path);
+      files = fs.readdirSync(path)
       files.forEach((file) => {
-        const curPath = path + "/" + file;
+        const curPath = path + '/' + file
         if (fs.statSync(curPath).isDirectory()) {
-          deleteFolder(curPath);
+          deleteFolder(curPath)
         } else {
-          fs.unlinkSync(curPath);
+          fs.unlinkSync(curPath)
         }
-      });
-      fs.rmdirSync(path);
+      })
+      fs.rmdirSync(path)
     } else {
-      fs.unlinkSync(path);
+      fs.unlinkSync(path)
     }
   }
 }
@@ -49,9 +49,9 @@ function deleteFolder(path) {
 function deleteFile(path) {
   if (fs.existsSync(path)) {
     if (fs.statSync(path).isDirectory()) {
-      deleteFolder(path);
+      deleteFolder(path)
     } else {
-      fs.unlinkSync(path);
+      fs.unlinkSync(path)
     }
   }
 }
@@ -62,42 +62,42 @@ function deleteFile(path) {
  * @param to Target directory
  */
 function copyFolder(from, to) {
-  let files = [];
+  let files = []
   // Whether the file exists If it does not exist, it is created
   if (fs.existsSync(to)) {
-    files = fs.readdirSync(from);
+    files = fs.readdirSync(from)
     files.forEach((file) => {
-      const targetPath = from + "/" + file;
-      const toPath = to + "/" + file;
+      const targetPath = from + '/' + file
+      const toPath = to + '/' + file
 
       // Copy folder
       if (fs.statSync(targetPath).isDirectory()) {
-        copyFolder(targetPath, toPath);
+        copyFolder(targetPath, toPath)
       } else {
         // Copy file
-        fs.copyFileSync(targetPath, toPath);
+        fs.copyFileSync(targetPath, toPath)
       }
-    });
+    })
   } else {
-    mkdirsSync(to);
-    copyFolder(from, to);
+    mkdirsSync(to)
+    copyFolder(from, to)
   }
 }
 
 // Create a directory synchronization method recursively
 function mkdirsSync(dirname) {
   if (fs.existsSync(dirname)) {
-    return true;
+    return true
   } else {
     if (mkdirsSync(pathName.dirname(dirname))) {
-      fs.mkdirSync(dirname);
-      return true;
+      fs.mkdirSync(dirname)
+      return true
     }
   }
 }
 
 module.exports = {
   deleteFolder,
   deleteFile,
-  copyFolder,
-};
+  copyFolder
+}

dashboard/src/main/webapp/public/index.html

@@ -15,18 +15,21 @@
   ~ limitations under the License.
   -->
 
-<!DOCTYPE html>
+<!doctype html>
 <html lang="">
   <head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <meta charset="utf-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
+    <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
     <title><%= htmlWebpackPlugin.options.title %></title>
   </head>
   <body>
     <noscript>
-      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+      <strong
+        >We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without
+        JavaScript enabled. Please enable it to continue.</strong
+      >
     </noscript>
     <div id="app"></div>
     <!-- built files will be auto injected -->

dashboard/src/main/webapp/src/App.vue

@@ -20,7 +20,7 @@
 </template>
 
 <script>
-import LayoutPage from "@/components/LayoutPage";
+import LayoutPage from '@/components/LayoutPage'
 export default {
   name: 'App',
   components: {

dashboard/src/main/webapp/src/api/api.js

@@ -15,68 +15,68 @@
  * limitations under the License.
  */
 
-import http from "@/utils/http";
+import http from '@/utils/http'
 // Create a Coordinator information interface
 export function getCoordinatorServerInfo(params, headers) {
-  return http.get("/coordinator/info", params, headers, 0);
+  return http.get('/coordinator/info', params, headers, 0)
 }
 
 // Create a coordinator configuration file interface
 export function getCoordinatorConf(params, headers) {
-  return http.get("/coordinator/conf", params, headers, 0);
+  return http.get('/coordinator/conf', params, headers, 0)
 }
 
 // Create an interface for the total number of nodes
 export function getShufflegetStatusTotal(params, headers) {
-  return http.get("/server/nodes/summary", params, headers, 0);
+  return http.get('/server/nodes/summary', params, headers, 0)
 }
 
 // Create an interface for activeNodes
 export function getShuffleActiveNodes(params, headers) {
-  return http.get("/server/nodes?status=active", params, headers, 0);
+  return http.get('/server/nodes?status=active', params, headers, 0)
 }
 
 // Create an interface for lostNodes
 export function getShuffleLostList(params, headers) {
-  return http.get("/server/nodes?status=lost", params, headers, 0);
+  return http.get('/server/nodes?status=lost', params, headers, 0)
 }
 
 // Create an interface for unhealthyNodes
 export function getShuffleUnhealthyList(params, headers) {
-  return http.get("/server/nodes?status=unhealthy", params, headers, 0);
+  return http.get('/server/nodes?status=unhealthy', params, headers, 0)
 }
 
 // Create an interface for decommissioningNodes
 export function getShuffleDecommissioningList(params, headers) {
-  return http.get("/server/nodes?status=decommissioning", params, headers, 0);
+  return http.get('/server/nodes?status=decommissioning', params, headers, 0)
 }
 
 // Create an interface for decommissionedNodes
 export function getShuffleDecommissionedList(params, headers) {
-  return http.get("/server/nodes?status=decommissioned", params, headers, 0);
+  return http.get('/server/nodes?status=decommissioned', params, headers, 0)
 }
 
 // Create an interface for excludeNodes
 export function getShuffleExcludeNodes(params, headers) {
-  return http.get("/server/nodes?status=excluded", params, headers, 0);
+  return http.get('/server/nodes?status=excluded', params, headers, 0)
 }
 
 // Total number of interfaces for new App
 export function getAppTotal(params, headers) {
-  return http.get("/app/total", params, headers, 0);
+  return http.get('/app/total', params, headers, 0)
 }
 
 // Create an interface for the app basic information list
 export function getApplicationInfoList(params, headers) {
-  return http.get("/app/appInfos", params, headers, 0);
+  return http.get('/app/appInfos', params, headers, 0)
 }
 
 // Create an interface for the number of apps for a user
 export function getTotalForUser(params, headers) {
-  return http.get("/app/userTotal", params, headers, 0);
+  return http.get('/app/userTotal', params, headers, 0)
 }
 
 // Obtain the configured coordinator server list
 export function getAllCoordinatorAddrees(params, headers) {
-  return http.get("/coordinator/coordinatorServers", params, headers, 1);
+  return http.get('/coordinator/coordinatorServers', params, headers, 1)
 }