Merge branch 'main' into pages

.nvmrc

@@ -1 +1 @@
-v20.15.0
+v20.17.0

CHANGELOG.en_US.md

@@ -1,3 +1,28 @@
+# 5.8.0 (2024-08-19)
+
+### 🎫 Feat
+
+- Added a second button permission command (judged based on the `permissions` field returned by the login interface)
+- Functional pop-up box `ReDialog` adds whether to enable the `loading` loading animation function after clicking the confirmation button
+- `PureTableBar` component adds full screen and exit full screen functions
+- `VxeTableBar` component adds full screen and exit full screen functions
+- The OK button of the `ReDialog` component provides the close button animation `closeLoading` function
+- Add development environment code debugging `vite-plugin-vue-inspector` plug-in to improve development experience
+- Added `vite-plugin-checker` plugin for stricter type and `eslint` verification
+
+### 🐞 Bug fixes
+
+- Fixed the problem that the current tab cannot be closed after configuring the routing attribute `fixedTag` to `false`
+- Fixed the issue where `logo` cannot be hidden in top menu mode
+
+### 🍏 Perf
+
+- Optimize type hints for custom instructions
+- Optimize the press enter login function on the login page
+- Optimize the mask level of the left menu on the mobile side
+- Optimize system management-permission function style of role management
+- Upgraded dependencies, compatible with the latest version of `element-plus`
+
 # 5.7.0 (2024-06-04)
 
 ### 🎫 Feat

CHANGELOG.md

@@ -1,3 +1,28 @@
+# 5.8.0 (2024-08-19)
+
+### 🎫 Feat
+
+- Added a second button permission command (judged based on the `permissions` field returned by the login interface)
+- Functional pop-up box `ReDialog` adds whether to enable the `loading` loading animation function after clicking the confirmation button
+- `PureTableBar` component adds full screen and exit full screen functions
+- `VxeTableBar` component adds full screen and exit full screen functions
+- The OK button of the `ReDialog` component provides the close button animation `closeLoading` function
+- Add development environment code debugging `vite-plugin-vue-inspector` plug-in to improve development experience
+- Added `vite-plugin-checker` plugin for stricter type and `eslint` verification
+
+### 🐞 Bug fixes
+
+- Fixed the problem that the current tab cannot be closed after configuring the routing attribute `fixedTag` to `false`
+- Fixed the issue where `logo` cannot be hidden in top menu mode
+
+### 🍏 Perf
+
+- Optimize type hints for custom instructions
+- Optimize the press enter login function on the login page
+- Optimize the mask level of the left menu on the mobile side
+- Optimize system management-permission function style of role management
+- Upgraded dependencies, compatible with the latest version of `element-plus`
+
 # 5.7.0 (2024-06-04)
 
 ### 🎫 Feat

CHANGELOG.zh_CN.md

@@ -1,3 +1,28 @@
+# 5.8.0 (2024-08-19)
+
+### 🎫 Feat
+
+- 新增第二种按钮权限指令（根据登录接口返回的`permissions`字段进行判断）
+- 函数式弹框`ReDialog`添加点击确认按钮后是否开启`loading`加载动画功能
+- `PureTableBar`组件添加全屏和退出全屏功能
+- `VxeTableBar`组件添加全屏和退出全屏功能
+- `ReDialog`组件的确定按钮提供关闭按钮动画`closeLoading`功能
+- 添加开发环境代码调试`vite-plugin-vue-inspector`插件，提升开发体验
+- 添加`vite-plugin-checker`插件，更严格的类型和`eslint`校验
+
+### 🐞 Bug fixes
+
+- 修复配置路由属性`fixedTag`为`false`后当前标签页不可关闭的问题
+- 修复顶部菜单模式下`logo`不可隐藏的问题
+
+### 🍏 Perf
+
+- 优化自定义指令的类型提示
+- 优化登录页回车登录功能
+- 优化移动端左侧菜单遮罩层级
+- 优化系统管理-角色管理的权限功能样式
+- 升级依赖，`element-plus`最新版兼容处理
+
 # 5.7.0 (2024-06-04)
 
 ### 🎫 Feat

