diff --git a/backend/src/main/java/io/dataease/auth/entity/SysUserEntity.java b/backend/src/main/java/io/dataease/auth/entity/SysUserEntity.java
index 2d07480db9..e74ae836d0 100644
--- a/backend/src/main/java/io/dataease/auth/entity/SysUserEntity.java
+++ b/backend/src/main/java/io/dataease/auth/entity/SysUserEntity.java
@@ -23,4 +23,6 @@ public class SysUserEntity implements Serializable {
     private String email;
 
     private String phone;
+
+    private String language;
 }
diff --git a/backend/src/main/java/io/dataease/base/domain/SysUser.java b/backend/src/main/java/io/dataease/base/domain/SysUser.java
index 56775ba68b..8f62905999 100644
--- a/backend/src/main/java/io/dataease/base/domain/SysUser.java
+++ b/backend/src/main/java/io/dataease/base/domain/SysUser.java
@@ -35,5 +35,7 @@ public class SysUser implements Serializable {
 
     private Long updateTime;
 
+    private String language;
+
     private static final long serialVersionUID = 1L;
 }
\ No newline at end of file
diff --git a/backend/src/main/java/io/dataease/base/domain/SysUserExample.java b/backend/src/main/java/io/dataease/base/domain/SysUserExample.java
index 1bc5260883..27cef73bb8 100644
--- a/backend/src/main/java/io/dataease/base/domain/SysUserExample.java
+++ b/backend/src/main/java/io/dataease/base/domain/SysUserExample.java
@@ -1083,6 +1083,76 @@ public class SysUserExample {
             addCriterion("update_time not between", value1, value2, "updateTime");
             return (Criteria) this;
         }
+
+        public Criteria andLanguageIsNull() {
+            addCriterion("`language` is null");
+            return (Criteria) this;
+        }
+
+        public Criteria andLanguageIsNotNull() {
+            addCriterion("`language` is not null");
+            return (Criteria) this;
+        }
+
+        public Criteria andLanguageEqualTo(String value) {
+            addCriterion("`language` =", value, "language");
+            return (Criteria) this;
+        }
+
+        public Criteria andLanguageNotEqualTo(String value) {
+            addCriterion("`language` <>", value, "language");
+            return (Criteria) this;
+        }
+
+        public Criteria andLanguageGreaterThan(String value) {
+            addCriterion("`language` >", value, "language");
+            return (Criteria) this;
+        }
+
+        public Criteria andLanguageGreaterThanOrEqualTo(String value) {
+            addCriterion("`language` >=", value, "language");
+            return (Criteria) this;
+        }
+
+        public Criteria andLanguageLessThan(String value) {
+            addCriterion("`language` <", value, "language");
+            return (Criteria) this;
+        }
+
+        public Criteria andLanguageLessThanOrEqualTo(String value) {
+            addCriterion("`language` <=", value, "language");
+            return (Criteria) this;
+        }
+
+        public Criteria andLanguageLike(String value) {
+            addCriterion("`language` like", value, "language");
+            return (Criteria) this;
+        }
+
+        public Criteria andLanguageNotLike(String value) {
+            addCriterion("`language` not like", value, "language");
+            return (Criteria) this;
+        }
+
+        public Criteria andLanguageIn(List<String> values) {
+            addCriterion("`language` in", values, "language");
+            return (Criteria) this;
+        }
+
+        public Criteria andLanguageNotIn(List<String> values) {
+            addCriterion("`language` not in", values, "language");
+            return (Criteria) this;
+        }
+
+        public Criteria andLanguageBetween(String value1, String value2) {
+            addCriterion("`language` between", value1, value2, "language");
+            return (Criteria) this;
+        }
+
+        public Criteria andLanguageNotBetween(String value1, String value2) {
+            addCriterion("`language` not between", value1, value2, "language");
+            return (Criteria) this;
+        }
     }
 
     public static class Criteria extends GeneratedCriteria {
diff --git a/backend/src/main/java/io/dataease/base/mapper/SysUserMapper.xml b/backend/src/main/java/io/dataease/base/mapper/SysUserMapper.xml
index de12f32bbc..41f42fc47a 100644
--- a/backend/src/main/java/io/dataease/base/mapper/SysUserMapper.xml
+++ b/backend/src/main/java/io/dataease/base/mapper/SysUserMapper.xml
@@ -17,6 +17,7 @@
     <result column="pwd_reset_time" jdbcType="BIGINT" property="pwdResetTime" />
     <result column="create_time" jdbcType="BIGINT" property="createTime" />
     <result column="update_time" jdbcType="BIGINT" property="updateTime" />
+    <result column="language" jdbcType="VARCHAR" property="language" />
   </resultMap>
   <sql id="Example_Where_Clause">
     <where>
@@ -78,7 +79,7 @@
   </sql>
   <sql id="Base_Column_List">
     user_id, dept_id, username, nick_name, gender, phone, email, `password`, is_admin, 
-    enabled, create_by, update_by, pwd_reset_time, create_time, update_time
+    enabled, create_by, update_by, pwd_reset_time, create_time, update_time, `language`
   </sql>
   <select id="selectByExample" parameterType="io.dataease.base.domain.SysUserExample" resultMap="BaseResultMap">
     select
@@ -115,14 +116,14 @@
       nick_name, gender, phone, 
       email, `password`, is_admin, 
       enabled, create_by, update_by, 
-      pwd_reset_time, create_time, update_time
-      )
+      pwd_reset_time, create_time, update_time, 
+      `language`)
     values (#{userId,jdbcType=BIGINT}, #{deptId,jdbcType=BIGINT}, #{username,jdbcType=VARCHAR}, 
       #{nickName,jdbcType=VARCHAR}, #{gender,jdbcType=VARCHAR}, #{phone,jdbcType=VARCHAR}, 
       #{email,jdbcType=VARCHAR}, #{password,jdbcType=VARCHAR}, #{isAdmin,jdbcType=BIT}, 
       #{enabled,jdbcType=BIGINT}, #{createBy,jdbcType=VARCHAR}, #{updateBy,jdbcType=VARCHAR}, 
-      #{pwdResetTime,jdbcType=BIGINT}, #{createTime,jdbcType=BIGINT}, #{updateTime,jdbcType=BIGINT}
-      )
+      #{pwdResetTime,jdbcType=BIGINT}, #{createTime,jdbcType=BIGINT}, #{updateTime,jdbcType=BIGINT}, 
+      #{language,jdbcType=VARCHAR})
   </insert>
   <insert id="insertSelective" parameterType="io.dataease.base.domain.SysUser">
     insert into sys_user
