npmapps 1.0.25 → 1.0.26

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (212) hide show
  1. package/app/.codegraph/daemon.pid +6 -0
  2. package/app/.eslintrc.js +19 -0
  3. package/app/README.md +24 -0
  4. package/app/babel.config.js +5 -0
  5. package/app/devtool-windows-amd64.zip +0 -0
  6. package/app/docs/superpowers/plans/2026-05-29-quill-editor.md +836 -0
  7. package/app/docs/superpowers/specs/2026-05-29-quill-editor-design.md +210 -0
  8. package/app/docs/superpowers/specs/2026-06-06-lazy-cascader-design.md +400 -0
  9. package/app/jsconfig.json +19 -0
  10. package/app/package-lock.json +21347 -0
  11. package/app/package.json +63 -0
  12. package/app/postcss.config.js +10 -0
  13. package/app/public/favicon.ico +0 -0
  14. package/app/public/index.html +17 -0
  15. package/app/public//344/270/200/351/224/256/351/273/221/346/232/227.html +136 -0
  16. package/app/src/App.vue +110 -0
  17. package/app/src/assets/bpmn-camunda.jpg +0 -0
  18. package/app/src/assets/css/diagram.less +17 -0
  19. package/app/src/assets/icon/Icon.less +31 -0
  20. package/app/src/assets/icon/font/app-codes.css +26 -0
  21. package/app/src/assets/icon/font/app.eot +0 -0
  22. package/app/src/assets/icon/font/app.svg +60 -0
  23. package/app/src/assets/icon/font/app.ttf +0 -0
  24. package/app/src/assets/icon/font/app.woff +0 -0
  25. package/app/src/assets/icon/font/app.woff2 +0 -0
  26. package/app/src/assets/icon/font/config.json +248 -0
  27. package/app/src/assets/icon/font/source/raw/align-bottom-tool.svg +30 -0
  28. package/app/src/assets/icon/font/source/raw/align-horizontal-center-tool.svg +85 -0
  29. package/app/src/assets/icon/font/source/raw/align-left-tool.svg +84 -0
  30. package/app/src/assets/icon/font/source/raw/align-right-tool.svg +80 -0
  31. package/app/src/assets/icon/font/source/raw/align-top-tool.svg +84 -0
  32. package/app/src/assets/icon/font/source/raw/align-vertical-center-tool.svg +89 -0
  33. package/app/src/assets/icon/font/source/raw/distribute-horizontally-tool.svg +95 -0
  34. package/app/src/assets/icon/font/source/raw/distribute-vertically-tool.svg +99 -0
  35. package/app/src/assets/icon/font/source/raw/set-color-tool.svg +111 -0
  36. package/app/src/assets/icon/font/source/symbols/align-bottom-tool.svg +30 -0
  37. package/app/src/assets/icon/font/source/symbols/align-horizontal-center-tool.svg +30 -0
  38. package/app/src/assets/icon/font/source/symbols/align-left-tool.svg +30 -0
  39. package/app/src/assets/icon/font/source/symbols/align-right-tool.svg +30 -0
  40. package/app/src/assets/icon/font/source/symbols/align-top-tool.svg +30 -0
  41. package/app/src/assets/icon/font/source/symbols/align-vertical-center-tool.svg +30 -0
  42. package/app/src/assets/icon/font/source/symbols/distribute-horizontally-tool.svg +30 -0
  43. package/app/src/assets/icon/font/source/symbols/distribute-vertically-tool.svg +30 -0
  44. package/app/src/assets/icon/font/source/symbols/set-color-tool.svg +63 -0
  45. package/app/src/assets/logo.png +0 -0
  46. package/app/src/components/EllTable/README.md +70 -0
  47. package/app/src/components/EllTable/article.md +184 -0
  48. package/app/src/components/EllTable/index.js +213 -0
  49. package/app/src/components/FormulaEditor/FunctionSelector.vue +123 -0
  50. package/app/src/components/FormulaEditor/OperatorSelector.vue +184 -0
  51. package/app/src/components/FormulaEditor/ParameterSelector.vue +123 -0
  52. package/app/src/components/FormulaEditor/api.js +69 -0
  53. package/app/src/components/FormulaEditor/index.vue +435 -0
  54. package/app/src/components/HelloWorld.vue +58 -0
  55. package/app/src/components/PageHeader/index.vue +158 -0
  56. package/app/src/components/Splitter/README.md +144 -0
  57. package/app/src/components/Splitter/example.vue +88 -0
  58. package/app/src/components/Splitter/index.vue +203 -0
  59. package/app/src/components/diagram/ToolBar.vue +357 -0
  60. package/app/src/components/diagram/customTranslate/customTranslate.js +12 -0
  61. package/app/src/components/diagram/customTranslate/translationsGerman.js +241 -0
  62. package/app/src/components/diagram/index.vue +261 -0
  63. package/app/src/components/diagram/xmlData.js +29 -0
  64. package/app/src/directives/filldown.js +155 -0
  65. package/app/src/directives/filldownTable.js +291 -0
  66. package/app/src/main.js +40 -0
  67. package/app/src/router/index.js +63 -0
  68. package/app/src/store/index.js +23 -0
  69. package/app/src/utils/winBox.js +23 -0
  70. package/app/src/views/Extend/A.vue +12 -0
  71. package/app/src/views/Extend/B.vue +10 -0
  72. package/app/src/views/Extend/MagicalComponentsForELFormItem.vue +87 -0
  73. package/app/src/views/Extend/index.vue +59 -0
  74. package/app/src/views/Extend/tableMouseHorizontalWheel.vue +193 -0
  75. package/app/src/views/Home.vue +37 -0
  76. package/app/src/views/RouterJump.vue +155 -0
  77. package/app/src/views/css.vue +57 -0
  78. package/app/src/views/cssComponents/EllipsisText.vue +83 -0
  79. package/app/src/views/cssComponents/HoverCard.vue +79 -0
  80. package/app/src/views/cssComponents/TableHover.vue +140 -0
  81. package/app/src/views/cssComponents/inputSlo.vue +52 -0
  82. package/app/src/views/cssComponents/tableFixed.vue +158 -0
  83. package/app/src/views/echarts/echart-dome.vue +82 -0
  84. package/app/src/views/echarts/index.vue +118 -0
  85. package/app/src/views/echarts/pei3d.vue +667 -0
  86. package/app/src/views/element/bpmn/index.vue +18 -0
  87. package/app/src/views/element/components/attendanceCycle/index.vue +131 -0
  88. package/app/src/views/element/components/attendanceGroup/index.vue +147 -0
  89. package/app/src/views/element/components/attendancePersonnel/index.vue +158 -0
  90. package/app/src/views/element/components/companyCalendar/index.vue +147 -0
  91. package/app/src/views/element/components/shift/index.vue +147 -0
  92. package/app/src/views/element/components/shiftRotationSystem/index.vue +147 -0
  93. package/app/src/views/element/elTableJsx/columnManagement.vue +340 -0
  94. package/app/src/views/element/elTableJsx/dialogInput.vue +71 -0
  95. package/app/src/views/element/elTableJsx/elTableJsx.vue +1826 -0
  96. package/app/src/views/element/elTableJsx/formTable.vue +598 -0
  97. package/app/src/views/element/elTableJsx/index.vue +29 -0
  98. package/app/src/views/element/elTableJsx/simpleTable.vue +192 -0
  99. package/app/src/views/element/elTableJsx.zip +0 -0
  100. package/app/src/views/element/index.vue +44 -0
  101. package/app/src/views/element/lazyCascader/LazyCascader.vue +302 -0
  102. package/app/src/views/element/lazyCascader/data.js +205 -0
  103. package/app/src/views/element/lazyCascader/index.vue +315 -0
  104. package/app/src/views/element/quillEditor/README.md +163 -0
  105. package/app/src/views/element/quillEditor/example.vue +314 -0
  106. package/app/src/views/element/quillEditor/index.vue +409 -0
  107. package/app/src/views/element/quillEditor/toolbar.js +122 -0
  108. package/app/vue.config.js +15 -0
  109. package/package.json +1 -1
  110. package/app/wujie-vue3-child/.claude/settings.local.json +0 -8
  111. package/app/wujie-vue3-child/.vscode/extensions.json +0 -3
  112. package/app/wujie-vue3-child/PROJECT_MEMORY.md +0 -427
  113. package/app/wujie-vue3-child/README.md +0 -5
  114. package/app/wujie-vue3-child/index.html +0 -13
  115. package/app/wujie-vue3-child/package-lock.json +0 -5744
  116. package/app/wujie-vue3-child/package.json +0 -28
  117. package/app/wujie-vue3-child/public/vite.svg +0 -1
  118. package/app/wujie-vue3-child/src/App.vue +0 -130
  119. package/app/wujie-vue3-child/src/assets/vue.svg +0 -1
  120. package/app/wujie-vue3-child/src/components/HelloWorld.vue +0 -43
  121. package/app/wujie-vue3-child/src/components/SmartAnchorTabs/index.jsx +0 -224
  122. package/app/wujie-vue3-child/src/components/SmartAnchorTabs/style.css +0 -154
  123. package/app/wujie-vue3-child/src/components/tags-view.vue +0 -193
  124. package/app/wujie-vue3-child/src/components/tags-view1.vue +0 -131
  125. package/app/wujie-vue3-child/src/directives/aiLoading.js +0 -182
  126. package/app/wujie-vue3-child/src/hooks/useClickOutside.js +0 -11
  127. package/app/wujie-vue3-child/src/hooks/useTableDragSort.js +0 -28
  128. package/app/wujie-vue3-child/src/main.js +0 -18
  129. package/app/wujie-vue3-child/src/router/index.js +0 -104
  130. package/app/wujie-vue3-child/src/store/tagsViewStroe.js +0 -34
  131. package/app/wujie-vue3-child/src/style.css +0 -171
  132. package/app/wujie-vue3-child/src/views/aiCoach/collapseExpand/index.jsx +0 -108
  133. package/app/wujie-vue3-child/src/views/aiCoach/collapseExpand/index.module.scss +0 -97
  134. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/README.md +0 -836
  135. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/REFLEX_EXAMPLES.md +0 -728
  136. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/components/DepartmentPersonnelSelector.jsx +0 -687
  137. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/components/DepartmentPersonnelSelector.module.scss +0 -560
  138. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/components/DepartmentSelector.jsx +0 -570
  139. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/components/DepartmentSelector.module.scss +0 -330
  140. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/components/DepartmentSelectorV2.jsx +0 -378
  141. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/components/DepartmentSelectorV2.module.scss +0 -228
  142. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/components/OptionsSelector.jsx +0 -399
  143. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/components/OptionsSelector.module.scss +0 -252
  144. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/components/PersonnelSelector.jsx +0 -585
  145. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/components/PersonnelSelector.module.scss +0 -331
  146. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/components/PopoverSelector.jsx +0 -392
  147. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/components/PopoverSelector.module.scss +0 -39
  148. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/components/README.md +0 -248
  149. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/components/SelectorTrigger.jsx +0 -194
  150. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/index.jsx +0 -1459
  151. package/app/wujie-vue3-child/src/views/aiCoach/departmentPersonnel/mockData.js +0 -301
  152. package/app/wujie-vue3-child/src/views/aiCoach/dialogueSegment/index.jsx +0 -182
  153. package/app/wujie-vue3-child/src/views/aiCoach/dialogueSegment/index.module.scss +0 -28
  154. package/app/wujie-vue3-child/src/views/aiCoach/index.jsx +0 -375
  155. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/ChartsPanel/index.jsx +0 -121
  156. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/ChartsPanel/index.module.scss +0 -76
  157. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/DonutChart/index.jsx +0 -104
  158. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/PracticeTable/index.jsx +0 -75
  159. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/PracticeTable/index.module.scss +0 -12
  160. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/RankBarChart/index.jsx +0 -62
  161. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/RankBarChart/index.module.scss +0 -43
  162. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/RankingGroup/index.jsx +0 -29
  163. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/RankingGroup/index.module.scss +0 -5
  164. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/RankingList/index.jsx +0 -58
  165. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/RankingList/index.module.scss +0 -85
  166. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/ScriptStatsPanel/index.jsx +0 -92
  167. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/ScriptStatsPanel/index.module.scss +0 -56
  168. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/StatCardsRow/index.jsx +0 -40
  169. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/StatCardsRow/index.module.scss +0 -53
  170. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/echarts/EchartsDonut.jsx +0 -106
  171. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/components/echarts/EchartsRankBar.jsx +0 -132
  172. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/index.jsx +0 -176
  173. package/app/wujie-vue3-child/src/views/aiCoach/practiceStatus/index.module.scss +0 -96
  174. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/CoachReport/index.jsx +0 -162
  175. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/CoachReport/index.module.scss +0 -16
  176. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/ComprehensiveEvaluation/index.jsx +0 -29
  177. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/ComprehensiveEvaluation/index.module.scss +0 -25
  178. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/DialogueBubble/index.jsx +0 -106
  179. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/DialogueBubble/index.module.scss +0 -164
  180. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/DialogueRecord/index.jsx +0 -182
  181. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/DialogueRecord/index.module.scss +0 -203
  182. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/DimensionDetail/index.jsx +0 -145
  183. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/DimensionDetail/index.module.scss +0 -126
  184. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/DimensionScores/index.jsx +0 -67
  185. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/DimensionScores/index.module.scss +0 -105
  186. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/ReportHeader/index.jsx +0 -81
  187. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/ReportHeader/index.module.scss +0 -47
  188. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/RoleInfo/index.jsx +0 -64
  189. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/RoleInfo/index.module.scss +0 -85
  190. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/ScoreBadge/index.jsx +0 -39
  191. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/ScoreBadge/index.module.scss +0 -44
  192. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/SubDimensionItem/index.jsx +0 -83
  193. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/components/SubDimensionItem/index.module.scss +0 -101
  194. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/index.jsx +0 -50
  195. package/app/wujie-vue3-child/src/views/aiCoach/reportDetail/index.module.scss +0 -25
  196. package/app/wujie-vue3-child/src/views/aiCoach/scriptTable/index.jsx +0 -196
  197. package/app/wujie-vue3-child/src/views/aiCoach/scriptTable/index.module.scss +0 -41
  198. package/app/wujie-vue3-child/src/views/aiCoach/scriptTable/inputColumn/index.jsx +0 -183
  199. package/app/wujie-vue3-child/src/views/aiCoach/scriptTable/inputColumn/index.module.scss +0 -115
  200. package/app/wujie-vue3-child/src/views/child-to-parent.vue +0 -117
  201. package/app/wujie-vue3-child/src/views/home.vue +0 -53
  202. package/app/wujie-vue3-child/src/views/jsx/btnSelect/btnSelect.vue +0 -169
  203. package/app/wujie-vue3-child/src/views/jsx/btnSelect/index.vue +0 -69
  204. package/app/wujie-vue3-child/src/views/jsx/com.vue +0 -44
  205. package/app/wujie-vue3-child/src/views/jsx/dialog.jsx +0 -66
  206. package/app/wujie-vue3-child/src/views/jsx/index.vue +0 -72
  207. package/app/wujie-vue3-child/src/views/jsx/props.vue +0 -33
  208. package/app/wujie-vue3-child/src/views/parent-to-child.vue +0 -225
  209. package/app/wujie-vue3-child/src/views/phone-code.vue +0 -318
  210. package/app/wujie-vue3-child/src/views/router-jump.vue +0 -123
  211. package/app/wujie-vue3-child/src/views/test.vue +0 -192
  212. package/app/wujie-vue3-child/vite.config.js +0 -15
