diff --git a/package.json b/package.json
index 4f84f9b..297addc 100644
--- a/package.json
+++ b/package.json
@@ -27,6 +27,7 @@
},
"dependencies": {
"fabric": "^5.3.0",
+ "lodash": "^4.17.21",
"pinia": "^2.1.7",
"vue": "^3.4.21",
"vue-router": "^4.3.0"
@@ -34,7 +35,9 @@
"devDependencies": {
"@rushstack/eslint-patch": "^1.3.3",
"@tsconfig/node20": "^20.1.2",
+ "@types/fabric": "^5.3.7",
"@types/jsdom": "^21.1.6",
+ "@types/lodash": "^4.17.0",
"@types/node": "^20.11.25",
"@vitejs/plugin-vue": "^5.0.4",
"@vitejs/plugin-vue-jsx": "^3.1.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index cd52965..cbc00e3 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -8,6 +8,9 @@ dependencies:
fabric:
specifier: ^5.3.0
version: 5.3.0
+ lodash:
+ specifier: ^4.17.21
+ version: 4.17.21
pinia:
specifier: ^2.1.7
version: 2.1.7(typescript@5.4.2)(vue@3.4.21)
@@ -25,9 +28,15 @@ devDependencies:
'@tsconfig/node20':
specifier: ^20.1.2
version: 20.1.2
+ '@types/fabric':
+ specifier: ^5.3.7
+ version: 5.3.7
'@types/jsdom':
specifier: ^21.1.6
version: 21.1.6
+ '@types/lodash':
+ specifier: ^4.17.0
+ version: 4.17.0
'@types/node':
specifier: ^20.11.25
version: 20.11.28
@@ -1041,6 +1050,10 @@ packages:
resolution: {integrity: sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==}
dev: true
+ /@types/fabric@5.3.7:
+ resolution: {integrity: sha512-Fd2oN4zg/E6X+85HbmWSpswzcu3rvDfmwtvz1SH0j2av9OFHZDRrkLQ3K16nl6w+mSflrcTfmB719I7wXkfIsw==}
+ dev: true
+
/@types/jsdom@21.1.6:
resolution: {integrity: sha512-/7kkMsC+/kMs7gAYmmBR9P0vGTnOoLhQhyhQJSlXGI5bzTHp6xdo0TtKWQAsz6pmSAeVqKSbqeyP6hytqr9FDw==}
dependencies:
@@ -1053,6 +1066,10 @@ packages:
resolution: {integrity: sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==}
dev: true
+ /@types/lodash@4.17.0:
+ resolution: {integrity: sha512-t7dhREVv6dbNj0q17X12j7yDG4bD/DHYX7o5/DbDxobP0HnGPgpRz2Ej77aL7TZT3DSw13fqUTj8J4mMnqa7WA==}
+ dev: true
+
/@types/node@20.11.28:
resolution: {integrity: sha512-M/GPWVS2wLkSkNHVeLkrF2fD5Lx5UC4PxA0uZcKc6QqbIQUJyW1jVjueJYi1z8n0I5PxYrtpnPnWglE+y9A0KA==}
dependencies:
@@ -3744,7 +3761,6 @@ packages:
/lodash@4.17.21:
resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==}
- dev: true
/log-symbols@4.1.0:
resolution: {integrity: sha512-8XPvpAA8uyhfteu8pIvQxpJZ7SYYdpUivZpGy6sFsBuKRY/7rQGavedeB8aK+Zkyq6upMFVL/9AW6vOYzfRyLg==}
diff --git a/src/components/player/CanvasPlayer.vue b/src/components/player/CanvasPlayer.vue
new file mode 100644
index 0000000..0e895be
--- /dev/null
+++ b/src/components/player/CanvasPlayer.vue
@@ -0,0 +1,67 @@
+
+
+
+
+
+
+
diff --git a/src/views/main-page.vue b/src/views/main-page.vue
index b193c65..82767af 100644
--- a/src/views/main-page.vue
+++ b/src/views/main-page.vue
@@ -1,7 +1,17 @@
-
+
-
+
@@ -20,7 +30,7 @@
-
+
left-panel
( 开发中... )
@@ -29,9 +39,8 @@
-
- player
-
( 开发中... )
+
+