diff --git a/cutejava-front/src/views/componentsDemo/advanced/CuteDragTableDemo.vue b/cutejava-front/src/views/componentsDemo/advanced/CuteDragTableDemo.vue
index 326e7146..999e1e9e 100644
--- a/cutejava-front/src/views/componentsDemo/advanced/CuteDragTableDemo.vue
+++ b/cutejava-front/src/views/componentsDemo/advanced/CuteDragTableDemo.vue
@@ -33,7 +33,7 @@
       <el-table-column prop="createTime" label="创建时间" sortable="custom" :formatter="FormatRowDateTimeStr" />
       <el-table-column prop="createBy" label="创建人" />
       <el-table-column label="操作" width="150" min-width="150" fixed="right">
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <div>
             <el-button type="text" @click="onTableEditClick(scope.row)">编辑</el-button>
             <el-button type="text" @click="onTableDeleteClick(scope.row)">删除</el-button>
@@ -92,22 +92,6 @@ export default {
           { prop: 'createTime', label: '创建时间', formatter: FormatRowDateTimeStr },
           { prop: 'createBy', label: '创建人' }
         ],
-        operateColumn: {
-          width: '150',
-          fixed: 'right',
-          formatter: (row, column, cellValue, index) => {
-            return (<div>
-              <el-button type='text' onClick={() => {
-                console.log('编辑')
-              }}>编辑
-              </el-button>
-              <el-button type='text' onClick={() => {
-                console.log('删除')
-              }}>删除
-              </el-button>
-            </div>)
-          }
-        },
         pageProps: {
           current: 1,
           pageSize: 10,
diff --git a/cutejava-front/src/views/componentsDemo/advanced/CuteSimpleTableDemo.vue b/cutejava-front/src/views/componentsDemo/advanced/CuteSimpleTableDemo.vue
index f744d97d..aa4dfeff 100644
--- a/cutejava-front/src/views/componentsDemo/advanced/CuteSimpleTableDemo.vue
+++ b/cutejava-front/src/views/componentsDemo/advanced/CuteSimpleTableDemo.vue
@@ -33,7 +33,7 @@
       <el-table-column prop="createTime" label="创建时间" sortable="custom" :formatter="FormatRowDateTimeStr" />
       <el-table-column prop="createBy" label="创建人" />
       <el-table-column label="操作" width="150" min-width="150" fixed="right">
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <div>
             <el-button type="text" @click="onTableEditClick(scope.row)">编辑</el-button>
             <el-button type="text" @click="onTableDeleteClick(scope.row)">删除</el-button>
@@ -92,22 +92,6 @@ export default {
           { prop: 'createTime', label: '创建时间', formatter: FormatRowDateTimeStr },
           { prop: 'createBy', label: '创建人' }
         ],
-        operateColumn: {
-          width: '150',
-          fixed: 'right',
-          formatter: (row, column, cellValue, index) => {
-            return (<div>
-              <el-button type='text' onClick={() => {
-                console.log('编辑')
-              }}>编辑
-              </el-button>
-              <el-button type='text' onClick={() => {
-                console.log('删除')
-              }}>删除
-              </el-button>
-            </div>)
-          }
-        },
         pageProps: {
           current: 1,
           pageSize: 10,
diff --git a/cutejava-front/src/views/componentsDemo/dev/CuteVerticalScrollBarDemo.vue b/cutejava-front/src/views/componentsDemo/dev/CuteVerticalScrollBarDemo.vue
index 0ef988f2..6af8dcbd 100644
--- a/cutejava-front/src/views/componentsDemo/dev/CuteVerticalScrollBarDemo.vue
+++ b/cutejava-front/src/views/componentsDemo/dev/CuteVerticalScrollBarDemo.vue
@@ -24,7 +24,7 @@
 import CuteVerticalScrollBar from '@/views/components/dev/CuteVerticalScrollBar.vue'
 
 export default {
-  name: 'CuteHorizontalScrollBarDemo',
+  name: 'CuteVerticalScrollBarDemo',
   components: { CuteVerticalScrollBar },
   data() {
     return {
diff --git a/cutejava-front/src/views/componentsDemo/index.vue b/cutejava-front/src/views/componentsDemo/index.vue
index 5739bff2..3e288f44 100644
--- a/cutejava-front/src/views/componentsDemo/index.vue
+++ b/cutejava-front/src/views/componentsDemo/index.vue
@@ -25,7 +25,7 @@
             <CuteHorizontalScrollBarDemo />
           </el-collapse-item>
           <el-collapse-item title="纵向滚动区域 CuteVerticalScrollBar" name="CuteVerticalScrollBar">
-            <CuteSectionTitleDemo />
+            <CuteVerticalScrollBarDemo />
           </el-collapse-item>
           <el-collapse-item title="一键复制 CuteOneKeyCopy" name="CuteOneKeyCopy">
             <CuteOneKeyCopyDemo />
@@ -163,10 +163,12 @@ import CuteFormDrawerProDemo from '@/views/componentsDemo/advanced/CuteFormDrawe
 import CuteSearchFormDemo from '@/views/componentsDemo/advanced/CuteSearchFormDemo.vue'
 import CuteSearchFormProDemo from '@/views/componentsDemo/advanced/CuteSearchFormProDemo.vue'
 import CuteSimpleTableDemo from '@/views/componentsDemo/advanced/CuteSimpleTableDemo.vue'
+import CuteVerticalScrollBarDemo from '@/views/componentsDemo/dev/CuteVerticalScrollBarDemo.vue'
 
 export default {
   name: 'SystemComponents',
   components: {
+    CuteVerticalScrollBarDemo,
     CuteSimpleTableDemo,
     CuteSearchFormProDemo,
     CuteSearchFormDemo,
@@ -203,13 +205,6 @@ export default {
     CuteButtonDemo,
     CutePage
   },
-  props: {
-    value: {
-      type: Object,
-      required: true,
-      default: null
-    }
-  },
   data() {
     return {
       tabKey: 'basic'
diff --git a/cutejava-front/src/views/system/dept/index.vue b/cutejava-front/src/views/system/dept/index.vue
index e45dddf0..d6e4cc34 100644
--- a/cutejava-front/src/views/system/dept/index.vue
+++ b/cutejava-front/src/views/system/dept/index.vue
@@ -94,7 +94,7 @@
       <el-table-column label="名称" prop="name" />
       <el-table-column label="排序" prop="deptSort" />
       <el-table-column label="状态" align="center" prop="enabled">
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <el-switch
             v-model="scope.row.enabled"
             :disabled="scope.row.id === 1"
@@ -112,7 +112,7 @@
         align="center"
         fixed="right"
       >
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <udOperation
             :data="scope.row"
             :permission="permission"
diff --git a/cutejava-front/src/views/system/dict/dictDetail.vue b/cutejava-front/src/views/system/dict/dictDetail.vue
index 465a6179..d6046031 100644
--- a/cutejava-front/src/views/system/dict/dictDetail.vue
+++ b/cutejava-front/src/views/system/dict/dictDetail.vue
@@ -57,7 +57,7 @@
           align="center"
           fixed="right"
         >
-          <template slot-scope="scope">
+          <template v-slot="scope">
             <udOperation
               :data="scope.row"
               :permission="permission"
diff --git a/cutejava-front/src/views/system/dict/index.vue b/cutejava-front/src/views/system/dict/index.vue
index 7750f37b..318a562e 100644
--- a/cutejava-front/src/views/system/dict/index.vue
+++ b/cutejava-front/src/views/system/dict/index.vue
@@ -63,7 +63,7 @@
               align="center"
               fixed="right"
             >
-              <template slot-scope="scope">
+              <template v-slot="scope">
                 <udOperation
                   :data="scope.row"
                   :permission="permission"
diff --git a/cutejava-front/src/views/system/job/index.vue b/cutejava-front/src/views/system/job/index.vue
index 55be1980..e4c26187 100644
--- a/cutejava-front/src/views/system/job/index.vue
+++ b/cutejava-front/src/views/system/job/index.vue
@@ -16,12 +16,12 @@
       <el-table-column type="selection" width="55" />
       <el-table-column prop="name" label="名称" />
       <el-table-column prop="jobSort" label="排序">
-        <template slot-scope="scope">
+        <template v-slot="scope">
           {{ scope.row.jobSort }}
         </template>
       </el-table-column>
       <el-table-column prop="status" label="状态" align="center">
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <el-switch
             v-model="scope.row.enabled"
             active-color="#67C23A"
@@ -39,7 +39,7 @@
         align="center"
         fixed="right"
       >
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <udOperation
             :data="scope.row"
             :permission="permission"
diff --git a/cutejava-front/src/views/system/menu/index.vue b/cutejava-front/src/views/system/menu/index.vue
index 2cfa6357..13dddc73 100644
--- a/cutejava-front/src/views/system/menu/index.vue
+++ b/cutejava-front/src/views/system/menu/index.vue
@@ -148,31 +148,31 @@
       <el-table-column type="selection" width="55" />
       <el-table-column :show-overflow-tooltip="true" label="菜单标题" width="220px" prop="title" />
       <el-table-column prop="icon" label="图标" align="center" width="60px">
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <svg-icon :icon-class="scope.row.icon ? scope.row.icon : ''" />
         </template>
       </el-table-column>
       <el-table-column prop="menuSort" align="center" label="排序">
-        <template slot-scope="scope">
+        <template v-slot="scope">
           {{ scope.row.menuSort }}
         </template>
       </el-table-column>
       <el-table-column :show-overflow-tooltip="true" prop="permission" label="权限标识" />
       <el-table-column :show-overflow-tooltip="true" prop="component" label="组件路径" />
       <el-table-column prop="iFrame" label="外链" width="75px">
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <span v-if="scope.row.iFrame">是</span>
           <span v-else>否</span>
         </template>
       </el-table-column>
       <el-table-column prop="cache" label="缓存" width="75px">
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <span v-if="scope.row.cache">是</span>
           <span v-else>否</span>
         </template>
       </el-table-column>
       <el-table-column prop="hidden" label="可见" width="75px">
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <span v-if="scope.row.hidden">否</span>
           <span v-else>是</span>
         </template>
@@ -185,7 +185,7 @@
         align="center"
         fixed="right"
       >
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <udOperation
             :data="scope.row"
             :permission="permission"
diff --git a/cutejava-front/src/views/system/online/index.vue b/cutejava-front/src/views/system/online/index.vue
index f0d66c2b..030360a2 100644
--- a/cutejava-front/src/views/system/online/index.vue
+++ b/cutejava-front/src/views/system/online/index.vue
@@ -46,7 +46,7 @@
       <el-table-column prop="browser" label="浏览器" />
       <el-table-column prop="loginTime" label="登录时间" />
       <el-table-column label="操作" width="70px" fixed="right">
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <el-popover
             :ref="scope.$index"
             v-permission="['admin']"
diff --git a/cutejava-front/src/views/system/quartzJob/index.vue b/cutejava-front/src/views/system/quartzJob/index.vue
index 4e4c713f..c33b0542 100644
--- a/cutejava-front/src/views/system/quartzJob/index.vue
+++ b/cutejava-front/src/views/system/quartzJob/index.vue
@@ -102,7 +102,7 @@
       <el-table-column :show-overflow-tooltip="true" prop="params" label="参数" />
       <el-table-column :show-overflow-tooltip="true" prop="cronExpression" label="cron表达式" />
       <el-table-column :show-overflow-tooltip="true" prop="isPause" width="90px" label="状态">
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <el-tag :type="scope.row.isPause ? 'warning' : 'success'">{{
             scope.row.isPause ? '已暂停' : '运行中'
           }}
@@ -118,7 +118,7 @@
         align="center"
         fixed="right"
       >
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <el-button
             v-permission="['admin','quartzJob:edit']"
             size="mini"
diff --git a/cutejava-front/src/views/system/quartzJob/log.vue b/cutejava-front/src/views/system/quartzJob/log.vue
index 27007115..7fc7a68d 100644
--- a/cutejava-front/src/views/system/quartzJob/log.vue
+++ b/cutejava-front/src/views/system/quartzJob/log.vue
@@ -45,7 +45,7 @@
       <el-table-column :show-overflow-tooltip="true" prop="params" width="120px" label="参数" />
       <el-table-column :show-overflow-tooltip="true" prop="cronExpression" label="cron表达式" />
       <el-table-column prop="createTime" label="异常详情" width="110px">
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <el-button
             v-show="scope.row.exceptionDetail"
             size="mini"
@@ -57,7 +57,7 @@
       </el-table-column>
       <el-table-column :show-overflow-tooltip="true" align="center" prop="time" width="100px" label="耗时(毫秒)" />
       <el-table-column align="center" prop="isSuccess" width="80px" label="状态">
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <el-tag :type="scope.row.isSuccess ? 'success' : 'danger'">{{
             scope.row.isSuccess ? '成功' : '失败'
           }}
diff --git a/cutejava-front/src/views/system/role/index.vue b/cutejava-front/src/views/system/role/index.vue
index 9c552207..9fb4446e 100644
--- a/cutejava-front/src/views/system/role/index.vue
+++ b/cutejava-front/src/views/system/role/index.vue
@@ -87,7 +87,7 @@
             <el-table-column prop="dataScope" label="数据权限" />
             <el-table-column prop="level" label="角色级别" />
             <el-table-column :show-overflow-tooltip="true" prop="description" label="描述">
-              <template slot-scope="scope">
+              <template v-slot="scope">
                 {{ scope.row.description == null ? '-' : scope.row.description }}
               </template>
             </el-table-column>
@@ -99,7 +99,7 @@
               align="center"
               fixed="right"
             >
-              <template slot-scope="scope">
+              <template v-slot="scope">
                 <udOperation
                   v-if="scope.row.level >= level"
                   :data="scope.row"
diff --git a/cutejava-front/src/views/system/storage/local/index.vue b/cutejava-front/src/views/system/storage/local/index.vue
index ecaf2fc2..56f0c898 100644
--- a/cutejava-front/src/views/system/storage/local/index.vue
+++ b/cutejava-front/src/views/system/storage/local/index.vue
@@ -76,7 +76,7 @@
     >
       <el-table-column type="selection" width="55" />
       <el-table-column prop="name" label="文件名">
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <el-popover
             :content="'file/' + scope.row.dateGroup + '/' + scope.row.realName"
             placement="top-start"
@@ -97,10 +97,10 @@
         </template>
       </el-table-column>
       <el-table-column prop="path" label="预览图">
-        <template slot-scope="{row}">
+        <template v-slot="scope">
           <el-image
-            :src=" baseApi + '/file/' + row.dateGroup + '/' + row.realName"
-            :preview-src-list="[baseApi + '/file/' + row.dateGroup + '/' + row.realName]"
+            :src=" baseApi + '/file/' + scope.row.dateGroup + '/' + scope.row.realName"
+            :preview-src-list="[baseApi + '/file/' + scope.row.dateGroup + '/' + scope.row.realName]"
             fit="contain"
             lazy
             class="el-avatar"
diff --git a/cutejava-front/src/views/system/storage/oss/index.vue b/cutejava-front/src/views/system/storage/oss/index.vue
index c74e8f57..9fafa6a0 100644
--- a/cutejava-front/src/views/system/storage/oss/index.vue
+++ b/cutejava-front/src/views/system/storage/oss/index.vue
@@ -81,7 +81,7 @@
       <el-table-column prop="createBy" label="操作人" />
       <el-table-column prop="createTime" label="创建日期" />
       <el-table-column label="操作" fixed="right">
-        <template slot-scope="scope">
+        <template v-slot="scope">
           <el-button id="ossFileUrl" type="text" @click="handleCopyFileUrl(scope.row.fileUrl)">复制链接</el-button>
         </template>
       </el-table-column>
diff --git a/cutejava-front/src/views/system/user/center.vue b/cutejava-front/src/views/system/user/center.vue
index 2ebc9036..5668e3de 100644
--- a/cutejava-front/src/views/system/user/center.vue
+++ b/cutejava-front/src/views/system/user/center.vue
@@ -103,7 +103,7 @@
                 <el-table-column :show-overflow-tooltip="true" prop="address" label="IP来源" />
                 <el-table-column prop="browserInfo" label="浏览器" />
                 <el-table-column prop="executeTime" label="请求耗时" align="center">
-                  <template slot-scope="scope">
+                  <template v-slot="scope">
                     <el-tag v-if="scope.row.executeTime <= 300">{{ scope.row.time || 0 }}ms</el-tag>
                     <el-tag v-else-if="scope.row.executeTime <= 1000" type="warning">{{ scope.row.executeTime || 0 }}ms</el-tag>
                     <el-tag v-else type="danger">{{ scope.row.executeTime || 0 }}ms</el-tag>
@@ -118,7 +118,7 @@
                       style="margin-left: 40px"
                     /></div>
                   </template>
-                  <template slot-scope="scope">
+                  <template v-slot="scope">
                     <span>{{ scope.row.createTime }}</span>
                   </template>
                 </el-table-column>
diff --git a/cutejava-front/src/views/system/user/index.vue b/cutejava-front/src/views/system/user/index.vue
index 41c259d6..2e6327b6 100644
--- a/cutejava-front/src/views/system/user/index.vue
+++ b/cutejava-front/src/views/system/user/index.vue
@@ -154,12 +154,12 @@
           <el-table-column :show-overflow-tooltip="true" prop="phone" width="100" label="手机号" />
           <el-table-column :show-overflow-tooltip="true" width="135" prop="email" label="邮箱" />
           <el-table-column :show-overflow-tooltip="true" prop="dept" label="部门">
-            <template slot-scope="scope">
+            <template v-slot="scope">
               <div>{{ scope.row.dept.name }}</div>
             </template>
           </el-table-column>
           <el-table-column label="状态" align="center" prop="enabled">
-            <template slot-scope="scope">
+            <template v-slot="scope">
               <el-switch
                 v-model="scope.row.enabled"
                 :disabled="user.id === scope.row.id"
@@ -177,7 +177,7 @@
             align="center"
             fixed="right"
           >
-            <template slot-scope="scope">
+            <template v-slot="scope">
               <udOperation
                 :data="scope.row"
                 :permission="permission"