♻️ refactor: eslint

.eslintrc.js

@@ -16,6 +16,12 @@ module.exports = {
     'vue/multi-word-component-names': 'off',
     'vue/no-useless-template-attributes': 'off',
     'vue/no-reserved-component-names': 'off',
+    'vue/attributes-order': [
+      'warn',
+      {
+        alphabetical: true,
+      },
+    ],
   },
   parserOptions: {
     parser: 'babel-eslint',

package.json

@@ -9,7 +9,7 @@
     "serve:node18": "set NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve",
     "build": "vue-cli-service build",
     "build:node18": "set NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service build",
-    "lint": "vue-cli-service lint",
+    "lint": "vue-cli-service lint --fix",
     "clear": "rimraf node_modules&&npm install  --registry=--registry=https://registry.npmmirror.com",
     "image-webpack-loader": "cnpm i image-webpack-loader -D",
     "update": "ncu -u --reject layouts,sass-loader,sass,screenfull,eslint,chalk,vue,vue-template-compiler,vue-router,vuex,@vue/cli-plugin-babel,@vue/cli-plugin-eslint,@vue/cli-service,eslint-plugin-vue --registry=https://registry.npmmirror.com&&cnpm i",
@@ -30,7 +30,7 @@
   },
   "dependencies": {
     "axios": "^1.4.0",
-    "caniuse-lite": "^1.0.30001506",
+    "caniuse-lite": "^1.0.30001508",
     "clipboard": "^2.0.11",
     "core-js": "^3.31.0",
     "dayjs": "^1.11.8",
@@ -72,7 +72,7 @@
     "prettier": "^2.8.8",
     "sass": "~1.32.13",
     "sass-loader": "^10.1.1",
-    "stylelint": "^15.8.0",
+    "stylelint": "^15.9.0",
     "stylelint-config-prettier": "^9.0.5",
     "stylelint-config-recess-order": "^4.2.0",
     "svg-sprite-loader": "^6.0.11",

src/components/SelectTree/index.vue

@@ -2,10 +2,10 @@
   <div class="select-tree-template">
     <el-select
       v-model="selectValue"
+      class="vab-tree-select"
       :clearable="clearable"
       :collapse-tags="selectType == 'multiple'"
       :multiple="selectType == 'multiple'"
-      class="vab-tree-select"
       value-key="id"
       @clear="clearHandle"
       @remove-tag="removeTag"
@@ -19,9 +19,9 @@
           :default-checked-keys="defaultSelectedKeys"
           :default-expanded-keys="defaultSelectedKeys"
           :highlight-current="true"
+          node-key="id"
           :props="defaultProps"
           :show-checkbox="selectType == 'multiple'"
-          node-key="id"
           @check="checkNode"
           @node-click="nodeClick"
         ></el-tree>

src/components/VabCharge/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="content">
-    <div :style="styleObj" class="g-container">
+    <div class="g-container" :style="styleObj">
       <div class="g-number">
         {{ endVal }}
       </div>

src/components/VabProfile/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :style="styleObj" class="card">
+  <div class="card" :style="styleObj">
     <div class="card-borders">
       <div class="border-top"></div>
       <div class="border-right"></div>
@@ -7,14 +7,14 @@
       <div class="border-left"></div>
     </div>
     <div class="card-content">
-      <el-image :src="avatar" class="avatar"></el-image>
+      <el-image class="avatar" :src="avatar"></el-image>
       <div class="username">{{ username }}</div>
       <div class="social-icons">
         <a
           v-for="(item, index) in iconArray"
           :key="index"
-          :href="item.url"
           class="social-icon"
+          :href="item.url"
           target="_blank"
         >
           <vab-icon :icon="['fas', item.icon]" />

src/components/VabSnow/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :style="styleObj" class="content">
+  <div class="content" :style="styleObj">
     <div v-for="(item, index) in 200" :key="index" class="snow"></div>
   </div>
 </template>

src/components/VabUpload/index.vue

@@ -15,13 +15,16 @@
       <br />
       <el-upload
         ref="upload"
+        accept="image/png, image/jpeg"
         :action="action"
         :auto-upload="false"
+        class="upload-content"
         :close-on-click-modal="false"
         :data="data"
         :file-list="fileList"
         :headers="headers"
         :limit="limit"
+        list-type="picture-card"
         :multiple="true"
         :name="name"
         :on-change="handleChange"
@@ -31,18 +34,15 @@
         :on-progress="handleProgress"
         :on-remove="handleRemove"
         :on-success="handleSuccess"
-        accept="image/png, image/jpeg"
-        class="upload-content"
-        list-type="picture-card"
       >
         <i slot="trigger" class="el-icon-plus"></i>
         <el-dialog
-          :visible.sync="dialogVisible"
           append-to-body
           title="查看大图"
+          :visible.sync="dialogVisible"
         >
           <div>
-            <img :src="dialogImageUrl" alt="" width="100%" />
+            <img alt="" :src="dialogImageUrl" width="100%" />
           </div>
         </el-dialog>
       </el-upload>

src/views/index/index.vue

@@ -24,7 +24,7 @@
           <div slot="header">
             <span>访问量</span>
           </div>
-          <vab-chart :option="fwl" autoresize />
+          <vab-chart autoresize :option="fwl" />
           <div class="bottom">
             <span>
               日均访问量:
@@ -39,7 +39,7 @@
           <div slot="header">
             <span>授权数</span>
           </div>
-          <vab-chart :option="sqs" autoresize />
+          <vab-chart autoresize :option="sqs" />
           <div class="bottom">
             <span>
               总授权数:
@@ -58,7 +58,7 @@
         :xl="3"
         :xs="12"
       >
-        <router-link :to="item.link" target="_blank">
+        <router-link target="_blank" :to="item.link">
           <el-card class="icon-panel" shadow="never">
             <vab-icon
               :icon="['fas', item.icon]"

src/views/login/index.vue

@@ -13,10 +13,10 @@
       <el-col :lg="8" :md="12" :sm="24" :xl="8" :xs="24">
         <el-form
           ref="form"
-          :model="form"
-          :rules="rules"
           class="login-form"
           label-position="left"
+          :model="form"
+          :rules="rules"
         >
           <div class="title">hello !</div>
           <div class="title-tips">欢迎来到{{ title }}！</div>
@@ -40,9 +40,9 @@
               :key="passwordType"
               ref="password"
               v-model.trim="form.password"
-              :type="passwordType"
               placeholder="请输入密码"
               tabindex="2"
+              :type="passwordType"
               @keyup.enter.native="handleLogin"
             />
             <span
@@ -57,8 +57,8 @@
             </span>
           </el-form-item>
           <el-button
-            :loading="loading"
             class="login-btn"
+            :loading="loading"
             type="primary"
             @click="handleLogin"
           >

src/views/mall/goodsList/index.vue

@@ -41,7 +41,7 @@
               <el-tag v-if="item.status === 0" hit type="danger">缺货</el-tag>
             </div>
             <div class="goods-list-image-group">
-              <img :src="item.image" class="goods-list-image" />
+              <img class="goods-list-image" :src="item.image" />
             </div>
             <div class="goods-list-title">{{ item.title }}</div>
             <div class="goods-list-description">{{ item.description }}</div>
@@ -53,11 +53,11 @@
       </el-col>
     </el-row>
     <el-pagination
+      background
       :current-page="queryForm.pageNo"
       :layout="layout"
       :page-size="queryForm.pageSize"
       :total="total"
-      background
       @current-change="handleCurrentChange"
       @size-change="handleSizeChange"
     ></el-pagination>

src/views/mall/pay/components/Step1.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+    <el-form ref="form" label-width="120px" :model="form" :rules="rules">
       <el-form-item label-width="0">
         <el-alert show-icon>请务必仔细填写并核对</el-alert>
       </el-form-item>

src/views/mall/pay/components/Step2.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+    <el-form ref="form" label-width="120px" :model="form" :rules="rules">
       <el-form-item label-width="0">
         <el-alert show-icon>
           确认转账后，资金将直接打入对方账户，无法退回。

src/views/mall/pay/components/Step3.vue

@@ -1,15 +1,15 @@
 <template>
   <div>
     <div class="pay-top-content">
-      <vab-icon :icon="['fas', 'check-circle']" class="pay-success"></vab-icon>
+      <vab-icon class="pay-success" :icon="['fas', 'check-circle']"></vab-icon>
       <p>支付成功</p>
     </div>
     <el-form
       ref="form"
-      :model="form"
-      :rules="rules"
       class="pay-bottom"
       label-width="120px"
+      :model="form"
+      :rules="rules"
     >
       <el-form-item label="付款账户：">
         {{ infoData.payAccount }}

src/views/mall/pay/index.vue

@@ -8,7 +8,7 @@
         :xl="{ span: 12, offset: 6 }"
         :xs="24"
       >
-        <el-steps :active="active" :space="200" align-center class="steps">
+        <el-steps :active="active" align-center class="steps" :space="200">
           <el-step title="填写转账信息"></el-step>
           <el-step title="确认转账信息"></el-step>
           <el-step title="完成"></el-step>

src/views/personnelManagement/menuManagement/components/MenuManagementEdit.vue

@@ -8,7 +8,7 @@
     <el-divider content-position="left">
       这里就不具体写了，请自行完善
     </el-divider>
-    <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+    <el-form ref="form" label-width="80px" :model="form" :rules="rules">
       <el-form-item label="name" prop="name">
         <el-input v-model="form.name" autocomplete="off"></el-input>
       </el-form-item>

src/views/personnelManagement/menuManagement/index.vue

@@ -8,8 +8,8 @@
         <el-tree
           :data="data"
           :default-expanded-keys="['root']"
-          :props="defaultProps"
           node-key="id"
+          :props="defaultProps"
           @node-click="handleNodeClick"
         ></el-tree>
       </el-col>
@@ -23,12 +23,12 @@
         </vab-query-form>
         <el-table
           v-loading="listLoading"
-          :data="list"
-          :element-loading-text="elementLoadingText"
-          :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
           border
+          :data="list"
           default-expand-all
+          :element-loading-text="elementLoadingText"
           row-key="path"
+          :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
         >
           <el-table-column
             label="name"

src/views/personnelManagement/roleManagement/components/RoleManagementEdit.vue

@@ -5,7 +5,7 @@
     width="500px"
     @close="close"
   >
-    <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+    <el-form ref="form" label-width="80px" :model="form" :rules="rules">
       <el-form-item label="权限码" prop="permission">
         <el-input v-model="form.permission" autocomplete="off"></el-input>
       </el-form-item>

src/views/personnelManagement/roleManagement/index.vue

@@ -55,13 +55,13 @@
       </el-table-column>
     </el-table>
     <el-pagination
+      background
       :current-page="queryForm.pageNo"
       :layout="layout"
       :page-size="queryForm.pageSize"
       :total="total"
-      background
-      @size-change="handleSizeChange"
       @current-change="handleCurrentChange"
+      @size-change="handleSizeChange"
     ></el-pagination>
     <edit ref="edit" @fetch-data="fetchData"></edit>
   </div>

src/views/personnelManagement/userManagement/components/UserManagementEdit.vue

@@ -5,7 +5,7 @@
     width="500px"
     @close="close"
   >
-    <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+    <el-form ref="form" label-width="80px" :model="form" :rules="rules">
       <el-form-item label="用户名" prop="username">
         <el-input v-model.trim="form.username" autocomplete="off"></el-input>
       </el-form-item>

src/views/personnelManagement/userManagement/index.vue

@@ -71,13 +71,13 @@
       </el-table-column>
     </el-table>
     <el-pagination
+      background
       :current-page="queryForm.pageNo"
       :layout="layout"
       :page-size="queryForm.pageSize"
       :total="total"
-      background
-      @size-change="handleSizeChange"
       @current-change="handleCurrentChange"
+      @size-change="handleSizeChange"
     ></el-pagination>
     <edit ref="edit" @fetch-data="fetchData"></edit>
   </div>

src/views/register/index.vue

@@ -14,9 +14,9 @@
       <el-col :lg="8" :md="12" :sm="24" :xl="8" :xs="24">
         <el-form
           ref="registerForm"
+          class="register-form"
           :model="form"
           :rules="registerRules"
-          class="register-form"
           size="mini"
         >
           <el-form-item prop="username">
@@ -55,8 +55,8 @@
               ></vab-icon>
             </el-input>
             <el-button
-              :disabled="isGetphone"
               class="show-pwd phone-code"
+              :disabled="isGetphone"
               type="primary"
               @click="getPhoneCode"
             >

src/views/vab/element/index.vue

@@ -7,8 +7,8 @@
         </el-button>
         <el-dialog
           :fullscreen="true"
-          :visible.sync="dialogVisible"
           title="element文档"
+          :visible.sync="dialogVisible"
         >
           <iframe
             class="element-iframe"
@@ -56,21 +56,21 @@
         ></el-progress>
         <el-progress
           :percentage="100"
+          status="success"
           :stroke-width="24"
           :text-inside="true"
-          status="success"
         ></el-progress>
         <el-progress
           :percentage="80"
+          status="warning"
           :stroke-width="22"
           :text-inside="true"
-          status="warning"
         ></el-progress>
         <el-progress
           :percentage="50"
+          status="exception"
           :stroke-width="20"
           :text-inside="true"
-          status="exception"
         ></el-progress>
         <el-progress :percentage="0" type="circle"></el-progress>
         <el-progress :percentage="25" type="circle"></el-progress>

src/views/vab/form/index.vue

@@ -4,10 +4,10 @@
       <el-col :lg="8" :md="12" :sm="24" :xl="8" :xs="24">
         <el-form
           ref="ruleForm"
-          :model="ruleForm"
-          :rules="rules"
           class="demo-ruleForm"
           label-width="100px"
+          :model="ruleForm"
+          :rules="rules"
         >
           <el-form-item label="活动名称" prop="name">
             <el-input v-model="ruleForm.name"></el-input>

src/views/vab/icon/colorfulIcon.vue

@@ -51,8 +51,8 @@
           :page-size="queryForm.pageSize"
           :page-sizes="[72, 144, 216, 288]"
           :total="total"
-          @size-change="handleSizeChange"
           @current-change="handleCurrentChange"
+          @size-change="handleSizeChange"
         ></el-pagination>
       </el-col>
     </el-row>

src/views/vab/icon/index.vue

@@ -43,8 +43,8 @@
           :page-size="queryForm.pageSize"
           :page-sizes="[72, 144, 216, 288]"
           :total="total"
-          @size-change="handleSizeChange"
           @current-change="handleCurrentChange"
+          @size-change="handleSizeChange"
         ></el-pagination>
       </el-col>
     </el-row>

src/views/vab/permissions/index.vue

@@ -45,11 +45,11 @@
     <el-row :gutter="20">
       <el-col :lg="12" :md="12" :sm="24" :xl="12" :xs="24">
         <el-table
-          :data="tableData"
-          :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
           border
+          :data="tableData"
           default-expand-all
           row-key="path"
+          :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
         >
           <el-table-column
             label="name"

src/views/vab/table/components/TableEdit.vue

@@ -5,7 +5,7 @@
     width="500px"
     @close="close"
   >
-    <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+    <el-form ref="form" label-width="80px" :model="form" :rules="rules">
       <el-form-item label="标题" prop="title">
         <el-input v-model.trim="form.title" autocomplete="off"></el-input>
       </el-form-item>

src/views/vab/table/index.vue

@@ -84,8 +84,8 @@
       <el-table-column label="状态" show-overflow-tooltip>
         <template #default="{ row }">
           <el-tooltip
-            :content="row.status"
             class="item"
+            :content="row.status"
             effect="dark"
             placement="top-start"
           >

src/views/vab/tree/index.vue

@@ -6,15 +6,15 @@
         <el-input v-model="filterText" placeholder="输入关键字过滤" />
         <el-tree
           ref="demoTree"
+          class="vab-filter-tree"
           :data="data2"
           :default-checked-keys="defaultCheckedKeys"
           :default-expanded-keys="defaultExpendedKeys"
           :expand-on-click-node="false"
           :filter-node-method="filterNode"
           :highlight-current="true"
-          :props="defaultProps"
-          class="vab-filter-tree"
           node-key="id"
+          :props="defaultProps"
           show-checkbox
           @check="checkNode"
           @node-click="nodeClick"
@@ -58,21 +58,21 @@
         <el-divider content-position="left">懒加载树</el-divider>
         <el-input
           v-model.lazy="keyW"
-          :value="keyW"
           class="input-with-select"
           placeholder="请输入内容"
+          :value="keyW"
           @keyup.enter.native="showTreeList"
         ></el-input>
         <div v-show="isShow" class="blur-tree">
           <el-tree
             ref="treeFilter"
-            :data="filterDevLlist"
-            :expand-on-click-node="false"
-            :props="defaultProps"
             class="vab-filter-tree"
+            :data="filterDevLlist"
             default-expand-all
+            :expand-on-click-node="false"
             highlight-current
             node-key="indexCode"
+            :props="defaultProps"
             @node-click="nodeClick"
           >
             <template #defalut="{ node }" class="vab-custom-tree-node">
@@ -106,13 +106,13 @@
           <el-tree
             ref="tree"
             v-loading="loading"
-            :expand-on-click-node="false"
-            :load="loadNode"
-            :props="defaultProps"
             class="vab-filter-tree"
+            :expand-on-click-node="false"
             highlight-current
             lazy
+            :load="loadNode"
             node-key="indexCode"
+            :props="defaultProps"
             @node-click="nodeClick"
           >
             <template #defalut="{ node }" class="vab-custom-tree-node">
@@ -156,8 +156,8 @@
               :data="selectTreeData"
               :default-expanded-keys="selectTreeDefaultSelectedKeys"
               :highlight-current="true"
-              :props="selectTreeDefaultProps"
               node-key="id"
+              :props="selectTreeDefaultProps"
               @node-click="selectTreeNodeClick"
             >
               <template #defalut="{ node }" class="vab-custom-tree-node">
@@ -189,8 +189,8 @@
               :default-checked-keys="selectTreeDefaultSelectedKeys"
               :default-expanded-keys="selectTreeDefaultSelectedKeys"
               :highlight-current="true"
-              :props="selectTreeDefaultProps"
               node-key="id"
+              :props="selectTreeDefaultProps"
               show-checkbox
               @check="multipleSelectTreeCheckNode"
             ></el-tree>
@@ -200,9 +200,9 @@
     </el-row>
     <!--添加/编辑节点弹框-------------------start-->
     <el-dialog
+      class="tree-operate-dialog"
       :title="dialogTitle"
       :visible.sync="treeDialogVisible"
-      class="tree-operate-dialog"
       width="400px"
       @close="treeDialogVisible = false"
     >

src/views/vab/upload/index.vue

@@ -4,8 +4,8 @@
     <vab-upload
       ref="vabUpload"
       :limit="50"
-      :size="2"
       name="file"
+      :size="2"
       url="/upload"
     ></vab-upload>
     <el-button type="primary" @click="handleShow({ key: 'value' })">

src/views/vab/webSocket/index.vue

@@ -6,7 +6,7 @@
           webSocket连接{{ status }}！
         </el-alert>
         <br />
-        <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+        <el-form ref="form" label-width="100px" :model="form" :rules="rules">
           <el-form-item label="地址">
             <el-input v-model="url" disabled></el-input>
           </el-form-item>