docs(数据可视化): 新增vue-echarts文档

docs/.vitepress/sibar.js

@@ -239,6 +239,10 @@ export function sidebarUsageFrame() {
               text: "echarts",
               link: "/usage-frame/前端综合/数据可视化/echarts",
             },
+            {
+              text: "vue-echarts",
+              link: "/usage-frame/前端综合/数据可视化/vue-echarts",
+            },
           ],
         },
         {

docs/usage-frame/前端综合/数据可视化/vue-echarts.md

@@ -0,0 +1,149 @@
+# vue echarts
+
+定义：echarts的vue组件
+
+## props
+
+### init-options
+
+该选项对应于`echarts.init`的第三个参数ops，可选属性有：
+
+```typescript
+// echarts.init的类型定义
+(
+  dom: HTMLDivElement | HTMLCanvasElement,
+  theme?: string | object,
+  opts?: {
+    // init-options可选属性
+    devicePixelRatio?: number;
+    renderer?: string;
+    useDirtyRect?: boolean;
+    useCoarsePointer?: boolean;
+    pointerSize?: number;
+    ssr?: boolean;
+    width?: number|string;
+    height?: number|string;
+    locale?: string;
+  }
+) => EChart
+```
+
+### theme
+
+应用的主题，对应于`echarts.init`的第二个参数theme，值类型为`string | object`
+
+### option
+
+图表配置，对应于`echartsInstance.setOption`的第一个参数option。
+
+```typescript
+// echartsInstance.setOption的类型定义
+(
+  option: Object,
+  notMerge?: boolean,
+  lazyUpdate?: boolean
+)
+
+// 或者：
+(
+  option: Object,
+  opts?: {
+    notMerge?: boolean;
+    lazyUpdate?: boolean;
+    replaceMerge?: string | string[];
+  }
+)
+```
+
+修改该prop会触发echarts的setOption方法，从而进行图表的更新。当不指定update-options prop时，修改option且不改变其引用地址，默认会将当前的option和旧的option进行合并。否则将直接替换旧的option。
+
+### update-options
+
+更新图表选项的配置，对应于`echartsInstance.setOption`的第二个之后的参数。类型定义见上面。
+
+### group
+
+在多个chart实例进行连接时的组名称，对应于`echartsInstance.group`。
+
+### autoresize
+
+是否应该在调整图表根的大小时自动调整图表的大小，使用options对象指定自定义限制延迟（ms），或额外的resize回调函数。
+
+类型定义如下：
+
+```typescript
+boolean | {
+  throttle?: number;
+  onResize?: () => void;
+}
+```
+
+### loading
+
+图表是否处于加载状态
+
+### loading-options
+
+加载动画的配置项，对应于`echartsInstance.showLoading`的opts参数。
+
+```typescript
+// echartsInstance.showLoading的类型定义
+(
+  // 未来只有default被支持
+  type?: string,
+  opts?: {
+    // type为default时的属性
+    text: 'loading',
+    color: '#c23531',
+    textColor: 'white',
+    maskColor: 'rgba(255, 255, 255, 0.8)',
+    zlevel: 0
+    fontSize: 12,
+    showSpinner: true,
+    spinnerRadius: 10,
+    lineWidth: 5,
+    fontWeight: 'normal',
+    fontStyle: 'normal',
+    fontFamily: 'sans-serif',
+  }
+)
+```
+
+### maunal-update
+
+是否手动更新option，对于性能关键的场景，最好绕过vue的option prop响应式系统。此时可设置该属性为ture，同时不指定option，而是通过ref检索到echarts实例，手动调用setOption方法更新图表。
+
+## 事件
+
+可以使用`v-on`绑定事件，注意此时仅支持`.once`修饰符，因为其他的修饰符与DOM事件系统紧密耦合。
+
+当要绑定原生DOM事件时，需要使用例如`@native:click`的形式。
+
+## provide/inject
+
+可以使用依赖注入的形式替换`theme`, `init-options`, `update-options`, `loading-options` prop的功能。
+
+使用形式是在使用到vue-echarts组件的地方引入provide即可：
+
+```typescript
+import { THEME_KEY } from 'vue-echarts'
+import { provide } from 'vue'
+
+// 组合式
+provide(THEME_KEY, 'dark')
+
+// 选项式
+export default {
+  provide: {
+    [THEME_KEY]: 'dark'
+  }
+}
+```
+
+<!--  -->
+
+## 方法
+
+在获取到echarts实例（通过ref）后，可以调用一些方法，例如：setOption、getWidth、getHeight、getDom、getOption、resize、dispatchAction、convertToPixel、convertFromPixel、containPixel、getDataURL、getConnectedDataURL、clear、dispose、showLoading、hideLoading。
+
+静态方法可以直接通过echarts本身进行访问。

docs/usage-frame/工具链/git操作.md

@@ -167,10 +167,12 @@ degit user/repo#1fd41saf4
 ### 暂存工作区间（stash）
 
 - `git stash`：把本地的改动暂存起来
+- `git stash push file1 file2 ...`：把指定文件暂存起来
 - `git stash save 'message'`：把本地的改动暂存起来，添加备注，方便查找
 - `git stash pop`：应用最近一次暂存的修改，同时删除暂存记录
 - `git stash apply stash@{$num}`：无参数默认使用`stash@{0}`
 - `git stash list`：查看当前stash缓存列表
+- `git stash drop stash@{$num}`：删除指定stash缓存
 - `git stash clear`：删除所有stash缓存
 
 ### 提交回滚（revert、reset）

drafts/2024-07-03.md

@@ -1,3 +1,48 @@
+# drafts
+
+## 2024-10-05
+
+数据大屏项目要点：
+
+多环形图效果实现：通过使用echarts的饼图叠加实现的，同一个环中，叠加2个饼图，一个有值的（有颜色），一个作为背景的。
+
+关系图示例：多加练习
+
+词云：echarts插件[echarts-wordcloud](https://github.com/ecomfe/echarts-wordcloud)
+
+数据总览展示：
+
+- 字体展示：通过自定义字体实现，需要加上字体文件，比如LED数字字体
+- 数字渐增：通过[countUp.js](https://www.npmjs.com/package/countup.js)插件实现
+- 字体渐变
+
+```css
+/* 字体渐变效果：背景渐变 + 字体透明 */
+.text-gradient {
+  background-image: linear-gradient(to bottom, #ff008a, #00bfff);
+  /* 背景颜色的作用范围：
+    是否延伸到边框（border-box）、内边距（padding-box）、内容盒子（content-box）下面；
+    或裁剪为文字的前景色（text） 
+  */
+  background-clip: text;
+  -webkit-background-clip: text;
+  /* 指定文本字符的填充色 */
+  -webkit-text-fill-color: transparent;
+
+```
+
+## 2024-09-09
+
+### 老旧项目node-sass安装问题
+
+1. python环境问题：在python官网下载对应版本即可，比如2.7，然后配置环境变量
+2. node-sass下载一直卡住的问题，通过手动在[github](https://github.com/sass/node-sass/releases?q=4.14.1&expanded=true)下下载`node -p "[process.platform, process.arch, process.versions.modules].join('-')"`提示的对应版本即可，然后依次执行：`set SASS_BINARY_PATH=D:\WorkCode\lib\win32-x64-83_binding.node`、`npm rebuild node-sass`、`npm install node-sass -D`、`npm install`
+3. 后续运行如果报错，需要将下载下来的`win32-x64-83_binding.node`文件复制并重命名为`node_modules\node-sass\vendor\win32-x64-83\binding.node`
+
+通过上述操作，即可成功安装项目对应依赖，[参考](https://blog.csdn.net/Newz0722/article/details/107046127)
+
+## 2024-07-03
+
 boolean、number、string、undefined、null、symbol、bigint、object
 
 defineEmits({