From 7701ba0c0d61c7345e7c144eea8e5301b5bdf4f4 Mon Sep 17 00:00:00 2001
From: piexlMax <qimiaojiangjizhao@gmail.com>
Date: Tue, 8 Aug 2023 18:25:23 +0800
Subject: [PATCH] =?UTF-8?q?css=20=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/style/basics.scss                     |   1 -
 web/src/style/main.scss                       | 378 +++---------------
 web/src/style/mobile.scss                     |  47 +--
 web/src/style/newLogin.scss                   | 105 -----
 web/src/view/error/index.vue                  |  42 +-
 web/src/view/layout/index.vue                 |  30 +-
 web/src/view/layout/search/search.vue         |  51 +--
 web/src/view/login/index.vue                  |   3 +-
 web/src/view/superAdmin/api/api.vue           |  12 +-
 web/src/view/systemTools/autoCode/index.vue   |   8 +-
 .../view/systemTools/autoCodeAdmin/index.vue  |   7 +-
 web/src/view/systemTools/autoPkg/autoPkg.vue  |  12 -
 .../view/systemTools/installPlugin/index.vue  |   1 -
 web/tailwind.config.js                        |   6 +-
 14 files changed, 108 insertions(+), 595 deletions(-)
 delete mode 100644 web/src/style/newLogin.scss

diff --git a/web/src/style/basics.scss b/web/src/style/basics.scss
index 7050af52..4b805540 100644
--- a/web/src/style/basics.scss
+++ b/web/src/style/basics.scss
@@ -1,7 +1,6 @@
 // basice
 $icon-size:18px;
 $active-color:#1890ff;
-$bg-main:#f0f2f5;
 $border-color: #f4f4f4;
 $white-bg:#fff;
 $el-icon-small:30px;
