@netang/quasar 0.2.32 → 0.2.33

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (289) hide show
  1. package/.editorconfig +12 -12
  2. package/_docs/docs/components/field-table.md +58 -58
  3. package/_docs/docs/components/field-tree.md +21 -21
  4. package/_docs/docs/components/table.md +24 -24
  5. package/_docs/docs/utils/table.md +196 -196
  6. package/components/column-title/index.vue +38 -38
  7. package/components/data/index.vue +20 -20
  8. package/components/dialog/img-viewer/index.vue +697 -697
  9. package/components/dialog/index.vue +387 -387
  10. package/components/dragger/index.vue +203 -203
  11. package/components/drawer/index.vue +303 -303
  12. package/components/editor-code/index.vue +328 -328
  13. package/components/empty/index.vue +82 -82
  14. package/components/field-date/index.vue +860 -860
  15. package/components/field-date/methods.js +100 -100
  16. package/components/field-table/index.vue +1483 -1483
  17. package/components/field-text/index.vue +166 -166
  18. package/components/field-tree/index.vue +755 -755
  19. package/components/img/index.vue +279 -279
  20. package/components/input-number/index.vue +560 -560
  21. package/components/list-menu/index.vue +149 -149
  22. package/components/list-menu-item/index.vue +79 -79
  23. package/components/mixed-table/index.vue +532 -532
  24. package/components/mixed-table-splitter/index.vue +377 -377
  25. package/components/power-page/index.vue +96 -96
  26. package/components/price/index.vue +188 -188
  27. package/components/private/components/index.js +11 -11
  28. package/components/private/components/move-to-tree/index.vue +154 -154
  29. package/components/private/edit-power-data/index.vue +846 -846
  30. package/components/private/table-visible-columns-button/index.vue +114 -114
  31. package/components/render/index.vue +123 -123
  32. package/components/search/index.vue +231 -231
  33. package/components/search-item/index.vue +210 -210
  34. package/components/select/index.vue +177 -177
  35. package/components/splitter/index.vue +422 -422
  36. package/components/table/index.vue +513 -513
  37. package/components/table-column-fixed/index.vue +110 -110
  38. package/components/table-pagination/index.vue +192 -192
  39. package/components/table-summary/index.vue +107 -107
  40. package/components/thumbnail/index.vue +72 -72
  41. package/components/toolbar/index.vue +150 -150
  42. package/components/tree/index.vue +1728 -1728
  43. package/components/tree/virtual-scroll.vue +41 -41
  44. package/components/uploader/index.vue +196 -196
  45. package/components/uploader-query/index.vue +945 -945
  46. package/components/value-format/index.vue +274 -274
  47. package/components/virtual-scroll/index.vue +136 -136
  48. package/configs/area3.js +1 -1
  49. package/docs/404.html +33 -33
  50. package/docs/assets/404.html-60b35caa.js +1 -1
  51. package/docs/assets/404.html-d1e63d77.js +1 -1
  52. package/docs/assets/alert.html-b2a2a72f.js +5 -5
  53. package/docs/assets/alert.html-ba46d137.js +1 -1
  54. package/docs/assets/app-9f30aa4b.js +6 -6
  55. package/docs/assets/area.html-01b9b58d.js +42 -42
  56. package/docs/assets/area.html-9a4fce6a.js +1 -1
  57. package/docs/assets/arr.html-145d27e7.js +1 -1
  58. package/docs/assets/arr.html-674e65ab.js +11 -11
  59. package/docs/assets/auth.html-579fa830.js +1 -1
  60. package/docs/assets/auth.html-8544ed95.js +8 -8
  61. package/docs/assets/bus.html-c71254aa.js +1 -1
  62. package/docs/assets/bus.html-dc7d3d19.js +6 -6
  63. package/docs/assets/column-title.html-c735cb5a.js +3 -3
  64. package/docs/assets/column-title.html-e9316762.js +1 -1
  65. package/docs/assets/confirm.html-ddfdc27f.js +10 -10
  66. package/docs/assets/confirm.html-ef3e2bef.js +1 -1
  67. package/docs/assets/copy.html-d20345b6.js +1 -1
  68. package/docs/assets/copy.html-ef8c8571.js +13 -13
  69. package/docs/assets/data.html-6432175d.js +30 -30
  70. package/docs/assets/data.html-a3b05d5b.js +1 -1
  71. package/docs/assets/dialog.html-1f698e5a.js +1 -1
  72. package/docs/assets/dialog.html-62902b83.js +68 -68
  73. package/docs/assets/dialog.html-baea77c9.js +1 -1
  74. package/docs/assets/dialog.html-bb082fc4.js +1 -1
  75. package/docs/assets/dict.html-1311da3d.js +23 -23
  76. package/docs/assets/dict.html-b96fbf0c.js +1 -1
  77. package/docs/assets/dictOptions.html-7c4f40a5.js +1 -1
  78. package/docs/assets/dictOptions.html-fb99d175.js +5 -5
  79. package/docs/assets/dragger.html-668d3efa.js +1 -1
  80. package/docs/assets/dragger.html-749d585a.js +1 -1
  81. package/docs/assets/editor-code.html-6ab26ea9.js +1 -1
  82. package/docs/assets/editor-code.html-d196205d.js +1 -1
  83. package/docs/assets/empty.html-1c139131.js +1 -1
  84. package/docs/assets/empty.html-1e9c441d.js +1 -1
  85. package/docs/assets/field-date.html-069fdb13.js +1 -1
  86. package/docs/assets/field-date.html-ad204aa9.js +1 -1
  87. package/docs/assets/field-table.html-ce480f03.js +1 -1
  88. package/docs/assets/field-table.html-d9236160.js +1 -1
  89. package/docs/assets/field-text.html-7277c62f.js +1 -1
  90. package/docs/assets/field-text.html-ccb4cecf.js +1 -1
  91. package/docs/assets/field-tree.html-519bfb45.js +1 -1
  92. package/docs/assets/field-tree.html-fdc748d6.js +1 -1
  93. package/docs/assets/form.html-2b562c37.js +2 -2
  94. package/docs/assets/form.html-75104cd5.js +1 -1
  95. package/docs/assets/framework-204010b2.js +5 -5
  96. package/docs/assets/getData.html-990e3787.js +1 -1
  97. package/docs/assets/getData.html-bb72025f.js +34 -34
  98. package/docs/assets/getFile.html-42368004.js +1 -1
  99. package/docs/assets/getFile.html-99abd054.js +3 -3
  100. package/docs/assets/getImage.html-3429c5a1.js +1 -1
  101. package/docs/assets/getImage.html-4d886d83.js +3 -3
  102. package/docs/assets/getTime.html-7435f922.js +1 -1
  103. package/docs/assets/getTime.html-b37f49eb.js +20 -20
  104. package/docs/assets/img.html-7d1da657.js +1 -1
  105. package/docs/assets/img.html-fbea1105.js +1 -1
  106. package/docs/assets/index.html-1695dd7c.js +1 -1
  107. package/docs/assets/index.html-65a4aa67.js +1 -1
  108. package/docs/assets/index.html-7b98d5bd.js +1 -1
  109. package/docs/assets/index.html-c01f2648.js +1 -1
  110. package/docs/assets/input-number.html-0b250d2a.js +1 -1
  111. package/docs/assets/input-number.html-a8eb0378.js +1 -1
  112. package/docs/assets/list-menu-item.html-7f1b4611.js +1 -1
  113. package/docs/assets/list-menu-item.html-84ed5ab8.js +1 -1
  114. package/docs/assets/list-menu.html-28b4163f.js +1 -1
  115. package/docs/assets/list-menu.html-cb6ba95b.js +1 -1
  116. package/docs/assets/loading.html-dae9e39d.js +6 -6
  117. package/docs/assets/loading.html-dc74c9e6.js +1 -1
  118. package/docs/assets/notify.html-e6c4c514.js +1 -1
  119. package/docs/assets/notify.html-f2c4d914.js +8 -8
  120. package/docs/assets/power-page.html-32e02f82.js +1 -1
  121. package/docs/assets/power-page.html-485e77da.js +1 -1
  122. package/docs/assets/power.html-d258cc19.js +93 -93
  123. package/docs/assets/power.html-e490bd32.js +1 -1
  124. package/docs/assets/previewImage.html-6a6b4245.js +1 -1
  125. package/docs/assets/previewImage.html-c5b7e945.js +2 -2
  126. package/docs/assets/price.html-1882c548.js +19 -19
  127. package/docs/assets/price.html-94d3f5be.js +1 -1
  128. package/docs/assets/price.html-d213df0f.js +1 -1
  129. package/docs/assets/price.html-deaf880f.js +1 -1
  130. package/docs/assets/render.html-8efcbdd4.js +1 -1
  131. package/docs/assets/render.html-df228e38.js +1 -1
  132. package/docs/assets/rule.html-2cd57fc2.js +13 -13
  133. package/docs/assets/rule.html-61662001.js +1 -1
  134. package/docs/assets/ruleValid.html-04fe2552.js +1 -1
  135. package/docs/assets/ruleValid.html-e0a776af.js +14 -14
  136. package/docs/assets/search-0782d0d1.svg +1 -1
  137. package/docs/assets/search-item.html-3f75394c.js +1 -1
  138. package/docs/assets/search-item.html-4e942ecd.js +1 -1
  139. package/docs/assets/search.html-2807043e.js +1 -1
  140. package/docs/assets/search.html-c24f8806.js +1 -1
  141. package/docs/assets/select.html-00d0607c.js +1 -1
  142. package/docs/assets/select.html-de7731f5.js +1 -1
  143. package/docs/assets/splitter.html-56f51a70.js +1 -1
  144. package/docs/assets/splitter.html-f5c836d7.js +1 -1
  145. package/docs/assets/style-161e43ab.css +1 -1
  146. package/docs/assets/symbols.html-a6aea4bf.js +1 -1
  147. package/docs/assets/symbols.html-b1f65bad.js +21 -21
  148. package/docs/assets/table-column-fixed.html-3a69e7b2.js +1 -1
  149. package/docs/assets/table-column-fixed.html-e763c38b.js +1 -1
  150. package/docs/assets/table-pagination.html-236934d3.js +1 -1
  151. package/docs/assets/table-pagination.html-c37ee2ac.js +1 -1
  152. package/docs/assets/table-splitter.html-07eab15c.js +1 -1
  153. package/docs/assets/table-splitter.html-7670ee65.js +1 -1
  154. package/docs/assets/table-summary.html-04db434f.js +1 -1
  155. package/docs/assets/table-summary.html-943c65a0.js +1 -1
  156. package/docs/assets/table.html-36253ad7.js +1 -1
  157. package/docs/assets/table.html-7f9c5d1b.js +38 -38
  158. package/docs/assets/table.html-93d53dc8.js +1 -1
  159. package/docs/assets/table.html-ac99b9cb.js +1 -1
  160. package/docs/assets/thumbnail.html-bab1976b.js +1 -1
  161. package/docs/assets/thumbnail.html-eb64e5e8.js +1 -1
  162. package/docs/assets/timestamp.html-4e54f79b.js +13 -13
  163. package/docs/assets/timestamp.html-d0e1b88a.js +1 -1
  164. package/docs/assets/toast.html-58ecbe21.js +1 -1
  165. package/docs/assets/toast.html-c9b9d36b.js +6 -6
  166. package/docs/assets/toolbar.html-83d9f97c.js +1 -1
  167. package/docs/assets/toolbar.html-ff7b8c92.js +1 -1
  168. package/docs/assets/tree.html-d07cbe79.js +23 -23
  169. package/docs/assets/tree.html-ea04193e.js +1 -1
  170. package/docs/assets/uploader-query.html-05590718.js +1 -1
  171. package/docs/assets/uploader-query.html-3175bac5.js +1 -1
  172. package/docs/assets/uploader.html-36da4394.js +2 -2
  173. package/docs/assets/uploader.html-6b5f3079.js +1 -1
  174. package/docs/assets/uploader.html-b9340b57.js +1 -1
  175. package/docs/assets/uploader.html-bc1c22e3.js +1 -1
  176. package/docs/assets/value-format.html-8ae3d47d.js +1 -1
  177. package/docs/assets/value-format.html-afa99b3d.js +1 -1
  178. package/docs/components/column-title.html +35 -35
  179. package/docs/components/data.html +62 -62
  180. package/docs/components/dialog.html +33 -33
  181. package/docs/components/dragger.html +33 -33
  182. package/docs/components/editor-code.html +33 -33
  183. package/docs/components/empty.html +33 -33
  184. package/docs/components/field-date.html +33 -33
  185. package/docs/components/field-table.html +33 -33
  186. package/docs/components/field-text.html +33 -33
  187. package/docs/components/field-tree.html +33 -33
  188. package/docs/components/img.html +33 -33
  189. package/docs/components/input-number.html +33 -33
  190. package/docs/components/list-menu-item.html +33 -33
  191. package/docs/components/list-menu.html +33 -33
  192. package/docs/components/power-page.html +33 -33
  193. package/docs/components/price.html +33 -33
  194. package/docs/components/render.html +33 -33
  195. package/docs/components/search-item.html +33 -33
  196. package/docs/components/search.html +33 -33
  197. package/docs/components/select.html +33 -33
  198. package/docs/components/splitter.html +33 -33
  199. package/docs/components/table-column-fixed.html +33 -33
  200. package/docs/components/table-pagination.html +33 -33
  201. package/docs/components/table-splitter.html +33 -33
  202. package/docs/components/table-summary.html +33 -33
  203. package/docs/components/table.html +33 -33
  204. package/docs/components/thumbnail.html +33 -33
  205. package/docs/components/toolbar.html +33 -33
  206. package/docs/components/uploader-query.html +33 -33
  207. package/docs/components/uploader.html +33 -33
  208. package/docs/components/value-format.html +33 -33
  209. package/docs/css/index.css +3 -3
  210. package/docs/index.html +33 -33
  211. package/docs/utils/alert.html +37 -37
  212. package/docs/utils/area.html +74 -74
  213. package/docs/utils/arr.html +43 -43
  214. package/docs/utils/auth.html +40 -40
  215. package/docs/utils/bus.html +38 -38
  216. package/docs/utils/confirm.html +42 -42
  217. package/docs/utils/copy.html +45 -45
  218. package/docs/utils/dialog.html +100 -100
  219. package/docs/utils/dict.html +55 -55
  220. package/docs/utils/dictOptions.html +37 -37
  221. package/docs/utils/form.html +34 -34
  222. package/docs/utils/getData.html +66 -66
  223. package/docs/utils/getFile.html +35 -35
  224. package/docs/utils/getImage.html +35 -35
  225. package/docs/utils/getTime.html +52 -52
  226. package/docs/utils/index.html +33 -33
  227. package/docs/utils/loading.html +38 -38
  228. package/docs/utils/notify.html +40 -40
  229. package/docs/utils/power.html +125 -125
  230. package/docs/utils/previewImage.html +34 -34
  231. package/docs/utils/price.html +51 -51
  232. package/docs/utils/rule.html +45 -45
  233. package/docs/utils/ruleValid.html +46 -46
  234. package/docs/utils/symbols.html +53 -53
  235. package/docs/utils/table.html +70 -70
  236. package/docs/utils/timestamp.html +45 -45
  237. package/docs/utils/toast.html +38 -38
  238. package/docs/utils/tree.html +55 -55
  239. package/docs/utils/uploader.html +34 -34
  240. package/package.json +25 -25
  241. package/sass/common.scss +184 -184
  242. package/sass/index.scss +12 -12
  243. package/sass/line.scss +39 -39
  244. package/sass/quasar/btn.scss +46 -46
  245. package/sass/quasar/common.scss +3 -3
  246. package/sass/quasar/drawer.scss +6 -6
  247. package/sass/quasar/field.scss +259 -259
  248. package/sass/quasar/loading.scss +6 -6
  249. package/sass/quasar/table.scss +168 -168
  250. package/sass/quasar/toolbar.scss +22 -22
  251. package/sass/variables.scss +140 -140
  252. package/store/index.js +29 -29
  253. package/utils/$auth.js +128 -128
  254. package/utils/$form.js +72 -72
  255. package/utils/$power.js +1494 -1494
  256. package/utils/$render.js +75 -75
  257. package/utils/$rule.js +13 -13
  258. package/utils/$ruleValid.js +10 -10
  259. package/utils/$search.js +416 -416
  260. package/utils/$table.js +1351 -1348
  261. package/utils/$tree.js +682 -682
  262. package/utils/alert.js +12 -12
  263. package/utils/area.js +400 -400
  264. package/utils/arr.js +51 -51
  265. package/utils/bus.js +6 -6
  266. package/utils/config.js +66 -66
  267. package/utils/confirm.js +11 -11
  268. package/utils/copy.js +30 -30
  269. package/utils/dialog.js +36 -36
  270. package/utils/dict.js +21 -21
  271. package/utils/dictOptions.js +28 -28
  272. package/utils/getData.js +88 -88
  273. package/utils/getFile.js +67 -67
  274. package/utils/getImage.js +276 -276
  275. package/utils/getTime.js +113 -113
  276. package/utils/index.js +67 -67
  277. package/utils/loading.js +15 -15
  278. package/utils/notify.js +13 -13
  279. package/utils/play.js +40 -40
  280. package/utils/previewImage.js +14 -14
  281. package/utils/price.js +18 -18
  282. package/utils/symbols.js +18 -18
  283. package/utils/timestamp.js +18 -18
  284. package/utils/toast.js +13 -13
  285. package/utils/uploader.js +2114 -2114
  286. package/utils/useAuth.js +30 -30
  287. package/utils/useFileUrl.js +26 -26
  288. package/utils/useRouter.js +47 -47
  289. package/utils/useSearch.js +587 -562