@@ -172,6 +173,9 @@
       <if test="updateTime != null">
         update_time,
       </if>
+      <if test="language != null">
+        `language`,
+      </if>
     </trim>
     <trim prefix="values (" suffix=")" suffixOverrides=",">
       <if test="userId != null">
@@ -219,6 +223,9 @@
       <if test="updateTime != null">
         #{updateTime,jdbcType=BIGINT},
       </if>
+      <if test="language != null">
+        #{language,jdbcType=VARCHAR},
+      </if>
     </trim>
   </insert>
   <select id="countByExample" parameterType="io.dataease.base.domain.SysUserExample" resultType="java.lang.Long">
@@ -275,6 +282,9 @@
       <if test="record.updateTime != null">
         update_time = #{record.updateTime,jdbcType=BIGINT},
       </if>
+      <if test="record.language != null">
+        `language` = #{record.language,jdbcType=VARCHAR},
+      </if>
     </set>
     <if test="_parameter != null">
       <include refid="Update_By_Example_Where_Clause" />
@@ -296,7 +306,8 @@
       update_by = #{record.updateBy,jdbcType=VARCHAR},
       pwd_reset_time = #{record.pwdResetTime,jdbcType=BIGINT},
       create_time = #{record.createTime,jdbcType=BIGINT},
-      update_time = #{record.updateTime,jdbcType=BIGINT}
+      update_time = #{record.updateTime,jdbcType=BIGINT},
+      `language` = #{record.language,jdbcType=VARCHAR}
     <if test="_parameter != null">
       <include refid="Update_By_Example_Where_Clause" />
     </if>
@@ -346,6 +357,9 @@
       <if test="updateTime != null">
         update_time = #{updateTime,jdbcType=BIGINT},
       </if>
+      <if test="language != null">
+        `language` = #{language,jdbcType=VARCHAR},
+      </if>
     </set>
     where user_id = #{userId,jdbcType=BIGINT}
   </update>
