Merge branch 'main' into gitee

CHANGELOG.en_US.md

@@ -1,3 +1,10 @@
+# 3.9.7 (2022-12-26)
+
+### 🍏 Perf
+
+- Use `path.posix.resolve` instead of `path.resolve` to avoid drive letter problems when using `electron` in `windows` environment
+- By default, the `CachingAsyncRoutes` dynamic routing cache is turned off locally, making it easier to debug in the development environment. It is not necessary to clear the local cached dynamic routing every time you modify the dynamic routing. It is recommended to enable it in the production environment
+
 # 3.9.6 (2022-12-19)
 
 ### 🎫 Chores

CHANGELOG.md

@@ -1,3 +1,10 @@
+# 3.9.7 (2022-12-26)
+
+### 🍏 Perf
+
+- Use `path.posix.resolve` instead of `path.resolve` to avoid drive letter problems when using `electron` in `windows` environment
+- By default, the `CachingAsyncRoutes` dynamic routing cache is turned off locally, making it easier to debug in the development environment. It is not necessary to clear the local cached dynamic routing every time you modify the dynamic routing. It is recommended to enable it in the production environment
+
 # 3.9.6 (2022-12-19)
 
 ### 🎫 Chores

CHANGELOG.zh_CN.md

@@ -1,3 +1,10 @@
+# 3.9.7 (2022-12-26)
+
+### 🍏 Perf
+
+- 使用 `path.posix.resolve` 替代 `path.resolve` 避免 `windows` 环境下使用 `electron` 出现盘符问题
+- 默认关闭 `CachingAsyncRoutes` 动态路由缓存本地，使其在开发环境下调试更方便，不用每次修改动态路由都要先清空本地缓存的动态路由，更推荐在生产环境开启
+
 # 3.9.6 (2022-12-19)
 
 ### 🎫 Chores

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-pure-admin",
-  "version": "3.9.6",
+  "version": "3.9.7",
   "private": true,
   "scripts": {
     "dev": "NODE_OPTIONS=--max-old-space-size=4096 vite",
@@ -35,23 +35,23 @@
     "@pureadmin/descriptions": "^1.1.0",
     "@pureadmin/table": "^1.9.0",
     "@pureadmin/utils": "^1.8.5",
-    "@vueuse/core": "^9.6.0",
+    "@vueuse/core": "^9.10.0",
     "@vueuse/motion": "2.0.0-beta.12",
     "@wangeditor/editor": "^5.1.21",
     "@wangeditor/editor-for-vue": "^5.1.12",
     "animate.css": "^4.1.1",
-    "axios": "^1.2.0",
+    "axios": "^1.2.2",
     "china-area-data": "^5.0.1",
     "cropperjs": "^1.5.12",
-    "dayjs": "^1.11.6",
+    "dayjs": "^1.11.7",
-    "echarts": "^5.4.0",
+    "echarts": "^5.4.1",
     "el-table-infinite-scroll": "^3.0.1",
-    "element-plus": "^2.2.27",
+    "element-plus": "^2.2.28",
     "element-resize-detector": "^1.2.4",
     "intro.js": "^6.0.0",
     "js-cookie": "^3.0.1",
     "jsbarcode": "^3.11.5",
-    "md-editor-v3": "^2.5.0",
+    "md-editor-v3": "^2.7.2",
     "mitt": "^3.0.0",
     "mockjs": "^1.1.0",
     "nprogress": "^0.2.0",
@@ -62,7 +62,7 @@
     "responsive-storage": "^2.1.0",
     "sortablejs": "^1.15.0",
     "swiper": "^8.4.5",
-    "typeit": "^8.7.0",
+    "typeit": "^8.7.1",
     "v-contextmenu": "3.0.0",
     "vue": "^3.2.45",
     "vue-i18n": "^9.2.2",
@@ -73,15 +73,15 @@
     "vue-virtual-scroller": "2.0.0-beta.7",
     "vue3-danmaku": "^1.2.0",
     "vuedraggable": "^4.1.0",
-    "xgplayer": "^2.32.1",
+    "xgplayer": "^2.32.2",
     "xlsx": "^0.18.5"
   },
   "devDependencies": {
     "@commitlint/cli": "13.1.0",
     "@commitlint/config-conventional": "13.1.0",
-    "@iconify-icons/ep": "^1.2.7",
+    "@iconify-icons/ep": "^1.2.10",
-    "@iconify-icons/ri": "^1.2.3",
+    "@iconify-icons/ri": "^1.2.4",
-    "@iconify/vue": "^4.0.0",
+    "@iconify/vue": "^4.0.2",
     "@intlify/unplugin-vue-i18n": "^0.8.1",
     "@pureadmin/theme": "^3.0.0",
     "@types/element-resize-detector": "1.1.3",
@@ -100,7 +100,7 @@
     "@vue/eslint-config-prettier": "^7.0.0",
     "@vue/eslint-config-typescript": "^11.0.2",
     "autoprefixer": "^10.4.13",
-    "cloc": "^2.10.0",
+    "cloc": "^2.11.0",
     "cssnano": "^5.1.14",
     "eslint": "^8.8.0",
     "eslint-plugin-prettier": "^4.0.0",
@@ -108,15 +108,15 @@
     "husky": "^7.0.4",
     "lint-staged": "11.1.2",
     "picocolors": "^1.0.0",
-    "postcss": "^8.4.18",
+    "postcss": "^8.4.21",
     "postcss-html": "^1.5.0",
-    "postcss-import": "^15.0.0",
+    "postcss-import": "^15.1.0",
-    "postcss-scss": "^4.0.5",
+    "postcss-scss": "^4.0.6",
     "prettier": "^2.5.1",
     "pretty-quick": "3.1.1",
     "rimraf": "3.0.2",
-    "rollup-plugin-visualizer": "^5.8.3",
+    "rollup-plugin-visualizer": "^5.9.0",
-    "sass": "^1.56.1",
+    "sass": "^1.57.1",
     "sass-loader": "^13.2.0",
     "stylelint": "^14.3.0",
     "stylelint-config-html": "^1.0.0",
@@ -126,17 +126,17 @@
     "stylelint-order": "^5.0.0",
     "svgo": "^3.0.2",
     "tailwindcss": "^3.2.4",
-    "terser": "^5.15.1",
+    "terser": "^5.16.1",
-    "typescript": "^4.9.3",
+    "typescript": "^4.9.4",
     "unplugin-vue-define-options": "^1.0.0",
-    "vite": "^4.0.3",
+    "vite": "^4.0.4",
     "vite-plugin-cdn-import": "^0.3.5",
     "vite-plugin-compression": "^0.5.1",
     "vite-plugin-mock": "^2.9.6",
     "vite-plugin-remove-console": "^1.3.0",
-    "vite-svg-loader": "^3.6.0",
+    "vite-svg-loader": "^4.0.0",
     "vue-eslint-parser": "^9.1.0",
-    "vue-tsc": "^1.0.9"
+    "vue-tsc": "^1.0.22"
   },
   "pnpm": {
     "peerDependencyRules": {

public/serverConfig.json

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

src/utils/print.ts

@@ -13,8 +13,6 @@ const Print = function (dom, options?: object): PrintFunction {
     styleStr: "",
     // Elements that need to dynamically get and set the height
     setDomHeightArr: [],
-    // Echart dom List
-    echartDomArr: [],
     // Callback before printing
     printBeforeFn: null,
     // Callback after printing
@@ -73,6 +71,8 @@ Print.prototype = {
     const inputs = document.querySelectorAll("input");
     const selects = document.querySelectorAll("select");
     const textareas = document.querySelectorAll("textarea");
+    const canvass = document.querySelectorAll("canvas");
+
     for (let k = 0; k < inputs.length; k++) {
       if (inputs[k].type == "checkbox" || inputs[k].type == "radio") {
         if (inputs[k].checked == true) {
@@ -108,6 +108,15 @@ Print.prototype = {
       }
     }
 
+    for (let k4 = 0; k4 < canvass.length; k4++) {
+      const imageURL = canvass[k4].toDataURL("image/png");
+      const img = document.createElement("img");
+      img.src = imageURL;
+      img.setAttribute("style", "max-width: 100%;");
+      img.className = "isNeedRemove";
+      canvass[k4].parentNode.insertBefore(img, canvass[k4].nextElementSibling);
+    }
+
     return this.dom.outerHTML;
   },
   /**
@@ -130,6 +139,12 @@ Print.prototype = {
     doc.open();
     doc.write(content);
     doc.close();
+
+    const removes = document.querySelectorAll(".isNeedRemove");
+    for (let k = 0; k < removes.length; k++) {
+      removes[k].parentNode.removeChild(removes[k]);
+    }
+
     // eslint-disable-next-line @typescript-eslint/no-this-alias
     const _this = this;
     iframe.onload = function (): void {
@@ -137,42 +152,16 @@ Print.prototype = {
       if (_this.conf.printBeforeFn) {
         _this.conf.printBeforeFn({ doc });
       }
-
+      _this.toPrint(w);
-      _this.drawEchartImg(doc).then(() => {
+      setTimeout(function () {
-        _this.toPrint(w);
+        document.body.removeChild(iframe);
-        setTimeout(function () {
+        // After popup, callback
-          document.body.removeChild(iframe);
+        if (_this.conf.printDoneCallBack) {
-          // After popup, callback
+          _this.conf.printDoneCallBack();
-          if (_this.conf.printDoneCallBack) {
+        }
-            _this.conf.printDoneCallBack();
+      }, 100);
-          }
-        }, 100);
-      });
     };
   },
-  /**
-   * echarts printing
-   * @param {Object} doc iframe window
-   */
-  drawEchartImg(doc): Promise<void> {
-    return new Promise<void>(resolve => {
-      if (this.conf.echartDomArr && this.conf.echartDomArr.length > 0) {
-        this.conf.echartDomArr.forEach(e => {
-          const dom = doc.querySelector("#" + e.$el.id);
-          const img = new Image();
-          const w = dom.offsetWidth + "px";
-          const H = dom.offsetHeight + "px";
-
-          img.style.width = w;
-          img.style.height = H;
-          img.src = e.imgSrc;
-          dom.innerHTML = "";
-          dom.appendChild(img);
-        });
-      }
-      resolve();
-    });
-  },
   /**
     Print
   */

src/views/able/print.vue

@@ -10,6 +10,7 @@ defineOptions({
 interface User {
   date: string;
   name: string;
+  age: number;
   address: string;
 }
 
@@ -19,15 +20,15 @@ const options = [
   {
     value: "1",
     el: ".el-table",
-    label: "Element-Plus Table"
+    label: "Table"
   },
   {
-    value: "3",
+    value: "2",
     el: ".echart",
     label: "Echart"
   },
   {
-    value: "4",
+    value: "3",
     el: ".img",
     label: "Image"
   }
@@ -51,21 +52,25 @@ const tableData: User[] = [
   {
     date: "2016-05-03",
     name: "Tom",
+    age: 18,
     address: "No. 189, Grove St, Los Angeles"
   },
   {
     date: "2016-05-02",
     name: "Tom",
+    age: 18,
     address: "No. 189, Grove St, Los Angeles"
   },
   {
     date: "2016-05-04",
     name: "Tom",
+    age: 18,
     address: "No. 189, Grove St, Los Angeles"
   },
   {
     date: "2016-05-01",
     name: "Tom",
+    age: 18,
     address: "No. 189, Grove St, Los Angeles"
   }
 ];
@@ -98,12 +103,11 @@ const tableData: User[] = [
     </template>
     <el-row :gutter="24">
       <el-col
-        :xs="22"
+        :xs="24"
-        :sm="22"
+        :sm="24"
-        :md="11"
+        :md="24"
-        :lg="11"
+        :lg="24"
-        :xl="11"
+        :xl="24"
-        style="margin: 10px; border: 0.01rem solid var(--el-color-primary)"
         v-motion
         :initial="{
           opacity: 0,
@@ -117,31 +121,28 @@ const tableData: User[] = [
           }
         }"
       >
-        <p class="font-medium pt-1">Element-Plus Table</p>
+        <p class="font-medium pt-1">Table</p>
         <el-table
           border
           :data="tableData"
           :row-class-name="tableRowClassName"
-          class="el-table w-full mt-[40px] mr-[40px]"
+          class="el-table w-full mt-[10px]"
         >
-          <el-table-column prop="date" label="Date" width="180" />
+          <el-table-column prop="date" label="Date" />
-          <el-table-column prop="name" label="Name" width="180" />
+          <el-table-column prop="name" label="Name" />
+          <el-table-column prop="age" label="age" />
           <el-table-column prop="address" label="Address" />
         </el-table>
       </el-col>
 
+      <el-divider />
+
       <el-col
-        :xs="22"
+        :xs="11"
-        :sm="22"
+        :sm="11"
         :md="11"
         :lg="11"
         :xl="11"
-        style="
-          width: 200px;
-          height: 300px;
-          margin: 10px;
-          border: 0.01rem solid var(--el-color-primary);
-        "
         v-motion
         :initial="{
           opacity: 0,
@@ -156,21 +157,15 @@ const tableData: User[] = [
         }"
       >
         <p class="font-medium pt-1">Echart</p>
-        <Line class="echart" style="margin: 0 auto; height: 300px" />
+        <Line class="echart mt-[10px]" />
       </el-col>
 
       <el-col
-        :xs="22"
+        :xs="11"
-        :sm="22"
+        :sm="11"
         :md="11"
         :lg="11"
         :xl="11"
-        style="
-          width: 200px;
-          height: 300px;
-          margin: 10px;
-          border: 0.01rem solid var(--el-color-primary);
-        "
         v-motion
         :initial="{
           opacity: 0,
@@ -188,8 +183,7 @@ const tableData: User[] = [
         <img
           src="https://avatars.githubusercontent.com/u/44761321?v=4"
           alt="avatars"
-          class="img"
+          class="img mt-[10px] w-[250px] h-[250px] m-auto"
-          style="width: 200px; height: 200px; margin: 50px auto"
         />
       </el-col>
     </el-row>

src/views/welcome/components/Bar.vue

@@ -1,6 +1,12 @@
 <script setup lang="ts">
-import { ref, computed, type Ref } from "vue";
+import { ref, computed, watch, type Ref } from "vue";
-import { useDark, useECharts, type EchartOptions } from "@pureadmin/utils";
+import { useAppStoreHook } from "@/store/modules/app";
+import {
+  delay,
+  useDark,
+  useECharts,
+  type EchartOptions
+} from "@pureadmin/utils";
 
 const { isDark } = useDark();
 
@@ -9,7 +15,7 @@ const theme: EchartOptions["theme"] = computed(() => {
 });
 
 const barChartRef = ref<HTMLDivElement | null>(null);
-const { setOptions } = useECharts(barChartRef as Ref<HTMLDivElement>, {
+const { setOptions, resize } = useECharts(barChartRef as Ref<HTMLDivElement>, {
   theme
 });
 
@@ -65,6 +71,13 @@ setOptions(
     }
   }
 );
+
+watch(
+  () => useAppStoreHook().getSidebarStatus,
+  () => {
+    delay(600).then(() => resize());
+  }
+);
 </script>
 
 <template>

src/views/welcome/components/Line.vue

@@ -1,6 +1,12 @@
 <script setup lang="ts">
-import { ref, computed, type Ref } from "vue";
+import { ref, computed, watch, type Ref } from "vue";
-import { useDark, useECharts, type EchartOptions } from "@pureadmin/utils";
+import { useAppStoreHook } from "@/store/modules/app";
+import {
+  delay,
+  useDark,
+  useECharts,
+  type EchartOptions
+} from "@pureadmin/utils";
 
 const { isDark } = useDark();
 
@@ -9,7 +15,7 @@ const theme: EchartOptions["theme"] = computed(() => {
 });
 
 const lineChartRef = ref<HTMLDivElement | null>(null);
-const { setOptions } = useECharts(lineChartRef as Ref<HTMLDivElement>, {
+const { setOptions, resize } = useECharts(lineChartRef as Ref<HTMLDivElement>, {
   theme
 });
 
@@ -53,6 +59,13 @@ setOptions(
     }
   }
 );
+
+watch(
+  () => useAppStoreHook().getSidebarStatus,
+  () => {
+    delay(600).then(() => resize());
+  }
+);
 </script>
 
 <template>

src/views/welcome/components/Pie.vue

@@ -1,6 +1,12 @@
 <script setup lang="ts">
-import { ref, computed, type Ref } from "vue";
+import { ref, computed, watch, type Ref } from "vue";
-import { useDark, useECharts, type EchartOptions } from "@pureadmin/utils";
+import { useAppStoreHook } from "@/store/modules/app";
+import {
+  delay,
+  useDark,
+  useECharts,
+  type EchartOptions
+} from "@pureadmin/utils";
 
 const { isDark } = useDark();
 
@@ -9,7 +15,7 @@ const theme: EchartOptions["theme"] = computed(() => {
 });
 
 const pieChartRef = ref<HTMLDivElement | null>(null);
-const { setOptions } = useECharts(pieChartRef as Ref<HTMLDivElement>, {
+const { setOptions, resize } = useECharts(pieChartRef as Ref<HTMLDivElement>, {
   theme
 });
 
@@ -61,6 +67,13 @@ setOptions(
     }
   }
 );
+
+watch(
+  () => useAppStoreHook().getSidebarStatus,
+  () => {
+    delay(600).then(() => resize());
+  }
+);
 </script>
 
 <template>