@@ -1,28 +0,0 @@
1
- {
2
- "name": "wujie-vue3-child",
3
- "private": true,
4
- "version": "0.0.0",
5
- "type": "module",
6
- "scripts": {
7
- "dev": "vite",
8
- "build": "vite build",
9
- "preview": "vite preview"
10
- },
11
- "dependencies": {
12
- "dayjs": "^1.11.13",
13
- "echarts": "^6.0.0",
14
- "element-plus": "^2.9.1",
15
- "lodash": "^4.17.21",
16
- "pinia": "^2.3.0",
17
- "pinia-plugin-persistedstate": "^4.2.0",
18
- "sass": "^1.83.0",
19
- "vue": "^3.5.13",
20
- "vue-router": "^4.5.0",
21
- "vuedraggable": "^4.1.0"
22
- },
23
- "devDependencies": {
24
- "@vitejs/plugin-vue": "^5.2.1",
25
- "@vitejs/plugin-vue-jsx": "^4.2.0",
26
- "vite": "^6.0.5"
27
- }
28
- }
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
@@ -1,130 +0,0 @@
1
- <script setup>
2
- import { ref, computed } from 'vue'
3
- import { useRouter, useRoute } from 'vue-router'
4
- import TagsView from './components/tags-view.vue'
5
- const router = useRouter()
6
- const route = useRoute()
7
-
8
- // 从路由配置生成菜单项
9
- const menuItems = computed(() =>
10
- router.options.routes.map((route, index) => ({
11
- index: String(index + 1),
12
- path: route.path,
13
- label: route.meta?.title || route.name,
14
- children: route.children?.map((child, childIndex) => ({
15
- index: `${index + 1}-${childIndex + 1}`,
16
- path: child.path,
17
- label: child.meta?.title || child.name
18
- }))
19
- }))
20
- )
21
-
22
- // 根据当前路由路径获取激活的菜单项
23
- const activeIndex = computed(() => {
24
- const currentPath = route.path
25
- for (const item of menuItems.value) {
26
- if (item.path === currentPath) return item.index
27
- const child = item.children?.find(child => child.path === currentPath)
28
- if (child) return child.index
29
- }
30
- return '1'
31
- })
32
-
33
- const handleSelect = (key) => {
34
- // 先查找主菜单项
35
- const mainItem = menuItems.value.find(item => item.index === key)
36
- if (mainItem && !mainItem.children) {
37
- router.push(mainItem.path)
38
- return
39
- }
40
-
41
- // 查找子菜单项
42
- for (const item of menuItems.value) {
43
- const childItem = item.children?.find(child => child.index === key)
44
- if (childItem) {
45
- router.push(childItem.path)
46
- return
47
- }
48
- }
49
- }
50
-
51
- window.$wujie?.bus.$on('router-jump', (data) => {
52
- console.log(data);
53
- if(data.app === 'vue3-child'){
54
- router.push({
55
- path: data.path,
56
- query: data.query
57
- })
58
- }
59
- })
60
- window.$wujie?.bus.$emit('loaded', 'vue3-child')
61
- console.log('app.vue');
62
-
63
-
64
- </script>
65
-
66
- <template>
67
- <div class="app-container">
68
- <el-menu
69
- :default-active="activeIndex"
70
- class="el-menu-demo"
71
- mode="horizontal"
72
- @select="handleSelect"
73
- >
74
- <template v-for="item in menuItems" :key="item.index">
75
- <!-- 有子菜单的情况 -->
76
- <el-sub-menu v-if="item.children?.length" :index="item.index">
77
- <template #title>{{ item.label }}</template>
78
- <el-menu-item
79
- v-for="child in item.children"
80
- :key="child.index"
81
- :index="child.index"
82
- >
83
- {{ child.label }}
84
- </el-menu-item>
85
- </el-sub-menu>
86
- <!-- 没有子菜单的情况 -->
87
- <el-menu-item v-else :index="item.index">
88
- {{ item.label }}
89
- </el-menu-item>
90
- </template>
91
- </el-menu>
92
-
93
- <tags-view></tags-view>
94
-
95
- <div class="content-container">
96
- <router-view></router-view>
97
- </div>
98
- </div>
99
- </template>
100
-
101
- <style scoped>
102
- .app-container {
103
- min-height: 100vh;
104
- }
105
-
106
- .el-menu-demo {
107
- padding-left: 20px;
108
- height: 40px; /* 减小菜单高度 */
109
- line-height: 40px; /* 确保文字垂直居中 */
110
- box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08); /* 添加阴影效果 */
111
- }
112
-
113
- :deep(.el-menu-item) {
114
- height: 40px; /* 减小菜单项高度 */
115
- line-height: 40px; /* 确保文字垂直居中 */
116
- padding: 0 20px; /* 调整内边距 */
117
- font-size: 14px; /* 调整字体大小 */
118
- }
119
-
120
- .content-container {
121
- padding: 20px; /* 给内容区域添加内边距 */
122
- }
123
-
124
- /* 自定义菜单项悬停和激活状态的样式 */
125
- :deep(.el-menu-item:hover),
126
- :deep(.el-menu-item.is-active) {
127
- background-color: #f5f7fa; /* 更柔和的背景色 */
128
- color: #409eff; /* Element Plus 的主题蓝色 */
129
- }
130
- </style>
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>
@@ -1,43 +0,0 @@
1
- <script setup>
2
- import { ref } from 'vue'
3
-
4
- defineProps({
5
- msg: String,
6
- })
7
-
8
- const count = ref(0)
9
- </script>
10
-
11
- <template>
12
- <h1>{{ msg }}</h1>
13
-
14
- <div class="card">
15
- <button type="button" @click="count++">count is {{ count }}</button>
16
- <p>
17
- Edit
18
- <code>components/HelloWorld.vue</code> to test HMR
19
- </p>
20
- </div>
21
-
22
- <p>
23
- Check out
24
- <a href="https://vuejs.org/guide/quick-start.html#local" target="_blank"
25
- >create-vue</a
26
- >, the official Vue + Vite starter
27
- </p>
28
- <p>
29
- Learn more about IDE Support for Vue in the
30
- <a
31
- href="https://vuejs.org/guide/scaling-up/tooling.html#ide-support"
32
- target="_blank"
33
- >Vue Docs Scaling up Guide</a
34
- >.
35
- </p>
36
- <p class="read-the-docs">Click on the Vite and Vue logos to learn more</p>
37
- </template>
38
-
39
- <style scoped>
40
- .read-the-docs {
41
- color: #888;
42
- }
43
- </style>
@@ -1,224 +0,0 @@
1
- import { defineComponent, ref, onMounted, onUnmounted, watch, nextTick, computed } from 'vue'
2
- import './style.css'
3
-
4
- export default defineComponent({
5
- name: 'SmartAnchorTabs',
6
- props: {
7
- // 数据源:[{ label, key, content?, component? }]
8
- tabs: {
9
- type: Array,
10
- required: true,
11
- default: () => []
12
- },
13
- // 布局位置:'left' | 'right' | 'top'
14
- position: {
15
- type: String,
16
- default: 'left'
17
- },
18
- // 模式:'anchor' (滚动锚点) | 'switch' (组件切换)
19
- mode: {
20
- type: String,
21
- default: 'anchor'
22
- },
23
- // 容器高度,如果是 anchor 模式需要指定高度以支持滚动
24
- height: {
25
- type: String,
26
- default: '100%'
27
- },
28
- // 默认激活的 key
29
- defaultActive: {
30
- type: String,
31
- default: ''
32
- }
33
- },
34
- emits: ['update:active', 'change'],
35
- setup(props, { slots, emit }) {
36
- const activeKey = ref(props.defaultActive || (props.tabs[0] && props.tabs[0].key) || '')
37
- const contentRef = ref(null)
38
- const isClicking = ref(false) // 防止点击滚动时触发 scroll 监听导致的跳动
39
- const sectionRefs = ref({})
40
-
41
- // 设置 section ref
42
- const setSectionRef = (el, key) => {
43
- if (el) {
44
- sectionRefs.value[key] = el
45
- }
46
- }
47
-
48
- // 切换 Tab
49
- const handleTabClick = (tab) => {
50
- activeKey.value = tab.key
51
- emit('update:active', tab.key)
52
- emit('change', tab.key)
53
-
54
- if (props.mode === 'anchor') {
55
- scrollToSection(tab.key)
56
- }
57
- }
58
-
59
- // 滚动到指定 Section
60
- const scrollToSection = (key) => {
61
- const sectionEl = sectionRefs.value[key]
62
- const containerEl = contentRef.value
63
-
64
- if (sectionEl && containerEl) {
65
- isClicking.value = true
66
-
67
- // 计算目标位置:section.offsetTop - container.offsetTop
68
- // 这里假设 content 是 relative 定位,直接用 section.offsetTop 即可(如果 section 是 content 的直接子元素)
69
- const top = sectionEl.offsetTop
70
-
71
- containerEl.scrollTo({
72
- top: top,
73
- behavior: 'smooth'
74
- })
75
-
76
- // 简单的防抖,等待滚动结束
77
- setTimeout(() => {
78
- isClicking.value = false
79
- }, 500)
80
- }
81
- }
82
-
83
- // 监听滚动,更新 Active Tab
84
- const handleScroll = (e) => {
85
- if (props.mode !== 'anchor' || isClicking.value) return
86
-
87
- const container = e.target
88
- const scrollTop = container.scrollTop
89
- const containerHeight = container.clientHeight
90
-
91
- // 遍历所有 sections,找到当前最符合可视区域的一个
92
- // 策略:找到第一个 top > scrollTop 的 section,那么它的前一个就是当前 active
93
- // 或者:找到距离 scrollTop 最近的一个 section
94
-
95
- let currentKey = ''
96
-
97
- // 加上一定的偏移量,比如滚动到 section 顶部往下 50px 才算进入
98
- const offset = 20
99
-
100
- for (const tab of props.tabs) {
101
- const sectionEl = sectionRefs.value[tab.key]
102
- if (!sectionEl) continue
103
-
104
- // section 距离容器顶部的距离
105
- const sectionTop = sectionEl.offsetTop
106
- const sectionHeight = sectionEl.offsetHeight
107
-
108
- // 如果 scrollTop 在 section 范围内
109
- if (scrollTop >= sectionTop - offset && scrollTop < sectionTop + sectionHeight - offset) {
110
- currentKey = tab.key
111
- break
112
- }
113
- }
114
-
115
- // 如果没有匹配到(比如上面的循环逻辑有漏洞),兜底策略:
116
- // 找最近的一个
117
- if (!currentKey) {
118
- let minDiff = Infinity
119
- for (const tab of props.tabs) {
120
- const sectionEl = sectionRefs.value[tab.key]
121
- if (!sectionEl) continue
122
- const diff = Math.abs(sectionEl.offsetTop - scrollTop)
123
- if (diff < minDiff) {
124
- minDiff = diff
125
- currentKey = tab.key
126
- }
127
- }
128
- }
129
-
130
- if (currentKey && currentKey !== activeKey.value) {
131
- activeKey.value = currentKey
132
- emit('update:active', currentKey)
133
- }
134
- }
135
-
136
- // 监听 defaultActive 变化
137
- watch(() => props.defaultActive, (val) => {
138
- if (val && val !== activeKey.value) {
139
- activeKey.value = val
140
- if (props.mode === 'anchor') {
141
- // nextTick 确保 DOM 更新后滚动
142
- nextTick(() => scrollToSection(val))
143
- }
144
- }
145
- })
146
-
147
- return () => {
148
- const { tabs, position, mode, height } = props
149
-
150
- // 类名生成
151
- const containerClasses = [
152
- 'smart-anchor-tabs',
153
- `smart-anchor-tabs--${position}`
154
- ]
155
-
156
- // 渲染导航
157
- const renderNav = () => (
158
- <div class="smart-anchor-nav">
159
- {tabs.map(tab => (
160
- <div
161
- key={tab.key}
162
- class={['smart-anchor-nav-item', activeKey.value === tab.key ? 'is-active' : '']}
163
- onClick={() => handleTabClick(tab)}
164
- >
165
- {slots[`nav-${tab.key}`] ? slots[`nav-${tab.key}`](tab) : tab.label}
166
- </div>
167
- ))}
168
- </div>
169
- )
170
-
171
- // 渲染内容
172
- const renderContent = () => {
173
- if (mode === 'switch') {
174
- // 切换模式:只渲染当前 active 的内容
175
- const currentTab = tabs.find(t => t.key === activeKey.value)
176
- if (!currentTab) return null
177
-
178
- return (
179
- <div class="smart-anchor-content" style={{ height: '100%', overflowY: 'auto' }}>
180
- {/* 优先渲染插槽,其次 component,最后 content 文本 */}
181
- {slots[currentTab.key] ? slots[currentTab.key](currentTab) :
182
- (currentTab.component ? <currentTab.component /> :
183
- (slots.default ? slots.default({ tab: currentTab }) : currentTab.content))}
184
- </div>
185
- )
186
- } else {
187
- // 锚点模式:渲染所有内容
188
- return (
189
- <div
190
- class="smart-anchor-content"
191
- ref={contentRef}
192
- onScroll={handleScroll}
193
- >
194
- {tabs.map(tab => (
195
- <div
196
- key={tab.key}
197
- ref={(el) => setSectionRef(el, tab.key)}
198
- class="smart-anchor-section"
199
- >
200
- <div class="smart-anchor-section-title">
201
- {tab.label}
202
- </div>
203
- <div class="smart-anchor-section-body">
204
- {/* 优先渲染插槽,其次 component,最后 content 文本 */}
205
- {slots[tab.key] ? slots[tab.key](tab) :
206
- (tab.component ? <tab.component /> :
207
- (slots.default ? slots.default({ tab: tab }) : tab.content))}
208
- </div>
209
- </div>
210
- ))}
211
- </div>
212
- )
213
- }
214
- }
215
-
216
- return (
217
- <div class={containerClasses} style={{ height }}>
218
- {renderNav()}
219
- {renderContent()}
220
- </div>
221
- )
222
- }
223
- }
224
- })
@@ -1,154 +0,0 @@
1
- /* SmartAnchorTabs 样式 */
2
-
3
- .smart-anchor-tabs {
4
- display: flex;
5
- width: 100%;
6
- height: 100%;
7
- position: relative;
8
- background-color: #fff;
9
- overflow: hidden; /* 防止外层滚动 */
10
- }
11
-
12
- /* 布局方向 */
13
- .smart-anchor-tabs--left {
14
- flex-direction: row;
15
- }
16
-
17
- .smart-anchor-tabs--right {
18
- flex-direction: row-reverse;
19
- }
20
-
21
- .smart-anchor-tabs--top {
22
- flex-direction: column;
23
- }
24
-
25
- /* 导航栏容器 */
26
- .smart-anchor-nav {
27
- position: relative;
28
- /* background: #f9fafb; */
29
- flex-shrink: 0;
30
- overflow-y: auto;
31
- }
32
-
33
- .smart-anchor-tabs--left .smart-anchor-nav,
34
- .smart-anchor-tabs--right .smart-anchor-nav {
35
- width: 200px;
36
- /* border-right: 1px solid #e4e7ed; */
37
- padding: 16px 0;
38
- }
39
-
40
- .smart-anchor-tabs--right .smart-anchor-nav {
41
- border-right: none;
42
- border-left: 1px solid #e4e7ed;
43
- }
44
-
45
- .smart-anchor-tabs--top .smart-anchor-nav {
46
- width: 100%;
47
- height: 48px;
48
- border-bottom: 1px solid #e4e7ed;
49
- display: flex;
50
- align-items: center;
51
- padding: 0 16px;
52
- overflow-x: auto;
53
- overflow-y: hidden;
54
- }
55
-
56
- /* 导航项 */
57
- .smart-anchor-nav-item {
58
- position: relative;
59
- cursor: pointer;
60
- color: #606266;
61
- font-size: 14px;
62
- transition: all 0.3s;
63
- user-select: none;
64
- }
65
-
66
- .smart-anchor-tabs--left .smart-anchor-nav-item,
67
- .smart-anchor-tabs--right .smart-anchor-nav-item {
68
- padding: 12px 24px;
69
- display: flex;
70
- align-items: center;
71
- }
72
-
73
- .smart-anchor-tabs--top .smart-anchor-nav-item {
74
- padding: 0 20px;
75
- height: 100%;
76
- display: flex;
77
- align-items: center;
78
- justify-content: center;
79
- white-space: nowrap;
80
- }
81
-
82
- .smart-anchor-nav-item:hover {
83
- color: #FDC099;
84
- }
85
-
86
- .smart-anchor-nav-item.is-active {
87
- color: #FDC099;
88
- font-weight: 500;
89
- /* background-color: #ecf5ff; */
90
- }
91
-
92
- /* 指示条 */
93
- .smart-anchor-nav-item::before {
94
- content: '';
95
- position: absolute;
96
- background-color: #FDC099;
97
- transition: all 0.3s;
98
- opacity: 0;
99
- }
100
-
101
- /* 左侧布局指示条 */
102
- .smart-anchor-tabs--left .smart-anchor-nav-item::before {
103
- left: 0;
104
- top: 0;
105
- bottom: 0;
106
- width: 3px;
107
- }
108
-
109
- /* 右侧布局指示条 */
110
- .smart-anchor-tabs--right .smart-anchor-nav-item::before {
111
- right: 0;
112
- top: 0;
113
- bottom: 0;
114
- width: 3px;
115
- }
116
-
117
- /* 顶部布局指示条 */
118
- .smart-anchor-tabs--top .smart-anchor-nav-item::before {
119
- left: 0;
120
- right: 0;
121
- bottom: 0;
122
- height: 2px;
123
- }
124
-
125
- .smart-anchor-nav-item.is-active::before {
126
- opacity: 1;
127
- }
128
-
129
- /* 内容区域 */
130
- .smart-anchor-content {
131
- flex: 1;
132
- overflow-y: auto;
133
- scroll-behavior: smooth;
134
- position: relative;
135
- padding: 24px;
136
- }
137
-
138
- /* 锚点模式下的 Section */
139
- .smart-anchor-section {
140
- margin-bottom: 40px;
141
- }
142
-
143
- .smart-anchor-section:last-child {
144
- margin-bottom: 200px; /* 底部留白,确保最后一项能滚到顶部 */
145
- }
146
-
147
- .smart-anchor-section-title {
148
- font-size: 16px;
149
- font-weight: bold;
150
- color: #303133;
151
- margin-bottom: 16px;
152
- padding-bottom: 12px;
153
- border-bottom: 1px solid #ebeef5;
154
- }