@@ -364,7 +378,8 @@
       update_by = #{updateBy,jdbcType=VARCHAR},
       pwd_reset_time = #{pwdResetTime,jdbcType=BIGINT},
       create_time = #{createTime,jdbcType=BIGINT},
-      update_time = #{updateTime,jdbcType=BIGINT}
+      update_time = #{updateTime,jdbcType=BIGINT},
+      `language` = #{language,jdbcType=VARCHAR}
     where user_id = #{userId,jdbcType=BIGINT}
   </update>
 </mapper>
\ No newline at end of file
diff --git a/backend/src/main/java/io/dataease/base/mapper/ext/AuthMapper.java b/backend/src/main/java/io/dataease/base/mapper/ext/AuthMapper.java
index 050702436a..418ac6375f 100644
--- a/backend/src/main/java/io/dataease/base/mapper/ext/AuthMapper.java
+++ b/backend/src/main/java/io/dataease/base/mapper/ext/AuthMapper.java
@@ -6,7 +6,6 @@ import io.dataease.auth.api.dto.CurrentRoleDto;
 import io.dataease.auth.entity.SysUserEntity;
 import org.apache.ibatis.annotations.Param;
 import java.util.List;
-import java.util.Map;
 
 public interface AuthMapper {
 
diff --git a/backend/src/main/java/io/dataease/base/mapper/ext/AuthMapper.xml b/backend/src/main/java/io/dataease/base/mapper/ext/AuthMapper.xml
index 8ec4698628..c99b962d5b 100644
--- a/backend/src/main/java/io/dataease/base/mapper/ext/AuthMapper.xml
+++ b/backend/src/main/java/io/dataease/base/mapper/ext/AuthMapper.xml
@@ -20,11 +20,11 @@
 
 
     <select id="findUser" resultMap="baseMap">
-        select user_id, username,nick_name, dept_id, password, enabled,email, phone from sys_user where user_id = #{userId}
+        select user_id, username,nick_name, dept_id, password, enabled,email, phone, language from sys_user where user_id = #{userId}
     </select>
 
     <select id="findUserByName" resultMap="baseMap">
-        select user_id, username,nick_name, dept_id, password, enabled,email, phone from sys_user where username = #{username}
+        select user_id, username,nick_name, dept_id, password, enabled,email, phone, language from sys_user where username = #{username}
     </select>
 
     <select id="roleCodes" resultType="String">
diff --git a/backend/src/main/java/io/dataease/controller/sys/SysUserController.java b/backend/src/main/java/io/dataease/controller/sys/SysUserController.java
index 5b877e9327..c098defdfe 100644
--- a/backend/src/main/java/io/dataease/controller/sys/SysUserController.java
+++ b/backend/src/main/java/io/dataease/controller/sys/SysUserController.java
@@ -19,6 +19,7 @@ import io.swagger.annotations.ApiOperation;
 import org.springframework.web.bind.annotation.*;
 import javax.annotation.Resource;
 import java.util.List;
+import java.util.Optional;
 
 @RestController
 @Api(tags = "系统：用户管理")
@@ -89,4 +90,15 @@ public class SysUserController {
     public void updatePersonInfo(@RequestBody SysUserCreateRequest request){
         sysUserService.updatePersonInfo(request);
     }
+
+    @ApiOperation("设置语言")
+    @PostMapping("/setLanguage/{language}")
+    public void setLanguage(@PathVariable String language) {
+        CurrentUserDto user = AuthUtils.getUser();
+        Optional.ofNullable(language).ifPresent(currentLanguage -> {
+            if (!currentLanguage.equals(user.getLanguage())) {
+                sysUserService.setLanguage(user.getUserId(), currentLanguage);
+            }
+        });
+    }
 }
diff --git a/backend/src/main/java/io/dataease/provider/mysql/MysqlQueryProvider.java b/backend/src/main/java/io/dataease/provider/mysql/MysqlQueryProvider.java
index be5d697573..f182c6109a 100644
--- a/backend/src/main/java/io/dataease/provider/mysql/MysqlQueryProvider.java
+++ b/backend/src/main/java/io/dataease/provider/mysql/MysqlQueryProvider.java
@@ -60,12 +60,12 @@ public class MysqlQueryProvider extends QueryProvider {
 
     @Override
     public String createQueryCountSQLAsTmp(String sql) {
-        return createQueryCountSQL(" (" + sql + ") AS tmp ");
+        return createQueryCountSQL(" (" + sqlFix(sql) + ") AS tmp ");
     }
 
     @Override
     public String createSQLPreview(String sql, String orderBy) {
-        return "SELECT * FROM (" + sql + ") AS tmp ORDER BY " + orderBy + " LIMIT 0,1000";
+        return "SELECT * FROM (" + sqlFix(sql) + ") AS tmp ORDER BY " + orderBy + " LIMIT 0,1000";
     }
 
     @Override
@@ -94,7 +94,7 @@ public class MysqlQueryProvider extends QueryProvider {
 
     @Override
     public String createQuerySQLAsTmp(String sql, List<DatasetTableField> fields) {
-        return createQuerySQL(" (" + sql + ") AS tmp ", fields);
+        return createQuerySQL(" (" + sqlFix(sql) + ") AS tmp ", fields);
     }
 
     @Override
@@ -228,7 +228,7 @@ public class MysqlQueryProvider extends QueryProvider {
 
     @Override
     public String getSQLAsTmp(String sql, List<ChartViewFieldDTO> xAxis, List<ChartViewFieldDTO> yAxis, List<ChartExtFilterRequest> extFilterRequestList) {
-        return getSQL(" (" + sql + ") AS tmp ", xAxis, yAxis, extFilterRequestList);
+        return getSQL(" (" + sqlFix(sql) + ") AS tmp ", xAxis, yAxis, extFilterRequestList);
     }
 
     @Override
@@ -298,4 +298,11 @@ public class MysqlQueryProvider extends QueryProvider {
         }
         return filter.toString();
     }
+
+    private String sqlFix(String sql) {
+        if (sql.lastIndexOf(";") == (sql.length() - 1)) {
+            sql = sql.substring(0, sql.length() - 1);
+        }
+        return sql;
+    }
 }
diff --git a/backend/src/main/java/io/dataease/service/sys/SysUserService.java b/backend/src/main/java/io/dataease/service/sys/SysUserService.java
index 9f6e448efc..455cf479ca 100644
--- a/backend/src/main/java/io/dataease/service/sys/SysUserService.java
+++ b/backend/src/main/java/io/dataease/service/sys/SysUserService.java
@@ -201,4 +201,12 @@ public class SysUserService {
         return userIds.stream().map(sysUserMapper::selectByPrimaryKey).collect(Collectors.toList());
     }
 
+    @CacheEvict(value = AuthConstants.USER_CACHE_NAME, key = "'user' + #userId")
+    public void setLanguage(Long userId,String language) {
+        SysUser sysUser = new SysUser();
+        sysUser.setUserId(userId);
+        sysUser.setLanguage(language);
+        sysUserMapper.updateByPrimaryKeySelective(sysUser);
+    }
+
 }
diff --git a/frontend/src/api/user.js b/frontend/src/api/user.js
index 2f82672213..ee99beb1eb 100644
--- a/frontend/src/api/user.js
+++ b/frontend/src/api/user.js
@@ -43,3 +43,10 @@ export function uiImage(imageId) {
     method: 'get'
   })
 }
