@robot-admin/naive-ui-components 0.6.3 → 0.6.4
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.
- package/CHANGELOG.md +48 -57
- package/README.md +18 -14
- package/dist/C_ActionBar-DYG0Yf3A.css.map +1 -0
- package/dist/C_ActionBar-MAjRhqcI.css.map +1 -0
- package/dist/C_ActionBar.css +47 -47
- package/dist/C_ActionBar.js.map +1 -1
- package/dist/C_ActionBar2.js +1 -1
- package/dist/C_ActionBar2.js.map +1 -1
- package/dist/{C_AntV-A3NXx_sF.css.map → C_AntV-BY8jqqmi.css.map} +1 -1
- package/dist/{C_AntV-D2Zp2qQF.css.map → C_AntV-BbkHc-_a.css.map} +1 -1
- package/dist/C_AntV.css +78 -78
- package/dist/C_AntV.js.map +1 -1
- package/dist/C_AntV2.js +2 -2
- package/dist/C_AntV2.js.map +1 -1
- package/dist/{C_Barcode-DjTmDkbQ.css.map → C_Barcode-DYDRDe2O.css.map} +1 -1
- package/dist/{C_Barcode-Do1Ozsmh.css.map → C_Barcode-muJdc_O4.css.map} +1 -1
- package/dist/C_Barcode.css +7 -7
- package/dist/C_Barcode.js.map +1 -1
- package/dist/C_Barcode2.js +1 -1
- package/dist/C_Barcode2.js.map +1 -1
- package/dist/C_Breadcrumb-D55Jd2CK.css.map +1 -0
- package/dist/C_Breadcrumb-mBL4CWps.css.map +1 -0
- package/dist/C_Breadcrumb.css +7 -0
- package/dist/C_Breadcrumb.js.map +1 -1
- package/dist/C_Breadcrumb2.js +1 -1
- package/dist/C_Breadcrumb2.js.map +1 -1
- package/dist/{C_Captcha-CZmAETly.css.map → C_Captcha-9_hk6VmY.css.map} +1 -1
- package/dist/{C_Captcha-Ccq3DMrR.css.map → C_Captcha-MtASlJ0f.css.map} +1 -1
- package/dist/C_Captcha.css +19 -19
- package/dist/C_Captcha.js.map +1 -1
- package/dist/C_Captcha2.js +1 -1
- package/dist/C_Captcha2.js.map +1 -1
- package/dist/{C_City-Cv5BESaN.css.map → C_City-Bam08Qv3.css.map} +1 -1
- package/dist/{C_City-DNKv4MpH.css.map → C_City-Bb3W-KaN.css.map} +1 -1
- package/dist/C_City.css +29 -29
- package/dist/C_City.js.map +1 -1
- package/dist/C_City2.js +1 -1
- package/dist/C_City2.js.map +1 -1
- package/dist/C_Code-BFi5xxnM.css.map +1 -0
- package/dist/C_Code-CZ7yfnri.css.map +1 -0
- package/dist/C_Code.css +3 -3
- package/dist/C_Code.js.map +1 -1
- package/dist/C_Code2.js +1 -1
- package/dist/C_Code2.js.map +1 -1
- package/dist/{C_CollapsePanel-BpofCDyl.css.map → C_CollapsePanel-BCmTFuDz.css.map} +1 -1
- package/dist/{C_CollapsePanel-Fap-lv_5.css.map → C_CollapsePanel-Bxnh4Zy-.css.map} +1 -1
- package/dist/C_CollapsePanel.css +35 -35
- package/dist/C_CollapsePanel.js.map +1 -1
- package/dist/C_CollapsePanel2.js +1 -1
- package/dist/C_CollapsePanel2.js.map +1 -1
- package/dist/{C_Cron-C0-8b5af.css.map → C_Cron-Civir5-I.css.map} +1 -1
- package/dist/{C_Cron-DqHQ92LN.css.map → C_Cron-iw3qpMsy.css.map} +1 -1
- package/dist/C_Cron.css +37 -37
- package/dist/C_Cron.js.map +1 -1
- package/dist/C_Cron2.js +1 -1
- package/dist/C_Cron2.js.map +1 -1
- package/dist/{C_Draggable-Bq6o0qXn.css.map → C_Draggable-BCjIvIwT.css.map} +1 -1
- package/dist/{C_Draggable-r6nhx3yM.css.map → C_Draggable-DwkSlCOS.css.map} +1 -1
- package/dist/C_Draggable.css +46 -46
- package/dist/C_Draggable.js.map +1 -1
- package/dist/C_Draggable2.js +1 -1
- package/dist/C_Draggable2.js.map +1 -1
- package/dist/{C_FilePreview-BVarVvnD.css.map → C_FilePreview-BhcbiXsV.css.map} +1 -1
- package/dist/{C_FilePreview-DHGlV4OR.css.map → C_FilePreview-DJudcIbW.css.map} +1 -1
- package/dist/C_FilePreview.css +91 -91
- package/dist/C_FilePreview.js.map +1 -1
- package/dist/C_FilePreview2.js +1 -1
- package/dist/C_FilePreview2.js.map +1 -1
- package/dist/{C_Form-BciQUPpS.css.map → C_Form-BtcAPIRi.css.map} +1 -1
- package/dist/{C_Form-CKHvXL3O.css.map → C_Form-D_gwQ7hC.css.map} +1 -1
- package/dist/C_Form.css +222 -222
- package/dist/C_Form.js.map +1 -1
- package/dist/C_Form2.js +1 -1
- package/dist/C_Form2.js.map +1 -1
- package/dist/{C_FormSearch-Bmd2CmG6.css.map → C_FormSearch-Bi4XYjjk.css.map} +1 -1
- package/dist/{C_FormSearch-DBNtnjaL.css.map → C_FormSearch-DUGOoX0u.css.map} +1 -1
- package/dist/C_FormSearch.css +45 -45
- package/dist/C_FormSearch.js.map +1 -1
- package/dist/C_FormSearch2.js +1 -1
- package/dist/C_FormSearch2.js.map +1 -1
- package/dist/{C_FormulaEditor-3WG2vtQl.css.map → C_FormulaEditor-CJk3SSUJ.css.map} +1 -1
- package/dist/{C_FormulaEditor-Cm0CokN5.css.map → C_FormulaEditor-Cy7mjfVO.css.map} +1 -1
- package/dist/C_FormulaEditor.css +78 -78
- package/dist/C_FormulaEditor.js.map +1 -1
- package/dist/C_FormulaEditor2.js +1 -1
- package/dist/C_FormulaEditor2.js.map +1 -1
- package/dist/C_FullCalendar-BQA0OjGB.css.map +1 -0
- package/dist/C_FullCalendar-ChJUosAi.css.map +1 -0
- package/dist/C_FullCalendar.css +3 -3
- package/dist/C_FullCalendar.js.map +1 -1
- package/dist/C_FullCalendar2.js +1 -1
- package/dist/C_FullCalendar2.js.map +1 -1
- package/dist/C_Icon.js.map +1 -1
- package/dist/C_Icon2.js.map +1 -1
- package/dist/{C_ImageCropper-D3L2-J_J.css.map → C_ImageCropper-BqZpkZfU.css.map} +1 -1
- package/dist/{C_ImageCropper-DrmUlaLi.css.map → C_ImageCropper-CylwGuzS.css.map} +1 -1
- package/dist/C_ImageCropper.css +10 -10
- package/dist/C_ImageCropper.js.map +1 -1
- package/dist/C_ImageCropper2.js +1 -1
- package/dist/C_ImageCropper2.js.map +1 -1
- package/dist/{C_Map-BCJmDnJT.css.map → C_Map-DNnBcY70.css.map} +1 -1
- package/dist/{C_Map-WUMXSAfy.css.map → C_Map-LEXIx6zM.css.map} +1 -1
- package/dist/C_Map.css +4 -4
- package/dist/C_Map.js.map +1 -1
- package/dist/C_Map2.js +1 -1
- package/dist/C_Map2.js.map +1 -1
- package/dist/{C_Markdown-7iBnLDtL.css.map → C_Markdown-Kujzx1qG.css.map} +1 -1
- package/dist/{C_Markdown-BbTvdFCl.css.map → C_Markdown-YCAmBbNF.css.map} +1 -1
- package/dist/C_Markdown.css +33 -33
- package/dist/C_Markdown.js.map +1 -1
- package/dist/C_Markdown2.js +1 -1
- package/dist/C_Markdown2.js.map +1 -1
- package/dist/C_Menu.cjs +1 -1
- package/dist/C_Menu.js +1 -1
- package/dist/{C_QRCode-DMxSyogU.css.map → C_QRCode-CFNTda_1.css.map} +1 -1
- package/dist/{C_QRCode-G7fiAkm4.css.map → C_QRCode-CmWr9lK-.css.map} +1 -1
- package/dist/C_QRCode.css +9 -9
- package/dist/C_QRCode.js.map +1 -1
- package/dist/C_QRCode2.js +1 -1
- package/dist/C_QRCode2.js.map +1 -1
- package/dist/{C_Signature-B5fFz6RD.css.map → C_Signature-PN4GOLRX.css.map} +1 -1
- package/dist/{C_Signature-es-ZNPzr.css.map → C_Signature-fWQqGIZ-.css.map} +1 -1
- package/dist/C_Signature.css +14 -14
- package/dist/C_Signature.js.map +1 -1
- package/dist/C_Signature2.js +1 -1
- package/dist/C_Signature2.js.map +1 -1
- package/dist/{C_SplitPane-Br2eK8IG.css.map → C_SplitPane-BOwr1C7K.css.map} +1 -1
- package/dist/{C_SplitPane-DuyzUhKB.css.map → C_SplitPane-N-a_D-7F.css.map} +1 -1
- package/dist/C_SplitPane.css +31 -31
- package/dist/C_SplitPane.js.map +1 -1
- package/dist/C_SplitPane2.js +1 -1
- package/dist/C_SplitPane2.js.map +1 -1
- package/dist/{C_Steps-DGwXxS2Y.css.map → C_Steps-DLW2vbqC.css.map} +1 -1
- package/dist/{C_Steps-P9Qj9iDd.css.map → C_Steps-DwMRHbG2.css.map} +1 -1
- package/dist/C_Steps.css +37 -37
- package/dist/C_Steps.js.map +1 -1
- package/dist/C_Steps2.js +1 -1
- package/dist/C_Steps2.js.map +1 -1
- package/dist/{C_Table-vZlcgH6x.css.map → C_Table-BV1wUw6f.css.map} +1 -1
- package/dist/{C_Table-wzAO43l0.css.map → C_Table-LlJ-JEdm.css.map} +1 -1
- package/dist/C_Table.css +93 -93
- package/dist/C_Table.js.map +1 -1
- package/dist/C_Table2.js +1 -1
- package/dist/C_Table2.js.map +1 -1
- package/dist/{C_TagsView-BsutyC3U.css.map → C_TagsView-DX3LecK1.css.map} +1 -1
- package/dist/{C_TagsView-Crm7yWg9.css.map → C_TagsView-DqOTa8bL.css.map} +1 -1
- package/dist/C_TagsView.css +36 -36
- package/dist/C_TagsView.js.map +1 -1
- package/dist/C_TagsView2.js +1 -1
- package/dist/C_TagsView2.js.map +1 -1
- package/dist/C_Time-BzyQVvTS.css.map +1 -0
- package/dist/C_Time-DmpKLQHc.css.map +1 -0
- package/dist/C_Time.css +5 -5
- package/dist/C_Time.js.map +1 -1
- package/dist/C_Time2.js +1 -1
- package/dist/C_Time2.js.map +1 -1
- package/dist/{C_Tree-B-Le4hjQ.css.map → C_Tree-D98nX9qT.css.map} +1 -1
- package/dist/{C_Tree-DnGc_MPb.css.map → C_Tree-ulfm7b-P.css.map} +1 -1
- package/dist/C_Tree.css +33 -33
- package/dist/C_Tree.js.map +1 -1
- package/dist/C_Tree2.js +1 -1
- package/dist/C_Tree2.js.map +1 -1
- package/dist/{C_VideoPlayer-Cdgv4Zq0.css.map → C_VideoPlayer-4J96tKfK.css.map} +1 -1
- package/dist/{C_VideoPlayer-rm0MODUv.css.map → C_VideoPlayer-D35seHkm.css.map} +1 -1
- package/dist/C_VideoPlayer.css +13 -13
- package/dist/C_VideoPlayer.js.map +1 -1
- package/dist/C_VideoPlayer2.js +1 -1
- package/dist/C_VideoPlayer2.js.map +1 -1
- package/dist/{C_VtableGantt-BpY-Rng3.css.map → C_VtableGantt-C2lxFmWg.css.map} +1 -1
- package/dist/{C_VtableGantt-DB87-jdS.css.map → C_VtableGantt-Dwnkw_WL.css.map} +1 -1
- package/dist/C_VtableGantt.css +15 -15
- package/dist/C_VtableGantt.js.map +1 -1
- package/dist/C_VtableGantt2.js +1 -1
- package/dist/C_VtableGantt2.js.map +1 -1
- package/dist/{C_WorkFlow-7F6op6qN.css.map → C_WorkFlow-2hJfvvTK.css.map} +1 -1
- package/dist/{C_WorkFlow-Cy3HWA6A.css.map → C_WorkFlow-DHoNjl8-.css.map} +1 -1
- package/dist/C_WorkFlow.css +108 -108
- package/dist/C_WorkFlow.js.map +1 -1
- package/dist/C_WorkFlow2.js +1 -1
- package/dist/C_WorkFlow2.js.map +1 -1
- package/dist/_shared.cjs +1 -1
- package/dist/_shared.js +1 -1
- package/dist/constants.d.ts +5 -5
- package/dist/constants2.d.ts +5 -5
- package/dist/constants3.d.ts +5 -5
- package/dist/constants4.d.ts +6 -6
- package/dist/constants5.d.ts +2 -2
- package/dist/data.d.ts +2 -2
- package/dist/index.cjs.map +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.vue.d.ts +1 -1
- package/dist/index11.vue.d.ts +7 -7
- package/dist/index12.vue.d.ts +2 -2
- package/dist/index13.vue.d.ts +5 -5
- package/dist/index15.vue.d.ts +3 -3
- package/dist/index16.vue.d.ts +1 -1
- package/dist/index19.vue.d.ts +3 -3
- package/dist/index2.vue.d.ts +1 -1
- package/dist/index4.vue.d.ts +6 -6
- package/dist/index5.vue.d.ts +2 -2
- package/dist/index6.vue.d.ts +2 -2
- package/dist/index7.vue.d.ts +3 -3
- package/dist/index8.vue.d.ts +1 -1
- package/dist/index9.vue.d.ts +3 -3
- package/dist/menuAdapter.js +1 -1
- package/dist/menuAdapter.js.map +1 -1
- package/dist/resolver.cjs.map +1 -1
- package/dist/resolver.js.map +1 -1
- package/dist/style.css +1218 -1209
- package/dist/useCalendarEvents.d.ts +1 -1
- package/dist/useCollapsePanel.d.ts +3 -3
- package/dist/useCropperCore.d.ts +4 -4
- package/dist/useDraggableLayout.d.ts +8 -8
- package/dist/useDynamicFormState.d.ts +4 -4
- package/dist/useEdgeInteraction.d.ts +2 -2
- package/dist/useInfiniteScroll.d.ts +2 -2
- package/dist/useModalEdit.d.ts +2 -2
- package/dist/useQRCode.d.ts +4 -4
- package/dist/useSearchState.d.ts +2 -2
- package/dist/useSignatureHistory.d.ts +2 -2
- package/dist/useSplitResize.d.ts +5 -5
- package/dist/useTimeSelection.d.ts +2 -2
- package/dist/useTreeOperations.d.ts +7 -7
- package/dist/useWorkflowValidation.d.ts +4 -4
- package/package.json +1 -1
- package/dist/C_ActionBar-jZPsiXtT.css.map +0 -1
- package/dist/C_ActionBar-nnfbZCea.css.map +0 -1
- package/dist/C_Code-DPZlNSxL.css.map +0 -1
- package/dist/C_Code-avZjAnHD.css.map +0 -1
- package/dist/C_FullCalendar-1U4VlG7X.css.map +0 -1
- package/dist/C_FullCalendar-DLUdCtqf.css.map +0 -1
- package/dist/C_Time-Bd_e1YDN.css.map +0 -1
- package/dist/C_Time-CKb_fwdm.css.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"C_Barcode-
|
|
1
|
+
{"version":3,"file":"C_Barcode-DYDRDe2O.css","names":[],"sources":["../src/components/C_Barcode/index.vue?vue&type=style&index=0&scoped=03c1988e&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled */.c-barcode[data-v-03c1988e] {\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n max-width: 100%;\n}\n.c-barcode .barcode-wrapper[data-v-03c1988e] {\n display: inline-block;\n padding: 8px;\n background: #ffffff;\n border-radius: 4px;\n transition: all 0.3s ease;\n overflow: hidden;\n max-width: 100%;\n}\n.c-barcode .barcode-wrapper.with-border[data-v-03c1988e] {\n border: 1px dashed #e0e0e0;\n}\n.c-barcode .barcode-wrapper[data-v-03c1988e]:hover {\n border-color: var(--c-primary, #409eff);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n}\n.c-barcode .barcode-wrapper[data-v-03c1988e] svg {\n max-width: 100%;\n height: auto;\n display: block;\n overflow: visible;\n}\n.c-barcode .barcode-label[data-v-03c1988e] {\n font-size: 14px;\n color: #666;\n text-align: center;\n font-weight: 500;\n word-break: break-all;\n max-width: 100%;\n}"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"C_Barcode-
|
|
1
|
+
{"version":3,"file":"C_Barcode-muJdc_O4.css","names":[],"sources":["../src/components/C_Barcode/index.vue?vue&type=style&index=0&scoped=03c1988e&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled */.c-barcode[data-v-03c1988e] {\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n max-width: 100%;\n}\n.c-barcode .barcode-wrapper[data-v-03c1988e] {\n display: inline-block;\n padding: 8px;\n background: #ffffff;\n border-radius: 4px;\n transition: all 0.3s ease;\n overflow: hidden;\n max-width: 100%;\n}\n.c-barcode .barcode-wrapper.with-border[data-v-03c1988e] {\n border: 1px dashed #e0e0e0;\n}\n.c-barcode .barcode-wrapper[data-v-03c1988e]:hover {\n border-color: var(--c-primary, #409eff);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n}\n.c-barcode .barcode-wrapper[data-v-03c1988e] svg {\n max-width: 100%;\n height: auto;\n display: block;\n overflow: visible;\n}\n.c-barcode .barcode-label[data-v-03c1988e] {\n font-size: 14px;\n color: #666;\n text-align: center;\n font-weight: 500;\n word-break: break-all;\n max-width: 100%;\n}"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}
|
package/dist/C_Barcode.css
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
/* unplugin-vue-components disabled */.c-barcode[data-v-
|
|
1
|
+
/* unplugin-vue-components disabled */.c-barcode[data-v-03c1988e] {
|
|
2
2
|
display: inline-flex;
|
|
3
3
|
flex-direction: column;
|
|
4
4
|
align-items: center;
|
|
5
5
|
gap: 8px;
|
|
6
6
|
max-width: 100%;
|
|
7
7
|
}
|
|
8
|
-
.c-barcode .barcode-wrapper[data-v-
|
|
8
|
+
.c-barcode .barcode-wrapper[data-v-03c1988e] {
|
|
9
9
|
display: inline-block;
|
|
10
10
|
padding: 8px;
|
|
11
11
|
background: #ffffff;
|
|
@@ -14,20 +14,20 @@
|
|
|
14
14
|
overflow: hidden;
|
|
15
15
|
max-width: 100%;
|
|
16
16
|
}
|
|
17
|
-
.c-barcode .barcode-wrapper.with-border[data-v-
|
|
17
|
+
.c-barcode .barcode-wrapper.with-border[data-v-03c1988e] {
|
|
18
18
|
border: 1px dashed #e0e0e0;
|
|
19
19
|
}
|
|
20
|
-
.c-barcode .barcode-wrapper[data-v-
|
|
20
|
+
.c-barcode .barcode-wrapper[data-v-03c1988e]:hover {
|
|
21
21
|
border-color: var(--c-primary, #409eff);
|
|
22
22
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
23
23
|
}
|
|
24
|
-
.c-barcode .barcode-wrapper[data-v-
|
|
24
|
+
.c-barcode .barcode-wrapper[data-v-03c1988e] svg {
|
|
25
25
|
max-width: 100%;
|
|
26
26
|
height: auto;
|
|
27
27
|
display: block;
|
|
28
28
|
overflow: visible;
|
|
29
29
|
}
|
|
30
|
-
.c-barcode .barcode-label[data-v-
|
|
30
|
+
.c-barcode .barcode-label[data-v-03c1988e] {
|
|
31
31
|
font-size: 14px;
|
|
32
32
|
color: #666;
|
|
33
33
|
text-align: center;
|
|
@@ -36,4 +36,4 @@
|
|
|
36
36
|
max-width: 100%;
|
|
37
37
|
}
|
|
38
38
|
|
|
39
|
-
/*# sourceMappingURL=C_Barcode-
|
|
39
|
+
/*# sourceMappingURL=C_Barcode-DYDRDe2O.css.map*/
|
package/dist/C_Barcode.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"C_Barcode.js","names":["showBorder","showLabel","label"],"sources":["../src/components/C_Barcode/index.vue","../src/components/C_Barcode/index.vue","../src/components/C_Barcode/index.vue"],"sourcesContent":["/* unplugin-vue-components disabled */<!--\
|
|
1
|
+
{"version":3,"file":"C_Barcode.js","names":["showBorder","showLabel","label"],"sources":["../src/components/C_Barcode/index.vue","../src/components/C_Barcode/index.vue","../src/components/C_Barcode/index.vue"],"sourcesContent":["/* unplugin-vue-components disabled */<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-12-02\n * @Description: 条形码组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-barcode\">\n <div class=\"barcode-wrapper\" :class=\"{ 'with-border': showBorder }\">\n <VueBarcode v-bind=\"barcodeProps\" @error=\"handleError\" />\n </div>\n <div v-if=\"showLabel && label\" class=\"barcode-label\">\n {{ label }}\n </div>\n </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport VueBarcode from \"@chenfengyuan/vue-barcode\";\n\ndefineOptions({ name: \"C_Barcode\" });\n\ninterface Props {\n value: string;\n format?:\n | \"CODE128\"\n | \"CODE39\"\n | \"EAN13\"\n | \"EAN8\"\n | \"UPC\"\n | \"ITF14\"\n | \"MSI\"\n | \"pharmacode\";\n width?: number;\n height?: number;\n showText?: boolean;\n fontSize?: number;\n textPosition?: \"bottom\" | \"top\";\n lineColor?: string;\n background?: string;\n showBorder?: boolean;\n label?: string;\n showLabel?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n format: \"CODE128\",\n width: 2,\n height: 80,\n showText: true,\n fontSize: 20,\n textPosition: \"bottom\",\n lineColor: \"#000000\",\n background: \"#FFFFFF\",\n showBorder: true,\n label: \"\",\n showLabel: false,\n});\n\nconst emit = defineEmits<{\n error: [error: Error];\n}>();\n\nconst barcodeProps = computed(() => ({\n value: props.value,\n format: props.format,\n width: props.width,\n height: props.height,\n displayValue: props.showText,\n fontSize: props.fontSize,\n textPosition: props.textPosition,\n lineColor: props.lineColor,\n background: props.background,\n}));\n\nconst handleError = (error: Error) => {\n console.error(\"条形码生成失败:\", error);\n emit(\"error\", error);\n};\n</script>\n\n<style lang=\"scss\" scoped>\n@use \"./index.scss\";\n</style>\n","/* unplugin-vue-components disabled */<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-12-02\n * @Description: 条形码组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-barcode\">\n <div class=\"barcode-wrapper\" :class=\"{ 'with-border': showBorder }\">\n <VueBarcode v-bind=\"barcodeProps\" @error=\"handleError\" />\n </div>\n <div v-if=\"showLabel && label\" class=\"barcode-label\">\n {{ label }}\n </div>\n </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport VueBarcode from \"@chenfengyuan/vue-barcode\";\n\ndefineOptions({ name: \"C_Barcode\" });\n\ninterface Props {\n value: string;\n format?:\n | \"CODE128\"\n | \"CODE39\"\n | \"EAN13\"\n | \"EAN8\"\n | \"UPC\"\n | \"ITF14\"\n | \"MSI\"\n | \"pharmacode\";\n width?: number;\n height?: number;\n showText?: boolean;\n fontSize?: number;\n textPosition?: \"bottom\" | \"top\";\n lineColor?: string;\n background?: string;\n showBorder?: boolean;\n label?: string;\n showLabel?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n format: \"CODE128\",\n width: 2,\n height: 80,\n showText: true,\n fontSize: 20,\n textPosition: \"bottom\",\n lineColor: \"#000000\",\n background: \"#FFFFFF\",\n showBorder: true,\n label: \"\",\n showLabel: false,\n});\n\nconst emit = defineEmits<{\n error: [error: Error];\n}>();\n\nconst barcodeProps = computed(() => ({\n value: props.value,\n format: props.format,\n width: props.width,\n height: props.height,\n displayValue: props.showText,\n fontSize: props.fontSize,\n textPosition: props.textPosition,\n lineColor: props.lineColor,\n background: props.background,\n}));\n\nconst handleError = (error: Error) => {\n console.error(\"条形码生成失败:\", error);\n emit(\"error\", error);\n};\n</script>\n\n<style lang=\"scss\" scoped>\n@use \"./index.scss\";\n</style>\n","<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-12-02\n * @Description: 条形码组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-barcode\">\n <div class=\"barcode-wrapper\" :class=\"{ 'with-border': showBorder }\">\n <VueBarcode v-bind=\"barcodeProps\" @error=\"handleError\" />\n </div>\n <div v-if=\"showLabel && label\" class=\"barcode-label\">\n {{ label }}\n </div>\n </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport VueBarcode from \"@chenfengyuan/vue-barcode\";\n\ndefineOptions({ name: \"C_Barcode\" });\n\ninterface Props {\n value: string;\n format?:\n | \"CODE128\"\n | \"CODE39\"\n | \"EAN13\"\n | \"EAN8\"\n | \"UPC\"\n | \"ITF14\"\n | \"MSI\"\n | \"pharmacode\";\n width?: number;\n height?: number;\n showText?: boolean;\n fontSize?: number;\n textPosition?: \"bottom\" | \"top\";\n lineColor?: string;\n background?: string;\n showBorder?: boolean;\n label?: string;\n showLabel?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n format: \"CODE128\",\n width: 2,\n height: 80,\n showText: true,\n fontSize: 20,\n textPosition: \"bottom\",\n lineColor: \"#000000\",\n background: \"#FFFFFF\",\n showBorder: true,\n label: \"\",\n showLabel: false,\n});\n\nconst emit = defineEmits<{\n error: [error: Error];\n}>();\n\nconst barcodeProps = computed(() => ({\n value: props.value,\n format: props.format,\n width: props.width,\n height: props.height,\n displayValue: props.showText,\n fontSize: props.fontSize,\n textPosition: props.textPosition,\n lineColor: props.lineColor,\n background: props.background,\n}));\n\nconst handleError = (error: Error) => {\n console.error(\"条形码生成失败:\", error);\n emit(\"error\", error);\n};\n</script>\n\n<style lang=\"scss\" scoped>\n@use \"./index.scss\";\n</style>\n"],"mappings":"kmBE+CA,IAAM,EAAQ,EAcR,EAAO,EAIP,GAAA,EAAA,EAAA,eAA+B,CACnC,MAAO,EAAM,MACb,OAAQ,EAAM,OACd,MAAO,EAAM,MACb,OAAQ,EAAM,OACd,aAAc,EAAM,SACpB,SAAU,EAAM,SAChB,aAAc,EAAM,aACpB,UAAW,EAAM,UACjB,WAAY,EAAM,WACnB,EAAE,CAEG,EAAe,GAAiB,CACpC,QAAQ,MAAM,WAAY,EAAM,CAChC,EAAK,QAAS,EAAM,2DAhEd,MAPN,EAOM,EAAA,EAAA,EAAA,oBAJE,MAAA,CAFD,OAAA,EAAA,EAAA,gBAAK,CAAC,kBAAiB,CAAA,cAA0BA,EAAAA,WAAU,CAAA,CAAA,CAAA,CAAA,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OACL,EAAA,QAAA,EAAA,EAAA,EAAA,YAArC,EAAqC,MAAzB,CAAG,QAAO,EAAW,CAAA,CAAA,KAAA,GAAA,CAAA,CAAA,EAAA,CAE5CC,EAAAA,WAAaC,EAAAA,QAAAA,EAAAA,EAAAA,YAAAA,EAAAA,EAAAA,EAAAA,oBAElB,MAFN,GAAA,EAAA,EAAA,iBACKA,EAAAA,MAAK,CAAA,EAAA,GAAA,EAAA,EAAA,oBAAA,OAAA,GAAA,CAAA,CAAA"}
|
package/dist/C_Barcode2.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{t as e}from"./export-helper.js";import{computed as t,createCommentVNode as n,createElementBlock as r,createElementVNode as i,createVNode as a,defineComponent as o,mergeProps as s,normalizeClass as c,openBlock as l,toDisplayString as u,unref as d}from"vue";import f from"@chenfengyuan/vue-barcode";const p={class:`c-barcode`},m={key:0,class:`barcode-label`};var h=e(o({name:`C_Barcode`,__name:`index`,props:{value:{},format:{default:`CODE128`},width:{default:2},height:{default:80},showText:{type:Boolean,default:!0},fontSize:{default:20},textPosition:{default:`bottom`},lineColor:{default:`#000000`},background:{default:`#FFFFFF`},showBorder:{type:Boolean,default:!0},label:{default:``},showLabel:{type:Boolean,default:!1}},emits:[`error`],setup(e,{emit:o}){let h=e,g=o,_=t(()=>({value:h.value,format:h.format,width:h.width,height:h.height,displayValue:h.showText,fontSize:h.fontSize,textPosition:h.textPosition,lineColor:h.lineColor,background:h.background})),v=e=>{console.error(`条形码生成失败:`,e),g(`error`,e)};return(e,t)=>(l(),r(`div`,p,[i(`div`,{class:c([`barcode-wrapper`,{"with-border":e.showBorder}])},[a(d(f),s(_.value,{onError:v}),null,16)],2),e.showLabel&&e.label?(l(),r(`div`,m,u(e.label),1)):n(`v-if`,!0)]))}}),[[`__scopeId`,`data-v-
|
|
1
|
+
import{t as e}from"./export-helper.js";import{computed as t,createCommentVNode as n,createElementBlock as r,createElementVNode as i,createVNode as a,defineComponent as o,mergeProps as s,normalizeClass as c,openBlock as l,toDisplayString as u,unref as d}from"vue";import f from"@chenfengyuan/vue-barcode";const p={class:`c-barcode`},m={key:0,class:`barcode-label`};var h=e(o({name:`C_Barcode`,__name:`index`,props:{value:{},format:{default:`CODE128`},width:{default:2},height:{default:80},showText:{type:Boolean,default:!0},fontSize:{default:20},textPosition:{default:`bottom`},lineColor:{default:`#000000`},background:{default:`#FFFFFF`},showBorder:{type:Boolean,default:!0},label:{default:``},showLabel:{type:Boolean,default:!1}},emits:[`error`],setup(e,{emit:o}){let h=e,g=o,_=t(()=>({value:h.value,format:h.format,width:h.width,height:h.height,displayValue:h.showText,fontSize:h.fontSize,textPosition:h.textPosition,lineColor:h.lineColor,background:h.background})),v=e=>{console.error(`条形码生成失败:`,e),g(`error`,e)};return(e,t)=>(l(),r(`div`,p,[i(`div`,{class:c([`barcode-wrapper`,{"with-border":e.showBorder}])},[a(d(f),s(_.value,{onError:v}),null,16)],2),e.showLabel&&e.label?(l(),r(`div`,m,u(e.label),1)):n(`v-if`,!0)]))}}),[[`__scopeId`,`data-v-03c1988e`]]);export{h as t};
|
|
2
2
|
//# sourceMappingURL=C_Barcode2.js.map
|
package/dist/C_Barcode2.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"C_Barcode2.js","names":["showBorder","showLabel","label"],"sources":["../src/components/C_Barcode/index.vue","../src/components/C_Barcode/index.vue","../src/components/C_Barcode/index.vue"],"sourcesContent":["/* unplugin-vue-components disabled */<!--\
|
|
1
|
+
{"version":3,"file":"C_Barcode2.js","names":["showBorder","showLabel","label"],"sources":["../src/components/C_Barcode/index.vue","../src/components/C_Barcode/index.vue","../src/components/C_Barcode/index.vue"],"sourcesContent":["/* unplugin-vue-components disabled */<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-12-02\n * @Description: 条形码组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-barcode\">\n <div class=\"barcode-wrapper\" :class=\"{ 'with-border': showBorder }\">\n <VueBarcode v-bind=\"barcodeProps\" @error=\"handleError\" />\n </div>\n <div v-if=\"showLabel && label\" class=\"barcode-label\">\n {{ label }}\n </div>\n </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport VueBarcode from \"@chenfengyuan/vue-barcode\";\n\ndefineOptions({ name: \"C_Barcode\" });\n\ninterface Props {\n value: string;\n format?:\n | \"CODE128\"\n | \"CODE39\"\n | \"EAN13\"\n | \"EAN8\"\n | \"UPC\"\n | \"ITF14\"\n | \"MSI\"\n | \"pharmacode\";\n width?: number;\n height?: number;\n showText?: boolean;\n fontSize?: number;\n textPosition?: \"bottom\" | \"top\";\n lineColor?: string;\n background?: string;\n showBorder?: boolean;\n label?: string;\n showLabel?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n format: \"CODE128\",\n width: 2,\n height: 80,\n showText: true,\n fontSize: 20,\n textPosition: \"bottom\",\n lineColor: \"#000000\",\n background: \"#FFFFFF\",\n showBorder: true,\n label: \"\",\n showLabel: false,\n});\n\nconst emit = defineEmits<{\n error: [error: Error];\n}>();\n\nconst barcodeProps = computed(() => ({\n value: props.value,\n format: props.format,\n width: props.width,\n height: props.height,\n displayValue: props.showText,\n fontSize: props.fontSize,\n textPosition: props.textPosition,\n lineColor: props.lineColor,\n background: props.background,\n}));\n\nconst handleError = (error: Error) => {\n console.error(\"条形码生成失败:\", error);\n emit(\"error\", error);\n};\n</script>\n\n<style lang=\"scss\" scoped>\n@use \"./index.scss\";\n</style>\n","/* unplugin-vue-components disabled */<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-12-02\n * @Description: 条形码组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-barcode\">\n <div class=\"barcode-wrapper\" :class=\"{ 'with-border': showBorder }\">\n <VueBarcode v-bind=\"barcodeProps\" @error=\"handleError\" />\n </div>\n <div v-if=\"showLabel && label\" class=\"barcode-label\">\n {{ label }}\n </div>\n </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport VueBarcode from \"@chenfengyuan/vue-barcode\";\n\ndefineOptions({ name: \"C_Barcode\" });\n\ninterface Props {\n value: string;\n format?:\n | \"CODE128\"\n | \"CODE39\"\n | \"EAN13\"\n | \"EAN8\"\n | \"UPC\"\n | \"ITF14\"\n | \"MSI\"\n | \"pharmacode\";\n width?: number;\n height?: number;\n showText?: boolean;\n fontSize?: number;\n textPosition?: \"bottom\" | \"top\";\n lineColor?: string;\n background?: string;\n showBorder?: boolean;\n label?: string;\n showLabel?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n format: \"CODE128\",\n width: 2,\n height: 80,\n showText: true,\n fontSize: 20,\n textPosition: \"bottom\",\n lineColor: \"#000000\",\n background: \"#FFFFFF\",\n showBorder: true,\n label: \"\",\n showLabel: false,\n});\n\nconst emit = defineEmits<{\n error: [error: Error];\n}>();\n\nconst barcodeProps = computed(() => ({\n value: props.value,\n format: props.format,\n width: props.width,\n height: props.height,\n displayValue: props.showText,\n fontSize: props.fontSize,\n textPosition: props.textPosition,\n lineColor: props.lineColor,\n background: props.background,\n}));\n\nconst handleError = (error: Error) => {\n console.error(\"条形码生成失败:\", error);\n emit(\"error\", error);\n};\n</script>\n\n<style lang=\"scss\" scoped>\n@use \"./index.scss\";\n</style>\n","<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-12-02\n * @Description: 条形码组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-barcode\">\n <div class=\"barcode-wrapper\" :class=\"{ 'with-border': showBorder }\">\n <VueBarcode v-bind=\"barcodeProps\" @error=\"handleError\" />\n </div>\n <div v-if=\"showLabel && label\" class=\"barcode-label\">\n {{ label }}\n </div>\n </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport VueBarcode from \"@chenfengyuan/vue-barcode\";\n\ndefineOptions({ name: \"C_Barcode\" });\n\ninterface Props {\n value: string;\n format?:\n | \"CODE128\"\n | \"CODE39\"\n | \"EAN13\"\n | \"EAN8\"\n | \"UPC\"\n | \"ITF14\"\n | \"MSI\"\n | \"pharmacode\";\n width?: number;\n height?: number;\n showText?: boolean;\n fontSize?: number;\n textPosition?: \"bottom\" | \"top\";\n lineColor?: string;\n background?: string;\n showBorder?: boolean;\n label?: string;\n showLabel?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n format: \"CODE128\",\n width: 2,\n height: 80,\n showText: true,\n fontSize: 20,\n textPosition: \"bottom\",\n lineColor: \"#000000\",\n background: \"#FFFFFF\",\n showBorder: true,\n label: \"\",\n showLabel: false,\n});\n\nconst emit = defineEmits<{\n error: [error: Error];\n}>();\n\nconst barcodeProps = computed(() => ({\n value: props.value,\n format: props.format,\n width: props.width,\n height: props.height,\n displayValue: props.showText,\n fontSize: props.fontSize,\n textPosition: props.textPosition,\n lineColor: props.lineColor,\n background: props.background,\n}));\n\nconst handleError = (error: Error) => {\n console.error(\"条形码生成失败:\", error);\n emit(\"error\", error);\n};\n</script>\n\n<style lang=\"scss\" scoped>\n@use \"./index.scss\";\n</style>\n"],"mappings":"6vBE+CA,IAAM,EAAQ,EAcR,EAAO,EAIP,EAAe,OAAgB,CACnC,MAAO,EAAM,MACb,OAAQ,EAAM,OACd,MAAO,EAAM,MACb,OAAQ,EAAM,OACd,aAAc,EAAM,SACpB,SAAU,EAAM,SAChB,aAAc,EAAM,aACpB,UAAW,EAAM,UACjB,WAAY,EAAM,WACnB,EAAE,CAEG,EAAe,GAAiB,CACpC,QAAQ,MAAM,WAAY,EAAM,CAChC,EAAK,QAAS,EAAM,oBAvEpB,EAOM,MAPN,EAOM,CANJ,EAEM,MAAA,CAFD,MAAK,EAAA,CAAC,kBAAiB,CAAA,cAA0BA,EAAAA,WAAU,CAAA,CAAA,CAAA,CAAA,CAC9D,EAAyD,EAAA,EAAA,CAAzD,EAAoB,EAAqC,MAAzB,CAAG,QAAO,EAAW,CAAA,CAAA,KAAA,GAAA,CAAA,CAAA,EAAA,CAE5CC,EAAAA,WAAaC,EAAAA,OAAAA,GAAAA,CAAxB,EAEM,MAFN,EAEM,EADDA,EAAAA,MAAK,CAAA,EAAA,EAAA,EAAA,OAAA,GAAA,CAAA,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"C_Breadcrumb-D55Jd2CK.css","names":[],"sources":["../src/components/C_Breadcrumb/index.vue?vue&type=style&index=0&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled */.c-breadcrumb__trigger, .c-breadcrumb__link {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n}"],"mappings":"AAAA;AACA;AACA;AACA;AACA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"C_Breadcrumb-mBL4CWps.css","names":[],"sources":["../src/components/C_Breadcrumb/index.vue?vue&type=style&index=0&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled */.c-breadcrumb__trigger, .c-breadcrumb__link {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n}"],"mappings":"AAAA;AACA;AACA;AACA;AACA"}
|
package/dist/C_Breadcrumb.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"C_Breadcrumb.js","names":["showIcon"],"sources":["../src/components/C_Breadcrumb/index.vue","../src/components/C_Breadcrumb/index.vue","../src/components/C_Breadcrumb/index.vue"],"sourcesContent":["/* unplugin-vue-components disabled */<!--\r\n * @Description: 通用面包屑组件 — 基于 NBreadcrumb 的路由面包屑导航\r\n *\r\n * 支持两种模式:\r\n * 1. 自动模式(默认)— 从 `route.matched` 自动生成面包屑\r\n * 2. 手动模式 — 传入 `items` 完全自定义\r\n *\r\n * @example 自动模式(零配置)\r\n * ```vue\r\n * <C_Breadcrumb\r\n * :label-formatter=\"$t\"\r\n * @select=\"router.push\"\r\n * />\r\n * ```\r\n *\r\n * @example 手动模式\r\n * ```vue\r\n * <C_Breadcrumb\r\n * :items=\"customBreadcrumbs\"\r\n * @select=\"handleSelect\"\r\n * />\r\n * ```\r\n *\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n <div class=\"c-breadcrumb flex-1 min-w-0\">\r\n <NBreadcrumb>\r\n <NBreadcrumbItem\r\n v-for=\"(item, index) in breadcrumbItems\"\r\n :key=\"index\"\r\n >\r\n <NDropdown\r\n v-if=\"item.children?.length\"\r\n :options=\"item.children\"\r\n @select=\"handleSelect\"\r\n >\r\n <div class=\"trigger\">\r\n <C_Icon\r\n v-if=\"showIcon\"\r\n :name=\"item.icon\"\r\n class=\"vertical-top\"\r\n />\r\n {{ item.label }}\r\n </div>\r\n </NDropdown>\r\n <span\r\n v-else\r\n class=\"c-breadcrumb-link\"\r\n @click=\"handleSelect(item.key)\"\r\n >\r\n <C_Icon\r\n v-if=\"showIcon\"\r\n :name=\"item.icon\"\r\n class=\"vertical-top mr-1\"\r\n />\r\n {{ item.label }}\r\n </span>\r\n </NBreadcrumbItem>\r\n </NBreadcrumb>\r\n </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\n import { computed } from 'vue'\r\n import { useRoute } from 'vue-router'\r\n import { C_Icon } from '../C_Icon'\r\n import type { BreadcrumbItem } from '../_shared'\r\n\r\n defineOptions({ name: 'C_Breadcrumb' })\r\n\r\n const props = withDefaults(\r\n defineProps<{\r\n /**\r\n * 手动传入面包屑数据\r\n * 不传时自动从 `route.matched` 生成(零配置)\r\n */\r\n items?: BreadcrumbItem[]\r\n /** 是否显示图标 */\r\n showIcon?: boolean\r\n /**\r\n * 标签文本格式化函数(用于 i18n)\r\n * 仅在自动模式下生效\r\n */\r\n labelFormatter?: (label: string) => string\r\n }>(),\r\n {\r\n showIcon: true,\r\n }\r\n )\r\n\r\n const emit = defineEmits<{\r\n /** 面包屑项被选中(返回路径 key) */\r\n select: [path: string]\r\n }>()\r\n\r\n const route = useRoute()\r\n\r\n const formatLabel = (title: string): string =>\r\n props.labelFormatter ? props.labelFormatter(title) : title\r\n\r\n /** 从 route.matched 自动生成面包屑 */\r\n const autoBreadcrumb = computed<BreadcrumbItem[]>(() => {\r\n return route.matched\r\n .filter((record: any) => record.meta?.title)\r\n .map((record: any) => ({\r\n key: record.path,\r\n label: formatLabel((record.meta.title || '') as string),\r\n icon: record.meta.icon as string | undefined,\r\n children: record.children?.length\r\n ? record.children.map((child: any) => ({\r\n key: child.path,\r\n label: formatLabel((child.meta?.title || '') as string),\r\n ...(child.children?.length && {\r\n children: child.children.map((grandChild: any) => ({\r\n key: grandChild.path,\r\n label: formatLabel((grandChild.meta?.title || '') as string),\r\n })),\r\n }),\r\n }))\r\n : [],\r\n }))\r\n })\r\n\r\n const breadcrumbItems = computed<BreadcrumbItem[]>(\r\n () => props.items ?? autoBreadcrumb.value\r\n )\r\n\r\n const handleSelect = (key: string) => {\r\n emit('select', key)\r\n }\r\n</script>\r\n","/* unplugin-vue-components disabled */<!--\r\n * @Description: 通用面包屑组件 — 基于 NBreadcrumb 的路由面包屑导航\r\n *\r\n * 支持两种模式:\r\n * 1. 自动模式(默认)— 从 `route.matched` 自动生成面包屑\r\n * 2. 手动模式 — 传入 `items` 完全自定义\r\n *\r\n * @example 自动模式(零配置)\r\n * ```vue\r\n * <C_Breadcrumb\r\n * :label-formatter=\"$t\"\r\n * @select=\"router.push\"\r\n * />\r\n * ```\r\n *\r\n * @example 手动模式\r\n * ```vue\r\n * <C_Breadcrumb\r\n * :items=\"customBreadcrumbs\"\r\n * @select=\"handleSelect\"\r\n * />\r\n * ```\r\n *\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n <div class=\"c-breadcrumb flex-1 min-w-0\">\r\n <NBreadcrumb>\r\n <NBreadcrumbItem\r\n v-for=\"(item, index) in breadcrumbItems\"\r\n :key=\"index\"\r\n >\r\n <NDropdown\r\n v-if=\"item.children?.length\"\r\n :options=\"item.children\"\r\n @select=\"handleSelect\"\r\n >\r\n <div class=\"trigger\">\r\n <C_Icon\r\n v-if=\"showIcon\"\r\n :name=\"item.icon\"\r\n class=\"vertical-top\"\r\n />\r\n {{ item.label }}\r\n </div>\r\n </NDropdown>\r\n <span\r\n v-else\r\n class=\"c-breadcrumb-link\"\r\n @click=\"handleSelect(item.key)\"\r\n >\r\n <C_Icon\r\n v-if=\"showIcon\"\r\n :name=\"item.icon\"\r\n class=\"vertical-top mr-1\"\r\n />\r\n {{ item.label }}\r\n </span>\r\n </NBreadcrumbItem>\r\n </NBreadcrumb>\r\n </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\n import { computed } from 'vue'\r\n import { useRoute } from 'vue-router'\r\n import { C_Icon } from '../C_Icon'\r\n import type { BreadcrumbItem } from '../_shared'\r\n\r\n defineOptions({ name: 'C_Breadcrumb' })\r\n\r\n const props = withDefaults(\r\n defineProps<{\r\n /**\r\n * 手动传入面包屑数据\r\n * 不传时自动从 `route.matched` 生成(零配置)\r\n */\r\n items?: BreadcrumbItem[]\r\n /** 是否显示图标 */\r\n showIcon?: boolean\r\n /**\r\n * 标签文本格式化函数(用于 i18n)\r\n * 仅在自动模式下生效\r\n */\r\n labelFormatter?: (label: string) => string\r\n }>(),\r\n {\r\n showIcon: true,\r\n }\r\n )\r\n\r\n const emit = defineEmits<{\r\n /** 面包屑项被选中(返回路径 key) */\r\n select: [path: string]\r\n }>()\r\n\r\n const route = useRoute()\r\n\r\n const formatLabel = (title: string): string =>\r\n props.labelFormatter ? props.labelFormatter(title) : title\r\n\r\n /** 从 route.matched 自动生成面包屑 */\r\n const autoBreadcrumb = computed<BreadcrumbItem[]>(() => {\r\n return route.matched\r\n .filter((record: any) => record.meta?.title)\r\n .map((record: any) => ({\r\n key: record.path,\r\n label: formatLabel((record.meta.title || '') as string),\r\n icon: record.meta.icon as string | undefined,\r\n children: record.children?.length\r\n ? record.children.map((child: any) => ({\r\n key: child.path,\r\n label: formatLabel((child.meta?.title || '') as string),\r\n ...(child.children?.length && {\r\n children: child.children.map((grandChild: any) => ({\r\n key: grandChild.path,\r\n label: formatLabel((grandChild.meta?.title || '') as string),\r\n })),\r\n }),\r\n }))\r\n : [],\r\n }))\r\n })\r\n\r\n const breadcrumbItems = computed<BreadcrumbItem[]>(\r\n () => props.items ?? autoBreadcrumb.value\r\n )\r\n\r\n const handleSelect = (key: string) => {\r\n emit('select', key)\r\n }\r\n</script>\r\n","<!--\r\n * @Description: 通用面包屑组件 — 基于 NBreadcrumb 的路由面包屑导航\r\n *\r\n * 支持两种模式:\r\n * 1. 自动模式(默认)— 从 `route.matched` 自动生成面包屑\r\n * 2. 手动模式 — 传入 `items` 完全自定义\r\n *\r\n * @example 自动模式(零配置)\r\n * ```vue\r\n * <C_Breadcrumb\r\n * :label-formatter=\"$t\"\r\n * @select=\"router.push\"\r\n * />\r\n * ```\r\n *\r\n * @example 手动模式\r\n * ```vue\r\n * <C_Breadcrumb\r\n * :items=\"customBreadcrumbs\"\r\n * @select=\"handleSelect\"\r\n * />\r\n * ```\r\n *\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n <div class=\"c-breadcrumb flex-1 min-w-0\">\r\n <NBreadcrumb>\r\n <NBreadcrumbItem\r\n v-for=\"(item, index) in breadcrumbItems\"\r\n :key=\"index\"\r\n >\r\n <NDropdown\r\n v-if=\"item.children?.length\"\r\n :options=\"item.children\"\r\n @select=\"handleSelect\"\r\n >\r\n <div class=\"trigger\">\r\n <C_Icon\r\n v-if=\"showIcon\"\r\n :name=\"item.icon\"\r\n class=\"vertical-top\"\r\n />\r\n {{ item.label }}\r\n </div>\r\n </NDropdown>\r\n <span\r\n v-else\r\n class=\"c-breadcrumb-link\"\r\n @click=\"handleSelect(item.key)\"\r\n >\r\n <C_Icon\r\n v-if=\"showIcon\"\r\n :name=\"item.icon\"\r\n class=\"vertical-top mr-1\"\r\n />\r\n {{ item.label }}\r\n </span>\r\n </NBreadcrumbItem>\r\n </NBreadcrumb>\r\n </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\n import { computed } from 'vue'\r\n import { useRoute } from 'vue-router'\r\n import { C_Icon } from '../C_Icon'\r\n import type { BreadcrumbItem } from '../_shared'\r\n\r\n defineOptions({ name: 'C_Breadcrumb' })\r\n\r\n const props = withDefaults(\r\n defineProps<{\r\n /**\r\n * 手动传入面包屑数据\r\n * 不传时自动从 `route.matched` 生成(零配置)\r\n */\r\n items?: BreadcrumbItem[]\r\n /** 是否显示图标 */\r\n showIcon?: boolean\r\n /**\r\n * 标签文本格式化函数(用于 i18n)\r\n * 仅在自动模式下生效\r\n */\r\n labelFormatter?: (label: string) => string\r\n }>(),\r\n {\r\n showIcon: true,\r\n }\r\n )\r\n\r\n const emit = defineEmits<{\r\n /** 面包屑项被选中(返回路径 key) */\r\n select: [path: string]\r\n }>()\r\n\r\n const route = useRoute()\r\n\r\n const formatLabel = (title: string): string =>\r\n props.labelFormatter ? props.labelFormatter(title) : title\r\n\r\n /** 从 route.matched 自动生成面包屑 */\r\n const autoBreadcrumb = computed<BreadcrumbItem[]>(() => {\r\n return route.matched\r\n .filter((record: any) => record.meta?.title)\r\n .map((record: any) => ({\r\n key: record.path,\r\n label: formatLabel((record.meta.title || '') as string),\r\n icon: record.meta.icon as string | undefined,\r\n children: record.children?.length\r\n ? record.children.map((child: any) => ({\r\n key: child.path,\r\n label: formatLabel((child.meta?.title || '') as string),\r\n ...(child.children?.length && {\r\n children: child.children.map((grandChild: any) => ({\r\n key: grandChild.path,\r\n label: formatLabel((grandChild.meta?.title || '') as string),\r\n })),\r\n }),\r\n }))\r\n : [],\r\n }))\r\n })\r\n\r\n const breadcrumbItems = computed<BreadcrumbItem[]>(\r\n () => props.items ?? autoBreadcrumb.value\r\n )\r\n\r\n const handleSelect = (key: string) => {\r\n emit('select', key)\r\n }\r\n</script>\r\n"],"mappings":"iXEuEE,IAAM,EAAQ,EAoBR,EAAO,EAKP,GAAA,EAAA,EAAA,WAAkB,CAElB,EAAe,GACnB,EAAM,eAAiB,EAAM,eAAe,EAAM,CAAG,EAGjD,GAAA,EAAA,EAAA,cACG,EAAM,QACV,OAAQ,GAAgB,EAAO,MAAM,MAAM,CAC3C,IAAK,IAAiB,CACrB,IAAK,EAAO,KACZ,MAAO,EAAa,EAAO,KAAK,OAAS,GAAc,CACvD,KAAM,EAAO,KAAK,KAClB,SAAU,EAAO,UAAU,OACvB,EAAO,SAAS,IAAK,IAAgB,CACnC,IAAK,EAAM,KACX,MAAO,EAAa,EAAM,MAAM,OAAS,GAAc,CACvD,GAAI,EAAM,UAAU,QAAU,CAC5B,SAAU,EAAM,SAAS,IAAK,IAAqB,CACjD,IAAK,EAAW,KAChB,MAAO,EAAa,EAAW,MAAM,OAAS,GAAc,CAC7D,EAAE,CACJ,CACF,EAAE,CACH,EAAE,CACP,EAAE,CACL,CAEI,GAAA,EAAA,EAAA,cACE,EAAM,OAAS,EAAe,MACrC,CAEK,EAAgB,GAAgB,CACpC,EAAK,SAAU,EAAI,uHArEf,MAlCN,EAkCM,EAAA,EAAA,EAAA,aADU,EAAA,KAAA,2BA9B8B,GAAA,EAAA,EAAA,WAAA,GAAA,EAAA,EAAA,EAAA,oBA6BxB,EAAA,SAAA,MAAA,EAAA,EAAA,YA7BQ,EAAA,OAAhB,EAAM,yCA6BE,EAAA,CA5Bf,IAAK,EAAK,CAAA,2BAkBhB,CAfa,EAAK,UAAU,SAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,aAYX,EAAA,OAXT,QAAS,EAAK,SACd,SAAQ,8BASH,EAAA,EAAA,EAAA,oBAAA,MAPN,EAOM,CALIA,EAAAA,WAAAA,EAAAA,EAAAA,YAAAA,EAAAA,EAAAA,EAAAA,cAAAA,EAAAA,EAAAA,OAGN,EAAA,EAAA,CAAA,OAFC,KAAM,EAAK,KACZ,MAAM,4FACN,KAAA,EAAA,EAAA,iBACC,EAAK,MAAK,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,qEAcV,OAAA,OATL,MAAM,oBACL,QAAK,GAAE,EAAa,EAAK,IAAG,GAGrBA,EAAAA,WAAAA,EAAAA,EAAAA,YAAAA,EAAAA,EAAAA,EAAAA,cAAAA,EAAAA,EAAAA,OAGN,EAAA,EAAA,CAAA,OAFC,KAAM,EAAK,KACZ,MAAM,iGACN,KAAA,EAAA,EAAA,iBACC,EAAK,MAAK,CAAA,EAAA,CAAA,CAAA,EAAA,EAAA,EAAA,CAAA"}
|
|
1
|
+
{"version":3,"file":"C_Breadcrumb.js","names":["showIcon"],"sources":["../src/components/C_Breadcrumb/index.vue","../src/components/C_Breadcrumb/index.vue","../src/components/C_Breadcrumb/index.vue"],"sourcesContent":["/* unplugin-vue-components disabled */<!--\n * @Description: 通用面包屑组件 — 基于 NBreadcrumb 的路由面包屑导航\n *\n * 支持两种模式:\n * 1. 自动模式(默认)— 从 `route.matched` 自动生成面包屑\n * 2. 手动模式 — 传入 `items` 完全自定义\n *\n * @example 自动模式(零配置)\n * ```vue\n * <C_Breadcrumb\n * :label-formatter=\"$t\"\n * @select=\"router.push\"\n * />\n * ```\n *\n * @example 手动模式\n * ```vue\n * <C_Breadcrumb\n * :items=\"customBreadcrumbs\"\n * @select=\"handleSelect\"\n * />\n * ```\n *\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-breadcrumb flex-1 min-w-0\">\n <NBreadcrumb>\n <NBreadcrumbItem\n v-for=\"(item, index) in breadcrumbItems\"\n :key=\"index\"\n >\n <NDropdown\n v-if=\"item.children?.length\"\n :options=\"item.children\"\n @select=\"handleSelect\"\n >\n <div class=\"c-breadcrumb__trigger\">\n <C_Icon\n v-if=\"showIcon\"\n :name=\"item.icon\"\n />\n {{ item.label }}\n </div>\n </NDropdown>\n <span\n v-else\n class=\"c-breadcrumb__link\"\n @click=\"handleSelect(item.key)\"\n >\n <C_Icon\n v-if=\"showIcon\"\n :name=\"item.icon\"\n />\n {{ item.label }}\n </span>\n </NBreadcrumbItem>\n </NBreadcrumb>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed } from 'vue'\n import { useRoute } from 'vue-router'\n import { C_Icon } from '../C_Icon'\n import type { BreadcrumbItem } from '../_shared'\n\n defineOptions({ name: 'C_Breadcrumb' })\n\n const props = withDefaults(\n defineProps<{\n /**\n * 手动传入面包屑数据\n * 不传时自动从 `route.matched` 生成(零配置)\n */\n items?: BreadcrumbItem[]\n /** 是否显示图标 */\n showIcon?: boolean\n /**\n * 标签文本格式化函数(用于 i18n)\n * 仅在自动模式下生效\n */\n labelFormatter?: (label: string) => string\n }>(),\n {\n showIcon: true,\n }\n )\n\n const emit = defineEmits<{\n /** 面包屑项被选中(返回路径 key) */\n select: [path: string]\n }>()\n\n const route = useRoute()\n\n const formatLabel = (title: string): string =>\n props.labelFormatter ? props.labelFormatter(title) : title\n\n /** 从 route.matched 自动生成面包屑 */\n const autoBreadcrumb = computed<BreadcrumbItem[]>(() => {\n return route.matched\n .filter((record: any) => record.meta?.title)\n .map((record: any) => ({\n key: record.path,\n label: formatLabel((record.meta.title || '') as string),\n icon: record.meta.icon as string | undefined,\n children: record.children?.length\n ? record.children.map((child: any) => ({\n key: child.path,\n label: formatLabel((child.meta?.title || '') as string),\n ...(child.children?.length && {\n children: child.children.map((grandChild: any) => ({\n key: grandChild.path,\n label: formatLabel((grandChild.meta?.title || '') as string),\n })),\n }),\n }))\n : [],\n }))\n })\n\n const breadcrumbItems = computed<BreadcrumbItem[]>(\n () => props.items ?? autoBreadcrumb.value\n )\n\n const handleSelect = (key: string) => {\n emit('select', key)\n }\n</script>\n\n<style lang=\"scss\">\n .c-breadcrumb {\n &__trigger,\n &__link {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n }\n }\n</style>\n","/* unplugin-vue-components disabled */<!--\n * @Description: 通用面包屑组件 — 基于 NBreadcrumb 的路由面包屑导航\n *\n * 支持两种模式:\n * 1. 自动模式(默认)— 从 `route.matched` 自动生成面包屑\n * 2. 手动模式 — 传入 `items` 完全自定义\n *\n * @example 自动模式(零配置)\n * ```vue\n * <C_Breadcrumb\n * :label-formatter=\"$t\"\n * @select=\"router.push\"\n * />\n * ```\n *\n * @example 手动模式\n * ```vue\n * <C_Breadcrumb\n * :items=\"customBreadcrumbs\"\n * @select=\"handleSelect\"\n * />\n * ```\n *\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-breadcrumb flex-1 min-w-0\">\n <NBreadcrumb>\n <NBreadcrumbItem\n v-for=\"(item, index) in breadcrumbItems\"\n :key=\"index\"\n >\n <NDropdown\n v-if=\"item.children?.length\"\n :options=\"item.children\"\n @select=\"handleSelect\"\n >\n <div class=\"c-breadcrumb__trigger\">\n <C_Icon\n v-if=\"showIcon\"\n :name=\"item.icon\"\n />\n {{ item.label }}\n </div>\n </NDropdown>\n <span\n v-else\n class=\"c-breadcrumb__link\"\n @click=\"handleSelect(item.key)\"\n >\n <C_Icon\n v-if=\"showIcon\"\n :name=\"item.icon\"\n />\n {{ item.label }}\n </span>\n </NBreadcrumbItem>\n </NBreadcrumb>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed } from 'vue'\n import { useRoute } from 'vue-router'\n import { C_Icon } from '../C_Icon'\n import type { BreadcrumbItem } from '../_shared'\n\n defineOptions({ name: 'C_Breadcrumb' })\n\n const props = withDefaults(\n defineProps<{\n /**\n * 手动传入面包屑数据\n * 不传时自动从 `route.matched` 生成(零配置)\n */\n items?: BreadcrumbItem[]\n /** 是否显示图标 */\n showIcon?: boolean\n /**\n * 标签文本格式化函数(用于 i18n)\n * 仅在自动模式下生效\n */\n labelFormatter?: (label: string) => string\n }>(),\n {\n showIcon: true,\n }\n )\n\n const emit = defineEmits<{\n /** 面包屑项被选中(返回路径 key) */\n select: [path: string]\n }>()\n\n const route = useRoute()\n\n const formatLabel = (title: string): string =>\n props.labelFormatter ? props.labelFormatter(title) : title\n\n /** 从 route.matched 自动生成面包屑 */\n const autoBreadcrumb = computed<BreadcrumbItem[]>(() => {\n return route.matched\n .filter((record: any) => record.meta?.title)\n .map((record: any) => ({\n key: record.path,\n label: formatLabel((record.meta.title || '') as string),\n icon: record.meta.icon as string | undefined,\n children: record.children?.length\n ? record.children.map((child: any) => ({\n key: child.path,\n label: formatLabel((child.meta?.title || '') as string),\n ...(child.children?.length && {\n children: child.children.map((grandChild: any) => ({\n key: grandChild.path,\n label: formatLabel((grandChild.meta?.title || '') as string),\n })),\n }),\n }))\n : [],\n }))\n })\n\n const breadcrumbItems = computed<BreadcrumbItem[]>(\n () => props.items ?? autoBreadcrumb.value\n )\n\n const handleSelect = (key: string) => {\n emit('select', key)\n }\n</script>\n\n<style lang=\"scss\">\n .c-breadcrumb {\n &__trigger,\n &__link {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n }\n }\n</style>\n","<!--\n * @Description: 通用面包屑组件 — 基于 NBreadcrumb 的路由面包屑导航\n *\n * 支持两种模式:\n * 1. 自动模式(默认)— 从 `route.matched` 自动生成面包屑\n * 2. 手动模式 — 传入 `items` 完全自定义\n *\n * @example 自动模式(零配置)\n * ```vue\n * <C_Breadcrumb\n * :label-formatter=\"$t\"\n * @select=\"router.push\"\n * />\n * ```\n *\n * @example 手动模式\n * ```vue\n * <C_Breadcrumb\n * :items=\"customBreadcrumbs\"\n * @select=\"handleSelect\"\n * />\n * ```\n *\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-breadcrumb flex-1 min-w-0\">\n <NBreadcrumb>\n <NBreadcrumbItem\n v-for=\"(item, index) in breadcrumbItems\"\n :key=\"index\"\n >\n <NDropdown\n v-if=\"item.children?.length\"\n :options=\"item.children\"\n @select=\"handleSelect\"\n >\n <div class=\"c-breadcrumb__trigger\">\n <C_Icon\n v-if=\"showIcon\"\n :name=\"item.icon\"\n />\n {{ item.label }}\n </div>\n </NDropdown>\n <span\n v-else\n class=\"c-breadcrumb__link\"\n @click=\"handleSelect(item.key)\"\n >\n <C_Icon\n v-if=\"showIcon\"\n :name=\"item.icon\"\n />\n {{ item.label }}\n </span>\n </NBreadcrumbItem>\n </NBreadcrumb>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed } from 'vue'\n import { useRoute } from 'vue-router'\n import { C_Icon } from '../C_Icon'\n import type { BreadcrumbItem } from '../_shared'\n\n defineOptions({ name: 'C_Breadcrumb' })\n\n const props = withDefaults(\n defineProps<{\n /**\n * 手动传入面包屑数据\n * 不传时自动从 `route.matched` 生成(零配置)\n */\n items?: BreadcrumbItem[]\n /** 是否显示图标 */\n showIcon?: boolean\n /**\n * 标签文本格式化函数(用于 i18n)\n * 仅在自动模式下生效\n */\n labelFormatter?: (label: string) => string\n }>(),\n {\n showIcon: true,\n }\n )\n\n const emit = defineEmits<{\n /** 面包屑项被选中(返回路径 key) */\n select: [path: string]\n }>()\n\n const route = useRoute()\n\n const formatLabel = (title: string): string =>\n props.labelFormatter ? props.labelFormatter(title) : title\n\n /** 从 route.matched 自动生成面包屑 */\n const autoBreadcrumb = computed<BreadcrumbItem[]>(() => {\n return route.matched\n .filter((record: any) => record.meta?.title)\n .map((record: any) => ({\n key: record.path,\n label: formatLabel((record.meta.title || '') as string),\n icon: record.meta.icon as string | undefined,\n children: record.children?.length\n ? record.children.map((child: any) => ({\n key: child.path,\n label: formatLabel((child.meta?.title || '') as string),\n ...(child.children?.length && {\n children: child.children.map((grandChild: any) => ({\n key: grandChild.path,\n label: formatLabel((grandChild.meta?.title || '') as string),\n })),\n }),\n }))\n : [],\n }))\n })\n\n const breadcrumbItems = computed<BreadcrumbItem[]>(\n () => props.items ?? autoBreadcrumb.value\n )\n\n const handleSelect = (key: string) => {\n emit('select', key)\n }\n</script>\n\n<style lang=\"scss\">\n .c-breadcrumb {\n &__trigger,\n &__link {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n }\n }\n</style>\n"],"mappings":"+XEqEE,IAAM,EAAQ,EAoBR,EAAO,EAKP,GAAA,EAAA,EAAA,WAAiB,CAEjB,EAAe,GACnB,EAAM,eAAiB,EAAM,eAAe,EAAM,CAAG,EAGjD,GAAA,EAAA,EAAA,cACG,EAAM,QACV,OAAQ,GAAgB,EAAO,MAAM,MAAK,CAC1C,IAAK,IAAiB,CACrB,IAAK,EAAO,KACZ,MAAO,EAAa,EAAO,KAAK,OAAS,GAAc,CACvD,KAAM,EAAO,KAAK,KAClB,SAAU,EAAO,UAAU,OACvB,EAAO,SAAS,IAAK,IAAgB,CACnC,IAAK,EAAM,KACX,MAAO,EAAa,EAAM,MAAM,OAAS,GAAc,CACvD,GAAI,EAAM,UAAU,QAAU,CAC5B,SAAU,EAAM,SAAS,IAAK,IAAqB,CACjD,IAAK,EAAW,KAChB,MAAO,EAAa,EAAW,MAAM,OAAS,GAAc,CAC7D,EAAE,CACJ,CACF,EAAC,CACF,EAAE,CACP,EAAC,CACL,CAEK,GAAA,EAAA,EAAA,cACE,EAAM,OAAS,EAAe,MACtC,CAEM,EAAgB,GAAgB,CACpC,EAAK,SAAU,EAAG,uHArEd,MAhCN,EAgCM,EAAA,EAAA,EAAA,aADU,EAAA,KAAA,2BA5B8B,GAAA,EAAA,EAAA,WAAA,GAAA,EAAA,EAAA,EAAA,oBA2BxB,EAAA,SAAA,MAAA,EAAA,EAAA,YA3BQ,EAAA,OAAhB,EAAM,yCA2BE,EAAA,CA1Bf,IAAK,EAAK,CAAA,2BAiBb,CAdU,EAAK,UAAU,SAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,aAWX,EAAA,OAVT,QAAS,EAAK,SACd,SAAQ,8BAQH,EAAA,EAAA,EAAA,oBAAA,MANN,EAMM,CAJIA,EAAAA,WAAAA,EAAAA,EAAAA,YAAAA,EAAAA,EAAAA,EAAAA,cAAAA,EAAAA,EAAAA,OAEN,EAAA,EAAA,CAAA,OADC,KAAM,EAAK,kFACZ,KAAA,EAAA,EAAA,iBACC,EAAK,MAAK,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,qEAaV,OAAA,OARL,MAAM,qBACL,QAAK,GAAE,EAAa,EAAK,IAAG,GAGrBA,EAAAA,WAAAA,EAAAA,EAAAA,YAAAA,EAAAA,EAAAA,EAAAA,cAAAA,EAAAA,EAAAA,OAEN,EAAA,EAAA,CAAA,OADC,KAAM,EAAK,kFACZ,KAAA,EAAA,EAAA,iBACC,EAAK,MAAK,CAAA,EAAA,CAAA,CAAA,EAAA,EAAA,EAAA,CAAA"}
|
package/dist/C_Breadcrumb2.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{t as e}from"./C_Icon2.js";import{NBreadcrumb as t,NBreadcrumbItem as n,NDropdown as r}from"naive-ui";import{Fragment as i,computed as a,createBlock as o,createCommentVNode as s,createElementBlock as c,createElementVNode as l,createTextVNode as u,createVNode as d,defineComponent as f,openBlock as p,renderList as m,toDisplayString as h,unref as g,withCtx as _}from"vue";import{useRoute as v}from"vue-router";const y={class:`c-breadcrumb flex-1 min-w-0`},b={class:`
|
|
1
|
+
import{t as e}from"./C_Icon2.js";import{NBreadcrumb as t,NBreadcrumbItem as n,NDropdown as r}from"naive-ui";import{Fragment as i,computed as a,createBlock as o,createCommentVNode as s,createElementBlock as c,createElementVNode as l,createTextVNode as u,createVNode as d,defineComponent as f,openBlock as p,renderList as m,toDisplayString as h,unref as g,withCtx as _}from"vue";import{useRoute as v}from"vue-router";const y={class:`c-breadcrumb flex-1 min-w-0`},b={class:`c-breadcrumb__trigger`},x=[`onClick`];var S=f({name:`C_Breadcrumb`,__name:`index`,props:{items:{},showIcon:{type:Boolean,default:!0},labelFormatter:{}},emits:[`select`],setup(f,{emit:S}){let C=f,w=S,T=v(),E=e=>C.labelFormatter?C.labelFormatter(e):e,D=a(()=>T.matched.filter(e=>e.meta?.title).map(e=>({key:e.path,label:E(e.meta.title||``),icon:e.meta.icon,children:e.children?.length?e.children.map(e=>({key:e.path,label:E(e.meta?.title||``),...e.children?.length&&{children:e.children.map(e=>({key:e.path,label:E(e.meta?.title||``)}))}})):[]}))),O=a(()=>C.items??D.value),k=e=>{w(`select`,e)};return(a,f)=>{let v=r,S=n,C=t;return p(),c(`div`,y,[d(C,null,{default:_(()=>[(p(!0),c(i,null,m(O.value,(t,n)=>(p(),o(S,{key:n},{default:_(()=>[t.children?.length?(p(),o(v,{key:0,options:t.children,onSelect:k},{default:_(()=>[l(`div`,b,[a.showIcon?(p(),o(g(e),{key:0,name:t.icon},null,8,[`name`])):s(`v-if`,!0),u(` `+h(t.label),1)])]),_:2},1032,[`options`])):(p(),c(`span`,{key:1,class:`c-breadcrumb__link`,onClick:e=>k(t.key)},[a.showIcon?(p(),o(g(e),{key:0,name:t.icon},null,8,[`name`])):s(`v-if`,!0),u(` `+h(t.label),1)],8,x))]),_:2},1024))),128))]),_:1})])}}});export{S as t};
|
|
2
2
|
//# sourceMappingURL=C_Breadcrumb2.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"C_Breadcrumb2.js","names":["showIcon"],"sources":["../src/components/C_Breadcrumb/index.vue","../src/components/C_Breadcrumb/index.vue","../src/components/C_Breadcrumb/index.vue"],"sourcesContent":["/* unplugin-vue-components disabled */<!--\r\n * @Description: 通用面包屑组件 — 基于 NBreadcrumb 的路由面包屑导航\r\n *\r\n * 支持两种模式:\r\n * 1. 自动模式(默认)— 从 `route.matched` 自动生成面包屑\r\n * 2. 手动模式 — 传入 `items` 完全自定义\r\n *\r\n * @example 自动模式(零配置)\r\n * ```vue\r\n * <C_Breadcrumb\r\n * :label-formatter=\"$t\"\r\n * @select=\"router.push\"\r\n * />\r\n * ```\r\n *\r\n * @example 手动模式\r\n * ```vue\r\n * <C_Breadcrumb\r\n * :items=\"customBreadcrumbs\"\r\n * @select=\"handleSelect\"\r\n * />\r\n * ```\r\n *\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n <div class=\"c-breadcrumb flex-1 min-w-0\">\r\n <NBreadcrumb>\r\n <NBreadcrumbItem\r\n v-for=\"(item, index) in breadcrumbItems\"\r\n :key=\"index\"\r\n >\r\n <NDropdown\r\n v-if=\"item.children?.length\"\r\n :options=\"item.children\"\r\n @select=\"handleSelect\"\r\n >\r\n <div class=\"trigger\">\r\n <C_Icon\r\n v-if=\"showIcon\"\r\n :name=\"item.icon\"\r\n class=\"vertical-top\"\r\n />\r\n {{ item.label }}\r\n </div>\r\n </NDropdown>\r\n <span\r\n v-else\r\n class=\"c-breadcrumb-link\"\r\n @click=\"handleSelect(item.key)\"\r\n >\r\n <C_Icon\r\n v-if=\"showIcon\"\r\n :name=\"item.icon\"\r\n class=\"vertical-top mr-1\"\r\n />\r\n {{ item.label }}\r\n </span>\r\n </NBreadcrumbItem>\r\n </NBreadcrumb>\r\n </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\n import { computed } from 'vue'\r\n import { useRoute } from 'vue-router'\r\n import { C_Icon } from '../C_Icon'\r\n import type { BreadcrumbItem } from '../_shared'\r\n\r\n defineOptions({ name: 'C_Breadcrumb' })\r\n\r\n const props = withDefaults(\r\n defineProps<{\r\n /**\r\n * 手动传入面包屑数据\r\n * 不传时自动从 `route.matched` 生成(零配置)\r\n */\r\n items?: BreadcrumbItem[]\r\n /** 是否显示图标 */\r\n showIcon?: boolean\r\n /**\r\n * 标签文本格式化函数(用于 i18n)\r\n * 仅在自动模式下生效\r\n */\r\n labelFormatter?: (label: string) => string\r\n }>(),\r\n {\r\n showIcon: true,\r\n }\r\n )\r\n\r\n const emit = defineEmits<{\r\n /** 面包屑项被选中(返回路径 key) */\r\n select: [path: string]\r\n }>()\r\n\r\n const route = useRoute()\r\n\r\n const formatLabel = (title: string): string =>\r\n props.labelFormatter ? props.labelFormatter(title) : title\r\n\r\n /** 从 route.matched 自动生成面包屑 */\r\n const autoBreadcrumb = computed<BreadcrumbItem[]>(() => {\r\n return route.matched\r\n .filter((record: any) => record.meta?.title)\r\n .map((record: any) => ({\r\n key: record.path,\r\n label: formatLabel((record.meta.title || '') as string),\r\n icon: record.meta.icon as string | undefined,\r\n children: record.children?.length\r\n ? record.children.map((child: any) => ({\r\n key: child.path,\r\n label: formatLabel((child.meta?.title || '') as string),\r\n ...(child.children?.length && {\r\n children: child.children.map((grandChild: any) => ({\r\n key: grandChild.path,\r\n label: formatLabel((grandChild.meta?.title || '') as string),\r\n })),\r\n }),\r\n }))\r\n : [],\r\n }))\r\n })\r\n\r\n const breadcrumbItems = computed<BreadcrumbItem[]>(\r\n () => props.items ?? autoBreadcrumb.value\r\n )\r\n\r\n const handleSelect = (key: string) => {\r\n emit('select', key)\r\n }\r\n</script>\r\n","/* unplugin-vue-components disabled */<!--\r\n * @Description: 通用面包屑组件 — 基于 NBreadcrumb 的路由面包屑导航\r\n *\r\n * 支持两种模式:\r\n * 1. 自动模式(默认)— 从 `route.matched` 自动生成面包屑\r\n * 2. 手动模式 — 传入 `items` 完全自定义\r\n *\r\n * @example 自动模式(零配置)\r\n * ```vue\r\n * <C_Breadcrumb\r\n * :label-formatter=\"$t\"\r\n * @select=\"router.push\"\r\n * />\r\n * ```\r\n *\r\n * @example 手动模式\r\n * ```vue\r\n * <C_Breadcrumb\r\n * :items=\"customBreadcrumbs\"\r\n * @select=\"handleSelect\"\r\n * />\r\n * ```\r\n *\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n <div class=\"c-breadcrumb flex-1 min-w-0\">\r\n <NBreadcrumb>\r\n <NBreadcrumbItem\r\n v-for=\"(item, index) in breadcrumbItems\"\r\n :key=\"index\"\r\n >\r\n <NDropdown\r\n v-if=\"item.children?.length\"\r\n :options=\"item.children\"\r\n @select=\"handleSelect\"\r\n >\r\n <div class=\"trigger\">\r\n <C_Icon\r\n v-if=\"showIcon\"\r\n :name=\"item.icon\"\r\n class=\"vertical-top\"\r\n />\r\n {{ item.label }}\r\n </div>\r\n </NDropdown>\r\n <span\r\n v-else\r\n class=\"c-breadcrumb-link\"\r\n @click=\"handleSelect(item.key)\"\r\n >\r\n <C_Icon\r\n v-if=\"showIcon\"\r\n :name=\"item.icon\"\r\n class=\"vertical-top mr-1\"\r\n />\r\n {{ item.label }}\r\n </span>\r\n </NBreadcrumbItem>\r\n </NBreadcrumb>\r\n </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\n import { computed } from 'vue'\r\n import { useRoute } from 'vue-router'\r\n import { C_Icon } from '../C_Icon'\r\n import type { BreadcrumbItem } from '../_shared'\r\n\r\n defineOptions({ name: 'C_Breadcrumb' })\r\n\r\n const props = withDefaults(\r\n defineProps<{\r\n /**\r\n * 手动传入面包屑数据\r\n * 不传时自动从 `route.matched` 生成(零配置)\r\n */\r\n items?: BreadcrumbItem[]\r\n /** 是否显示图标 */\r\n showIcon?: boolean\r\n /**\r\n * 标签文本格式化函数(用于 i18n)\r\n * 仅在自动模式下生效\r\n */\r\n labelFormatter?: (label: string) => string\r\n }>(),\r\n {\r\n showIcon: true,\r\n }\r\n )\r\n\r\n const emit = defineEmits<{\r\n /** 面包屑项被选中(返回路径 key) */\r\n select: [path: string]\r\n }>()\r\n\r\n const route = useRoute()\r\n\r\n const formatLabel = (title: string): string =>\r\n props.labelFormatter ? props.labelFormatter(title) : title\r\n\r\n /** 从 route.matched 自动生成面包屑 */\r\n const autoBreadcrumb = computed<BreadcrumbItem[]>(() => {\r\n return route.matched\r\n .filter((record: any) => record.meta?.title)\r\n .map((record: any) => ({\r\n key: record.path,\r\n label: formatLabel((record.meta.title || '') as string),\r\n icon: record.meta.icon as string | undefined,\r\n children: record.children?.length\r\n ? record.children.map((child: any) => ({\r\n key: child.path,\r\n label: formatLabel((child.meta?.title || '') as string),\r\n ...(child.children?.length && {\r\n children: child.children.map((grandChild: any) => ({\r\n key: grandChild.path,\r\n label: formatLabel((grandChild.meta?.title || '') as string),\r\n })),\r\n }),\r\n }))\r\n : [],\r\n }))\r\n })\r\n\r\n const breadcrumbItems = computed<BreadcrumbItem[]>(\r\n () => props.items ?? autoBreadcrumb.value\r\n )\r\n\r\n const handleSelect = (key: string) => {\r\n emit('select', key)\r\n }\r\n</script>\r\n","<!--\r\n * @Description: 通用面包屑组件 — 基于 NBreadcrumb 的路由面包屑导航\r\n *\r\n * 支持两种模式:\r\n * 1. 自动模式(默认)— 从 `route.matched` 自动生成面包屑\r\n * 2. 手动模式 — 传入 `items` 完全自定义\r\n *\r\n * @example 自动模式(零配置)\r\n * ```vue\r\n * <C_Breadcrumb\r\n * :label-formatter=\"$t\"\r\n * @select=\"router.push\"\r\n * />\r\n * ```\r\n *\r\n * @example 手动模式\r\n * ```vue\r\n * <C_Breadcrumb\r\n * :items=\"customBreadcrumbs\"\r\n * @select=\"handleSelect\"\r\n * />\r\n * ```\r\n *\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n <div class=\"c-breadcrumb flex-1 min-w-0\">\r\n <NBreadcrumb>\r\n <NBreadcrumbItem\r\n v-for=\"(item, index) in breadcrumbItems\"\r\n :key=\"index\"\r\n >\r\n <NDropdown\r\n v-if=\"item.children?.length\"\r\n :options=\"item.children\"\r\n @select=\"handleSelect\"\r\n >\r\n <div class=\"trigger\">\r\n <C_Icon\r\n v-if=\"showIcon\"\r\n :name=\"item.icon\"\r\n class=\"vertical-top\"\r\n />\r\n {{ item.label }}\r\n </div>\r\n </NDropdown>\r\n <span\r\n v-else\r\n class=\"c-breadcrumb-link\"\r\n @click=\"handleSelect(item.key)\"\r\n >\r\n <C_Icon\r\n v-if=\"showIcon\"\r\n :name=\"item.icon\"\r\n class=\"vertical-top mr-1\"\r\n />\r\n {{ item.label }}\r\n </span>\r\n </NBreadcrumbItem>\r\n </NBreadcrumb>\r\n </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\n import { computed } from 'vue'\r\n import { useRoute } from 'vue-router'\r\n import { C_Icon } from '../C_Icon'\r\n import type { BreadcrumbItem } from '../_shared'\r\n\r\n defineOptions({ name: 'C_Breadcrumb' })\r\n\r\n const props = withDefaults(\r\n defineProps<{\r\n /**\r\n * 手动传入面包屑数据\r\n * 不传时自动从 `route.matched` 生成(零配置)\r\n */\r\n items?: BreadcrumbItem[]\r\n /** 是否显示图标 */\r\n showIcon?: boolean\r\n /**\r\n * 标签文本格式化函数(用于 i18n)\r\n * 仅在自动模式下生效\r\n */\r\n labelFormatter?: (label: string) => string\r\n }>(),\r\n {\r\n showIcon: true,\r\n }\r\n )\r\n\r\n const emit = defineEmits<{\r\n /** 面包屑项被选中(返回路径 key) */\r\n select: [path: string]\r\n }>()\r\n\r\n const route = useRoute()\r\n\r\n const formatLabel = (title: string): string =>\r\n props.labelFormatter ? props.labelFormatter(title) : title\r\n\r\n /** 从 route.matched 自动生成面包屑 */\r\n const autoBreadcrumb = computed<BreadcrumbItem[]>(() => {\r\n return route.matched\r\n .filter((record: any) => record.meta?.title)\r\n .map((record: any) => ({\r\n key: record.path,\r\n label: formatLabel((record.meta.title || '') as string),\r\n icon: record.meta.icon as string | undefined,\r\n children: record.children?.length\r\n ? record.children.map((child: any) => ({\r\n key: child.path,\r\n label: formatLabel((child.meta?.title || '') as string),\r\n ...(child.children?.length && {\r\n children: child.children.map((grandChild: any) => ({\r\n key: grandChild.path,\r\n label: formatLabel((grandChild.meta?.title || '') as string),\r\n })),\r\n }),\r\n }))\r\n : [],\r\n }))\r\n })\r\n\r\n const breadcrumbItems = computed<BreadcrumbItem[]>(\r\n () => props.items ?? autoBreadcrumb.value\r\n )\r\n\r\n const handleSelect = (key: string) => {\r\n emit('select', key)\r\n }\r\n</script>\r\n"],"mappings":"ooBEuEE,IAAM,EAAQ,EAoBR,EAAO,EAKP,EAAQ,GAAU,CAElB,EAAe,GACnB,EAAM,eAAiB,EAAM,eAAe,EAAM,CAAG,EAGjD,EAAiB,MACd,EAAM,QACV,OAAQ,GAAgB,EAAO,MAAM,MAAM,CAC3C,IAAK,IAAiB,CACrB,IAAK,EAAO,KACZ,MAAO,EAAa,EAAO,KAAK,OAAS,GAAc,CACvD,KAAM,EAAO,KAAK,KAClB,SAAU,EAAO,UAAU,OACvB,EAAO,SAAS,IAAK,IAAgB,CACnC,IAAK,EAAM,KACX,MAAO,EAAa,EAAM,MAAM,OAAS,GAAc,CACvD,GAAI,EAAM,UAAU,QAAU,CAC5B,SAAU,EAAM,SAAS,IAAK,IAAqB,CACjD,IAAK,EAAW,KAChB,MAAO,EAAa,EAAW,MAAM,OAAS,GAAc,CAC7D,EAAE,CACJ,CACF,EAAE,CACH,EAAE,CACP,EAAE,CACL,CAEI,EAAkB,MAChB,EAAM,OAAS,EAAe,MACrC,CAEK,EAAgB,GAAgB,CACpC,EAAK,SAAU,EAAI,2CAvGrB,EAkCM,MAlCN,EAkCM,CAjCJ,EAgCc,EAAA,KAAA,eA9B8B,EAAA,EAAA,GAAA,CAD1C,EA8BkB,EAAA,KAAA,EA7BQ,EAAA,OAAhB,EAAM,SADhB,EA8BkB,EAAA,CA5Bf,IAAK,EAAK,CAAA,eAkBhB,CAfa,EAAK,UAAU,QAAA,GAAA,CADvB,EAaY,EAAA,OAXT,QAAS,EAAK,SACd,SAAQ,kBASH,CAPN,EAOM,MAPN,EAOM,CALIA,EAAAA,UAAAA,GAAAA,CADR,EAIE,EAAA,EAAA,CAAA,OAFC,KAAM,EAAK,KACZ,MAAM,iDACN,IACF,EAAG,EAAK,MAAK,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,8BAGjB,EAWO,OAAA,OATL,MAAM,oBACL,QAAK,GAAE,EAAa,EAAK,IAAG,GAGrBA,EAAAA,UAAAA,GAAAA,CADR,EAIE,EAAA,EAAA,CAAA,OAFC,KAAM,EAAK,KACZ,MAAM,sDACN,IACF,EAAG,EAAK,MAAK,CAAA,EAAA,CAAA,CAAA,EAAA,EAAA,EAAA,CAAA"}
|
|
1
|
+
{"version":3,"file":"C_Breadcrumb2.js","names":["showIcon"],"sources":["../src/components/C_Breadcrumb/index.vue","../src/components/C_Breadcrumb/index.vue","../src/components/C_Breadcrumb/index.vue"],"sourcesContent":["/* unplugin-vue-components disabled */<!--\n * @Description: 通用面包屑组件 — 基于 NBreadcrumb 的路由面包屑导航\n *\n * 支持两种模式:\n * 1. 自动模式(默认)— 从 `route.matched` 自动生成面包屑\n * 2. 手动模式 — 传入 `items` 完全自定义\n *\n * @example 自动模式(零配置)\n * ```vue\n * <C_Breadcrumb\n * :label-formatter=\"$t\"\n * @select=\"router.push\"\n * />\n * ```\n *\n * @example 手动模式\n * ```vue\n * <C_Breadcrumb\n * :items=\"customBreadcrumbs\"\n * @select=\"handleSelect\"\n * />\n * ```\n *\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-breadcrumb flex-1 min-w-0\">\n <NBreadcrumb>\n <NBreadcrumbItem\n v-for=\"(item, index) in breadcrumbItems\"\n :key=\"index\"\n >\n <NDropdown\n v-if=\"item.children?.length\"\n :options=\"item.children\"\n @select=\"handleSelect\"\n >\n <div class=\"c-breadcrumb__trigger\">\n <C_Icon\n v-if=\"showIcon\"\n :name=\"item.icon\"\n />\n {{ item.label }}\n </div>\n </NDropdown>\n <span\n v-else\n class=\"c-breadcrumb__link\"\n @click=\"handleSelect(item.key)\"\n >\n <C_Icon\n v-if=\"showIcon\"\n :name=\"item.icon\"\n />\n {{ item.label }}\n </span>\n </NBreadcrumbItem>\n </NBreadcrumb>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed } from 'vue'\n import { useRoute } from 'vue-router'\n import { C_Icon } from '../C_Icon'\n import type { BreadcrumbItem } from '../_shared'\n\n defineOptions({ name: 'C_Breadcrumb' })\n\n const props = withDefaults(\n defineProps<{\n /**\n * 手动传入面包屑数据\n * 不传时自动从 `route.matched` 生成(零配置)\n */\n items?: BreadcrumbItem[]\n /** 是否显示图标 */\n showIcon?: boolean\n /**\n * 标签文本格式化函数(用于 i18n)\n * 仅在自动模式下生效\n */\n labelFormatter?: (label: string) => string\n }>(),\n {\n showIcon: true,\n }\n )\n\n const emit = defineEmits<{\n /** 面包屑项被选中(返回路径 key) */\n select: [path: string]\n }>()\n\n const route = useRoute()\n\n const formatLabel = (title: string): string =>\n props.labelFormatter ? props.labelFormatter(title) : title\n\n /** 从 route.matched 自动生成面包屑 */\n const autoBreadcrumb = computed<BreadcrumbItem[]>(() => {\n return route.matched\n .filter((record: any) => record.meta?.title)\n .map((record: any) => ({\n key: record.path,\n label: formatLabel((record.meta.title || '') as string),\n icon: record.meta.icon as string | undefined,\n children: record.children?.length\n ? record.children.map((child: any) => ({\n key: child.path,\n label: formatLabel((child.meta?.title || '') as string),\n ...(child.children?.length && {\n children: child.children.map((grandChild: any) => ({\n key: grandChild.path,\n label: formatLabel((grandChild.meta?.title || '') as string),\n })),\n }),\n }))\n : [],\n }))\n })\n\n const breadcrumbItems = computed<BreadcrumbItem[]>(\n () => props.items ?? autoBreadcrumb.value\n )\n\n const handleSelect = (key: string) => {\n emit('select', key)\n }\n</script>\n\n<style lang=\"scss\">\n .c-breadcrumb {\n &__trigger,\n &__link {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n }\n }\n</style>\n","/* unplugin-vue-components disabled */<!--\n * @Description: 通用面包屑组件 — 基于 NBreadcrumb 的路由面包屑导航\n *\n * 支持两种模式:\n * 1. 自动模式(默认)— 从 `route.matched` 自动生成面包屑\n * 2. 手动模式 — 传入 `items` 完全自定义\n *\n * @example 自动模式(零配置)\n * ```vue\n * <C_Breadcrumb\n * :label-formatter=\"$t\"\n * @select=\"router.push\"\n * />\n * ```\n *\n * @example 手动模式\n * ```vue\n * <C_Breadcrumb\n * :items=\"customBreadcrumbs\"\n * @select=\"handleSelect\"\n * />\n * ```\n *\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-breadcrumb flex-1 min-w-0\">\n <NBreadcrumb>\n <NBreadcrumbItem\n v-for=\"(item, index) in breadcrumbItems\"\n :key=\"index\"\n >\n <NDropdown\n v-if=\"item.children?.length\"\n :options=\"item.children\"\n @select=\"handleSelect\"\n >\n <div class=\"c-breadcrumb__trigger\">\n <C_Icon\n v-if=\"showIcon\"\n :name=\"item.icon\"\n />\n {{ item.label }}\n </div>\n </NDropdown>\n <span\n v-else\n class=\"c-breadcrumb__link\"\n @click=\"handleSelect(item.key)\"\n >\n <C_Icon\n v-if=\"showIcon\"\n :name=\"item.icon\"\n />\n {{ item.label }}\n </span>\n </NBreadcrumbItem>\n </NBreadcrumb>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed } from 'vue'\n import { useRoute } from 'vue-router'\n import { C_Icon } from '../C_Icon'\n import type { BreadcrumbItem } from '../_shared'\n\n defineOptions({ name: 'C_Breadcrumb' })\n\n const props = withDefaults(\n defineProps<{\n /**\n * 手动传入面包屑数据\n * 不传时自动从 `route.matched` 生成(零配置)\n */\n items?: BreadcrumbItem[]\n /** 是否显示图标 */\n showIcon?: boolean\n /**\n * 标签文本格式化函数(用于 i18n)\n * 仅在自动模式下生效\n */\n labelFormatter?: (label: string) => string\n }>(),\n {\n showIcon: true,\n }\n )\n\n const emit = defineEmits<{\n /** 面包屑项被选中(返回路径 key) */\n select: [path: string]\n }>()\n\n const route = useRoute()\n\n const formatLabel = (title: string): string =>\n props.labelFormatter ? props.labelFormatter(title) : title\n\n /** 从 route.matched 自动生成面包屑 */\n const autoBreadcrumb = computed<BreadcrumbItem[]>(() => {\n return route.matched\n .filter((record: any) => record.meta?.title)\n .map((record: any) => ({\n key: record.path,\n label: formatLabel((record.meta.title || '') as string),\n icon: record.meta.icon as string | undefined,\n children: record.children?.length\n ? record.children.map((child: any) => ({\n key: child.path,\n label: formatLabel((child.meta?.title || '') as string),\n ...(child.children?.length && {\n children: child.children.map((grandChild: any) => ({\n key: grandChild.path,\n label: formatLabel((grandChild.meta?.title || '') as string),\n })),\n }),\n }))\n : [],\n }))\n })\n\n const breadcrumbItems = computed<BreadcrumbItem[]>(\n () => props.items ?? autoBreadcrumb.value\n )\n\n const handleSelect = (key: string) => {\n emit('select', key)\n }\n</script>\n\n<style lang=\"scss\">\n .c-breadcrumb {\n &__trigger,\n &__link {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n }\n }\n</style>\n","<!--\n * @Description: 通用面包屑组件 — 基于 NBreadcrumb 的路由面包屑导航\n *\n * 支持两种模式:\n * 1. 自动模式(默认)— 从 `route.matched` 自动生成面包屑\n * 2. 手动模式 — 传入 `items` 完全自定义\n *\n * @example 自动模式(零配置)\n * ```vue\n * <C_Breadcrumb\n * :label-formatter=\"$t\"\n * @select=\"router.push\"\n * />\n * ```\n *\n * @example 手动模式\n * ```vue\n * <C_Breadcrumb\n * :items=\"customBreadcrumbs\"\n * @select=\"handleSelect\"\n * />\n * ```\n *\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-breadcrumb flex-1 min-w-0\">\n <NBreadcrumb>\n <NBreadcrumbItem\n v-for=\"(item, index) in breadcrumbItems\"\n :key=\"index\"\n >\n <NDropdown\n v-if=\"item.children?.length\"\n :options=\"item.children\"\n @select=\"handleSelect\"\n >\n <div class=\"c-breadcrumb__trigger\">\n <C_Icon\n v-if=\"showIcon\"\n :name=\"item.icon\"\n />\n {{ item.label }}\n </div>\n </NDropdown>\n <span\n v-else\n class=\"c-breadcrumb__link\"\n @click=\"handleSelect(item.key)\"\n >\n <C_Icon\n v-if=\"showIcon\"\n :name=\"item.icon\"\n />\n {{ item.label }}\n </span>\n </NBreadcrumbItem>\n </NBreadcrumb>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed } from 'vue'\n import { useRoute } from 'vue-router'\n import { C_Icon } from '../C_Icon'\n import type { BreadcrumbItem } from '../_shared'\n\n defineOptions({ name: 'C_Breadcrumb' })\n\n const props = withDefaults(\n defineProps<{\n /**\n * 手动传入面包屑数据\n * 不传时自动从 `route.matched` 生成(零配置)\n */\n items?: BreadcrumbItem[]\n /** 是否显示图标 */\n showIcon?: boolean\n /**\n * 标签文本格式化函数(用于 i18n)\n * 仅在自动模式下生效\n */\n labelFormatter?: (label: string) => string\n }>(),\n {\n showIcon: true,\n }\n )\n\n const emit = defineEmits<{\n /** 面包屑项被选中(返回路径 key) */\n select: [path: string]\n }>()\n\n const route = useRoute()\n\n const formatLabel = (title: string): string =>\n props.labelFormatter ? props.labelFormatter(title) : title\n\n /** 从 route.matched 自动生成面包屑 */\n const autoBreadcrumb = computed<BreadcrumbItem[]>(() => {\n return route.matched\n .filter((record: any) => record.meta?.title)\n .map((record: any) => ({\n key: record.path,\n label: formatLabel((record.meta.title || '') as string),\n icon: record.meta.icon as string | undefined,\n children: record.children?.length\n ? record.children.map((child: any) => ({\n key: child.path,\n label: formatLabel((child.meta?.title || '') as string),\n ...(child.children?.length && {\n children: child.children.map((grandChild: any) => ({\n key: grandChild.path,\n label: formatLabel((grandChild.meta?.title || '') as string),\n })),\n }),\n }))\n : [],\n }))\n })\n\n const breadcrumbItems = computed<BreadcrumbItem[]>(\n () => props.items ?? autoBreadcrumb.value\n )\n\n const handleSelect = (key: string) => {\n emit('select', key)\n }\n</script>\n\n<style lang=\"scss\">\n .c-breadcrumb {\n &__trigger,\n &__link {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n }\n }\n</style>\n"],"mappings":"kpBEqEE,IAAM,EAAQ,EAoBR,EAAO,EAKP,EAAQ,GAAS,CAEjB,EAAe,GACnB,EAAM,eAAiB,EAAM,eAAe,EAAM,CAAG,EAGjD,EAAiB,MACd,EAAM,QACV,OAAQ,GAAgB,EAAO,MAAM,MAAK,CAC1C,IAAK,IAAiB,CACrB,IAAK,EAAO,KACZ,MAAO,EAAa,EAAO,KAAK,OAAS,GAAc,CACvD,KAAM,EAAO,KAAK,KAClB,SAAU,EAAO,UAAU,OACvB,EAAO,SAAS,IAAK,IAAgB,CACnC,IAAK,EAAM,KACX,MAAO,EAAa,EAAM,MAAM,OAAS,GAAc,CACvD,GAAI,EAAM,UAAU,QAAU,CAC5B,SAAU,EAAM,SAAS,IAAK,IAAqB,CACjD,IAAK,EAAW,KAChB,MAAO,EAAa,EAAW,MAAM,OAAS,GAAc,CAC7D,EAAE,CACJ,CACF,EAAC,CACF,EAAE,CACP,EAAC,CACL,CAEK,EAAkB,MAChB,EAAM,OAAS,EAAe,MACtC,CAEM,EAAgB,GAAgB,CACpC,EAAK,SAAU,EAAG,2CArGpB,EAgCM,MAhCN,EAgCM,CA/BJ,EA8Bc,EAAA,KAAA,eA5B8B,EAAA,EAAA,GAAA,CAD1C,EA4BkB,EAAA,KAAA,EA3BQ,EAAA,OAAhB,EAAM,SADhB,EA4BkB,EAAA,CA1Bf,IAAK,EAAK,CAAA,eAiBb,CAdU,EAAK,UAAU,QAAA,GAAA,CADvB,EAYY,EAAA,OAVT,QAAS,EAAK,SACd,SAAQ,kBAQH,CANN,EAMM,MANN,EAMM,CAJIA,EAAAA,UAAAA,GAAAA,CADR,EAGE,EAAA,EAAA,CAAA,OADC,KAAM,EAAK,uCACZ,IACF,EAAG,EAAK,MAAK,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,8BAGjB,EAUO,OAAA,OARL,MAAM,qBACL,QAAK,GAAE,EAAa,EAAK,IAAG,GAGrBA,EAAAA,UAAAA,GAAAA,CADR,EAGE,EAAA,EAAA,CAAA,OADC,KAAM,EAAK,uCACZ,IACF,EAAG,EAAK,MAAK,CAAA,EAAA,CAAA,CAAA,EAAA,EAAA,EAAA,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"C_Captcha-
|
|
1
|
+
{"version":3,"file":"C_Captcha-9_hk6VmY.css","names":[],"sources":["../src/components/C_Captcha/index.vue?vue&type=style&index=0&scoped=a4319836&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled */.c-captcha-modern[data-v-a4319836] {\n width: 100%;\n font-family: inherit;\n}\n.captcha-trigger[data-v-a4319836] {\n width: 100%;\n max-width: 280px;\n margin: 0 auto;\n padding: 12px 16px;\n cursor: pointer;\n user-select: none;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.captcha-trigger[data-v-a4319836]:hover:not(.disabled) {\n transform: translateY(-1px);\n}\n.captcha-trigger.disabled[data-v-a4319836] {\n opacity: 0.5;\n cursor: not-allowed;\n}\n.captcha-content[data-v-a4319836] {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n flex: 1;\n}\n.captcha-icon[data-v-a4319836] {\n font-size: 18px;\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n.captcha-text[data-v-a4319836] {\n color: rgba(255, 255, 255, 0.8);\n font-size: 14px;\n font-weight: 500;\n letter-spacing: 0.3px;\n text-align: center;\n white-space: nowrap;\n}\n.refresh-button[data-v-a4319836] {\n position: absolute;\n right: 12px;\n top: 50%;\n transform: translateY(-50%);\n width: 28px;\n height: 28px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.3s ease;\n color: rgba(255, 255, 255, 0.6);\n font-size: 14px;\n flex-shrink: 0;\n}\n.refresh-button[data-v-a4319836]:hover {\n color: rgba(255, 255, 255, 0.9);\n transform: translateY(-50%) rotate(180deg);\n}\n.success-icon[data-v-a4319836],\n.success-text[data-v-a4319836] {\n color: #43c23a;\n}\n.error-icon[data-v-a4319836],\n.error-text[data-v-a4319836] {\n color: #f56c6c;\n}\n@keyframes shake-a4319836 {\n0%, 100% {\n transform: translateX(0);\n}\n25% {\n transform: translateX(-4px);\n}\n75% {\n transform: translateX(4px);\n}\n}\n@media (max-width: 768px) {\n.captcha-trigger[data-v-a4319836] {\n max-width: 240px;\n padding: 10px 14px;\n}\n.captcha-icon[data-v-a4319836] {\n font-size: 16px;\n width: 18px;\n height: 18px;\n}\n.captcha-text[data-v-a4319836] {\n font-size: 13px;\n}\n.refresh-button[data-v-a4319836] {\n width: 24px;\n height: 24px;\n font-size: 12px;\n right: 10px;\n}\n}"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"C_Captcha-
|
|
1
|
+
{"version":3,"file":"C_Captcha-MtASlJ0f.css","names":[],"sources":["../src/components/C_Captcha/index.vue?vue&type=style&index=0&scoped=a4319836&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled */.c-captcha-modern[data-v-a4319836] {\n width: 100%;\n font-family: inherit;\n}\n.captcha-trigger[data-v-a4319836] {\n width: 100%;\n max-width: 280px;\n margin: 0 auto;\n padding: 12px 16px;\n cursor: pointer;\n user-select: none;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.captcha-trigger[data-v-a4319836]:hover:not(.disabled) {\n transform: translateY(-1px);\n}\n.captcha-trigger.disabled[data-v-a4319836] {\n opacity: 0.5;\n cursor: not-allowed;\n}\n.captcha-content[data-v-a4319836] {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n flex: 1;\n}\n.captcha-icon[data-v-a4319836] {\n font-size: 18px;\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n.captcha-text[data-v-a4319836] {\n color: rgba(255, 255, 255, 0.8);\n font-size: 14px;\n font-weight: 500;\n letter-spacing: 0.3px;\n text-align: center;\n white-space: nowrap;\n}\n.refresh-button[data-v-a4319836] {\n position: absolute;\n right: 12px;\n top: 50%;\n transform: translateY(-50%);\n width: 28px;\n height: 28px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.3s ease;\n color: rgba(255, 255, 255, 0.6);\n font-size: 14px;\n flex-shrink: 0;\n}\n.refresh-button[data-v-a4319836]:hover {\n color: rgba(255, 255, 255, 0.9);\n transform: translateY(-50%) rotate(180deg);\n}\n.success-icon[data-v-a4319836],\n.success-text[data-v-a4319836] {\n color: #43c23a;\n}\n.error-icon[data-v-a4319836],\n.error-text[data-v-a4319836] {\n color: #f56c6c;\n}\n@keyframes shake-a4319836 {\n0%, 100% {\n transform: translateX(0);\n}\n25% {\n transform: translateX(-4px);\n}\n75% {\n transform: translateX(4px);\n}\n}\n@media (max-width: 768px) {\n.captcha-trigger[data-v-a4319836] {\n max-width: 240px;\n padding: 10px 14px;\n}\n.captcha-icon[data-v-a4319836] {\n font-size: 16px;\n width: 18px;\n height: 18px;\n}\n.captcha-text[data-v-a4319836] {\n font-size: 13px;\n}\n.refresh-button[data-v-a4319836] {\n width: 24px;\n height: 24px;\n font-size: 12px;\n right: 10px;\n}\n}"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}
|
package/dist/C_Captcha.css
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
/* unplugin-vue-components disabled */.c-captcha-modern[data-v-
|
|
1
|
+
/* unplugin-vue-components disabled */.c-captcha-modern[data-v-a4319836] {
|
|
2
2
|
width: 100%;
|
|
3
3
|
font-family: inherit;
|
|
4
4
|
}
|
|
5
|
-
.captcha-trigger[data-v-
|
|
5
|
+
.captcha-trigger[data-v-a4319836] {
|
|
6
6
|
width: 100%;
|
|
7
7
|
max-width: 280px;
|
|
8
8
|
margin: 0 auto;
|
|
@@ -15,21 +15,21 @@
|
|
|
15
15
|
position: relative;
|
|
16
16
|
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
17
17
|
}
|
|
18
|
-
.captcha-trigger[data-v-
|
|
18
|
+
.captcha-trigger[data-v-a4319836]:hover:not(.disabled) {
|
|
19
19
|
transform: translateY(-1px);
|
|
20
20
|
}
|
|
21
|
-
.captcha-trigger.disabled[data-v-
|
|
21
|
+
.captcha-trigger.disabled[data-v-a4319836] {
|
|
22
22
|
opacity: 0.5;
|
|
23
23
|
cursor: not-allowed;
|
|
24
24
|
}
|
|
25
|
-
.captcha-content[data-v-
|
|
25
|
+
.captcha-content[data-v-a4319836] {
|
|
26
26
|
display: flex;
|
|
27
27
|
align-items: center;
|
|
28
28
|
justify-content: center;
|
|
29
29
|
gap: 8px;
|
|
30
30
|
flex: 1;
|
|
31
31
|
}
|
|
32
|
-
.captcha-icon[data-v-
|
|
32
|
+
.captcha-icon[data-v-a4319836] {
|
|
33
33
|
font-size: 18px;
|
|
34
34
|
width: 20px;
|
|
35
35
|
height: 20px;
|
|
@@ -38,7 +38,7 @@
|
|
|
38
38
|
justify-content: center;
|
|
39
39
|
flex-shrink: 0;
|
|
40
40
|
}
|
|
41
|
-
.captcha-text[data-v-
|
|
41
|
+
.captcha-text[data-v-a4319836] {
|
|
42
42
|
color: rgba(255, 255, 255, 0.8);
|
|
43
43
|
font-size: 14px;
|
|
44
44
|
font-weight: 500;
|
|
@@ -46,7 +46,7 @@
|
|
|
46
46
|
text-align: center;
|
|
47
47
|
white-space: nowrap;
|
|
48
48
|
}
|
|
49
|
-
.refresh-button[data-v-
|
|
49
|
+
.refresh-button[data-v-a4319836] {
|
|
50
50
|
position: absolute;
|
|
51
51
|
right: 12px;
|
|
52
52
|
top: 50%;
|
|
@@ -62,19 +62,19 @@
|
|
|
62
62
|
font-size: 14px;
|
|
63
63
|
flex-shrink: 0;
|
|
64
64
|
}
|
|
65
|
-
.refresh-button[data-v-
|
|
65
|
+
.refresh-button[data-v-a4319836]:hover {
|
|
66
66
|
color: rgba(255, 255, 255, 0.9);
|
|
67
67
|
transform: translateY(-50%) rotate(180deg);
|
|
68
68
|
}
|
|
69
|
-
.success-icon[data-v-
|
|
70
|
-
.success-text[data-v-
|
|
69
|
+
.success-icon[data-v-a4319836],
|
|
70
|
+
.success-text[data-v-a4319836] {
|
|
71
71
|
color: #43c23a;
|
|
72
72
|
}
|
|
73
|
-
.error-icon[data-v-
|
|
74
|
-
.error-text[data-v-
|
|
73
|
+
.error-icon[data-v-a4319836],
|
|
74
|
+
.error-text[data-v-a4319836] {
|
|
75
75
|
color: #f56c6c;
|
|
76
76
|
}
|
|
77
|
-
@keyframes shake-
|
|
77
|
+
@keyframes shake-a4319836 {
|
|
78
78
|
0%, 100% {
|
|
79
79
|
transform: translateX(0);
|
|
80
80
|
}
|
|
@@ -86,19 +86,19 @@
|
|
|
86
86
|
}
|
|
87
87
|
}
|
|
88
88
|
@media (max-width: 768px) {
|
|
89
|
-
.captcha-trigger[data-v-
|
|
89
|
+
.captcha-trigger[data-v-a4319836] {
|
|
90
90
|
max-width: 240px;
|
|
91
91
|
padding: 10px 14px;
|
|
92
92
|
}
|
|
93
|
-
.captcha-icon[data-v-
|
|
93
|
+
.captcha-icon[data-v-a4319836] {
|
|
94
94
|
font-size: 16px;
|
|
95
95
|
width: 18px;
|
|
96
96
|
height: 18px;
|
|
97
97
|
}
|
|
98
|
-
.captcha-text[data-v-
|
|
98
|
+
.captcha-text[data-v-a4319836] {
|
|
99
99
|
font-size: 13px;
|
|
100
100
|
}
|
|
101
|
-
.refresh-button[data-v-
|
|
101
|
+
.refresh-button[data-v-a4319836] {
|
|
102
102
|
width: 24px;
|
|
103
103
|
height: 24px;
|
|
104
104
|
font-size: 12px;
|
|
@@ -106,4 +106,4 @@
|
|
|
106
106
|
}
|
|
107
107
|
}
|
|
108
108
|
|
|
109
|
-
/*# sourceMappingURL=C_Captcha-
|
|
109
|
+
/*# sourceMappingURL=C_Captcha-9_hk6VmY.css.map*/
|
package/dist/C_Captcha.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"C_Captcha.js","names":["disabled","triggerText"],"sources":["../src/components/C_Captcha/index.vue","../src/components/C_Captcha/index.vue","../src/components/C_Captcha/index.vue"],"sourcesContent":["/* unplugin-vue-components disabled */<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-07-23\r\n * @Description: 基于 vue3-puzzle-vcode 封装的验证器组件\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n <div class=\"c-captcha-modern\">\r\n <div\r\n class=\"captcha-trigger\"\r\n @click=\"showCaptcha\"\r\n :class=\"{\r\n verified: isVerified,\r\n error: hasError,\r\n disabled: disabled,\r\n }\"\r\n >\r\n <div class=\"captcha-content\">\r\n <div class=\"captcha-icon\">\r\n <span v-if=\"!isVerified && !hasError\">🧩</span>\r\n <span v-if=\"isVerified\" class=\"success-icon\">✓</span>\r\n <span v-if=\"hasError\" class=\"error-icon\">⚠️</span>\r\n </div>\r\n <div class=\"captcha-text\">\r\n <span v-if=\"!isVerified && !hasError\">{{ triggerText }}</span>\r\n <span v-if=\"isVerified\" class=\"success-text\">验证成功</span>\r\n <span v-if=\"hasError\" class=\"error-text\">验证失败,请重试</span>\r\n </div>\r\n </div>\r\n <div\r\n v-if=\"isVerified || hasError\"\r\n class=\"refresh-button\"\r\n @click.stop=\"resetCaptcha\"\r\n title=\"重新验证\"\r\n >\r\n ⟲\r\n </div>\r\n </div>\r\n <PuzzleVcode\r\n :show=\"showModal\"\r\n :imgs=\"captchaImages\"\r\n @success=\"handleSuccess\"\r\n @close=\"handleClose\"\r\n @fail=\"handleFail\"\r\n />\r\n </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { ref, computed, onBeforeUnmount } from \"vue\";\r\nimport PuzzleVcode from \"vue3-puzzle-vcode\";\r\n\r\ndefineOptions({ name: \"C_Captcha\" });\r\n\r\ninterface CaptchaProps {\r\n triggerText?: string;\r\n images?: string[];\r\n disabled?: boolean;\r\n theme?: \"light\" | \"dark\";\r\n}\r\n\r\ninterface CaptchaEmits {\r\n (e: \"success\", data: { token: string; timestamp: number }): void;\r\n (e: \"fail\", error: string): void;\r\n (e: \"change\", valid: boolean): void;\r\n (e: \"reset\"): void;\r\n}\r\n\r\nconst props = withDefaults(defineProps<CaptchaProps>(), {\r\n triggerText: \"点击进行人机验证\",\r\n images: () => [],\r\n disabled: false,\r\n theme: \"dark\",\r\n});\r\n\r\nconst emit = defineEmits<CaptchaEmits>();\r\n\r\nconst showModal = ref(false);\r\nconst isVerified = ref(false);\r\nconst hasError = ref(false);\r\nconst verificationToken = ref(\"\");\r\nlet errorTimer: ReturnType<typeof setTimeout> | null = null;\r\n\r\nconst captchaImages = computed(() =>\r\n props.images.length > 0 ? props.images : undefined,\r\n);\r\n\r\nconst showCaptcha = () => {\r\n if (props.disabled || isVerified.value) return;\r\n hasError.value = false;\r\n showModal.value = true;\r\n};\r\n\r\nconst handleSuccess = () => {\r\n isVerified.value = true;\r\n hasError.value = false;\r\n showModal.value = false;\r\n const timestamp = Date.now();\r\n const token = `puzzle_${timestamp}_${Math.random().toString(36).substring(2, 9)}`;\r\n verificationToken.value = token;\r\n emit(\"success\", { token, timestamp });\r\n emit(\"change\", true);\r\n};\r\n\r\nconst handleFail = () => {\r\n isVerified.value = false;\r\n hasError.value = true;\r\n showModal.value = false;\r\n if (errorTimer) clearTimeout(errorTimer);\r\n errorTimer = setTimeout(() => {\r\n hasError.value = false;\r\n errorTimer = null;\r\n }, 3000);\r\n emit(\"fail\", \"拼图验证失败\");\r\n emit(\"change\", false);\r\n};\r\n\r\nconst handleClose = () => {\r\n showModal.value = false;\r\n};\r\n\r\nconst resetCaptcha = () => {\r\n isVerified.value = false;\r\n hasError.value = false;\r\n showModal.value = false;\r\n verificationToken.value = \"\";\r\n if (errorTimer) {\r\n clearTimeout(errorTimer);\r\n errorTimer = null;\r\n }\r\n emit(\"reset\");\r\n emit(\"change\", false);\r\n};\r\n\r\ndefineExpose({\r\n validate: () => isVerified.value,\r\n getToken: () => verificationToken.value,\r\n getVerificationData: () => {\r\n if (!isVerified.value) return null;\r\n return {\r\n token: verificationToken.value,\r\n timestamp: Date.now(),\r\n type: \"puzzle-captcha\",\r\n };\r\n },\r\n reset: resetCaptcha,\r\n show: showCaptcha,\r\n});\r\n\r\nonBeforeUnmount(() => {\r\n if (errorTimer) clearTimeout(errorTimer);\r\n});\r\n</script>\r\n\r\n<style scoped lang=\"scss\">\r\n@use \"./index.scss\";\r\n</style>\r\n","/* unplugin-vue-components disabled */<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-07-23\r\n * @Description: 基于 vue3-puzzle-vcode 封装的验证器组件\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n <div class=\"c-captcha-modern\">\r\n <div\r\n class=\"captcha-trigger\"\r\n @click=\"showCaptcha\"\r\n :class=\"{\r\n verified: isVerified,\r\n error: hasError,\r\n disabled: disabled,\r\n }\"\r\n >\r\n <div class=\"captcha-content\">\r\n <div class=\"captcha-icon\">\r\n <span v-if=\"!isVerified && !hasError\">🧩</span>\r\n <span v-if=\"isVerified\" class=\"success-icon\">✓</span>\r\n <span v-if=\"hasError\" class=\"error-icon\">⚠️</span>\r\n </div>\r\n <div class=\"captcha-text\">\r\n <span v-if=\"!isVerified && !hasError\">{{ triggerText }}</span>\r\n <span v-if=\"isVerified\" class=\"success-text\">验证成功</span>\r\n <span v-if=\"hasError\" class=\"error-text\">验证失败,请重试</span>\r\n </div>\r\n </div>\r\n <div\r\n v-if=\"isVerified || hasError\"\r\n class=\"refresh-button\"\r\n @click.stop=\"resetCaptcha\"\r\n title=\"重新验证\"\r\n >\r\n ⟲\r\n </div>\r\n </div>\r\n <PuzzleVcode\r\n :show=\"showModal\"\r\n :imgs=\"captchaImages\"\r\n @success=\"handleSuccess\"\r\n @close=\"handleClose\"\r\n @fail=\"handleFail\"\r\n />\r\n </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { ref, computed, onBeforeUnmount } from \"vue\";\r\nimport PuzzleVcode from \"vue3-puzzle-vcode\";\r\n\r\ndefineOptions({ name: \"C_Captcha\" });\r\n\r\ninterface CaptchaProps {\r\n triggerText?: string;\r\n images?: string[];\r\n disabled?: boolean;\r\n theme?: \"light\" | \"dark\";\r\n}\r\n\r\ninterface CaptchaEmits {\r\n (e: \"success\", data: { token: string; timestamp: number }): void;\r\n (e: \"fail\", error: string): void;\r\n (e: \"change\", valid: boolean): void;\r\n (e: \"reset\"): void;\r\n}\r\n\r\nconst props = withDefaults(defineProps<CaptchaProps>(), {\r\n triggerText: \"点击进行人机验证\",\r\n images: () => [],\r\n disabled: false,\r\n theme: \"dark\",\r\n});\r\n\r\nconst emit = defineEmits<CaptchaEmits>();\r\n\r\nconst showModal = ref(false);\r\nconst isVerified = ref(false);\r\nconst hasError = ref(false);\r\nconst verificationToken = ref(\"\");\r\nlet errorTimer: ReturnType<typeof setTimeout> | null = null;\r\n\r\nconst captchaImages = computed(() =>\r\n props.images.length > 0 ? props.images : undefined,\r\n);\r\n\r\nconst showCaptcha = () => {\r\n if (props.disabled || isVerified.value) return;\r\n hasError.value = false;\r\n showModal.value = true;\r\n};\r\n\r\nconst handleSuccess = () => {\r\n isVerified.value = true;\r\n hasError.value = false;\r\n showModal.value = false;\r\n const timestamp = Date.now();\r\n const token = `puzzle_${timestamp}_${Math.random().toString(36).substring(2, 9)}`;\r\n verificationToken.value = token;\r\n emit(\"success\", { token, timestamp });\r\n emit(\"change\", true);\r\n};\r\n\r\nconst handleFail = () => {\r\n isVerified.value = false;\r\n hasError.value = true;\r\n showModal.value = false;\r\n if (errorTimer) clearTimeout(errorTimer);\r\n errorTimer = setTimeout(() => {\r\n hasError.value = false;\r\n errorTimer = null;\r\n }, 3000);\r\n emit(\"fail\", \"拼图验证失败\");\r\n emit(\"change\", false);\r\n};\r\n\r\nconst handleClose = () => {\r\n showModal.value = false;\r\n};\r\n\r\nconst resetCaptcha = () => {\r\n isVerified.value = false;\r\n hasError.value = false;\r\n showModal.value = false;\r\n verificationToken.value = \"\";\r\n if (errorTimer) {\r\n clearTimeout(errorTimer);\r\n errorTimer = null;\r\n }\r\n emit(\"reset\");\r\n emit(\"change\", false);\r\n};\r\n\r\ndefineExpose({\r\n validate: () => isVerified.value,\r\n getToken: () => verificationToken.value,\r\n getVerificationData: () => {\r\n if (!isVerified.value) return null;\r\n return {\r\n token: verificationToken.value,\r\n timestamp: Date.now(),\r\n type: \"puzzle-captcha\",\r\n };\r\n },\r\n reset: resetCaptcha,\r\n show: showCaptcha,\r\n});\r\n\r\nonBeforeUnmount(() => {\r\n if (errorTimer) clearTimeout(errorTimer);\r\n});\r\n</script>\r\n\r\n<style scoped lang=\"scss\">\r\n@use \"./index.scss\";\r\n</style>\r\n","<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-07-23\r\n * @Description: 基于 vue3-puzzle-vcode 封装的验证器组件\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n <div class=\"c-captcha-modern\">\r\n <div\r\n class=\"captcha-trigger\"\r\n @click=\"showCaptcha\"\r\n :class=\"{\r\n verified: isVerified,\r\n error: hasError,\r\n disabled: disabled,\r\n }\"\r\n >\r\n <div class=\"captcha-content\">\r\n <div class=\"captcha-icon\">\r\n <span v-if=\"!isVerified && !hasError\">🧩</span>\r\n <span v-if=\"isVerified\" class=\"success-icon\">✓</span>\r\n <span v-if=\"hasError\" class=\"error-icon\">⚠️</span>\r\n </div>\r\n <div class=\"captcha-text\">\r\n <span v-if=\"!isVerified && !hasError\">{{ triggerText }}</span>\r\n <span v-if=\"isVerified\" class=\"success-text\">验证成功</span>\r\n <span v-if=\"hasError\" class=\"error-text\">验证失败,请重试</span>\r\n </div>\r\n </div>\r\n <div\r\n v-if=\"isVerified || hasError\"\r\n class=\"refresh-button\"\r\n @click.stop=\"resetCaptcha\"\r\n title=\"重新验证\"\r\n >\r\n ⟲\r\n </div>\r\n </div>\r\n <PuzzleVcode\r\n :show=\"showModal\"\r\n :imgs=\"captchaImages\"\r\n @success=\"handleSuccess\"\r\n @close=\"handleClose\"\r\n @fail=\"handleFail\"\r\n />\r\n </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { ref, computed, onBeforeUnmount } from \"vue\";\r\nimport PuzzleVcode from \"vue3-puzzle-vcode\";\r\n\r\ndefineOptions({ name: \"C_Captcha\" });\r\n\r\ninterface CaptchaProps {\r\n triggerText?: string;\r\n images?: string[];\r\n disabled?: boolean;\r\n theme?: \"light\" | \"dark\";\r\n}\r\n\r\ninterface CaptchaEmits {\r\n (e: \"success\", data: { token: string; timestamp: number }): void;\r\n (e: \"fail\", error: string): void;\r\n (e: \"change\", valid: boolean): void;\r\n (e: \"reset\"): void;\r\n}\r\n\r\nconst props = withDefaults(defineProps<CaptchaProps>(), {\r\n triggerText: \"点击进行人机验证\",\r\n images: () => [],\r\n disabled: false,\r\n theme: \"dark\",\r\n});\r\n\r\nconst emit = defineEmits<CaptchaEmits>();\r\n\r\nconst showModal = ref(false);\r\nconst isVerified = ref(false);\r\nconst hasError = ref(false);\r\nconst verificationToken = ref(\"\");\r\nlet errorTimer: ReturnType<typeof setTimeout> | null = null;\r\n\r\nconst captchaImages = computed(() =>\r\n props.images.length > 0 ? props.images : undefined,\r\n);\r\n\r\nconst showCaptcha = () => {\r\n if (props.disabled || isVerified.value) return;\r\n hasError.value = false;\r\n showModal.value = true;\r\n};\r\n\r\nconst handleSuccess = () => {\r\n isVerified.value = true;\r\n hasError.value = false;\r\n showModal.value = false;\r\n const timestamp = Date.now();\r\n const token = `puzzle_${timestamp}_${Math.random().toString(36).substring(2, 9)}`;\r\n verificationToken.value = token;\r\n emit(\"success\", { token, timestamp });\r\n emit(\"change\", true);\r\n};\r\n\r\nconst handleFail = () => {\r\n isVerified.value = false;\r\n hasError.value = true;\r\n showModal.value = false;\r\n if (errorTimer) clearTimeout(errorTimer);\r\n errorTimer = setTimeout(() => {\r\n hasError.value = false;\r\n errorTimer = null;\r\n }, 3000);\r\n emit(\"fail\", \"拼图验证失败\");\r\n emit(\"change\", false);\r\n};\r\n\r\nconst handleClose = () => {\r\n showModal.value = false;\r\n};\r\n\r\nconst resetCaptcha = () => {\r\n isVerified.value = false;\r\n hasError.value = false;\r\n showModal.value = false;\r\n verificationToken.value = \"\";\r\n if (errorTimer) {\r\n clearTimeout(errorTimer);\r\n errorTimer = null;\r\n }\r\n emit(\"reset\");\r\n emit(\"change\", false);\r\n};\r\n\r\ndefineExpose({\r\n validate: () => isVerified.value,\r\n getToken: () => verificationToken.value,\r\n getVerificationData: () => {\r\n if (!isVerified.value) return null;\r\n return {\r\n token: verificationToken.value,\r\n timestamp: Date.now(),\r\n type: \"puzzle-captcha\",\r\n };\r\n },\r\n reset: resetCaptcha,\r\n show: showCaptcha,\r\n});\r\n\r\nonBeforeUnmount(() => {\r\n if (errorTimer) clearTimeout(errorTimer);\r\n});\r\n</script>\r\n\r\n<style scoped lang=\"scss\">\r\n@use \"./index.scss\";\r\n</style>\r\n"],"mappings":"qnBEqEA,IAAM,EAAQ,EAOR,EAAO,EAEP,GAAA,EAAA,EAAA,KAAgB,GAAM,CACtB,GAAA,EAAA,EAAA,KAAiB,GAAM,CACvB,GAAA,EAAA,EAAA,KAAe,GAAM,CACrB,GAAA,EAAA,EAAA,KAAwB,GAAG,CAC7B,EAAmD,KAEjD,GAAA,EAAA,EAAA,cACJ,EAAM,OAAO,OAAS,EAAI,EAAM,OAAS,IAAA,GAC1C,CAEK,MAAoB,CACpB,EAAM,UAAY,EAAW,QACjC,EAAS,MAAQ,GACjB,EAAU,MAAQ,KAGd,MAAsB,CAC1B,EAAW,MAAQ,GACnB,EAAS,MAAQ,GACjB,EAAU,MAAQ,GAClB,IAAM,EAAY,KAAK,KAAK,CACtB,EAAQ,UAAU,EAAU,GAAG,KAAK,QAAQ,CAAC,SAAS,GAAG,CAAC,UAAU,EAAG,EAAE,GAC/E,EAAkB,MAAQ,EAC1B,EAAK,UAAW,CAAE,QAAO,YAAW,CAAC,CACrC,EAAK,SAAU,GAAK,EAGhB,MAAmB,CACvB,EAAW,MAAQ,GACnB,EAAS,MAAQ,GACjB,EAAU,MAAQ,GACd,GAAY,aAAa,EAAW,CACxC,EAAa,eAAiB,CAC5B,EAAS,MAAQ,GACjB,EAAa,MACZ,IAAK,CACR,EAAK,OAAQ,SAAS,CACtB,EAAK,SAAU,GAAM,EAGjB,MAAoB,CACxB,EAAU,MAAQ,IAGd,MAAqB,CACzB,EAAW,MAAQ,GACnB,EAAS,MAAQ,GACjB,EAAU,MAAQ,GAClB,EAAkB,MAAQ,GAC1B,AAEE,KADA,aAAa,EAAW,CACX,MAEf,EAAK,QAAQ,CACb,EAAK,SAAU,GAAM,SAGvB,EAAa,CACX,aAAgB,EAAW,MAC3B,aAAgB,EAAkB,MAClC,wBACO,EAAW,MACT,CACL,MAAO,EAAkB,MACzB,UAAW,KAAK,KAAK,CACrB,KAAM,iBACP,CAL6B,KAOhC,MAAO,EACP,KAAM,EACP,CAAC,EAEF,EAAA,EAAA,qBAAsB,CAChB,GAAY,aAAa,EAAW,EACxC,oDA1GM,MAtCN,EAsCM,EAAA,EAAA,EAAA,oBARE,MAAA,CA5BJ,OAAA,EAAA,EAAA,gBAAK,CAAC,kBAAiB,UAEM,EAAA,YAA4B,EAAA,eAA6BA,EAAAA,YADrF,QAAO,6BAkBF,MAXN,EAWM,EAAA,EAAA,EAAA,oBANE,MAJN,EAIM,EAHS,EAAA,OAAU,CAAK,EAAA,QAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAAmB,OAAA,EAAT,KAAE,GAAA,EAAA,EAAA,oBAAA,OAAA,GAAA,CAC5B,EAAA,QAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAAyC,OAArD,EAA6C,IAAC,GAAA,EAAA,EAAA,oBAAA,OAAA,GAAA,CAClC,EAAA,QAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAAsC,OAAlD,EAAyC,KAAE,GAAA,EAAA,EAAA,oBAAA,OAAA,GAAA,4BAMvC,MAJN,EAIM,EAHS,EAAA,OAAU,CAAK,EAAA,QAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAAkC,OAAA,GAAA,EAAA,EAAA,iBAArBC,EAAAA,YAAW,CAAA,EAAA,GAAA,EAAA,EAAA,oBAAA,OAAA,GAAA,CACxC,EAAA,QAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAA4C,OAAxD,EAA6C,OAAI,GAAA,EAAA,EAAA,oBAAA,OAAA,GAAA,CACrC,EAAA,QAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAA4C,OAAxD,EAAyC,WAAQ,GAAA,EAAA,EAAA,oBAAA,OAAA,GAAA,KAI7C,EAAA,OAAc,EAAA,QAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAMhB,MAAA,OALJ,MAAM,iBACL,SAAA,EAAA,EAAA,eAAY,EAAY,CAAA,OAAA,CAAA,CACzB,MAAM,QACP,MAED,GAAA,EAAA,EAAA,oBAAA,OAAA,GAAA,CAAA,CAAA,EAAA,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OAQA,EAAA,QAAA,CAAA,CALC,KAAM,EAAA,MACN,KAAM,EAAA,MACN,UAAS,EACT,QAAO,EACP,OAAM"}
|
|
1
|
+
{"version":3,"file":"C_Captcha.js","names":["disabled","triggerText"],"sources":["../src/components/C_Captcha/index.vue","../src/components/C_Captcha/index.vue","../src/components/C_Captcha/index.vue"],"sourcesContent":["/* unplugin-vue-components disabled */<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-07-23\n * @Description: 基于 vue3-puzzle-vcode 封装的验证器组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-captcha-modern\">\n <div\n class=\"captcha-trigger\"\n @click=\"showCaptcha\"\n :class=\"{\n verified: isVerified,\n error: hasError,\n disabled: disabled,\n }\"\n >\n <div class=\"captcha-content\">\n <div class=\"captcha-icon\">\n <span v-if=\"!isVerified && !hasError\">🧩</span>\n <span v-if=\"isVerified\" class=\"success-icon\">✓</span>\n <span v-if=\"hasError\" class=\"error-icon\">⚠️</span>\n </div>\n <div class=\"captcha-text\">\n <span v-if=\"!isVerified && !hasError\">{{ triggerText }}</span>\n <span v-if=\"isVerified\" class=\"success-text\">验证成功</span>\n <span v-if=\"hasError\" class=\"error-text\">验证失败,请重试</span>\n </div>\n </div>\n <div\n v-if=\"isVerified || hasError\"\n class=\"refresh-button\"\n @click.stop=\"resetCaptcha\"\n title=\"重新验证\"\n >\n ⟲\n </div>\n </div>\n <PuzzleVcode\n :show=\"showModal\"\n :imgs=\"captchaImages\"\n @success=\"handleSuccess\"\n @close=\"handleClose\"\n @fail=\"handleFail\"\n />\n </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onBeforeUnmount } from \"vue\";\nimport PuzzleVcode from \"vue3-puzzle-vcode\";\n\ndefineOptions({ name: \"C_Captcha\" });\n\ninterface CaptchaProps {\n triggerText?: string;\n images?: string[];\n disabled?: boolean;\n theme?: \"light\" | \"dark\";\n}\n\ninterface CaptchaEmits {\n (e: \"success\", data: { token: string; timestamp: number }): void;\n (e: \"fail\", error: string): void;\n (e: \"change\", valid: boolean): void;\n (e: \"reset\"): void;\n}\n\nconst props = withDefaults(defineProps<CaptchaProps>(), {\n triggerText: \"点击进行人机验证\",\n images: () => [],\n disabled: false,\n theme: \"dark\",\n});\n\nconst emit = defineEmits<CaptchaEmits>();\n\nconst showModal = ref(false);\nconst isVerified = ref(false);\nconst hasError = ref(false);\nconst verificationToken = ref(\"\");\nlet errorTimer: ReturnType<typeof setTimeout> | null = null;\n\nconst captchaImages = computed(() =>\n props.images.length > 0 ? props.images : undefined,\n);\n\nconst showCaptcha = () => {\n if (props.disabled || isVerified.value) return;\n hasError.value = false;\n showModal.value = true;\n};\n\nconst handleSuccess = () => {\n isVerified.value = true;\n hasError.value = false;\n showModal.value = false;\n const timestamp = Date.now();\n const token = `puzzle_${timestamp}_${Math.random().toString(36).substring(2, 9)}`;\n verificationToken.value = token;\n emit(\"success\", { token, timestamp });\n emit(\"change\", true);\n};\n\nconst handleFail = () => {\n isVerified.value = false;\n hasError.value = true;\n showModal.value = false;\n if (errorTimer) clearTimeout(errorTimer);\n errorTimer = setTimeout(() => {\n hasError.value = false;\n errorTimer = null;\n }, 3000);\n emit(\"fail\", \"拼图验证失败\");\n emit(\"change\", false);\n};\n\nconst handleClose = () => {\n showModal.value = false;\n};\n\nconst resetCaptcha = () => {\n isVerified.value = false;\n hasError.value = false;\n showModal.value = false;\n verificationToken.value = \"\";\n if (errorTimer) {\n clearTimeout(errorTimer);\n errorTimer = null;\n }\n emit(\"reset\");\n emit(\"change\", false);\n};\n\ndefineExpose({\n validate: () => isVerified.value,\n getToken: () => verificationToken.value,\n getVerificationData: () => {\n if (!isVerified.value) return null;\n return {\n token: verificationToken.value,\n timestamp: Date.now(),\n type: \"puzzle-captcha\",\n };\n },\n reset: resetCaptcha,\n show: showCaptcha,\n});\n\nonBeforeUnmount(() => {\n if (errorTimer) clearTimeout(errorTimer);\n});\n</script>\n\n<style scoped lang=\"scss\">\n@use \"./index.scss\";\n</style>\n","/* unplugin-vue-components disabled */<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-07-23\n * @Description: 基于 vue3-puzzle-vcode 封装的验证器组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-captcha-modern\">\n <div\n class=\"captcha-trigger\"\n @click=\"showCaptcha\"\n :class=\"{\n verified: isVerified,\n error: hasError,\n disabled: disabled,\n }\"\n >\n <div class=\"captcha-content\">\n <div class=\"captcha-icon\">\n <span v-if=\"!isVerified && !hasError\">🧩</span>\n <span v-if=\"isVerified\" class=\"success-icon\">✓</span>\n <span v-if=\"hasError\" class=\"error-icon\">⚠️</span>\n </div>\n <div class=\"captcha-text\">\n <span v-if=\"!isVerified && !hasError\">{{ triggerText }}</span>\n <span v-if=\"isVerified\" class=\"success-text\">验证成功</span>\n <span v-if=\"hasError\" class=\"error-text\">验证失败,请重试</span>\n </div>\n </div>\n <div\n v-if=\"isVerified || hasError\"\n class=\"refresh-button\"\n @click.stop=\"resetCaptcha\"\n title=\"重新验证\"\n >\n ⟲\n </div>\n </div>\n <PuzzleVcode\n :show=\"showModal\"\n :imgs=\"captchaImages\"\n @success=\"handleSuccess\"\n @close=\"handleClose\"\n @fail=\"handleFail\"\n />\n </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onBeforeUnmount } from \"vue\";\nimport PuzzleVcode from \"vue3-puzzle-vcode\";\n\ndefineOptions({ name: \"C_Captcha\" });\n\ninterface CaptchaProps {\n triggerText?: string;\n images?: string[];\n disabled?: boolean;\n theme?: \"light\" | \"dark\";\n}\n\ninterface CaptchaEmits {\n (e: \"success\", data: { token: string; timestamp: number }): void;\n (e: \"fail\", error: string): void;\n (e: \"change\", valid: boolean): void;\n (e: \"reset\"): void;\n}\n\nconst props = withDefaults(defineProps<CaptchaProps>(), {\n triggerText: \"点击进行人机验证\",\n images: () => [],\n disabled: false,\n theme: \"dark\",\n});\n\nconst emit = defineEmits<CaptchaEmits>();\n\nconst showModal = ref(false);\nconst isVerified = ref(false);\nconst hasError = ref(false);\nconst verificationToken = ref(\"\");\nlet errorTimer: ReturnType<typeof setTimeout> | null = null;\n\nconst captchaImages = computed(() =>\n props.images.length > 0 ? props.images : undefined,\n);\n\nconst showCaptcha = () => {\n if (props.disabled || isVerified.value) return;\n hasError.value = false;\n showModal.value = true;\n};\n\nconst handleSuccess = () => {\n isVerified.value = true;\n hasError.value = false;\n showModal.value = false;\n const timestamp = Date.now();\n const token = `puzzle_${timestamp}_${Math.random().toString(36).substring(2, 9)}`;\n verificationToken.value = token;\n emit(\"success\", { token, timestamp });\n emit(\"change\", true);\n};\n\nconst handleFail = () => {\n isVerified.value = false;\n hasError.value = true;\n showModal.value = false;\n if (errorTimer) clearTimeout(errorTimer);\n errorTimer = setTimeout(() => {\n hasError.value = false;\n errorTimer = null;\n }, 3000);\n emit(\"fail\", \"拼图验证失败\");\n emit(\"change\", false);\n};\n\nconst handleClose = () => {\n showModal.value = false;\n};\n\nconst resetCaptcha = () => {\n isVerified.value = false;\n hasError.value = false;\n showModal.value = false;\n verificationToken.value = \"\";\n if (errorTimer) {\n clearTimeout(errorTimer);\n errorTimer = null;\n }\n emit(\"reset\");\n emit(\"change\", false);\n};\n\ndefineExpose({\n validate: () => isVerified.value,\n getToken: () => verificationToken.value,\n getVerificationData: () => {\n if (!isVerified.value) return null;\n return {\n token: verificationToken.value,\n timestamp: Date.now(),\n type: \"puzzle-captcha\",\n };\n },\n reset: resetCaptcha,\n show: showCaptcha,\n});\n\nonBeforeUnmount(() => {\n if (errorTimer) clearTimeout(errorTimer);\n});\n</script>\n\n<style scoped lang=\"scss\">\n@use \"./index.scss\";\n</style>\n","<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-07-23\n * @Description: 基于 vue3-puzzle-vcode 封装的验证器组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-captcha-modern\">\n <div\n class=\"captcha-trigger\"\n @click=\"showCaptcha\"\n :class=\"{\n verified: isVerified,\n error: hasError,\n disabled: disabled,\n }\"\n >\n <div class=\"captcha-content\">\n <div class=\"captcha-icon\">\n <span v-if=\"!isVerified && !hasError\">🧩</span>\n <span v-if=\"isVerified\" class=\"success-icon\">✓</span>\n <span v-if=\"hasError\" class=\"error-icon\">⚠️</span>\n </div>\n <div class=\"captcha-text\">\n <span v-if=\"!isVerified && !hasError\">{{ triggerText }}</span>\n <span v-if=\"isVerified\" class=\"success-text\">验证成功</span>\n <span v-if=\"hasError\" class=\"error-text\">验证失败,请重试</span>\n </div>\n </div>\n <div\n v-if=\"isVerified || hasError\"\n class=\"refresh-button\"\n @click.stop=\"resetCaptcha\"\n title=\"重新验证\"\n >\n ⟲\n </div>\n </div>\n <PuzzleVcode\n :show=\"showModal\"\n :imgs=\"captchaImages\"\n @success=\"handleSuccess\"\n @close=\"handleClose\"\n @fail=\"handleFail\"\n />\n </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onBeforeUnmount } from \"vue\";\nimport PuzzleVcode from \"vue3-puzzle-vcode\";\n\ndefineOptions({ name: \"C_Captcha\" });\n\ninterface CaptchaProps {\n triggerText?: string;\n images?: string[];\n disabled?: boolean;\n theme?: \"light\" | \"dark\";\n}\n\ninterface CaptchaEmits {\n (e: \"success\", data: { token: string; timestamp: number }): void;\n (e: \"fail\", error: string): void;\n (e: \"change\", valid: boolean): void;\n (e: \"reset\"): void;\n}\n\nconst props = withDefaults(defineProps<CaptchaProps>(), {\n triggerText: \"点击进行人机验证\",\n images: () => [],\n disabled: false,\n theme: \"dark\",\n});\n\nconst emit = defineEmits<CaptchaEmits>();\n\nconst showModal = ref(false);\nconst isVerified = ref(false);\nconst hasError = ref(false);\nconst verificationToken = ref(\"\");\nlet errorTimer: ReturnType<typeof setTimeout> | null = null;\n\nconst captchaImages = computed(() =>\n props.images.length > 0 ? props.images : undefined,\n);\n\nconst showCaptcha = () => {\n if (props.disabled || isVerified.value) return;\n hasError.value = false;\n showModal.value = true;\n};\n\nconst handleSuccess = () => {\n isVerified.value = true;\n hasError.value = false;\n showModal.value = false;\n const timestamp = Date.now();\n const token = `puzzle_${timestamp}_${Math.random().toString(36).substring(2, 9)}`;\n verificationToken.value = token;\n emit(\"success\", { token, timestamp });\n emit(\"change\", true);\n};\n\nconst handleFail = () => {\n isVerified.value = false;\n hasError.value = true;\n showModal.value = false;\n if (errorTimer) clearTimeout(errorTimer);\n errorTimer = setTimeout(() => {\n hasError.value = false;\n errorTimer = null;\n }, 3000);\n emit(\"fail\", \"拼图验证失败\");\n emit(\"change\", false);\n};\n\nconst handleClose = () => {\n showModal.value = false;\n};\n\nconst resetCaptcha = () => {\n isVerified.value = false;\n hasError.value = false;\n showModal.value = false;\n verificationToken.value = \"\";\n if (errorTimer) {\n clearTimeout(errorTimer);\n errorTimer = null;\n }\n emit(\"reset\");\n emit(\"change\", false);\n};\n\ndefineExpose({\n validate: () => isVerified.value,\n getToken: () => verificationToken.value,\n getVerificationData: () => {\n if (!isVerified.value) return null;\n return {\n token: verificationToken.value,\n timestamp: Date.now(),\n type: \"puzzle-captcha\",\n };\n },\n reset: resetCaptcha,\n show: showCaptcha,\n});\n\nonBeforeUnmount(() => {\n if (errorTimer) clearTimeout(errorTimer);\n});\n</script>\n\n<style scoped lang=\"scss\">\n@use \"./index.scss\";\n</style>\n"],"mappings":"qnBEqEA,IAAM,EAAQ,EAOR,EAAO,EAEP,GAAA,EAAA,EAAA,KAAgB,GAAM,CACtB,GAAA,EAAA,EAAA,KAAiB,GAAM,CACvB,GAAA,EAAA,EAAA,KAAe,GAAM,CACrB,GAAA,EAAA,EAAA,KAAwB,GAAG,CAC7B,EAAmD,KAEjD,GAAA,EAAA,EAAA,cACJ,EAAM,OAAO,OAAS,EAAI,EAAM,OAAS,IAAA,GAC1C,CAEK,MAAoB,CACpB,EAAM,UAAY,EAAW,QACjC,EAAS,MAAQ,GACjB,EAAU,MAAQ,KAGd,MAAsB,CAC1B,EAAW,MAAQ,GACnB,EAAS,MAAQ,GACjB,EAAU,MAAQ,GAClB,IAAM,EAAY,KAAK,KAAK,CACtB,EAAQ,UAAU,EAAU,GAAG,KAAK,QAAQ,CAAC,SAAS,GAAG,CAAC,UAAU,EAAG,EAAE,GAC/E,EAAkB,MAAQ,EAC1B,EAAK,UAAW,CAAE,QAAO,YAAW,CAAC,CACrC,EAAK,SAAU,GAAK,EAGhB,MAAmB,CACvB,EAAW,MAAQ,GACnB,EAAS,MAAQ,GACjB,EAAU,MAAQ,GACd,GAAY,aAAa,EAAW,CACxC,EAAa,eAAiB,CAC5B,EAAS,MAAQ,GACjB,EAAa,MACZ,IAAK,CACR,EAAK,OAAQ,SAAS,CACtB,EAAK,SAAU,GAAM,EAGjB,MAAoB,CACxB,EAAU,MAAQ,IAGd,MAAqB,CACzB,EAAW,MAAQ,GACnB,EAAS,MAAQ,GACjB,EAAU,MAAQ,GAClB,EAAkB,MAAQ,GAC1B,AAEE,KADA,aAAa,EAAW,CACX,MAEf,EAAK,QAAQ,CACb,EAAK,SAAU,GAAM,SAGvB,EAAa,CACX,aAAgB,EAAW,MAC3B,aAAgB,EAAkB,MAClC,wBACO,EAAW,MACT,CACL,MAAO,EAAkB,MACzB,UAAW,KAAK,KAAK,CACrB,KAAM,iBACP,CAL6B,KAOhC,MAAO,EACP,KAAM,EACP,CAAC,EAEF,EAAA,EAAA,qBAAsB,CAChB,GAAY,aAAa,EAAW,EACxC,oDA1GM,MAtCN,EAsCM,EAAA,EAAA,EAAA,oBARE,MAAA,CA5BJ,OAAA,EAAA,EAAA,gBAAK,CAAC,kBAAiB,UAEK,EAAA,YAA2B,EAAA,eAA4BA,EAAAA,YADlF,QAAO,6BAkBF,MAXN,EAWM,EAAA,EAAA,EAAA,oBANE,MAJN,EAIM,EAHS,EAAA,OAAU,CAAK,EAAA,QAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAAmB,OAAA,EAAT,KAAE,GAAA,EAAA,EAAA,oBAAA,OAAA,GAAA,CAC5B,EAAA,QAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAAyC,OAArD,EAA6C,IAAC,GAAA,EAAA,EAAA,oBAAA,OAAA,GAAA,CAClC,EAAA,QAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAAsC,OAAlD,EAAyC,KAAE,GAAA,EAAA,EAAA,oBAAA,OAAA,GAAA,4BAMvC,MAJN,EAIM,EAHS,EAAA,OAAU,CAAK,EAAA,QAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAAkC,OAAA,GAAA,EAAA,EAAA,iBAArBC,EAAAA,YAAW,CAAA,EAAA,GAAA,EAAA,EAAA,oBAAA,OAAA,GAAA,CACxC,EAAA,QAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAA4C,OAAxD,EAA6C,OAAI,GAAA,EAAA,EAAA,oBAAA,OAAA,GAAA,CACrC,EAAA,QAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAA4C,OAAxD,EAAyC,WAAQ,GAAA,EAAA,EAAA,oBAAA,OAAA,GAAA,KAI7C,EAAA,OAAc,EAAA,QAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAMhB,MAAA,OALJ,MAAM,iBACL,SAAA,EAAA,EAAA,eAAY,EAAY,CAAA,OAAA,CAAA,CACzB,MAAM,QACP,MAED,GAAA,EAAA,EAAA,oBAAA,OAAA,GAAA,CAAA,CAAA,EAAA,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OAQA,EAAA,QAAA,CAAA,CALC,KAAM,EAAA,MACN,KAAM,EAAA,MACN,UAAS,EACT,QAAO,EACP,OAAM"}
|
package/dist/C_Captcha2.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{t as e}from"./export-helper.js";import{computed as t,createCommentVNode as n,createElementBlock as r,createElementVNode as i,createVNode as a,defineComponent as o,normalizeClass as s,onBeforeUnmount as c,openBlock as l,ref as u,toDisplayString as d,unref as f,withModifiers as p}from"vue";import m from"vue3-puzzle-vcode";const h={class:`c-captcha-modern`},g={class:`captcha-content`},_={class:`captcha-icon`},v={key:0},y={key:1,class:`success-icon`},b={key:2,class:`error-icon`},x={class:`captcha-text`},S={key:0},C={key:1,class:`success-text`},w={key:2,class:`error-text`};var T=e(o({name:`C_Captcha`,__name:`index`,props:{triggerText:{default:`点击进行人机验证`},images:{default:()=>[]},disabled:{type:Boolean,default:!1},theme:{default:`dark`}},emits:[`success`,`fail`,`change`,`reset`],setup(e,{expose:o,emit:T}){let E=e,D=T,O=u(!1),k=u(!1),A=u(!1),j=u(``),M=null,N=t(()=>E.images.length>0?E.images:void 0),P=()=>{E.disabled||k.value||(A.value=!1,O.value=!0)},F=()=>{k.value=!0,A.value=!1,O.value=!1;let e=Date.now(),t=`puzzle_${e}_${Math.random().toString(36).substring(2,9)}`;j.value=t,D(`success`,{token:t,timestamp:e}),D(`change`,!0)},I=()=>{k.value=!1,A.value=!0,O.value=!1,M&&clearTimeout(M),M=setTimeout(()=>{A.value=!1,M=null},3e3),D(`fail`,`拼图验证失败`),D(`change`,!1)},L=()=>{O.value=!1},R=()=>{k.value=!1,A.value=!1,O.value=!1,j.value=``,M&&=(clearTimeout(M),null),D(`reset`),D(`change`,!1)};return o({validate:()=>k.value,getToken:()=>j.value,getVerificationData:()=>k.value?{token:j.value,timestamp:Date.now(),type:`puzzle-captcha`}:null,reset:R,show:P}),c(()=>{M&&clearTimeout(M)}),(e,t)=>(l(),r(`div`,h,[i(`div`,{class:s([`captcha-trigger`,{verified:k.value,error:A.value,disabled:e.disabled}]),onClick:P},[i(`div`,g,[i(`div`,_,[!k.value&&!A.value?(l(),r(`span`,v,`🧩`)):n(`v-if`,!0),k.value?(l(),r(`span`,y,`✓`)):n(`v-if`,!0),A.value?(l(),r(`span`,b,`⚠️`)):n(`v-if`,!0)]),i(`div`,x,[!k.value&&!A.value?(l(),r(`span`,S,d(e.triggerText),1)):n(`v-if`,!0),k.value?(l(),r(`span`,C,`验证成功`)):n(`v-if`,!0),A.value?(l(),r(`span`,w,`验证失败,请重试`)):n(`v-if`,!0)])]),k.value||A.value?(l(),r(`div`,{key:0,class:`refresh-button`,onClick:p(R,[`stop`]),title:`重新验证`},` ⟲ `)):n(`v-if`,!0)],2),a(f(m),{show:O.value,imgs:N.value,onSuccess:F,onClose:L,onFail:I},null,8,[`show`,`imgs`])]))}}),[[`__scopeId`,`data-v-
|
|
1
|
+
import{t as e}from"./export-helper.js";import{computed as t,createCommentVNode as n,createElementBlock as r,createElementVNode as i,createVNode as a,defineComponent as o,normalizeClass as s,onBeforeUnmount as c,openBlock as l,ref as u,toDisplayString as d,unref as f,withModifiers as p}from"vue";import m from"vue3-puzzle-vcode";const h={class:`c-captcha-modern`},g={class:`captcha-content`},_={class:`captcha-icon`},v={key:0},y={key:1,class:`success-icon`},b={key:2,class:`error-icon`},x={class:`captcha-text`},S={key:0},C={key:1,class:`success-text`},w={key:2,class:`error-text`};var T=e(o({name:`C_Captcha`,__name:`index`,props:{triggerText:{default:`点击进行人机验证`},images:{default:()=>[]},disabled:{type:Boolean,default:!1},theme:{default:`dark`}},emits:[`success`,`fail`,`change`,`reset`],setup(e,{expose:o,emit:T}){let E=e,D=T,O=u(!1),k=u(!1),A=u(!1),j=u(``),M=null,N=t(()=>E.images.length>0?E.images:void 0),P=()=>{E.disabled||k.value||(A.value=!1,O.value=!0)},F=()=>{k.value=!0,A.value=!1,O.value=!1;let e=Date.now(),t=`puzzle_${e}_${Math.random().toString(36).substring(2,9)}`;j.value=t,D(`success`,{token:t,timestamp:e}),D(`change`,!0)},I=()=>{k.value=!1,A.value=!0,O.value=!1,M&&clearTimeout(M),M=setTimeout(()=>{A.value=!1,M=null},3e3),D(`fail`,`拼图验证失败`),D(`change`,!1)},L=()=>{O.value=!1},R=()=>{k.value=!1,A.value=!1,O.value=!1,j.value=``,M&&=(clearTimeout(M),null),D(`reset`),D(`change`,!1)};return o({validate:()=>k.value,getToken:()=>j.value,getVerificationData:()=>k.value?{token:j.value,timestamp:Date.now(),type:`puzzle-captcha`}:null,reset:R,show:P}),c(()=>{M&&clearTimeout(M)}),(e,t)=>(l(),r(`div`,h,[i(`div`,{class:s([`captcha-trigger`,{verified:k.value,error:A.value,disabled:e.disabled}]),onClick:P},[i(`div`,g,[i(`div`,_,[!k.value&&!A.value?(l(),r(`span`,v,`🧩`)):n(`v-if`,!0),k.value?(l(),r(`span`,y,`✓`)):n(`v-if`,!0),A.value?(l(),r(`span`,b,`⚠️`)):n(`v-if`,!0)]),i(`div`,x,[!k.value&&!A.value?(l(),r(`span`,S,d(e.triggerText),1)):n(`v-if`,!0),k.value?(l(),r(`span`,C,`验证成功`)):n(`v-if`,!0),A.value?(l(),r(`span`,w,`验证失败,请重试`)):n(`v-if`,!0)])]),k.value||A.value?(l(),r(`div`,{key:0,class:`refresh-button`,onClick:p(R,[`stop`]),title:`重新验证`},` ⟲ `)):n(`v-if`,!0)],2),a(f(m),{show:O.value,imgs:N.value,onSuccess:F,onClose:L,onFail:I},null,8,[`show`,`imgs`])]))}}),[[`__scopeId`,`data-v-a4319836`]]);export{T as t};
|
|
2
2
|
//# sourceMappingURL=C_Captcha2.js.map
|