diff --git a/web/src/style/main.scss b/web/src/style/main.scss
index cb8442b7..7eff6b27 100644
--- a/web/src/style/main.scss
+++ b/web/src/style/main.scss
@@ -511,19 +511,12 @@ li {
 // 导航
 #app {
     .el-container {
-        position: relative;
-        height: 100%;
-        width: 100%;
+        @apply relative h-full w-full;
     }
     .el-container.mobile.openside {
-        position: fixed;
-        top: 0;
+        @apply fixed top-0;
     }
     .gva-aside {
-        -webkit-transition: width .2s;
-        transition: width .2s;
-        width: $width-aside;
-        height: 100%;
         position: fixed;
         font-size: 0;
         top: 0;
@@ -535,20 +528,13 @@ li {
             border-right: none;
         }
         .tilte {
-            min-height: $height-aside-tilte;
-            line-height: $height-aside-tilte;
+            @apply min-h-[60px];
             text-align: center;
             transition: all 0.3s;
             display: flex;
             align-items: center;
             justify-content: center;
-            .logoimg {
-                width: $width-aside-img;
-                height: $height-aside-img;
-                background: #fff;
-                border-radius: 50%;
-                padding: 3px;
-            }
+
             .tit-text {
                 display: inline-block;
                 color: #fff;
@@ -584,31 +570,16 @@ li {
     }
     .hideside {
         .aside {
-            width: $width-hideside-aside;
-        }
-    }
-    .mobile.hideside {
-        .gva-aside {
-            -webkit-transition-duration: .2s;
-            transition-duration: .2s;
-            -webkit-transform: translate3d(-210px, 0, 0);
-            transform: translate3d(-220px, 0, 0);
+            @apply w-[54px]
         }
     }
+
     .mobile {
         .gva-aside {
-            -webkit-transition: -webkit-transform .28s;
-            transition: -webkit-transform .28s;
-            transition: transform .28s;
-            transition: transform .28s, -webkit-transform .28s;
-            width: $width-mobile-aside;
+            width: $width-hideside-aside;
         }
     }
-    .main-cont.el-main {
-        min-height: 100%;
-        margin-left: $width-aside;
-        position: relative;
-    }
+
     .hideside {
         .main-cont.el-main {
             margin-left: 54px;
@@ -627,298 +598,63 @@ li {
             top: 0;
             height: 100%;
             position: absolute;
-            z-index: 999;
+            z-index: 1001;
             left: 0;
         }
     }
 }
 
 //   layout
-.layout-cont {
-    .main-cont {
-        position: relative;
-        &.el-main {
-            background-color: $bg-main;
-            padding: 0;
-        }
-    }
-}
 
 .admin-box {
-    min-height: calc(100vh - 200px);
-    padding: 12px 16px;
-    margin: 100px 2px 20px;
-    .el-table--border {
-        border-radius: 4px;
-        margin-bottom: 14px;
-    }
+    @apply min-h-[calc(100vh-200px)] px-3 py-4 mt-28 mb-4 mx-1;
     .el-table {
-        thead {
-            @apply text-gray-950;
-        }
         th {
-            padding: 6px 0;
+            @apply px-0 py-2;
             .cell {
-                color: rgba($color: #000000, $alpha: 0.85);
-                font-size: 14px;
-                line-height: 40px;
-                min-height: 40px;
+                @apply leading-[40px] text-gray-700;
             }
         }
         td {
-            padding: 6px 0;
+            @apply px-0 py-2;
             .cell {
-                min-height: 40px;
-                line-height: 40px;
-                color: rgba($color: #000000, $alpha: 0.65);
+                @apply leading-[40px] text-gray-600;
             }
         }
-        td.is-leaf {
-            border-bottom: 1px solid #e8e8e8;
-        }
-        th.is-leaf {
-            background: #F7FBFF;
-            border-bottom: none;
-        }
-    }
-    .el-pagination {
-        padding: 20px 0 0 0;
-    }
-    .upload-demo,
-    .upload {
-        padding: 0;
-    }
-    .edit_container,
-    .edit {
-        padding: 0;
-    }
-    .el-input {
-        .el-input__suffix {
-            margin-top: -3px;
-        }
-        &.is-disabled {
-            .el-input__suffix {
-                margin-top: 0px;
-            }
+        .is-leaf {
+            background: #F7FBFF !important;
+            @apply border-b border-t-0 border-l-0 border-r-0 border-solid border-gray-50;
         }
     }
-    .el-cascader {
-        .el-input {
-            .el-input__suffix {
-                margin-top: 0px;
-            }
-        }
-    }
-    .el-input__inner {
-        border-color: rgba($color: #000000, $alpha: 0.15);
-        height: 32px;
-        border-radius: 2px;
-    }
-}
-
-.admin-box:after,
-.admin-box:before {
-    content: "";
-    display: block;
-    clear: both;
-}
-
-.button-box {
-    background: $white-bg;
-    border: none;
-    padding: 0 0 10px 0px;
 }
 
 // table
-.has-gutter {
-    tr {
-        th {
-            background-color: #fafafa;
-        }
-    }
-}
-
-.el-table--striped {
-    .el-table__body {
-        tr.el-table__row--striped {
-            td {
-                background: #fff !important;
-            }
-        }
-    }
-}
-
-.el-table th,
-.el-table tr {
-    background-color: #ffffff;
-}
-
 .el-pagination {
+    @apply mt-8;
     .btn-prev,
     .btn-next {
-        border: 1px solid #ddd;
-        border-radius: 4px;
+        @apply border border-solid border-gray-300 rounded;
     }
     .el-pager {
         li {
-            color: #666;
-            font-size: 12px;
-            margin: 0 5px;
-            border: 1px solid #ddd;
-            border-radius: 4px;
+            @apply border border-solid border-gray-300 rounded text-gray-600 text-sm mx-1;
         }
     }
-    padding: 20px 0 !important;
 }
 
-.el-row {
-    padding: 10px 0;
-    .el-col>label {
-        line-height: 30px;
-        text-align: right;
-        width: 80%;
-        padding-right: 15px;
-        display: inline-block;
-    }
-    .line {
-        line-height: 30px;
-        text-align: center;
-    }
-}
-
-.edit_container {
-    background-color: $white-bg;
-    padding: 15px;
-    .el-button {
-        margin: 15px 0;
-    }
-}
-
-.edit {
-    background-color: $white-bg;
-    .el-button {
-        margin: 15px 0;
-    }
-}
-
-.el-container {
-    .tips {
-        margin-top: 10px;
-        font-size: 14px;
-        font-weight: 400;
-        color: #606266;
-    }
-}
 
 .el-container.layout-cont {
-    .main-cont.el-main {
-        background-color: $bg-main;
-    }
-}
-
-.el-container.layout-cont {
-    .main-cont {
-        .router-history {
-            @apply bg-white p-0 border-t border-l-0 border-r-0 border-b-0 border-solid border-gray-100;
-            .el-tabs__header {
-                @apply m-0;
-                .el-tabs__item{
-                    @apply border-solid border-r border-t-0 border-gray-100 border-b-0;
-                    &+.el-tabs__item{
-                        @apply border-l-0;
-                    }
-                }
-                .el-tabs__item.is-active {
-                    @apply bg-blue-500 bg-opacity-5;
-                }
-                .el-tabs__nav {
-                    @apply border-0;
-                }
-            }
-        }
-    }
-}
-
-.el-table__row {
-    .el-button.el-button--text.el-button--small {
-        @apply relative;
-    }
-    .cell {
-        button:last-child::after {
-            content: '' !important;
-            position: absolute !important;
-            width: 0px !important;
-        }
-    }
-}
-
-.clear:after,
-.clear:before {
-    content: "";
-    display: block;
-    clear: both;
-}
-
-.el-table--striped .el-table__body tr.el-table__row--level-1 td:first-child {
-    .cell {
-        .el-table__indent {
-            border-right: 1.5px solid #ccc;
-            margin-left: 6px;
-        }
-        .el-table__placeholder {
-            width: 10px;
-        }
-    }
-}
-
-.el-table--striped .el-table__body tr.el-table__row--level-2 td:first-child {
-    .cell {
-        .el-table__indent {
-            border-right: 1.5px solid #ccc;
-            margin-left: 6px;
-        }
-        .el-table__placeholder {
-            width: 10px;
-        }
+    .header-cont {
+        @apply px-4 h-16 bg-white;
     }
-}
 
-$headerHigh: 52px;
-$mainHight: 100vh;
-.dropdown-group {
-    min-width: 100px;
-}
 
-.topfix {
-    position: fixed;
-    top: 0;
-    box-sizing: border-box;
-    z-index: 999;
-    >.el-row {
-        padding: 0;
-        .el-col-lg-14 {
-            height: 60px;
+    .main-cont {
+        @apply h-screen overflow-visible;
+        &.el-main {
+            @apply min-h-full ml-[220px] bg-main p-0 overflow-auto;
         }
-    }
-}
 
-.layout-cont {
-    .right-box {
-        padding-top: 16px;
-        display: flex;
-        justify-content: flex-end;
-        align-items: center;
-        img {
-            vertical-align: middle;
-            border: 1px solid #ccc;
-            border-radius: 6px;
-        }
-    }
-    .header-cont {
-        @apply px-4 h-16 bg-white;
-        background: #fff;
-    }
-    .main-cont {
         .breadcrumb {
             @apply h-16 flex items-center p-0 ml-12 text-lg;
             .el-breadcrumb__item {
@@ -932,42 +668,42 @@ $mainHight: 100vh;
                 }
             }
         }
-        &.el-main {
-            overflow: auto;
-            background: #fff;
+
+        .router-history {
+            @apply bg-white p-0 border-t border-l-0 border-r-0 border-b-0 border-solid border-gray-100;
+            .el-tabs__header {
+                @apply m-0;
+                .el-tabs__item{
+                    @apply border-solid border-r border-t-0 border-gray-100 border-b-0 border-l-0;
+                }
+                .el-tabs__item.is-active {
+                    @apply bg-blue-500 bg-opacity-5;
+                }
+                .el-tabs__nav {
+                    @apply border-0;
+                }
+            }
         }
-        height: $mainHight !important;
-        overflow: visible;
-        position: relative;
+
         .aside {
-            overflow: auto;
-            // background: #fff;
-            &::-webkit-scrollbar {
-                display: none;
-            }
+            @apply overflow-auto;
         }
         .el-menu-vertical {
-            height: calc(100vh - 60px) !important;
-            visibility: auto;
+            @apply h-[calc(100vh-60px)];
             &:not(.el-menu--collapse) {
-                width: 220px;
+                @apply w-[220px];
             }
         }
         .el-menu--collapse {
-            width: 54px;
+            @apply w-[54px];
             li {
                 .el-tooltip,
                 .el-sub-menu__title {
-                    padding: 0px 15px !important;
+                    @apply px-4;
                 }
             }
         }
-        &::-webkit-scrollbar {
-            display: none;
-        }
-        &.main-left {
-            width: auto !important;
-        }
+
         &.main-right {
             .admin-title {
                 float: left;
@@ -985,24 +721,8 @@ $mainHight: 100vh;
     }
 }
 
-.search-component {
-    @apply inline-flex overflow-hidden text-center gap-5 mr-5;
-    div{
-        @apply cursor-pointer;
-    }
-    .el-input__inner {
-        @apply border-b border-solid border-gray-300;
-    }
-    .el-dropdown-link {
-        @apply cursor-pointer;
-    }
-    .dropdown-group {
-        min-width: 100px;
-    }
-}
-
 .el-dropdown {
-    overflow: hidden;
+    @apply overflow-hidden
 }
 
 .gva-table-box {
diff --git a/web/src/style/mobile.scss b/web/src/style/mobile.scss
index 270764ed..f2fa7cd4 100644
--- a/web/src/style/mobile.scss
+++ b/web/src/style/mobile.scss
@@ -10,54 +10,9 @@
             }
         }
     }
-    .layout-cont {
-        .right-box {
-            @apply mr-1.5;
-        }
-    }
     .el-main {
         .admin-box {
-            margin-left: 0;
-            margin-right: 0;
-        }
-        .big.admin-box {
-            padding: 0;
-        }
-        .big {
-            .bottom {
-                .chart-player {
-                    height: auto!important;
-                    margin-bottom: 15px;
-                }
-                .todoapp {
-                    background-color: #fff;
-                    padding-bottom: 10px;
-                }
-            }
-        }
-    }
-    .card .car-left,
-    .card .car-right {
-        width: 100%;
-        height: 100%;
-    }
-    .card {
-        @apply px-1.5;
-    }
-    .card {
-        .text {
-            width: 100%;
-            h4 {
-                white-space: break-spaces;
-            }
-        }
-    }
-    .shadow {
-        margin-left: 4px;
-        margin-right: 4px;
-        .grid-content {
-            margin-bottom: 10px;
-            padding: 0;
+            @apply mx-0;
         }
     }
     .el-dialog {
diff --git a/web/src/style/newLogin.scss b/web/src/style/newLogin.scss
deleted file mode 100644
index 5d89b3c3..00000000
--- a/web/src/style/newLogin.scss
+++ /dev/null
@@ -1,105 +0,0 @@
-#userLayout {
-    margin: 0;
-    padding: 0;
-    background-image: url("@/assets/login_background.jpg");
-    background-size: cover;
-    width: 100%;
-    height: 100%;
-    position: relative;
-    .input-icon {
-        padding-right: 6px;
-        padding-top: 4px;
-    }
-    .login_panel {
-        position: absolute;
-        top: 3vh;
-        left: 2vw;
-        width: 96vw;
-        height: 94vh;
-        background-color: rgba(255, 255, 255, .8);
-        border-radius: 10px;
-        display: flex;
-        align-items: center;
-        justify-content: space-evenly;
-        .login_panel_right {
-            background-image: url("@/assets/login_left.svg");
-            background-size: cover;
-            width: 40%;
-            height: 60%;
-            float: right !important;
-        }
-        .login_panel_form {
-            width: 420px;
-            background-color: #fff;
-            padding: 40px 40px 40px 40px;
-            border-radius: 10px;
-            box-shadow: 2px 3px 7px rgba(0, 0, 0, .2);
-            .login_panel_form_title {
-                display: flex;
-                align-items: center;
-                margin: 30px 0;
-                .login_panel_form_title_logo {
-                    width: 90px;
-                    height: 72px;
-                }
-                .login_panel_form_title_p {
-                    font-size: 40px;
-                    padding-left: 20px;
-                }
-            }
-            .vPicBox {
-                display: flex;
-                justify-content: space-between;
-                width: 100%;
-            }
-            .vPic {
-                width: 33%;
-                height: 38px;
-                background: #ccc;
-                img {
-                    width: 100%;
-                    height: 100%;
-                    vertical-align: middle;
-                }
-            }
-        }
-        .login_panel_foot {
-            position: absolute;
-            bottom: 20px;
-            .links {
-                display: flex;
-                align-items: center;
-                justify-content: space-between;
-                .link-icon {
-                    width: 30px;
-                    height: 30px;
-                }
-            }
-            .copyright {
-                color: #777777;
-                margin-top: 5px;
-            }
-        }
-    }
-}
-
-//小屏幕不显示右侧，将登录框居中
-@media (max-width: 750px) {
-    .login_panel_right {
-        display: none;
-    }
-    .login_panel {
-        width: 100vw;
-        height: 100vh;
-        top: 0;
-        left: 0;
-    }
-    .login_panel_form {
-        width: 100%;
-    }
-}
-
-
-/*
-  powerBy : bypanghu@163.com
-*/
\ No newline at end of file
diff --git a/web/src/view/error/index.vue b/web/src/view/error/index.vue
index 4a10d832..4181f1d4 100644
--- a/web/src/view/error/index.vue
+++ b/web/src/view/error/index.vue
@@ -1,12 +1,13 @@
 <template>
   <div>
-    <div class="big">
-      <div class="inner">
+    <div class="w-full h-screen bg-gray-50 flex items-center justify-center">
+      <div class="flex flex-col items-center text-2xl gap-4">
         <img src="../../assets/notFound.png">
         <p>页面被神秘力量吸走了（如果您是开源版请联系我们修复）</p>
         <p style="font-size:18px;line-height:40px;">常见问题为当前此角色无当前路由，如果确定要使用本路由，请到角色管理进行分配</p>
         <p>↓</p>
-        <img src="../../assets/qm.png" class="leftPic">
+        <img src="../../assets/qm.png" class="w-16 h-16 mt-20">
+        <el-button @click="toDashboard">返回首页</el-button>
       </div>
     </div>
   </div>
@@ -15,31 +16,16 @@
 <script>
 export default {
   name: 'Error'
-
 }
 </script>
 
-<style lang="scss">
-    .big{
-        width: 100%;
-        height: calc(100vh - 220px);
-        background-color: rgb(244,244,244);
-        position: relative;
-    }
-    .inner{
-        position: absolute;
-        top: 50%;
-        left: 50%;
-        transform: translate(-50%, -50%);
-    }
-    .inner p {
-        text-align: center;
-        font-size: 24px;
-    }
-    .inner .leftPic{
-        width: 60px;
-        height: 60px;
-        margin-left: 44%;
-        margin-top: 20px;
-    }
-</style>
+<script setup>
+import {useUserStore} from "@/pinia/modules/user";
+import {useRouter} from "vue-router";
+
+const userStore = useUserStore()
+const router = useRouter()
+const toDashboard = () =>{
+  router.push({name:userStore.userInfo.authority.defaultRouter})
+}
+</script>
diff --git a/web/src/view/layout/index.vue b/web/src/view/layout/index.vue
index e300caa0..8f9af404 100644
--- a/web/src/view/layout/index.vue
+++ b/web/src/view/layout/index.vue
@@ -2,9 +2,9 @@
   <el-container class="layout-cont">
     <el-container :class="[isSider?'openside':'hideside',isMobile ? 'mobile': '']">
       <el-row :class="[isShadowBg?'shadowBg':'']" @click="changeShadow()" />
-      <el-aside class="main-cont main-left gva-aside">
+      <el-aside class="main-cont gva-aside" :style="{width:asideWidth()}">
         <div class="tilte" :style="{background: backgroundColor}">
-          <img alt class="logoimg" :src="$GIN_VUE_ADMIN.appLogo">
+          <img alt class="w-9 h-9 p-1 bg-white rounded-full" :src="$GIN_VUE_ADMIN.appLogo">
           <div v-if="isSider" class="tit-text" :style="{color:textColor}">{{ $GIN_VUE_ADMIN.appName }}</div>
         </div>
         <Aside class="aside" />
@@ -13,8 +13,8 @@
       <el-main class="main-cont main-right">
         <transition :duration="{ enter: 800, leave: 100 }" mode="out-in" name="el-fade-in-linear">
           <div
-            :style="{width: `calc(100% - ${isMobile?'0px':isCollapse?'54px':'220px'})`}"
-            class="topfix"
+            :style="{width: `calc(100% - ${getAsideWidth()})`}"
+            class="fixed top-0 box-border z-50"
           >
             <el-row>
               <el-col>
@@ -35,8 +35,8 @@
                         >{{ fmtTitle(item.meta.title,route) }}</el-breadcrumb-item>
                       </el-breadcrumb>
                     </el-col>
-                    <el-col :xs="12" :lg="9" :md="9" :sm="14" :xl="9">
-                      <div class="right-box">
+                    <el-col :xs="12" :lg="9" :md="9" :sm="14" :xl="9" class="flex items-center justify-end">
+                      <div class="mr-1.5 flex items-center">
                         <Search />
                         <el-dropdown>
                           <div class="flex justify-center items-center h-full w-full">
@@ -49,9 +49,9 @@
                             </span>
                           </div>
                           <template #dropdown>
-                            <el-dropdown-menu class="dropdown-group">
+                            <el-dropdown-menu>
                               <el-dropdown-item>
-                                <span style="font-weight: 600;">
+                                <span class="font-bold">
                                   当前角色：{{ userStore.userInfo.authority.authorityName }}
                                 </span>
                               </el-dropdown-item>
@@ -211,6 +211,18 @@ onMounted(() => {
 
 const userStore = useUserStore()
 
+const asideWidth = ()=> {
+  if (isMobile.value) {
+    return isCollapse.value?'0px':'220px'
+  }
+  return isCollapse.value ? '54px' : '220px'
+}
+
+const getAsideWidth = () =>{
+  if(isMobile.value) return '0px'
+  return isCollapse.value?'54px':'220px'
+}
+
 const textColor = computed(() => {
   if (userStore.sideMode === 'dark') {
     return '#fff'
@@ -294,7 +306,5 @@ const changeShadow = () => {
 :deep .el-overlay {
   background-color: hsla(0,0%,100%,.9) !important;
 }
-.command-box{
 
-}
 </style>
diff --git a/web/src/view/layout/search/search.vue b/web/src/view/layout/search/search.vue
index 3368b71b..4c54fdce 100644
--- a/web/src/view/layout/search/search.vue
+++ b/web/src/view/layout/search/search.vue
@@ -2,7 +2,7 @@
   <div class="search-component">
       <div class="gvaIcon gvaIcon-refresh" :class="[reload ? 'reloading' : '']" @click="handleReload" />
       <Screenfull class="search-icon" />
-      <div class="service gvaIcon-customer-service" @click="toService" />
+      <div class="gvaIcon gvaIcon-customer-service" @click="toService" />
   </div>
 </template>
 
@@ -30,33 +30,25 @@ const toService = () => {
 
 </script>
 <style scoped lang="scss">
-.reload {
-  font-size: 18px;
-}
-
-.transition-box {
-  overflow: hidden;
-  width: 160px;
-  margin-right: 32px;
-  text-align: center;
 
-  ::v-deep(.el-input__wrapper) {
-    .el-input__inner {
-      border-bottom: 1px solid var(--el-color-info-light-7);
-    }
-
-    box-shadow: none !important;
+.search-component {
+  @apply inline-flex overflow-hidden text-center gap-5 mr-5;
+  div{
+    @apply cursor-pointer;
   }
-
-  ::v-deep(.el-select .el-input .el-input__wrapper.is-focus) {
-    box-shadow: none !important;
+  .el-input__inner {
+    @apply border-b border-solid border-gray-300;
   }
-
-  ::v-deep(.el-select .el-input.is-focus .el-input__wrapper) {
-    box-shadow: none !important;
+  .el-dropdown-link {
+    @apply cursor-pointer;
   }
 }
 
+.reload {
+  font-size: 18px;
+}
+
+
 .reloading{
   animation:turn 0.5s linear infinite;
 }
@@ -83,19 +75,4 @@ const toService = () => {
   }
 }
 
-.service {
-  font-family: "gvaIcon", serif !important;
-  font-size: 16px;
-  font-style: normal;
-  font-weight: 800;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-//小屏幕不显示
-@media (max-width: 750px) {
-  .service {
-    display: none;
-  }
-}
 </style>
diff --git a/web/src/view/login/index.vue b/web/src/view/login/index.vue
index be1e28d1..c77ad376 100644
--- a/web/src/view/login/index.vue
+++ b/web/src/view/login/index.vue
@@ -44,8 +44,7 @@
                 </div>
               </el-form-item>
               <el-form-item class="mb-6">
-                <el-button class="shadow shadow-blue-600 h-11 w-full" type="primary" size="large" @click="submitForm">登
-                  录</el-button>
+                <el-button class="shadow shadow-blue-600 h-11 w-full" type="primary" size="large" @click="submitForm">登 录</el-button>
               </el-form-item>
               <el-form-item class="mb-6">
                 <el-button
diff --git a/web/src/view/superAdmin/api/api.vue b/web/src/view/superAdmin/api/api.vue
index 87531984..7c5b0fe1 100644
--- a/web/src/view/superAdmin/api/api.vue
+++ b/web/src/view/superAdmin/api/api.vue
@@ -28,7 +28,6 @@
       </el-form>
     </div>
     <div class="gva-table-box">
-      <div class="gva-btn-list">
         <div class="gva-btn-list">
           <el-button type="primary" icon="plus" @click="openDialog('addApi')">新增</el-button>
           <el-icon  class="cursor-pointer" @click="toDoc('https://www.bilibili.com/video/BV1kv4y1g7nT?p=7&vd_source=f2640257c21e3b547a790461ed94875e')"><VideoCameraFilled /></el-icon>
@@ -39,7 +38,7 @@
               <el-button type="primary" @click="onDelete">确定</el-button>
             </div>
             <template #reference>
-              <el-button icon="delete" :disabled="!apis.length" style="margin-left: 10px;" @click="deleteVisible = true">删除</el-button>
+              <el-button icon="delete" :disabled="!apis.length" @click="deleteVisible = true">删除</el-button>
             </template>
           </el-popover>
           <el-popover v-model="freshVisible" placement="top" width="160">
@@ -49,10 +48,9 @@
               <el-button type="primary" @click="onFresh">确定</el-button>
             </div>
             <template #reference>
-              <el-button icon="Refresh" style="margin-left: 10px;" @click="freshVisible = true">刷新缓存</el-button>
+              <el-button icon="Refresh" @click="freshVisible = true">刷新缓存</el-button>
             </template>
           </el-popover>
-        </div>
       </div>
       <el-table :data="tableData" @sort-change="sortChange" @selection-change="handleSelectionChange">
         <el-table-column
@@ -406,12 +404,6 @@ const deleteApiFunc = async(row) => {
 </script>
 
 <style scoped lang="scss">
-.button-box {
-  padding: 10px 20px;
-  .el-button {
-    float: right;
-  }
-}
 .warning {
   color: #dc143c;
 }
diff --git a/web/src/view/systemTools/autoCode/index.vue b/web/src/view/systemTools/autoCode/index.vue
index ca333c1b..55f4c788 100644
--- a/web/src/view/systemTools/autoCode/index.vue
+++ b/web/src/view/systemTools/autoCode/index.vue
@@ -727,13 +727,7 @@ export default {
     align-items: center;
     padding: 5px 0;
   }
-.button-box {
-  padding: 10px 20px;
-  .el-button {
-    margin-right: 20px;
-    float: right;
-  }
-}
+
 .auto-btn-list{
   margin-top: 16px;
 }
diff --git a/web/src/view/systemTools/autoCodeAdmin/index.vue b/web/src/view/systemTools/autoCodeAdmin/index.vue
index 70d3b852..f0a108de 100644
--- a/web/src/view/systemTools/autoCodeAdmin/index.vue
+++ b/web/src/view/systemTools/autoCodeAdmin/index.vue
@@ -173,12 +173,7 @@ const goAutoCode = (row) => {
 </script>
 
 <style scoped lang="scss">
-.button-box {
-  padding: 10px 20px;
-  .el-button {
-    float: right;
-  }
-}
+
 .el-tag--mini {
   margin-left: 5px;
 }
diff --git a/web/src/view/systemTools/autoPkg/autoPkg.vue b/web/src/view/systemTools/autoPkg/autoPkg.vue
index 907e1fb4..cde343f1 100644
--- a/web/src/view/systemTools/autoPkg/autoPkg.vue
+++ b/web/src/view/systemTools/autoPkg/autoPkg.vue
@@ -149,15 +149,3 @@ const deleteApiFunc = async(row) => {
 
 getTableData()
 </script>
-
-<style scoped lang="scss">
-.button-box {
-  padding: 10px 20px;
-  .el-button {
-    float: right;
-  }
-}
-.warning {
-  color: #dc143c;
-}
-</style>
diff --git a/web/src/view/systemTools/installPlugin/index.vue b/web/src/view/systemTools/installPlugin/index.vue
index 0487bb7e..abbc0a7d 100644
--- a/web/src/view/systemTools/installPlugin/index.vue
+++ b/web/src/view/systemTools/installPlugin/index.vue
@@ -1,7 +1,6 @@
 <template>
   <div>
     <el-upload
-      class="upload-demo"
       drag
       :action="`${path}/autoCode/installPlugin`"
       :headers="{'x-token':userStore.token}"
diff --git a/web/tailwind.config.js b/web/tailwind.config.js
index d1b5c65b..db6369c3 100644
--- a/web/tailwind.config.js
+++ b/web/tailwind.config.js
@@ -5,7 +5,11 @@ module.exports = {
     "./src/**/*.{vue,js,ts,jsx,tsx}",
   ],
   theme: {
-    extend: {},
+    extend: {
+      backgroundColor: {
+        "main": "#F5F5F5",
+      }
+    },
   },
   plugins: [],
   corePlugins: {
-- 
GitLab