+
+export function languageApi(language) {
+  return request({
+    url: '/api/user/setLanguage/' + language,
+    method: 'post'
+  })
+}
diff --git a/frontend/src/components/LangSelect/index.vue b/frontend/src/components/LangSelect/index.vue
index f606735f2c..32c9a4c1fa 100644
--- a/frontend/src/components/LangSelect/index.vue
+++ b/frontend/src/components/LangSelect/index.vue
@@ -33,7 +33,7 @@ export default {
   methods: {
     handleSetLanguage(lang) {
       this.$i18n.locale = lang
-      this.$store.dispatch('app/setLanguage', lang)
+      this.$store.dispatch('user/setLanguage', lang)
       this.$message({
         message: 'Switch Language Success',
         type: 'success'
diff --git a/frontend/src/layout/components/Topbar.vue b/frontend/src/layout/components/Topbar.vue
index 47c850f589..888f58ec3e 100644
--- a/frontend/src/layout/components/Topbar.vue
+++ b/frontend/src/layout/components/Topbar.vue
@@ -35,7 +35,7 @@
           <size-select id="size-select" class="right-menu-item hover-effect" />
         </el-tooltip> -->
 
-<!--        <lang-select class="right-menu-item hover-effect" />-->
+        <lang-select class="right-menu-item hover-effect" />
       </template>
 
       <el-dropdown class="top-dropdown" style="display: flex;align-items: center;">
@@ -72,15 +72,15 @@ import { isExternal } from '@/utils/validate'
 // import Doc from '@/components/Doc'
 // import Screenfull from '@/components/Screenfull'
 // import SizeSelect from '@/components/SizeSelect'
-// import LangSelect from '@/components/LangSelect'
+import LangSelect from '@/components/LangSelect'
 import { getSysUI } from '@/utils/auth'
 export default {
   name: 'Topbar',
   components: {
-    AppLink
+    AppLink,
     // Screenfull,
     // SizeSelect,
-    // LangSelect
+    LangSelect
     // Doc
   },
   data() {
diff --git a/frontend/src/store/getters.js b/frontend/src/store/getters.js
index e7030857aa..b12c9dcaa7 100644
--- a/frontend/src/store/getters.js
+++ b/frontend/src/store/getters.js
@@ -1,6 +1,6 @@
 const getters = {
   sidebar: state => state.app.sidebar,
-  language: state => state.app.language,
+  language: state => state.user.language,
   size: state => state.app.size,
   device: state => state.app.device,
   token: state => state.user.token,
diff --git a/frontend/src/store/modules/app.js b/frontend/src/store/modules/app.js
index d5c7131ade..93eaba66fa 100644
--- a/frontend/src/store/modules/app.js
+++ b/frontend/src/store/modules/app.js
@@ -1,5 +1,5 @@
 import Cookies from 'js-cookie'
-import { getLanguage } from '@/lang/index'
+
 const state = {
   sidebar: {
     opened: Cookies.get('sidebarStatus') ? !!+Cookies.get('sidebarStatus') : true,
@@ -7,7 +7,7 @@ const state = {
     hide: false
   },
   device: 'desktop',
-  language: getLanguage(),
+
   size: Cookies.get('size') || 'small'
 }
 
@@ -32,10 +32,7 @@ const mutations = {
   SET_SIDEBAR_HIDE: (state, status) => {
     state.sidebar.hide = status
   },
-  SET_LANGUAGE: (state, language) => {
-    state.language = language
-    Cookies.set('language', language)
-  },
+
   SET_SIZE: (state, size) => {
     state.size = size
     Cookies.set('size', size)
@@ -57,9 +54,6 @@ const actions = {
   },
   setSize({ commit }, size) {
     commit('SET_SIZE', size)
-  },
-  setLanguage({ commit }, language) {
-    commit('SET_LANGUAGE', language)
   }
 }
 
diff --git a/frontend/src/store/modules/user.js b/frontend/src/store/modules/user.js
index 4b2a70c041..c7757dfa42 100644
--- a/frontend/src/store/modules/user.js
+++ b/frontend/src/store/modules/user.js
@@ -1,8 +1,9 @@
-import { login, logout, getInfo, getUIinfo } from '@/api/user'
+import { login, logout, getInfo, getUIinfo, languageApi } from '@/api/user'
 import { getToken, setToken, removeToken, setSysUI } from '@/utils/auth'
 import { resetRouter } from '@/router'
 import { format } from '@/utils/formatUi'
-
+import { getLanguage } from '@/lang/index'
+import Cookies from 'js-cookie'
 const getDefaultState = () => {
   return {
     token: getToken(),
@@ -14,7 +15,7 @@ const getDefaultState = () => {
     loadMenus: false,
     // 当前用户拥有哪些资源权限
     permissions: [],
-
+    language: getLanguage(),
     uiInfo: null
   }
 }
@@ -51,6 +52,10 @@ const mutations = {
   },
   SET_UI_INFO: (state, info) => {
     state.uiInfo = info
+  },
+  SET_LANGUAGE: (state, language) => {
+    state.language = language
+    Cookies.set('language', language)
   }
 }
 
@@ -87,13 +92,15 @@ const actions = {
         const currentUser = data
         commit('SET_USER', currentUser)
 
-        const { roles, nickName, permissions } = data
+        const { roles, nickName, permissions, language } = data
         commit('SET_ROLES', roles)
 
         commit('SET_NAME', nickName)
         // commit('SET_AVATAR', avatar)
 
         commit('SET_PERMISSIONS', permissions)
+
+        commit('SET_LANGUAGE', language)
         resolve(data)
       }).catch(error => {
         reject(error)
@@ -144,6 +151,11 @@ const actions = {
   },
   setLoginMsg({ commit, msg }) {
     commit('SET_LOGIN_MSG', msg)
+  },
+  setLanguage({ commit }, language) {
+    languageApi(language).then(() => {
+      commit('SET_LANGUAGE', language)
+    })
   }
 }
 
diff --git a/frontend/src/views/panel/edit/index.vue b/frontend/src/views/panel/edit/index.vue
index 40e2aa03bf..850e36a2c4 100644
--- a/frontend/src/views/panel/edit/index.vue
+++ b/frontend/src/views/panel/edit/index.vue
@@ -115,7 +115,7 @@ import { get } from '@/api/panel/panel'
 // 引入样式
 import '@/components/canvas/assets/iconfont/iconfont.css'
 import '@/components/canvas/styles/animate.css'
-import '@/components/canvas/styles/reset.css'
+// import '@/components/canvas/styles/reset.css'
 
 import { ApplicationContext } from '@/utils/ApplicationContext'
 import FilterDialog from '../filter/filterDialog'
diff --git a/frontend/src/views/panel/enshrine/index.vue b/frontend/src/views/panel/enshrine/index.vue
index 09be5a705a..7e944638c5 100644
--- a/frontend/src/views/panel/enshrine/index.vue
+++ b/frontend/src/views/panel/enshrine/index.vue
@@ -1,7 +1,6 @@
 <template>
   <div>
     <el-table
-
       class="de-filter-data-table"
       :data="starDatas"
       :show-header="false"
@@ -52,7 +51,7 @@ export default {
       })
     },
     resetID(data) {
-      if( data ) {
+      if (data) {
         data.forEach(item => {
           item.id = uuid.v1()
         })
diff --git a/frontend/src/views/panel/list/EditPanel/index.vue b/frontend/src/views/panel/list/EditPanel/index.vue
index d745f4de30..94331d0a8c 100644
--- a/frontend/src/views/panel/list/EditPanel/index.vue
+++ b/frontend/src/views/panel/list/EditPanel/index.vue
@@ -2,17 +2,17 @@
   <el-row>
     <el-row v-if="editPanel.optType==='new' && editPanel.panelInfo.nodeType==='panel'">
       <el-col :span="18" style="height: 40px">
-        <el-radio v-model="inputType" label="self"> {{ $t(panel.custom) }}</el-radio>
-        <el-radio v-model="inputType" label="import">{{ $t(panel.import_template) }}  </el-radio>
-        <el-radio v-model="inputType" label="copy">{{ $t(panel.copy_template) }}  </el-radio>
+        <el-radio v-model="inputType" label="self"> {{ $t('panel.custom') }}</el-radio>
+        <el-radio v-model="inputType" label="import">{{ $t('panel.import_template') }}  </el-radio>
+        <el-radio v-model="inputType" label="copy">{{ $t('panel.copy_template') }}  </el-radio>
       </el-col>
       <el-col v-if="inputType==='import'" :span="6">
-        <el-button class="el-icon-upload" size="small" type="primary" @click="goFile">{{ $t(panel.upload_template) }}</el-button>
+        <el-button class="el-icon-upload" size="small" type="primary" @click="goFile">{{ $t('panel.upload_template') }}</el-button>
         <input id="input" ref="files" type="file" accept=".DE" hidden @change="handleFileChange">
       </el-col>
     </el-row>
     <el-row style="margin-top: 5px">
-      <el-col :span="4">{{ editPanel.titleSuf }} {{ $t(commons.name) }}</el-col>
+      <el-col :span="4">{{ editPanel.titleSuf }} {{ $t('commons.name') }}</el-col>
       <el-col :span="20">
         <el-input v-model="editPanel.panelInfo.name" clearable size="mini" />
       </el-col>
@@ -25,8 +25,8 @@
     </el-row>
     <el-row v-if="inputType==='import'" class="preview" :style="classBackground" />
     <el-row class="root-class">
-      <el-button @click="cancel()">{{ $t(commons.cancel) }}</el-button>
-      <el-button type="primary" @click="save()">{{ $t(commons.confirm) }}</el-button>
+      <el-button size="mini" @click="cancel()">{{ $t('commons.cancel') }}</el-button>
+      <el-button type="primary" size="mini" @click="save()">{{ $t('commons.confirm') }}</el-button>
     </el-row>
   </el-row>
 </template>
@@ -101,7 +101,7 @@ export default {
     },
     save() {
       if (!this.editPanel.panelInfo.name) {
-        this.$warning( this.$t('commons.name_can_not_empty'))
+        this.$warning(this.$t('chart.name_can_not_empty'))
         return false
       }
       panelSave(this.editPanel.panelInfo).then(response => {
diff --git a/frontend/src/views/panel/list/PanelList.vue b/frontend/src/views/panel/list/PanelList.vue
index 26d7362113..d336d589ba 100644
--- a/frontend/src/views/panel/list/PanelList.vue
+++ b/frontend/src/views/panel/list/PanelList.vue
@@ -1,5 +1,5 @@
 <template xmlns:el-col="http://www.w3.org/1999/html">
-  <el-col>
+  <el-col style="padding: 0 10px 0 10px;">
     <!-- panel list -->
     <el-col>
       <el-row>
@@ -28,7 +28,10 @@
       </el-row>
 
       <el-row>
-        <span class="header-title">{{ $t('panel.panel') }}</span>
+        <span class="header-title">
+          {{ $t('panel.panel') }}
+          <el-button style="float: right;padding-right: 7px;" type="text" icon="el-icon-circle-plus" @click="showEditPanel(newFolder)" />
+        </span>
       </el-row>
       <el-col class="custom-tree-container">
         <div class="block">
@@ -92,7 +95,7 @@
                         {{ $t('panel.edit') }}
                       </el-dropdown-item>
                       <el-dropdown-item v-if="data.nodeType==='panel'" icon="el-icon-paperclip" :command="beforeClickMore('link',data,node)">
-                       {{ $t('panel.create_public_links') }}
+                        {{ $t('panel.create_public_links') }}
                       </el-dropdown-item>
                     </el-dropdown-menu>
                   </el-dropdown>
@@ -248,6 +251,16 @@ export default {
           panelData: '[]'
         }
       },
+      newFolder: {
+        type: 'folder',
+        data: {
+          id: null,
+          pid: null,
+          level: 0
+        },
+        node: {},
+        optType: 'newFirstFolder'
+      },
       linkTitle: '链接分享',
       linkVisible: false,
       linkResourceId: null,
@@ -319,6 +332,12 @@ export default {
           this.editPanel.panelInfo.pid = param.data.id
           this.editPanel.panelInfo.level = param.data.level + 1
           break
+        case 'newFirstFolder':
+          this.editPanel.titlePre = this.$t('commons.create')
+          this.editPanel.panelInfo.name = ''
+          this.editPanel.panelInfo.pid = null
+          this.editPanel.panelInfo.level = 0
+          break
         case 'edit':
         case 'rename':
           this.editPanel.titlePre = this.$t('commons.edit')
@@ -525,7 +544,9 @@ export default {
     flex: 1;
     color: #606266;
     font-weight: bold;
-
+    display: block;
+    height: 100%;
+    line-height: 36px;
   }
 
   .el-divider--horizontal {
diff --git a/frontend/src/views/panel/list/PanelViewShow.vue b/frontend/src/views/panel/list/PanelViewShow.vue
index cb51f0a28e..815a86ef0d 100644
--- a/frontend/src/views/panel/list/PanelViewShow.vue
+++ b/frontend/src/views/panel/list/PanelViewShow.vue
@@ -27,7 +27,7 @@
         </span>
 
         <span v-if="hasStar && panelInfo" style="float: right;margin-right: 10px">
-          <el-tooltip :content="$t('commons.cancle')">
+          <el-tooltip :content="$t('commons.cancel')">
             <el-button class="el-icon-star-on" size="mini" circle @click="unstar" />
           </el-tooltip>
         </span>