From f663cf5b4167dea21935a6ee2c526abc2109760c Mon Sep 17 00:00:00 2001
From: XiaoDaiGua-Ray <443547225@qq.com>
Date: Mon, 1 Jan 2024 22:04:22 +0800
Subject: [PATCH] =?UTF-8?q?update:=20=E8=A1=A5=E5=85=85v4.5.0=E7=89=88?=
 =?UTF-8?q?=E6=9C=AC=E6=96=B0=E5=A2=9E=E4=B8=80=E4=BA=9B=E5=8A=9F=E8=83=BD?=
 =?UTF-8?q?=EF=BC=8C=E4=BF=AE=E6=94=B9=E4=BA=86=E4=B8=80=E4=BA=9Bbug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .eslintrc.cjs                                 |  1 +
 CHANGELOG.md                                  | 14 ++--
 src/App.tsx                                   |  2 +
 .../AppRequestCancelerProvider/index.tsx      |  8 +--
 .../provider/AppStyleProvider/index.tsx       |  2 -
 .../provider/AppVersionProvider/index.tsx     | 70 +++++++++++++++++++
 .../index.scss => provider.scss}              |  0
 src/app-config/designConfig.ts                |  2 +
 src/components/RChart/src/index.tsx           | 14 +++-
 src/components/RChart/src/props.ts            |  3 +
 src/components/RModal/src/Modal.tsx           |  5 +-
 src/components/RModal/src/props.ts            |  2 +-
 src/hooks/web/useDomToImage.ts                |  3 +-
 src/main.ts                                   |  1 +
 14 files changed, 108 insertions(+), 19 deletions(-)
 create mode 100644 src/app-components/provider/AppVersionProvider/index.tsx
 rename src/app-components/provider/{AppStyleProvider/index.scss => provider.scss} (100%)

