You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
132 lines
7.4 KiB
132 lines
7.4 KiB
# \ud83e\udded \u667a\u80fd\u884c\u7a0b\u89c4\u5212\u7cfb\u7edf
|
|
|
|
> \u4e00\u7ad9\u5f0f\u65c5\u884c\u884c\u7a0b\u89c4\u5212\u5e73\u53f0\uff0c\u4ece\u201c\u7075\u611f\u8f93\u5165\u201d\u5230\u201c\u6700\u7ec8\u4ea4\u4ed8\u201d\u7684\u5b8c\u6574\u95ed\u73af\u3002
|
|
|
|
## \u9879\u76ee\u6982\u8ff0
|
|
|
|
\u57fa\u4e8e Vue 3 + Vite + Leaflet \u6784\u5efa\u7684\u4ea4\u4e92\u5f0f\u884c\u7a0b\u89c4\u5212\u7cfb\u7edf\uff0c\u5b9e\u73b0\u4e86 PRD \u4e2d\u5b9a\u4e49\u7684\u4e09\u9636\u6bb5\u4ea4\u4e92\u67b6\u6784\u3002
|
|
|
|
## \u6280\u672f\u6808
|
|
|
|
- **\u524d\u7aef\u6846\u67b6**: Vue 3 (Composition API)
|
|
- **\u6784\u5efa\u5de5\u5177**: Vite 5
|
|
- **\u72b6\u6001\u7ba1\u7406**: Pinia
|
|
- **\u5730\u56fe\u5e93**: Leaflet
|
|
- **\u62d6\u62fd\u6392\u5e8f**: SortableJS
|
|
- **\u8def\u7531 API**: OSRM (\u5f00\u6e90\u514d\u8d39)
|
|
|
|
## \u5feb\u901f\u5f00\u59cb
|
|
|
|
```bash
|
|
# \u5b89\u88c5\u4f9d\u8d56
|
|
NODE_ENV=development npm install
|
|
|
|
# \u5f00\u53d1\u6a21\u5f0f
|
|
npm run dev
|
|
|
|
# \u6784\u5efa\u751f\u4ea7\u7248\u672c
|
|
npm run build
|
|
|
|
# \u9884\u89c8\u751f\u4ea7\u7248\u672c
|
|
npm run preview
|
|
```
|
|
|
|
## \u9879\u76ee\u7ed3\u6784
|
|
|
|
```
|
|
src/
|
|
\u251c\u2500\u2500 components/
|
|
\u2502 \u251c\u2500\u2500 App.vue # \u6839\u7ec4\u4ef6\uff0c\u9636\u6bb5\u5207\u6362
|
|
\u2502 \u251c\u2500\u2500 ChatInterface.vue # Phase 1: \u5bf9\u8bdd\u63a5\u53e3
|
|
\u2502 \u251c\u2500\u2500 ComparisonView.vue # Phase 2: \u65b9\u6848\u5bf9\u6bd4
|
|
\u2502 \u251c\u2500\u2500 Workbench.vue # Phase 3: \u6c89\u6d78\u5de5\u4f5c\u53f0
|
|
\u2502 \u251c\u2500\u2500 TimelinePanel.vue # \u5de6\u4fa7\u65f6\u95f4\u7ebf\uff08SortableJS\u62d6\u62fd\uff09
|
|
\u2502 \u251c\u2500\u2500 DetailPanel.vue # \u4e2d\u95f4\u8be6\u60c5\u9762\u677f
|
|
\u2502 \u251c\u2500\u2500 MapView.vue # Leaflet \u5730\u56fe\u7ec4\u4ef6\uff08\u771f\u5b9e\u8def\u7ebf\uff09
|
|
\u2502 \u251c\u2500\u2500 ModeToggle.vue # \u9884\u89c8/\u7f16\u8f91\u6a21\u5f0f\u5207\u6362
|
|
\u2502 \u2514\u2500\u2500 ReplacementPanel.vue # \u667a\u80fd\u66ff\u6362\u63a8\u8350\u9762\u677f\uff08\u60ac\u505c\u9884\u6f14\uff09
|
|
\u251c\u2500\u2500 stores/
|
|
\u2502 \u2514\u2500\u2500 itinerary.js # Pinia \u72b6\u6001\u7ba1\u7406\uff08\u8def\u7ebf\u4f18\u5316\uff09
|
|
\u251c\u2500\u2500 data/
|
|
\u2502 \u2514\u2500\u2500 sampleData.js # \u4e91\u53574\u5929\u884c\u7a0b\u793a\u4f8b\u6570\u636e + AI\u6a21\u677f
|
|
\u251c\u2500\u2500 services/
|
|
\u2502 \u2514\u2500\u2500 routeService.js # OSRM \u8def\u5f84\u8ba1\u7b97\u670d\u52a1 + \u7ed5\u8def\u68c0\u6d4b
|
|
\u251c\u2500\u2500 utils/
|
|
\u2502 \u2514\u2500\u2500 exporter.js # \u9759\u6001 HTML \u5bfc\u51fa\u5668
|
|
\u2514\u2500\u2500 main.js # \u5165\u53e3\u6587\u4ef6
|
|
```
|
|
|
|
## \u5df2\u5b9e\u73b0\u529f\u80fd\u2705
|
|
|
|
### Phase 1: \u5bf9\u8bdd\u63a5\u53e3
|
|
- [x] ChatGPT \u98ce\u683c\u5bf9\u8bdd\u6d41
|
|
- [x] \u7528\u6237\u8f93\u5165\u4e0e AI \u54cd\u5e94\u6a21\u62df
|
|
- [x] \u65b9\u6848\u5361\u7247\u5f39\u51fa\u52a8\u753b
|
|
- [x] \u601d\u8003\u4e2d\u52a8\u753b\u6548\u679c
|
|
|
|
### Phase 2: \u65b9\u6848\u5bf9\u6bd4
|
|
- [x] \u4e09\u65b9\u6848\u5e76\u5217\u5c55\u793a
|
|
- [x] \u5bf9\u6bd4\u7ef4\u5ea6\uff1a\u91cc\u7a0b/\u9a7e\u9a76/\u9884\u7b97/\u666f\u70b9\u5bc6\u5ea6
|
|
- [x] \u8def\u7ebf\u6982\u89c8\u4e0e\u6838\u5fc3\u4eae\u70b9
|
|
- [x] \u70b9\u51fb\u9009\u62e9\u8fdb\u5165\u5de5\u4f5c\u53f0
|
|
|
|
### Phase 3: \u6c89\u6d78\u5de5\u4f5c\u53f0
|
|
- [x] \u9884\u89c8\u6a21\u5f0f\uff1a\u5168\u5c4f\u5730\u56fe + \u81ea\u52a8\u64ad\u653e\u5c0f\u8f66\u52a8\u753b + \u7cbe\u7f8e\u8be6\u60c5\u5361
|
|
- [x] \u7f16\u8f91\u6a21\u5f0f\uff1a\u62d6\u62fd\u624b\u67c4 + \u5220\u9664/\u66ff\u6362\u6309\u94ae + \u865a\u7ebf\u8def\u7ebf
|
|
- [x] \u53cc\u6a21\u5f0f\u65e0\u7f1d\u5207\u6362
|
|
- [x] \u5730\u56fe\u6807\u8bb0\u70b9\u51fb\u4ea4\u4e92
|
|
- [x] \u5c0f\u8f66\u6cbf\u8def\u7ebf\u52a8\u753b\uff08requestAnimationFrame\uff09
|
|
- [x] \u65f6\u95f4\u7ebf\u5bfc\u822a\uff08\u4e0a\u4e00\u7ad9/\u4e0b\u4e00\u7ad9/\u952e\u76d8\u65b9\u5411\u952e\uff09
|
|
- [x] \u884c\u7a0b\u7edf\u8ba1\uff08\u603b\u91cc\u7a0b/\u9a7e\u9a76\u65f6\u95f4/\u5929\u6570\uff09
|
|
|
|
### Phase 4: \u667a\u80fd\u4e0e\u63a8\u8350
|
|
- [x] \u667a\u80fd\u66ff\u6362\u63a8\u8350\u9762\u677f
|
|
- [x] **\u60ac\u505c\u865a\u7ebf\u9884\u6f14** - \u9f20\u6807\u60ac\u505c\u5373\u53ef\u5728\u5730\u56fe\u4e0a\u9884\u89c8\u66ff\u6362\u540e\u7684\u8def\u7ebf
|
|
- [x] **\u771f\u5b9e\u8def\u7ebf\u83b7\u53d6** - \u8c03\u7528 OSRM \u514d\u8d39 API \u83b7\u53d6\u771f\u5b9e\u9a7e\u8f66\u8def\u7ebf
|
|
- [x] **\u667a\u80fd\u7ea0\u504f** - \u81ea\u52a8\u68c0\u6d4b\u7ed5\u8def\u5e76\u5f39\u51fa\u4f18\u5316\u63d0\u793a
|
|
- [x] **\u4e00\u952e\u4f18\u5316** - \u81ea\u52a8\u6309\u5730\u7406\u987a\u5e8f\u91cd\u6392\u884c\u7a0b\u8282\u70b9
|
|
- [x] **\u62d6\u62fd\u6392\u5e8f** - SortableJS \u5b9e\u73b0\u65f6\u95f4\u7ebf\u62d6\u62fd\uff0c\u5730\u56fe\u5b9e\u65f6\u66f4\u65b0
|
|
|
|
### Phase 5: \u5bfc\u51fa\u4e0e\u5206\u4eab
|
|
- [x] **\u5bfc\u51fa\u9759\u6001 HTML** - \u5c06\u5f53\u524d\u7f16\u8f91\u597d\u7684\u884c\u7a0b\u5bfc\u51fa\u4e3a\u72ec\u7acb HTML \u6587\u4ef6
|
|
- [x] \u5bfc\u51fa\u6587\u4ef6\u5305\u542b\u5b8c\u6574\u5730\u56fe\u3001\u52a8\u753b\u3001\u8be6\u60c5\u5c55\u793a
|
|
- [x] \u53ef\u76f4\u63a5\u6253\u5f00\u6d4f\u89c8\uff0c\u65e0\u9700\u670d\u52a1\u5668
|
|
|
|
## \u5f85\u5b9e\u73b0\u529f\u80fd
|
|
|
|
- [ ] \u771f\u5b9e AI \u63a5\u53e3\u8c03\u7528\uff08\u5df2\u6709\u914d\u7f6e\u9875\u9762\uff0c\u5f85\u63a5\u5165\u5b9e\u9645\u751f\u6210\uff09
|
|
- [ ] \u751f\u6210\u5206\u4eab\u94fe\u63a5\uff08\u9700\u540e\u7aef\u652f\u6301\uff09
|
|
- [ ] \u591a\u884c\u7a0b\u6587\u4ef6\u7ba1\u7406
|
|
- [ ] \u7528\u6237\u6536\u85cf\u4e0e\u5386\u53f2\u8bb0\u5f55
|
|
|
|
## \u2699\ufe0f \u540e\u53f0\u914d\u7f6e
|
|
|
|
\u7cfb\u7edf\u652f\u6301\u901a\u8fc7\u53f3\u4e0a\u89d2\u9f7f\u8f6e\u6309\u94ae\u8fdb\u5165 **AI \u6a21\u578b\u914d\u7f6e\u9875\u9762**\uff0c\u76ee\u524d\u4ec5\u652f\u6301 **\u963f\u91cc\u4e91 DashScope\uff08\u901a\u4e49\u5343\u95ee\uff09**\uff1a
|
|
|
|
| \u914d\u7f6e\u9879 | \u8bf4\u660e |
|
|
|--------|------|
|
|
| API Key | \u4ece[\u963f\u91cc\u4e91\u767e\u70bc\u63a7\u5236\u53f0](https://bailian.console.aliyun.com/)\u83b7\u53d6 |
|
|
| \u6a21\u578b\u9009\u62e9 | Qwen-Turbo\uff08\u5feb\u901f\uff09\u3001Qwen-Plus\uff08\u5747\u8861\uff09\u3001Qwen-Max\uff08\u9ad8\u8d28\u91cf\uff09\u3001Qwen-Long\uff08\u957f\u6587\u672c\uff09 |
|
|
| Base URL | \u9ed8\u8ba4 `https://dashscope.aliyuncs.com/compatible-mode/v1` |
|
|
| Temperature | \u521b\u9020\u6027\u63a7\u5236\uff080=\u7cbe\u786e\uff0c1=\u968f\u673a\uff09 |
|
|
| Max Tokens | \u6700\u5927\u8f93\u51fa\u957f\u5ea6 |
|
|
| \u6d4b\u8bd5\u8fde\u63a5 | \u9a8c\u8bc1 API Key \u548c\u6a21\u578b\u662f\u5426\u53ef\u7528 |
|
|
|
|
\u914d\u7f6e\u6570\u636e\u901a\u8fc7 `localStorage` \u6301\u4e45\u5316\u5b58\u50a8\uff0c\u5237\u65b0\u9875\u9762\u4e0d\u4e22\u5931\u3002
|
|
|
|
## \u6838\u5fc3\u4ea4\u4e92\u7ec6\u8282
|
|
|
|
### \u66ff\u6362\u9884\u6f14
|
|
1. \u70b9\u51fb\u8282\u70b9 \u2192 \u9009\u62e9\u201c\u66ff\u6362\u201d
|
|
2. \u4fa7\u8fb9\u6ed1\u51fa\u63a8\u8350\u5217\u8868
|
|
3. **\u60ac\u505c\u9884\u89c8**: \u9f20\u6807\u60ac\u505c\u5373\u5728\u5730\u56fe\u4e0a\u663e\u793a\u865a\u7ebf\u9884\u6f14
|
|
4. \u786e\u8ba4\u66ff\u6362 \u2192 \u5b9e\u7ebf\u66f4\u65b0\uff0c\u8def\u7ebf\u81ea\u52a8\u91cd\u7b97
|
|
|
|
### \u667a\u80fd\u7ea0\u504f
|
|
- \u5f53\u7528\u6237\u62d6\u62fd\u5bfc\u81f4\u987a\u5e8f\u4e0d\u5408\u7406\uff0c\u9876\u90e8\u5f39\u51fa\u63d0\u793a
|
|
- \u70b9\u51fb\u201c\u4e00\u952e\u4f18\u5316\u201d\u5373\u53ef\u81ea\u52a8\u91cd\u6392\u4e3a\u6700\u77ed\u8def\u5f84
|
|
|
|
### \u5b9e\u65f6\u53cd\u9988
|
|
- \u6bcf\u6b21\u4fee\u6539\u540e\uff0c\u9876\u90e8\u6570\u636e\u6761\u5b9e\u65f6\u66f4\u65b0\u603b\u91cc\u7a0b\u3001\u603b\u8017\u65f6
|
|
- \u7ed5\u8def\u6bb5\u4ee5\u7ea2\u8272\u7a81\u51fa\u663e\u793a
|