@@ -1,96 +1,96 @@
1
- <template>
2
- <div v-if="container">
3
- <!-- 空数据 -->
4
- <n-empty
5
- :description="emptyDescription"
6
- fit
7
- html
8
- v-if="pageStatus === false"
9
- >
10
- <slot name="empty" />
11
- </n-empty>
12
- <!-- 插槽 -->
13
- <slot v-else-if="pageStatus === true" />
14
- <!-- 加载 -->
15
- <q-inner-loading
16
- :showing="pageLoading"
17
- />
18
- </div>
19
- <q-page
20
- v-bind="$attrs"
21
- v-else
22
- >
23
- <!-- 空数据 -->
24
- <n-empty
25
- :description="emptyDescription"
26
- fit
27
- html
28
- v-if="pageStatus === false"
29
- />
30
- <!-- 插槽 -->
31
- <slot v-else-if="pageStatus === true" />
32
- <!-- 加载 -->
33
- <q-inner-loading
34
- :showing="pageLoading"
35
- />
36
- </q-page>
37
- </template>
38
-
39
- <script>
40
- import { inject } from 'vue'
41
-
42
- import { NPowerKey } from '../../utils/symbols'
43
-
44
- import NEmpty from '../empty'
45
-
46
- export default {
47
-
48
- /**
49
- * 标识
50
- */
51
- name: 'NPowerPage',
52
-
53
- /**
54
- * 声明属性
55
- */
56
- props: {
57
- // 是否容器化
58
- container: Boolean,
59
- },
60
-
61
- /**
62
- * 组件
63
- */
64
- components: {
65
- NEmpty,
66
- },
67
-
68
- /**
69
- * 组合式
70
- */
71
- setup() {
72
-
73
- // ==========【数据】============================================================================================
74
-
75
- // 获取注入权限数据
76
- const {
77
- // 页面状态
78
- pageStatus,
79
- // 空状态描述
80
- emptyDescription,
81
- // 页面加载
82
- pageLoading,
83
- } = inject(NPowerKey)
84
-
85
- // ==========【返回】============================================================================================
86
- return {
87
- // 页面状态
88
- pageStatus,
89
- // 空状态描述
90
- emptyDescription,
91
- // 页面加载
92
- pageLoading,
93
- }
94
- },
95
- }
96
- </script>
1
+ <template>
2
+ <div v-if="container">
3
+ <!-- 空数据 -->
4
+ <n-empty
5
+ :description="emptyDescription"
6
+ fit
7
+ html
8
+ v-if="pageStatus === false"
9
+ >
10
+ <slot name="empty" />
11
+ </n-empty>
12
+ <!-- 插槽 -->
13
+ <slot v-else-if="pageStatus === true" />
14
+ <!-- 加载 -->
15
+ <q-inner-loading
16
+ :showing="pageLoading"
17
+ />
18
+ </div>
19
+ <q-page
20
+ v-bind="$attrs"
21
+ v-else
22
+ >
23
+ <!-- 空数据 -->
24
+ <n-empty
25
+ :description="emptyDescription"
26
+ fit
27
+ html
28
+ v-if="pageStatus === false"
29
+ />
30
+ <!-- 插槽 -->
31
+ <slot v-else-if="pageStatus === true" />
32
+ <!-- 加载 -->
33
+ <q-inner-loading
34
+ :showing="pageLoading"
35
+ />
36
+ </q-page>
37
+ </template>
38
+
39
+ <script>
40
+ import { inject } from 'vue'
41
+
42
+ import { NPowerKey } from '../../utils/symbols'
43
+
44
+ import NEmpty from '../empty'
45
+
46
+ export default {
47
+
48
+ /**
49
+ * 标识
50
+ */
51
+ name: 'NPowerPage',
52
+
53
+ /**
54
+ * 声明属性
55
+ */
56
+ props: {
57
+ // 是否容器化
58
+ container: Boolean,
59
+ },
60
+
61
+ /**
62
+ * 组件
63
+ */
64
+ components: {
65
+ NEmpty,
66
+ },
67
+
68
+ /**
69
+ * 组合式
70
+ */
71
+ setup() {
72
+
73
+ // ==========【数据】============================================================================================
74
+
75
+ // 获取注入权限数据
76
+ const {
77
+ // 页面状态
78
+ pageStatus,
79
+ // 空状态描述
80
+ emptyDescription,
81
+ // 页面加载
82
+ pageLoading,
83
+ } = inject(NPowerKey)
84
+
85
+ // ==========【返回】============================================================================================
86
+ return {
87
+ // 页面状态
88
+ pageStatus,
89
+ // 空状态描述
90
+ emptyDescription,
91
+ // 页面加载
92
+ pageLoading,
93
+ }
94
+ },
95
+ }
96
+ </script>
@@ -1,188 +1,188 @@
1
- <template>
2
- <div class="n-price">
3
- <!-- 价格符号 -->
4
- <span v-if="sign" :style="signStyle">{{sign}}</span>
5
- <!-- 价格 -->
6
- <span :style="priceStyle">{{currentPrice.main}}</span>
7
- <!-- 价格后缀 -->
8
- <span :style="signStyle" v-if="currentPrice.odd">{{currentPrice.odd}}</span>
9
- <!-- 删除价格 -->
10
- <span class="n-price__del" :style="[
11
- signBaseStyle,
12
- {
13
- marginLeft: toPx(delPriceMarginLeft),
14
- color: delPriceColor,
15
- }
16
- ]" v-if="delPrice && delPrice > price">{{sign}}{{getPrice(delPrice)}}</span>
17
- </div>
18
- </template>
19
-
20
- <script>
21
- import { computed } from 'vue'
22
-
23
- import $n_px from '@netang/utils/px'
24
- import $n_split from '@netang/utils/split'
25
-
26
- import $n_price from '../../utils/price'
27
-
28
- export default {
29
-
30
- /**
31
- * 标识
32
- */
33
- name: 'NPrice',
34
-
35
- /**
36
- * 声明属性
37
- */
38
- props: {
39
- // 颜色
40
- color: {
41
- type: String,
42
- default: '#ff3750',
43
- },
44
- // 删除价格颜色
45
- delPriceColor: {
46
- type: String,
47
- default: '#999999',
48
- },
49
- // 价格符号
50
- sign: {
51
- type: [ String, Boolean ],
52
- default: '¥'
53
- },
54
- // 价格符号大小
55
- signSize: {
56
- type: Number,
57
- default: 12,
58
- },
59
- // 价格符号是否加粗
60
- signBold: {
61
- type: Boolean,
62
- default: true,
63
- },
64
- // 价格
65
- price: [ String, Number ],
66
- // 最高价格
67
- maxPrice: [ String, Number ],
68
- // 删除价格
69
- delPrice: [ String, Number ],
70
- // 删除价格左边距
71
- delPriceMarginLeft: {
72
- type: [ String, Number ],
73
- default: 8,
74
- },
75
- // 价格符号大小
76
- priceSize: {
77
- type: Number,
78
- default: 16,
79
- },
80
- // 价格是否加粗
81
- priceBold: {
82
- type: Boolean,
83
- default: true,
84
- },
85
- },
86
-
87
- /**
88
- * 组合式
89
- */
90
- setup(props) {
91
-
92
- // ==========【计算属性】==========================================================================================
93
-
94
- /**
95
- * 当前价格
96
- */
97
- const currentPrice = computed(function () {
98
-
99
- const price = $n_price(props.price)
100
- const arr = $n_split(String(price), '.')
101
-
102
- return {
103
- main: arr[0],
104
- odd: arr.length > 1 ? '.' + arr[1] : ''
105
- }
106
- })
107
-
108
- /**
109
- * 价格符号基础样式
110
- */
111
- const signBaseStyle = computed(function () {
112
- return {
113
- fontSize: $n_px(props.signSize),
114
- marginBottom: $n_px((props.priceSize - props.signSize) * 0.5 / 2),
115
- }
116
- })
117
-
118
- /**
119
- * 价格符号样式
120
- */
121
- const signStyle = computed(function () {
122
-
123
- const style = {
124
- color: props.color,
125
- }
126
-
127
- if (props.signBold) {
128
- style.fontWeight = 'bold'
129
- }
130
-
131
- return [
132
- style,
133
- signBaseStyle.value,
134
- ]
135
- })
136
-
137
- /**
138
- * 价格样式
139
- */
140
- const priceStyle = computed(function () {
141
-
142
- const style = {
143
- color: props.color,
144
- fontSize: $n_px(props.priceSize),
145
- }
146
-
147
- if (props.priceBold) {
148
- style.fontWeight = 'bold'
149
- }
150
-
151
- return style
152
- })
153
-
154
- // ==========【方法】=============================================================================================
155
-
156
- return {
157
- // 当前价格
158
- currentPrice,
159
- // 价格符号基础样式
160
- signBaseStyle,
161
- // 价格符号样式
162
- signStyle,
163
- // 价格样式
164
- priceStyle,
165
-
166
- // 转为像素
167
- toPx: $n_px,
168
- // 获取价格
169
- getPrice: $n_price
170
- }
171
- },
172
- }
173
- </script>
174
-
175
- <style lang="scss">
176
-
177
- .n-price {
178
- display: flex;
179
- flex-direction: row;
180
- align-items: flex-end;
181
-
182
- // 删除价格
183
- &__del {
184
- text-decoration: line-through;
185
- }
186
- }
187
-
188
- </style>
1
+ <template>
2
+ <div class="n-price">
3
+ <!-- 价格符号 -->
4
+ <span v-if="sign" :style="signStyle">{{sign}}</span>
5
+ <!-- 价格 -->
6
+ <span :style="priceStyle">{{currentPrice.main}}</span>
7
+ <!-- 价格后缀 -->
8
+ <span :style="signStyle" v-if="currentPrice.odd">{{currentPrice.odd}}</span>
9
+ <!-- 删除价格 -->
10
+ <span class="n-price__del" :style="[
11
+ signBaseStyle,
12
+ {
13
+ marginLeft: toPx(delPriceMarginLeft),
14
+ color: delPriceColor,
15
+ }
16
+ ]" v-if="delPrice && delPrice > price">{{sign}}{{getPrice(delPrice)}}</span>
17
+ </div>
18
+ </template>
19
+
20
+ <script>
21
+ import { computed } from 'vue'
22
+
23
+ import $n_px from '@netang/utils/px'
24
+ import $n_split from '@netang/utils/split'
25
+
26
+ import $n_price from '../../utils/price'
27
+
28
+ export default {
29
+
30
+ /**
31
+ * 标识
32
+ */
33
+ name: 'NPrice',
34
+
35
+ /**
36
+ * 声明属性
37
+ */
38
+ props: {
39
+ // 颜色
40
+ color: {
41
+ type: String,
42
+ default: '#ff3750',
43
+ },
44
+ // 删除价格颜色
45
+ delPriceColor: {
46
+ type: String,
47
+ default: '#999999',
48
+ },
49
+ // 价格符号
50
+ sign: {
51
+ type: [ String, Boolean ],
52
+ default: '¥'
53
+ },
54
+ // 价格符号大小
55
+ signSize: {
56
+ type: Number,
57
+ default: 12,
58
+ },
59
+ // 价格符号是否加粗
60
+ signBold: {
61
+ type: Boolean,
62
+ default: true,
63
+ },
64
+ // 价格
65
+ price: [ String, Number ],
66
+ // 最高价格
67
+ maxPrice: [ String, Number ],
68
+ // 删除价格
69
+ delPrice: [ String, Number ],
70
+ // 删除价格左边距
71
+ delPriceMarginLeft: {
72
+ type: [ String, Number ],
73
+ default: 8,
74
+ },
75
+ // 价格符号大小
76
+ priceSize: {
77
+ type: Number,
78
+ default: 16,
79
+ },
80
+ // 价格是否加粗
81
+ priceBold: {
82
+ type: Boolean,
83
+ default: true,
84
+ },
85
+ },
86
+
87
+ /**
88
+ * 组合式
89
+ */
90
+ setup(props) {
91
+
92
+ // ==========【计算属性】==========================================================================================
93
+
94
+ /**
95
+ * 当前价格
96
+ */
97
+ const currentPrice = computed(function () {
98
+
99
+ const price = $n_price(props.price)
100
+ const arr = $n_split(String(price), '.')
101
+
102
+ return {
103
+ main: arr[0],
104
+ odd: arr.length > 1 ? '.' + arr[1] : ''
105
+ }
106
+ })
107
+
108
+ /**
109
+ * 价格符号基础样式
110
+ */
111
+ const signBaseStyle = computed(function () {
112
+ return {
113
+ fontSize: $n_px(props.signSize),
114
+ marginBottom: $n_px((props.priceSize - props.signSize) * 0.5 / 2),
115
+ }
116
+ })
117
+
118
+ /**
119
+ * 价格符号样式
120
+ */
121
+ const signStyle = computed(function () {
122
+
123
+ const style = {
124
+ color: props.color,
125
+ }
126
+
127
+ if (props.signBold) {
128
+ style.fontWeight = 'bold'
129
+ }
130
+
131
+ return [
132
+ style,
133
+ signBaseStyle.value,
134
+ ]
135
+ })
136
+
137
+ /**
138
+ * 价格样式
139
+ */
140
+ const priceStyle = computed(function () {
141
+
142
+ const style = {
143
+ color: props.color,
144
+ fontSize: $n_px(props.priceSize),
145
+ }
146
+
147
+ if (props.priceBold) {
148
+ style.fontWeight = 'bold'
149
+ }
150
+
151
+ return style
152
+ })
153
+
154
+ // ==========【方法】=============================================================================================
155
+
156
+ return {
157
+ // 当前价格
158
+ currentPrice,
159
+ // 价格符号基础样式
160
+ signBaseStyle,
161
+ // 价格符号样式
162
+ signStyle,
163
+ // 价格样式
164
+ priceStyle,
165
+
166
+ // 转为像素
167
+ toPx: $n_px,
168
+ // 获取价格
169
+ getPrice: $n_price
170
+ }
171
+ },
172
+ }
173
+ </script>
174
+
175
+ <style lang="scss">
176
+
177
+ .n-price {
178
+ display: flex;
179
+ flex-direction: row;
180
+ align-items: flex-end;
181
+
182
+ // 删除价格
183
+ &__del {
184
+ text-decoration: line-through;
185
+ }
186
+ }
187
+
188
+ </style>
@@ -1,11 +1,11 @@
1
- import { configs } from '../../../utils/config'
2
-
3
- const {
4
- // 对话框组件
5
- dialogComponents,
6
- } = configs
7
-
8
- export default {
9
- moveToTree: () => import('./move-to-tree'),
10
- ...dialogComponents,
11
- }
1
+ import { configs } from '../../../utils/config'
2
+
3
+ const {
4
+ // 对话框组件
5
+ dialogComponents,
6
+ } = configs
7
+
8
+ export default {
9
+ moveToTree: () => import('./move-to-tree'),
10
+ ...dialogComponents,
11
+ }