build/plugins.ts

@@ -26,7 +26,6 @@ export function getPluginsList(
     // jsx、tsx语法支持
     vueJsx(),
     VueI18nPlugin({
-      jitCompilation: false,
       include: [pathResolve("../locales/**")]
     }),
     checker({

eslint.config.js

@@ -78,7 +78,8 @@ export default defineFlatConfig([
     languageOptions: {
       parser: parserTypeScript,
       parserOptions: {
-        sourceType: "module"
+        sourceType: "module",
+        warnOnUnsupportedTypeScriptVersion: false
       }
     },
     plugins: {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-pure-admin",
-  "version": "5.7.0",
+  "version": "5.8.0",
   "private": true,
   "type": "module",
   "scripts": {
@@ -48,28 +48,28 @@
   },
   "dependencies": {
     "@amap/amap-jsapi-loader": "^1.0.1",
-    "@howdyjs/mouse-menu": "^2.1.3",
+    "@howdyjs/mouse-menu": "^2.1.6",
     "@infectoone/vue-ganttastic": "^2.3.2",
     "@logicflow/core": "^1.2.28",
     "@logicflow/extension": "^1.2.28",
     "@pureadmin/descriptions": "^1.2.1",
-    "@pureadmin/table": "^3.2.0",
+    "@pureadmin/table": "^3.2.1",
     "@pureadmin/utils": "^2.4.8",
     "@vue-flow/background": "^1.3.0",
-    "@vue-flow/core": "^1.39.3",
+    "@vue-flow/core": "^1.41.2",
-    "@vueuse/core": "^10.11.1",
+    "@vueuse/core": "^11.1.0",
-    "@vueuse/motion": "^2.2.3",
+    "@vueuse/motion": "^2.2.5",
     "@wangeditor/editor": "^5.1.23",
     "@wangeditor/editor-for-vue": "^5.1.12",
     "@zxcvbn-ts/core": "^3.0.4",
     "animate.css": "^4.1.1",
-    "axios": "^1.7.3",
+    "axios": "^1.7.7",
     "china-area-data": "^5.0.1",
     "cropperjs": "^1.6.2",
-    "dayjs": "^1.11.12",
+    "dayjs": "^1.11.13",
     "echarts": "^5.5.1",
     "el-table-infinite-scroll": "^3.0.6",
-    "element-plus": "^2.8.0",
+    "element-plus": "^2.8.3",
     "intro.js": "^7.2.0",
     "js-cookie": "^3.0.5",
     "jsbarcode": "^3.11.6",
@@ -79,98 +79,98 @@
     "mqtt": "4.3.7",
     "nprogress": "^0.2.0",
     "path": "^0.12.7",
-    "pinia": "^2.2.1",
+    "pinia": "^2.2.2",
     "pinyin-pro": "^3.24.2",
-    "plus-pro-components": "^0.1.14",
+    "plus-pro-components": "^0.1.16",
     "qrcode": "^1.5.4",
     "qs": "^6.13.0",
     "responsive-storage": "^2.2.0",
-    "sortablejs": "^1.15.2",
+    "sortablejs": "^1.15.3",
-    "swiper": "^11.1.9",
+    "swiper": "^11.1.14",
-    "typeit": "^8.8.4",
+    "typeit": "^8.8.5",
     "v-contextmenu": "^3.2.0",
-    "v3-infinite-loading": "^1.3.1",
+    "v3-infinite-loading": "^1.3.2",
-    "version-rocket": "^1.7.2",
+    "version-rocket": "^1.7.3",
-    "vue": "^3.4.37",
+    "vue": "^3.5.7",
-    "vue-i18n": "^9.13.1",
+    "vue-i18n": "^10.0.1",
     "vue-json-pretty": "^2.4.0",
     "vue-pdf-embed": "^2.1.0",
-    "vue-router": "^4.4.3",
+    "vue-router": "^4.4.5",
     "vue-tippy": "^6.4.4",
     "vue-types": "^5.1.3",
     "vue-virtual-scroller": "2.0.0-beta.8",
-    "vue-waterfall-plugin-next": "^2.4.3",
+    "vue-waterfall-plugin-next": "^2.6.0",
     "vue3-danmaku": "^1.6.1",
     "vue3-puzzle-vcode": "^1.1.7",
     "vuedraggable": "^4.1.0",
-    "vxe-table": "4.6.17",
+    "vxe-table": "4.6.19",
-    "wavesurfer.js": "^7.8.3",
+    "wavesurfer.js": "^7.8.6",
-    "xgplayer": "^3.0.19",
+    "xgplayer": "^3.0.20",
     "xlsx": "^0.18.5"
   },
   "devDependencies": {
-    "@commitlint/cli": "^19.4.0",
+    "@commitlint/cli": "^19.5.0",
-    "@commitlint/config-conventional": "^19.2.2",
+    "@commitlint/config-conventional": "^19.5.0",
-    "@commitlint/types": "^19.0.3",
+    "@commitlint/types": "^19.5.0",
-    "@eslint/js": "^9.9.0",
+    "@eslint/js": "^9.11.0",
     "@faker-js/faker": "^8.4.1",
     "@iconify-icons/ep": "^1.2.12",
     "@iconify-icons/ri": "^1.2.10",
     "@iconify/vue": "^4.1.2",
-    "@intlify/unplugin-vue-i18n": "^4.0.0",
+    "@intlify/unplugin-vue-i18n": "^5.0.0",
     "@pureadmin/theme": "^3.2.0",
     "@types/dagre": "^0.7.52",
     "@types/gradient-string": "^1.1.6",
     "@types/intro.js": "^5.1.5",
     "@types/js-cookie": "^3.0.6",
-    "@types/node": "^20.14.15",
+    "@types/node": "^20.16.5",
     "@types/nprogress": "^0.2.3",
     "@types/qrcode": "^1.5.5",
-    "@types/qs": "^6.9.15",
+    "@types/qs": "^6.9.16",
     "@types/sortablejs": "^1.15.8",
     "@typescript-eslint/eslint-plugin": "^7.18.0",
     "@typescript-eslint/parser": "^7.18.0",
-    "@vitejs/plugin-vue": "^5.1.2",
+    "@vitejs/plugin-vue": "^5.1.4",
-    "@vitejs/plugin-vue-jsx": "^4.0.0",
+    "@vitejs/plugin-vue-jsx": "^4.0.1",
     "autoprefixer": "^10.4.20",
-    "boxen": "^7.1.1",
+    "boxen": "^8.0.1",
-    "cssnano": "^7.0.5",
+    "cssnano": "^7.0.6",
     "dagre": "^0.8.5",
-    "eslint": "^9.9.0",
+    "eslint": "^9.11.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-define-config": "^2.1.0",
     "eslint-plugin-prettier": "^5.2.1",
-    "eslint-plugin-vue": "^9.27.0",
+    "eslint-plugin-vue": "^9.28.0",
     "gradient-string": "^2.0.2",
-    "husky": "^9.1.4",
+    "husky": "^9.1.6",
-    "lint-staged": "^15.2.8",
+    "lint-staged": "^15.2.10",
-    "postcss": "^8.4.41",
+    "postcss": "^8.4.47",
     "postcss-html": "^1.7.0",
     "postcss-import": "^16.1.0",
     "postcss-scss": "^4.0.9",
     "prettier": "^3.3.3",
-    "rimraf": "^5.0.10",
+    "rimraf": "^6.0.1",
     "rollup-plugin-visualizer": "^5.12.0",
-    "sass": "^1.77.8",
+    "sass": "1.77.8",
-    "stylelint": "^16.8.1",
+    "stylelint": "^16.9.0",
-    "stylelint-config-recess-order": "^5.0.1",
+    "stylelint-config-recess-order": "^5.1.0",
     "stylelint-config-recommended-vue": "^1.5.0",
     "stylelint-config-standard-scss": "^13.1.0",
     "stylelint-prettier": "^5.0.2",
     "svgo": "^3.3.2",
-    "tailwindcss": "^3.4.9",
+    "tailwindcss": "^3.4.12",
-    "typescript": "^5.5.4",
+    "typescript": "^5.6.2",
-    "vite": "^5.4.0",
+    "vite": "^5.4.7",
     "vite-plugin-cdn-import": "^1.0.1",
-    "vite-plugin-checker": "^0.7.2",
+    "vite-plugin-checker": "^0.8.0",
     "vite-plugin-compression": "^0.5.1",
-    "vite-plugin-fake-server": "^2.1.1",
+    "vite-plugin-fake-server": "^2.1.2",
     "vite-plugin-remove-console": "^2.2.0",
     "vite-plugin-router-warn": "^1.0.0",
-    "vite-plugin-vue-inspector": "^5.1.3",
+    "vite-plugin-vue-inspector": "^5.2.0",
     "vite-svg-loader": "^5.1.0",
     "vue-eslint-parser": "^9.4.3",
-    "vue-tsc": "^2.0.29"
+    "vue-tsc": "^2.1.6"
   },
   "engines": {
     "node": "^18.18.0 || ^20.9.0 || >=21.1.0",

public/platform-config.json

@@ -1,5 +1,5 @@
 {
-  "Version": "5.7.0",
+  "Version": "5.8.0",
   "Title": "PureAdmin",
   "FixedHeader": true,
   "HiddenSideBar": false,

src/plugins/i18n.ts

@@ -50,7 +50,7 @@ function getObjectKeys(obj) {
       if (obj[k] && isObject(obj[k])) {
         stack.push({ obj: obj[k], key: newKey });
       } else {
-        keys.add(newKey);
+        keys.add(key);
       }
     }
   }

src/style/element-plus.scss

@@ -163,9 +163,10 @@
 
 /* 仿 el-scrollbar 滚动条样式，支持大多数浏览器，如Chrome、Edge、Firefox、Safari等。整体暗色风格在 src/style/dark.scss 文件进行了适配 */
 .pure-scrollbar {
+  scrollbar-color: rgb(221 222 224) transparent; /* 滑块颜色、轨道颜色 */
+
   /* Firefox */
   scrollbar-width: thin; /* 可选值为 'auto', 'thin', 'none' */
-  scrollbar-color: rgb(221 222 224) transparent; /* 滑块颜色、轨道颜色 */
   ::-webkit-scrollbar {
     width: 6px; /* 滚动条宽度 */
   }

src/views/system/dept/utils/hook.tsx

@@ -123,7 +123,7 @@ export function useDept() {
       fullscreen: deviceDetection(),
       fullscreenIcon: true,
       closeOnClickModal: false,
-      contentRenderer: () => h(editForm, { ref: formRef }),
+      contentRenderer: () => h(editForm, { ref: formRef, formInline: null }),
       beforeSure: (done, { options }) => {
         const FormRef = formRef.value.getRef();
         const curData = options.props.formInline as FormItemProps;

src/views/system/menu/utils/hook.tsx

@@ -165,7 +165,7 @@ export function useMenu() {
       fullscreen: deviceDetection(),
       fullscreenIcon: true,
       closeOnClickModal: false,
-      contentRenderer: () => h(editForm, { ref: formRef }),
+      contentRenderer: () => h(editForm, { ref: formRef, formInline: null }),
       beforeSure: (done, { options }) => {
         const FormRef = formRef.value.getRef();
         const curData = options.props.formInline as FormItemProps;

src/views/system/role/utils/hook.tsx

@@ -195,7 +195,7 @@ export function useRole(treeRef: Ref) {
       fullscreen: deviceDetection(),
       fullscreenIcon: true,
       closeOnClickModal: false,
-      contentRenderer: () => h(editForm, { ref: formRef }),
+      contentRenderer: () => h(editForm, { ref: formRef, formInline: null }),
       beforeSure: (done, { options }) => {
         const FormRef = formRef.value.getRef();
         const curData = options.props.formInline as FormItemProps;

src/views/system/user/utils/hook.tsx

@@ -331,7 +331,7 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
       fullscreen: deviceDetection(),
       fullscreenIcon: true,
       closeOnClickModal: false,
-      contentRenderer: () => h(editForm, { ref: formRef }),
+      contentRenderer: () => h(editForm, { ref: formRef, formInline: null }),
       beforeSure: (done, { options }) => {
         const FormRef = formRef.value.getRef();
         const curData = options.props.formInline as FormItemProps;

src/views/table/high/excel/index.vue

@@ -6,11 +6,7 @@ const { columns, dataList, exportExcel } = useColumns();
 
 <template>
   <div>
-    <el-button
+    <el-button type="primary" class="mb-[20px]" @click="exportExcel">
-      type="primary"
-      class="mb-[20px] float-right"
-      @click="exportExcel"
-    >
       导出
     </el-button>
     <pure-table row-key="id" border :data="dataList" :columns="columns" />

src/views/table/high/header/columns.tsx

@@ -0,0 +1,57 @@
+import { tableData } from "../data";
+import { ref, onMounted } from "vue";
+import { clone, delay } from "@pureadmin/utils";
+
+export function useColumns() {
+  const dataList = ref([]);
+  const columns = ref<TableColumnList>([
+    {
+      label: "日期",
+      prop: "date"
+    },
+    {
+      label: "姓名",
+      prop: "name"
+    },
+    {
+      label: "地址",
+      prop: "address"
+    }
+  ]);
+
+  function onChange() {
+    // 动态表头只需给 columns.value 重新赋值即可，如下
+    columns.value = [
+      {
+        label: "日期" + Math.round(Math.random() * 99),
+        prop: "date"
+      },
+      {
+        label: Math.round(Math.random() * 99) + "姓名",
+        prop: "name"
+      },
+      {
+        label: "地址",
+        prop: "address"
+      }
+    ];
+  }
+
+  onMounted(() => {
+    delay(600).then(() => {
+      const newList = [];
+      Array.from({ length: 6 }).forEach(() => {
+        newList.push(clone(tableData, true));
+      });
+      newList.flat(Infinity).forEach((item, index) => {
+        dataList.value.push({ id: index, ...item });
+      });
+    });
+  });
+
+  return {
+    columns,
+    dataList,
+    onChange
+  };
+}

src/views/table/high/header/index.vue

@@ -0,0 +1,25 @@
+<script setup lang="ts">
+import { ref } from "vue";
+import { useColumns } from "./columns";
+
+const tableRef = ref();
+
+const { columns, dataList, onChange } = useColumns();
+</script>
+
+<template>
+  <div>
+    <el-button type="primary" class="mb-[20px]" @click="onChange">
+      切换表头
+    </el-button>
+    <pure-table
+      ref="tableRef"
+      border
+      row-key="id"
+      alignWhole="center"
+      showOverflowTooltip
+      :data="dataList"
+      :columns="columns"
+    />
+  </div>
+</template>

src/views/table/high/list.tsx

@@ -1,5 +1,6 @@
 import Adaptive from "./adaptive/index.vue";
 import Page from "./page/index.vue";
+import Header from "./header/index.vue";
 import RowDrag from "./drag/row/index.vue";
 import ColumnDrag from "./drag/column/index.vue";
 import Contextmenu from "./contextmenu/index.vue";
@@ -25,6 +26,12 @@ export const list = [
     title: "分页、加载动画、动态列",
     component: Page
   },
+  {
+    key: "header",
+    content: rendContent("header"),
+    title: "动态表头",
+    component: Header
+  },
   {
     key: "tableSelect",
     content: rendContent("table-select"),

src/views/table/high/prints/index.vue

@@ -9,7 +9,7 @@ const { columns, dataList, print, cellStyle, rowStyle, headerCellStyle } =
 
 <template>
   <div>
-    <el-button type="primary" class="mb-[20px] float-right" @click="print">
+    <el-button type="primary" class="mb-[20px]" @click="print">
       打印
     </el-button>
     <!-- rowHoverBgColor="transparent" 鼠标经过行时，去掉行的背景色 -->