diff --git a/.github/workflows/build_test.yml b/.github/workflows/build_test.yml
index b3f76993..03fb0caa 100644
--- a/.github/workflows/build_test.yml
+++ b/.github/workflows/build_test.yml
@@ -20,7 +20,7 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node-version: [14.16.0]
+        node-version: [16.8.0]
     steps:
       - name: Check out branch
         uses: actions/checkout@v2
diff --git a/README.md b/README.md
index 5369e4a5..8ac43180 100644
--- a/README.md
+++ b/README.md
@@ -42,14 +42,10 @@
 
 3.您完全可以通过我们的教程和文档完成一切操作，因此我们不再提供免费的技术服务，如需服务请进行[付费支持](https://www.gin-vue-admin.com/coffee/payment.html)
 
-4.如果您将此项目用于商业用途，请遵守Apache2.0协议并保留作者技术支持声明。您需保留如下版权声明信息，其余信息功能不做任何限制。如需剔除请联系微信：shouzi_1994
+4.如果您将此项目用于商业用途，请遵守Apache2.0协议并保留作者技术支持声明。您需保留如下版权声明信息，其余信息功能不做任何限制。如需剔除请[购买授权](https://www.gin-vue-admin.com/empower/index.html)
 
 <img src="https://qmplusimg.henrongyi.top/%E6%8E%88%E6%9D%83.png" width="1000">
 
-5.如果您需要服务器的话 2核2G腾讯云服务器45元/年 在这里购买：https://cloud.tencent.com/act/new?fromSource=gwzcw.4325959.4325959.4325959&utm_medium=cps&utm_id=gwzcw.4325959.4325959.4325959&cps_key=962a7fdaa930cda1c06e36a7608e95cc
-									      
-阿里云服务器 1c2g1m 38一年 在这里购买:https://www.aliyun.com/minisite/goods?userCode=xqe01uob
-
 ## 1. 基本介绍
 
 ### 1.1 项目介绍
@@ -86,11 +82,9 @@ Gin-vue-admin 的成长离不开大家的支持，如果你愿意为 gin-vue-adm
 ## 2. 使用说明
 
 ```
-- node版本 > v12.18.3
+- node版本 > v16.8.3
 - golang版本 >= v1.16
 - IDE推荐：Goland
-- 初始化项目： 不同版本数据库初始化不通 参见 https://www.gin-vue-admin.com/docs/first_master
-- 替换掉项目中的七牛云公钥，私钥，仓名和默认url地址，以免发生测试文件数据错乱
 ```
 
 ### 2.1 server项目
@@ -121,7 +115,7 @@ go build -o server main.go (windows编译命令为go build -o server.exe main.go
 cd web
 
 # 安装依赖
-cnpm install || npm install
+npm install
 
 # 启动web项目
 npm run serve
@@ -352,7 +346,7 @@ swag init
 
 （5）gin-vue-admin 版本更新介绍视频
 
-> bilibili：https://space.bilibili.com/322210472/channel/detail?cid=126418&ctype=0
+> bilibili：https://www.bilibili.com/video/BV1kv4y1g7nT
 
 ## 7. 联系方式
 
@@ -384,12 +378,6 @@ swag init
 
 如果你觉得这个项目对你有帮助，你可以请作者喝饮料 :tropical_drink: [点我](https://www.gin-vue-admin.com/coffee/index.html)
 
-## 10. 友情链接
-
-[H5-Dooring ｜ H5页面制作神器](https://github.com/MrXujiang/h5-Dooring)	
-
-[go-zero 微服务框架｜缩短从需求到上线的距离](https://github.com/zeromicro/go-zero)
-
-## 11. 商用注意事项
+## 10. 商用注意事项
 
 如果您将此项目用于商业用途，请遵守Apache2.0协议并保留作者技术支持声明。
diff --git a/web/package.json b/web/package.json
index 92236af0..0555be15 100644
--- a/web/package.json
+++ b/web/package.json
@@ -23,14 +23,13 @@
         "qs": "^6.8.0",
         "quill": "^1.3.7",
         "screenfull": "^5.0.2",
-        "script-ext-html-webpack-plugin": "^2.1.4",
         "spark-md5": "^3.0.1",
         "vue": "^3.2.25",
         "vue-router": "^4.0.0-0"
     },
     "devDependencies": {
-        "@vitejs/plugin-legacy": "^1.4.4",
-        "@vitejs/plugin-vue": "^2.3.3",
+        "@vitejs/plugin-legacy": "^2.0.0",
+        "@vitejs/plugin-vue": "^3.0.1",
         "@vue/cli-plugin-babel": "~4.5.0",
         "@vue/cli-plugin-eslint": "~4.5.0",
         "@vue/cli-plugin-router": "~4.5.0",
@@ -43,9 +42,9 @@
         "dotenv": "^10.0.0",
         "eslint": "^6.7.2",
         "eslint-plugin-vue": "^7.0.0",
-        "sass": "^1.26.5",
-        "sass-loader": "^8.0.2",
-        "vite": "^2.8.0",
+        "sass": "^1.54.0",
+        "terser": "^5.4.0",
+        "vite": "^3.0.1",
         "vite-plugin-banner": "^0.1.3",
         "vite-plugin-importer": "^0.2.5"
     }
diff --git a/web/src/style/base.scss b/web/src/style/base.scss
index b1ab305f..f6a2eae8 100644
--- a/web/src/style/base.scss
+++ b/web/src/style/base.scss
@@ -1,7 +1,3 @@
-.clearfix {
-    *zoom: 1;
-}
-
 .clearfix:after {
     content: '';
     display: block;
diff --git a/web/src/style/button.scss b/web/src/style/button.scss
new file mode 100644
index 00000000..9c3e7c56
--- /dev/null
+++ b/web/src/style/button.scss
@@ -0,0 +1,9 @@
+.sticky-button {
+  position: sticky;
+  top: 2px;
+  z-index: 2;
+  background-color: #fff;
+}
+.fitler{
+  width: 60%;
+}
\ No newline at end of file
diff --git a/web/src/view/superAdmin/authority/authority.vue b/web/src/view/superAdmin/authority/authority.vue
index 19ccab8a..1d80c5f8 100644
--- a/web/src/view/superAdmin/authority/authority.vue
+++ b/web/src/view/superAdmin/authority/authority.vue
@@ -83,8 +83,8 @@
       </template>
     </el-dialog>
 
-    <el-drawer v-if="drawer" v-model="drawer" :with-header="false" size="40%" title="角色配置">
-      <el-tabs :before-leave="autoEnter" class="role-box" type="border-card">
+    <el-drawer v-if="drawer" v-model="drawer" custom-class="auth-drawer" :with-header="false" size="40%" title="角色配置">
+      <el-tabs :before-leave="autoEnter" type="border-card">
         <el-tab-pane label="角色菜单">
           <Menus ref="menus" :row="activeRow" @changeRow="changeRow" />
         </el-tab-pane>
@@ -396,10 +396,15 @@ export default {
     }
   }
 }
-.role-box {
-  .el-tabs__content {
-    height: calc(100vh - 72px);
-    overflow: auto;
+.tree-content{
+  overflow: auto;
+  height: calc(100vh - 100px);
+  margin-top: 10px;
+}
+
+.auth-drawer{
+  .el-drawer__body{
+    overflow: hidden;
   }
 }
 </style>
diff --git a/web/src/view/superAdmin/authority/components/apis.vue b/web/src/view/superAdmin/authority/components/apis.vue
index db530cc2..dd1c5220 100644
--- a/web/src/view/superAdmin/authority/components/apis.vue
+++ b/web/src/view/superAdmin/authority/components/apis.vue
@@ -1,19 +1,23 @@
 <template>
   <div>
-    <div class="clearfix">
+    <div class="clearfix sticky-button">
+      <el-input v-model="filterText" class="fitler" placeholder="筛选" />
       <el-button class="fl-right" size="small" type="primary" @click="authApiEnter">确 定</el-button>
     </div>
-    <el-tree
-      ref="apiTree"
-      :data="apiTreeData"
-      :default-checked-keys="apiTreeIds"
-      :props="apiDefaultProps"
-      default-expand-all
-      highlight-current
-      node-key="onlyId"
-      show-checkbox
-      @check="nodeChange"
-    />
+    <div class="tree-content">
+      <el-tree
+        ref="apiTree"
+        :data="apiTreeData"
+        :default-checked-keys="apiTreeIds"
+        :props="apiDefaultProps"
+        default-expand-all
+        highlight-current
+        node-key="onlyId"
+        show-checkbox
+        :filter-node-method="filterNode"
+        @check="nodeChange"
+      />
+    </div>
   </div>
 </template>
 <script>
@@ -25,7 +29,7 @@ export default {
 <script setup>
 import { getAllApis } from '@/api/api'
 import { UpdateCasbin, getPolicyPathByAuthorityId } from '@/api/casbin'
-import { ref } from 'vue'
+import { ref, watch } from 'vue'
 import { ElMessage } from 'element-plus'
 const props = defineProps({
   row: {
@@ -40,7 +44,7 @@ const apiDefaultProps = ref({
   children: 'children',
   label: 'description'
 })
-
+const filterText = ref('')
 const apiTreeData = ref([])
 const apiTreeIds = ref([])
 const activeUserId = ref('')
@@ -120,4 +124,16 @@ defineExpose({
   enterAndNext
 })
 
+const filterNode = (value, data) => {
+  if (!value) return true
+  return data.description.indexOf(value) !== -1
+}
+watch(filterText, (val) => {
+  apiTree.value.filter(val)
+})
+
 </script>
+
+<style lang="scss" scoped>
+@import "@/style/button.scss";
+</style>
diff --git a/web/src/view/superAdmin/authority/components/datas.vue b/web/src/view/superAdmin/authority/components/datas.vue
index 6f3d46f6..4f2facd2 100644
--- a/web/src/view/superAdmin/authority/components/datas.vue
+++ b/web/src/view/superAdmin/authority/components/datas.vue
@@ -1,14 +1,16 @@
 <template>
   <div>
-    <div class="clearfix" style="margin: 18px">
+    <div class="clearfix sticky-button" style="margin: 18px">
       <el-button class="fl-right" size="small" type="primary" @click="authDataEnter">确 定</el-button>
       <el-button class="fl-left" size="small" type="primary" @click="all">全选</el-button>
       <el-button class="fl-left" size="small" type="primary" @click="self">本角色</el-button>
       <el-button class="fl-left" size="small" type="primary" @click="selfAndChildren">本角色及子角色</el-button>
     </div>
-    <el-checkbox-group v-model="dataAuthorityId" @change="selectAuthority">
-      <el-checkbox v-for="(item,key) in authoritys" :key="key" :label="item">{{ item.authorityName }}</el-checkbox>
-    </el-checkbox-group>
+    <div class="tree-content">
+      <el-checkbox-group v-model="dataAuthorityId" @change="selectAuthority">
+        <el-checkbox v-for="(item,key) in authoritys" :key="key" :label="item">{{ item.authorityName }}</el-checkbox>
+      </el-checkbox-group>
+    </div>
     <warning-bar title="此功能仅用于创建角色和角色的many2many关系表，具体使用还须自己结合表实现业务，详情参考示例代码（客户示例）" />
   </div>
 </template>
diff --git a/web/src/view/superAdmin/authority/components/menus.vue b/web/src/view/superAdmin/authority/components/menus.vue
index ce48163f..31c73cc4 100644
--- a/web/src/view/superAdmin/authority/components/menus.vue
+++ b/web/src/view/superAdmin/authority/components/menus.vue
@@ -1,48 +1,51 @@
 <template>
   <div>
-    <div class="clearfix">
+    <div class="clearfix sticky-button">
+      <el-input v-model="filterText" class="fitler" placeholder="筛选" />
       <el-button class="fl-right" size="small" type="primary" @click="relation">确 定</el-button>
     </div>
-    <el-tree
-      ref="menuTree"
-      :data="menuTreeData"
-      :default-checked-keys="menuTreeIds"
-      :props="menuDefaultProps"
-      default-expand-all
-      highlight-current
-      node-key="ID"
-      show-checkbox
-      @check="nodeChange"
-    >
-      <template #default="{ node , data }">
-        <span class="custom-tree-node">
-          <span>{{ node.label }}</span>
-          <span>
-            <el-button
-              type="primary"
-              link
-              size="small"
-              :style="{color:row.defaultRouter === data.name?'#E6A23C':'#85ce61'}"
-              :disabled="!node.checked"
-              @click="() => setDefault(data)"
-            >
-              {{ row.defaultRouter === data.name?"首页":"设为首页" }}
-            </el-button>
+    <div class="tree-content">
+      <el-tree
+        ref="menuTree"
+        :data="menuTreeData"
+        :default-checked-keys="menuTreeIds"
+        :props="menuDefaultProps"
+        default-expand-all
+        highlight-current
+        node-key="ID"
+        show-checkbox
+        :filter-node-method="filterNode"
+        @check="nodeChange"
+      >
+        <template #default="{ node , data }">
+          <span class="custom-tree-node">
+            <span>{{ node.label }}</span>
+            <span>
+              <el-button
+                type="primary"
+                link
+                size="small"
+                :style="{color:row.defaultRouter === data.name?'#E6A23C':'#85ce61'}"
+                :disabled="!node.checked"
+                @click="() => setDefault(data)"
+              >
+                {{ row.defaultRouter === data.name?"首页":"设为首页" }}
+              </el-button>
+            </span>
+            <span v-if="data.menuBtn.length">
+              <el-button
+                type="primary"
+                link
+                size="small"
+                @click="() => OpenBtn(data)"
+              >
+                分配按钮
+              </el-button>
+            </span>
           </span>
-          <span v-if="data.menuBtn.length">
-            <el-button
-              type="primary"
-              link
-              size="small"
-              @click="() => OpenBtn(data)"
-            >
-              分配按钮
-            </el-button>
-          </span>
-        </span>
-      </template>
-    </el-tree>
-
+        </template>
+      </el-tree>
+    </div>
     <el-dialog v-model="btnVisible" title="分配按钮" destroy-on-close>
       <el-table
         ref="btnTableRef"
@@ -70,8 +73,9 @@ import {
   updateAuthority
 } from '@/api/authority'
 import { getAuthorityBtnApi, setAuthorityBtnApi } from '@/api/authorityBtn'
-import { nextTick, ref } from 'vue'
+import { nextTick, ref, watch } from 'vue'
 import { ElMessage } from 'element-plus'
+
 const props = defineProps({
   row: {
     default: function() {
@@ -82,7 +86,7 @@ const props = defineProps({
 })
 
 const emit = defineEmits(['changeRow'])
-
+const filterText = ref('')
 const menuTreeData = ref([])
 const menuTreeIds = ref([])
 const needConfirm = ref(false)
@@ -192,6 +196,16 @@ const enterDialog = async() => {
   }
 }
 
+const filterNode = (value, data) => {
+  if (!value) return true
+  // console.log(data.mate.title)
+  return data.meta.title.indexOf(value) !== -1
+}
+
+watch(filterText, (val) => {
+  menuTree.value.filter(val)
+})
+
 </script>
 
 <script>
@@ -202,6 +216,7 @@ export default {
 </script>
 
 <style lang="scss" scope>
+@import "@/style/button.scss";
 .custom-tree-node{
   span+span{
     margin-left: 12px;