diff --git a/.eslintrc.cjs b/.eslintrc.cjs
index c711e9dc..73a97f64 100644
--- a/.eslintrc.cjs
+++ b/.eslintrc.cjs
@@ -33,6 +33,7 @@ module.exports = {
     defineExpose: 'readonly',
     withDefaults: 'readonly',
     defineOptions: 'readonly',
+    defineModel: 'readonly',
   },
   rules: {
     'no-undefined': ['error'],
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9e2e347d..2ddb1baf 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -15,11 +15,11 @@
 - 放弃 `ReactivityTransform` 支持
 - 放弃 `node14, 16` 版本支持
 - 放弃 `vite4.x` 版本支持
-- 弃用 `defineModel` 方法
+- 弃用 `defineModel` 配置，`vue3.4.0` 版本该功能已经稳定
 
-主要是解决 `sameLevel` 问题与核心包 `store/men` 的一些问题。提高了性能，避免了潜在的空引用问题。
+解决 `sameLevel` 问题与核心包 `store/men` 的一些问题。提高了性能，避免了潜在的空引用问题。
 
-然后就是统一 `types` 包的导入导出行为。
+是统一 `types` 包的导入导出行为。
 
 ## Feats
 
@@ -34,12 +34,18 @@
   - 更新 `vue` 版本至 `3.4.0`
   - 更新 `@vitejs/plugin-vue-jsx` 版本至 `3.1.0`
 - `RModal` 组件相关
-  - 新增 `memoryPosition` 配置项，用于配置是否记忆上一次的位置
+  - 新增 `memo` 配置项，用于配置是否记忆上一次的位置
+- `RChart` 组件
+  - 补充部分注释
+  - 新增 `isDispose` 方法，检测当前图表是否被卸载
+- 新增 `AppVersionProvider` 注入器，用于注入 `appVersion` 全局变量，检测是否需要重新加载页面
 
 ## Fixes
 
 - 修复初始化的时候面包屑为空的问题
 - 修复 `sameLevel` 平级模式面包屑追加问题
+- `RModal` 组件
+  - 修复初始化配置 `show = true` 时，`dad` 属性不生效的问题
 
 ## 4.4.7
 
diff --git a/src/App.tsx b/src/App.tsx
index b568cc66..e9271308 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -4,12 +4,14 @@ import AppStyleProvider from '@/app-components/provider/AppStyleProvider'
 import AppLockScreen from '@/app-components/app/AppLockScreen'
 import AppWatermarkProvider from '@/app-components/provider/AppWatermarkProvider'
 import AppGlobalSpin from '@/spin'
+import AppVersionProvider from '@/app-components/provider/AppVersionProvider'
 
 export default defineComponent({
   name: 'App',
   render() {
     return (
       <AppNaiveGlobalProvider>
+        <AppVersionProvider />
         <AppLockScreen />
         <AppStyleProvider />
         <AppWatermarkProvider />
diff --git a/src/app-components/provider/AppRequestCancelerProvider/index.tsx b/src/app-components/provider/AppRequestCancelerProvider/index.tsx
index 6aa15f36..7117e50f 100644
--- a/src/app-components/provider/AppRequestCancelerProvider/index.tsx
+++ b/src/app-components/provider/AppRequestCancelerProvider/index.tsx
@@ -29,13 +29,7 @@ const AppRequestCancelerProvider = defineComponent({
     expose()
   },
   render() {
-    return (
-      <div
-        style={{
-          display: 'none',
-        }}
-      ></div>
-    )
+    return <div class="app-style-provider"></div>
   },
 })
 
diff --git a/src/app-components/provider/AppStyleProvider/index.tsx b/src/app-components/provider/AppStyleProvider/index.tsx
index 5379d392..dc391d8a 100644
--- a/src/app-components/provider/AppStyleProvider/index.tsx
+++ b/src/app-components/provider/AppStyleProvider/index.tsx
@@ -9,8 +9,6 @@
  * @remark 今天也是元气满满撸代码的一天
  */
 
-import './index.scss'
-
 import { get } from 'lodash-es'
 import {
   addClass,
diff --git a/src/app-components/provider/AppVersionProvider/index.tsx b/src/app-components/provider/AppVersionProvider/index.tsx
new file mode 100644
index 00000000..eb640fd7
--- /dev/null
+++ b/src/app-components/provider/AppVersionProvider/index.tsx
@@ -0,0 +1,70 @@
+/**
+ *
+ * @author Ray <https://github.com/XiaoDaiGua-Ray>
+ *
+ * @date 2024-01-01
+ *
+ * @workspace ray-template
+ *
+ * @remark 今天也是元气满满撸代码的一天
+ */
+
+/**
+ *
+ * 检测当前版本是否为最新版本
+ * 如果不是最新版本则弹出提示框，提示用户更新，点击确认后退出登录并且刷新资源
+ */
+
+import { RModal } from '@/components'
+
+import { getStorage, setStorage } from '@/utils'
+import { useSigningActions } from '@/store'
+
+export default defineComponent({
+  name: 'AppVersionProvider',
+  setup() {
+    const storageKey = 'appVersionProvider'
+    const {
+      pkg: { version },
+    } = __APP_CFG__
+    const cacheVersion = getStorage<string>(storageKey, 'localStorage')
+    const modalShow = ref(false)
+    const { logout } = useSigningActions()
+
+    if (version !== cacheVersion || !cacheVersion) {
+      modalShow.value = true
+
+      setStorage<string>(storageKey, version, 'localStorage')
+    }
+
+    return {
+      modalShow,
+      logout,
+    }
+  },
+  render() {
+    const { logout } = this
+
+    return (
+      <div class="app-style-provider">
+        <RModal
+          v-model:show={this.modalShow}
+          closeOnEsc={false}
+          maskClosable={false}
+          preset="dialog"
+          closable={false}
+          title="发现新版本"
+          content="当前版本已更新，点击确认加载新版本~"
+          zIndex={999999999}
+          dad
+          positiveText="确认"
+          negativeText="取消"
+          onPositiveClick={logout}
+          onNegativeClick={() => {
+            this.modalShow = false
+          }}
+        />
+      </div>
+    )
+  },
+})
diff --git a/src/app-components/provider/AppStyleProvider/index.scss b/src/app-components/provider/provider.scss
similarity index 100%
rename from src/app-components/provider/AppStyleProvider/index.scss
rename to src/app-components/provider/provider.scss
diff --git a/src/app-config/designConfig.ts b/src/app-config/designConfig.ts
index 45dd4447..6708bab3 100644
--- a/src/app-config/designConfig.ts
+++ b/src/app-config/designConfig.ts
@@ -65,6 +65,8 @@ export const APP_THEME: AppTheme = {
    *
    * 配置 echart 主题颜色
    * 约定配置时以：主题名称为文件名，其文件夹下两个主题风格的 json 文件。并且暗色主题必须为 xxx-dark.json
+   *
+   * [文档地址](https://xiaodaigua-ray.github.io/ray-template-doc/ray-template-docs/advanced/echart-themes.html)
    */
   echartTheme: 'macarons',
 }
diff --git a/src/components/RChart/src/index.tsx b/src/components/RChart/src/index.tsx
index b4688d60..99ee4044 100644
--- a/src/components/RChart/src/index.tsx
+++ b/src/components/RChart/src/index.tsx
@@ -247,6 +247,7 @@ export default defineComponent({
       }
     }
 
+    // chart 是否已经销毁
     const isDispose = () => !!(echartInst && echartInst.getDom())
 
     /**
@@ -268,6 +269,14 @@ export default defineComponent({
       }
     }
 
+    /**
+     *
+     * @param key moreDropDownOptions key
+     * @param option moreDropDownOptions current click option
+     *
+     * 预设 card 风格下拉框点击
+     * 当前仅实现下载图片功能
+     */
     const dropdownSelect = (key: string | number, option: DropdownOption) => {
       if (key === 'downloadChart' && isDispose()) {
         const { filename, ...args } = props.downloadOptions
@@ -301,7 +310,6 @@ export default defineComponent({
       if (props.autoResize) {
         resizeThrottleReturn = throttle(resizeChart, props.throttleWait)
         /** 监听内容区域尺寸变化更新 chart */
-
         resizeObserverReturn = useResizeObserver(
           props.observer || rayChartWrapperRef,
           resizeThrottleReturn,
@@ -334,7 +342,6 @@ export default defineComponent({
         }
       },
     )
-
     /**
      *
      * 贴花跟随主题渲染
@@ -348,7 +355,6 @@ export default defineComponent({
         updateChartTheme()
       },
     )
-
     watchEffect(() => {
       /** 监听 options 变化 */
       if (props.watchOptions) {
@@ -365,6 +371,7 @@ export default defineComponent({
             echartInst?.setOption(options, setOpt)
           },
           {
+            // 深度监听 options
             deep: true,
           },
         )
@@ -381,6 +388,7 @@ export default defineComponent({
       echart: echartInstanceRef,
       dispose: unmount,
       render: mount,
+      isDispose,
     })
 
     onBeforeMount(async () => {
diff --git a/src/components/RChart/src/props.ts b/src/components/RChart/src/props.ts
index 67155ad4..287d588c 100644
--- a/src/components/RChart/src/props.ts
+++ b/src/components/RChart/src/props.ts
@@ -52,6 +52,7 @@ const props = {
     type: Array as PropType<DropdownProps['options']>,
   },
   preset: {
+    // 是否启用预设样式
     type: String as PropType<RChartPresetType>,
   },
   contentStyle: {
@@ -153,6 +154,8 @@ const props = {
      *
      * 拓展 `echarts` 图表
      * 用于自己手动拓展相关的包
+     *
+     * 注意，该方法不支持动态调用，及时动态更新了该属性，也不会生效
      */
     type: Array as PropType<EChartsExtensionInstallRegisters[]>,
     default: () => [],
diff --git a/src/components/RModal/src/Modal.tsx b/src/components/RModal/src/Modal.tsx
index 35067d81..2cc8aaf1 100644
--- a/src/components/RModal/src/Modal.tsx
+++ b/src/components/RModal/src/Modal.tsx
@@ -77,7 +77,7 @@ export default defineComponent({
 
             const target = document.getElementById(uuidEl)
 
-            if (props.memoryPosition && target) {
+            if (props.memo && target) {
               target.style.transform = `translate(${position.x}px, ${position.y}px)`
             }
           })
@@ -87,6 +87,9 @@ export default defineComponent({
           intractable = null
         }
       },
+      {
+        immediate: true,
+      },
     )
 
     return {
diff --git a/src/components/RModal/src/props.ts b/src/components/RModal/src/props.ts
index 1e63b2d7..338e2c3f 100644
--- a/src/components/RModal/src/props.ts
+++ b/src/components/RModal/src/props.ts
@@ -13,7 +13,7 @@ import { modalProps } from 'naive-ui'
 
 const props = {
   ...modalProps,
-  memoryPosition: {
+  memo: {
     /**
      *
      * 是否记住上一次的位置
diff --git a/src/hooks/web/useDomToImage.ts b/src/hooks/web/useDomToImage.ts
index c496a05b..dcfa7d6e 100644
--- a/src/hooks/web/useDomToImage.ts
+++ b/src/hooks/web/useDomToImage.ts
@@ -90,7 +90,8 @@ const domToImageMethods = {
  * const { create, stop } = useDomToImage(refDom, {
  *   beforeCreate: (element) => { ... },
  *   created: (element, result) => { ... },
- *   createdError: (element, error) => { ... },
+ *   createdError: (error) => { ... },
+ *   finally: () => { ... },
  * })
  */
 export const useDomToImage = <T extends HTMLElement>(
diff --git a/src/main.ts b/src/main.ts
index ab0eed16..8b60d0c0 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,6 +1,7 @@
 import App from './App'
 
 import '@/styles/base.scss'
+import './app-components/provider/provider.scss'
 
 import 'virtual:svg-icons-register' // vite-plugin-svg-icons 脚本，启用 svg 雪碧图