封装虚拟表格 tableV2

Author: zxiaosi

README.md

@@ -156,6 +156,10 @@ server {
         index  index.html index.htm;
         try_files $uri $uri/ /index.html; # 防止页面刷新404
     }
+    
+     location /static/avatar/ {
+        proxy_pass http://fastapi:8000/static/avatar/;
+    }
 
     location /api {
         client_max_body_size 5m;

frontend/README.md

@@ -6,4 +6,34 @@
 npm install
 npm run dev
 npm run build
-```
+```
+
+### 关于自定义组件的样式问题
+
+- 方案一: 使用 `:deep()` 深度选择器包一下, <font color="red">缺点: 会导致样式全局污染</font>
+
+  ```css
+  :deep(.el-table__header) {
+    background-color: #f5f5f5;
+  }
+  ```
+
+- 方案二: 使用 `less/scss` 的模块化, <font color="red">缺点: 要分离文件</font>
+
+  ```css
+  .dot {
+    width: 10px;
+    height: 10px;
+    background-color: red;
+  }
+  ```
+
+  ```vue
+  <script setup lang="tsx">
+  import styles from "./index.module.less";
+  </script>
+
+  <template>
+    <div class="{styles.dot}"></div>
+  </template>
+  ```

frontend/auto-imports.d.ts

@@ -0,0 +1,8 @@
+/* eslint-disable */
+/* prettier-ignore */
+// @ts-nocheck
+// Generated by unplugin-auto-import
+export {}
+declare global {
+
+}

frontend/components.d.ts

@@ -0,0 +1,46 @@
+/* eslint-disable */
+/* prettier-ignore */
+// @ts-nocheck
+// Generated by unplugin-vue-components
+// Read more: https://github.com/vuejs/core/pull/3399
+import '@vue/runtime-core'
+
+export {}
+
+declare module '@vue/runtime-core' {
+  export interface GlobalComponents {
+    ElAside: typeof import('element-plus/es')['ElAside']
+    ElAutoResizer: typeof import('element-plus/es')['ElAutoResizer']
+    ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb']
+    ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem']
+    ElButton: typeof import('element-plus/es')['ElButton']
+    ElCard: typeof import('element-plus/es')['ElCard']
+    ElContainer: typeof import('element-plus/es')['ElContainer']
+    ElCountdown: typeof import('element-plus/es')['ElCountdown']
+    ElDropdown: typeof import('element-plus/es')['ElDropdown']
+    ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
+    ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
+    ElForm: typeof import('element-plus/es')['ElForm']
+    ElFormItem: typeof import('element-plus/es')['ElFormItem']
+    ElHeader: typeof import('element-plus/es')['ElHeader']
+    ElIcon: typeof import('element-plus/es')['ElIcon']
+    ElImage: typeof import('element-plus/es')['ElImage']
+    ElInput: typeof import('element-plus/es')['ElInput']
+    ElMain: typeof import('element-plus/es')['ElMain']
+    ElMenu: typeof import('element-plus/es')['ElMenu']
+    ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
+    ElPagination: typeof import('element-plus/es')['ElPagination']
+    ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
+    ElTable: typeof import('element-plus/es')['ElTable']
+    ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
+    ElTableV2: typeof import('element-plus/es')['ElTableV2']
+    ElTag: typeof import('element-plus/es')['ElTag']
+    ElTooltip: typeof import('element-plus/es')['ElTooltip']
+    ElUpload: typeof import('element-plus/es')['ElUpload']
+    MyTable: typeof import('./src/components/MyTable.vue')['default']
+    MyTableV2: typeof import('./src/components/MyTableV2.vue')['default']
+    MyUpload: typeof import('./src/components/MyUpload.vue')['default']
+    RouterLink: typeof import('vue-router')['RouterLink']
+    RouterView: typeof import('vue-router')['RouterView']
+  }
+}

frontend/env.d.ts

@@ -1,9 +1,11 @@
 /// <reference types="vite/client" />
 
+// 防止 App.vue 报错
+declare module "*.vue" {
+  import { defineComponent } from "vue";
+  const Component: ReturnType<typeof defineComponent>;
+  export default Component;
+}
+
 // 防止 ElementPlus 国际化报红
 declare module "element-plus/dist/locale/zh-cn.mjs";
-
-declare module 'echarts' {
-  const echarts: any
-  export default echarts
-}