vxe-pc-ui 4.5.36 → 4.6.0

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 (306) hide show
  1. package/es/calendar/src/calendar.js +1 -1
  2. package/es/components.js +6 -0
  3. package/es/date-panel/index.js +12 -0
  4. package/es/date-panel/src/date-panel.js +1587 -0
  5. package/es/date-panel/src/util.js +191 -0
  6. package/es/date-panel/style.css +443 -0
  7. package/es/date-panel/style.min.css +1 -0
  8. package/es/date-picker/index.js +0 -1
  9. package/es/date-picker/src/date-picker.js +274 -1663
  10. package/es/date-picker/style.css +68 -810
  11. package/es/date-picker/style.min.css +1 -1
  12. package/es/date-range-picker/index.js +12 -0
  13. package/es/date-range-picker/src/date-range-picker.js +1121 -0
  14. package/es/date-range-picker/style.css +284 -0
  15. package/es/date-range-picker/style.min.css +1 -0
  16. package/es/form/render/index.js +21 -15
  17. package/es/icon/style.css +1 -1
  18. package/es/input/src/input.js +1 -1
  19. package/es/language/ar-EG.js +1 -1
  20. package/es/language/de-DE.js +1 -1
  21. package/es/language/en-US.js +1 -1
  22. package/es/language/es-ES.js +1 -1
  23. package/es/language/fr-FR.d.ts +2 -0
  24. package/es/language/fr-FR.js +1 -1
  25. package/es/language/hu-HU.js +1 -1
  26. package/es/language/hy-AM.d.ts +2 -0
  27. package/es/language/hy-AM.js +1 -1
  28. package/es/language/id-ID.d.ts +2 -0
  29. package/es/language/id-ID.js +1 -1
  30. package/es/language/it-IT.d.ts +2 -0
  31. package/es/language/it-IT.js +1 -1
  32. package/es/language/ja-JP.js +1 -1
  33. package/es/language/ko-KR.js +1 -1
  34. package/es/language/ms-MY.d.ts +2 -0
  35. package/es/language/ms-MY.js +708 -0
  36. package/es/language/nb-NO.d.ts +2 -0
  37. package/es/language/nb-NO.js +1 -1
  38. package/es/language/pt-BR.js +1 -1
  39. package/es/language/ru-RU.js +1 -1
  40. package/es/language/th-TH.d.ts +2 -0
  41. package/es/language/th-TH.js +1 -1
  42. package/es/language/ug-CN.d.ts +2 -0
  43. package/es/language/ug-CN.js +1 -1
  44. package/es/language/uk-UA.js +1 -1
  45. package/es/language/uz-UZ.d.ts +2 -0
  46. package/es/language/uz-UZ.js +708 -0
  47. package/es/language/vi-VN.d.ts +2 -0
  48. package/es/language/vi-VN.js +1 -1
  49. package/es/language/zh-CHT.d.ts +2 -0
  50. package/es/language/zh-CHT.js +1 -1
  51. package/es/language/zh-CN.js +1 -1
  52. package/es/print/src/print.js +4 -0
  53. package/es/print/src/util.js +46 -3
  54. package/es/pulldown/style.css +15 -0
  55. package/es/pulldown/style.min.css +1 -1
  56. package/es/select/style.css +15 -0
  57. package/es/select/style.min.css +1 -1
  58. package/es/style.css +1 -1
  59. package/es/style.min.css +1 -1
  60. package/es/table-select/style.css +15 -0
  61. package/es/table-select/style.min.css +1 -1
  62. package/es/tree-select/style.css +15 -0
  63. package/es/tree-select/style.min.css +1 -1
  64. package/es/ui/index.js +31 -6
  65. package/es/ui/src/log.js +1 -1
  66. package/es/vxe-date-panel/index.js +3 -0
  67. package/es/vxe-date-panel/style.css +443 -0
  68. package/es/vxe-date-panel/style.min.css +1 -0
  69. package/es/vxe-date-picker/style.css +68 -810
  70. package/es/vxe-date-picker/style.min.css +1 -1
  71. package/es/vxe-date-range-picker/index.js +3 -0
  72. package/es/vxe-date-range-picker/style.css +284 -0
  73. package/es/vxe-date-range-picker/style.min.css +1 -0
  74. package/es/vxe-pulldown/style.css +15 -0
  75. package/es/vxe-pulldown/style.min.css +1 -1
  76. package/es/vxe-select/style.css +15 -0
  77. package/es/vxe-select/style.min.css +1 -1
  78. package/es/vxe-table-select/style.css +15 -0
  79. package/es/vxe-table-select/style.min.css +1 -1
  80. package/es/vxe-tree-select/style.css +15 -0
  81. package/es/vxe-tree-select/style.min.css +1 -1
  82. package/lib/calendar/src/calendar.js +1 -1
  83. package/lib/calendar/src/calendar.min.js +1 -1
  84. package/lib/components.js +25 -1
  85. package/lib/components.min.js +1 -1
  86. package/lib/date-panel/index.js +19 -0
  87. package/lib/date-panel/index.min.js +1 -0
  88. package/lib/date-panel/src/date-panel.js +1667 -0
  89. package/lib/date-panel/src/date-panel.min.js +1 -0
  90. package/lib/date-panel/src/util.js +219 -0
  91. package/lib/date-panel/src/util.min.js +1 -0
  92. package/lib/date-panel/style/index.js +1 -0
  93. package/lib/date-panel/style/style.css +443 -0
  94. package/lib/date-panel/style/style.min.css +1 -0
  95. package/lib/date-picker/index.js +0 -1
  96. package/lib/date-picker/index.min.js +1 -1
  97. package/lib/date-picker/src/date-picker.js +288 -1717
  98. package/lib/date-picker/src/date-picker.min.js +1 -1
  99. package/lib/date-picker/style/style.css +68 -810
  100. package/lib/date-picker/style/style.min.css +1 -1
  101. package/lib/date-range-picker/index.js +19 -0
  102. package/lib/date-range-picker/index.min.js +1 -0
  103. package/lib/date-range-picker/src/date-range-picker.js +1194 -0
  104. package/lib/date-range-picker/src/date-range-picker.min.js +1 -0
  105. package/lib/date-range-picker/style/index.js +1 -0
  106. package/lib/date-range-picker/style/style.css +284 -0
  107. package/lib/date-range-picker/style/style.min.css +1 -0
  108. package/lib/form/render/index.js +21 -15
  109. package/lib/form/render/index.min.js +1 -1
  110. package/lib/icon/style/style.css +1 -1
  111. package/lib/icon/style/style.min.css +1 -1
  112. package/lib/index.umd.js +2954 -1252
  113. package/lib/index.umd.min.js +1 -1
  114. package/lib/input/src/input.js +1 -1
  115. package/lib/input/src/input.min.js +1 -1
  116. package/lib/language/ar-EG.d.ts +2 -0
  117. package/lib/language/ar-EG.js +1 -1
  118. package/lib/language/ar-EG.min.js +1 -1
  119. package/lib/language/ar-EG.umd.js +728 -0
  120. package/lib/language/de-DE.d.ts +2 -0
  121. package/lib/language/de-DE.js +1 -1
  122. package/lib/language/de-DE.min.js +1 -1
  123. package/lib/language/de-DE.umd.js +728 -0
  124. package/lib/language/en-US.js +1 -1
  125. package/lib/language/en-US.min.js +1 -1
  126. package/lib/language/en-US.umd.js +1 -1
  127. package/lib/language/es-ES.js +1 -1
  128. package/lib/language/es-ES.min.js +1 -1
  129. package/lib/language/es-ES.umd.js +1 -1
  130. package/lib/language/fr-FR.d.ts +2 -0
  131. package/lib/language/fr-FR.js +1 -1
  132. package/lib/language/fr-FR.min.js +1 -1
  133. package/lib/language/fr-FR.umd.js +728 -0
  134. package/lib/language/hu-HU.js +1 -1
  135. package/lib/language/hu-HU.min.js +1 -1
  136. package/lib/language/hu-HU.umd.js +1 -1
  137. package/lib/language/hy-AM.d.ts +2 -0
  138. package/lib/language/hy-AM.js +1 -1
  139. package/lib/language/hy-AM.min.js +1 -1
  140. package/lib/language/hy-AM.umd.js +728 -0
  141. package/lib/language/id-ID.d.ts +2 -0
  142. package/lib/language/id-ID.js +1 -1
  143. package/lib/language/id-ID.min.js +1 -1
  144. package/lib/language/id-ID.umd.js +728 -0
  145. package/lib/language/it-IT.d.ts +2 -0
  146. package/lib/language/it-IT.js +1 -1
  147. package/lib/language/it-IT.min.js +1 -1
  148. package/lib/language/it-IT.umd.js +728 -0
  149. package/lib/language/ja-JP.js +1 -1
  150. package/lib/language/ja-JP.min.js +1 -1
  151. package/lib/language/ja-JP.umd.js +1 -1
  152. package/lib/language/ko-KR.js +1 -1
  153. package/lib/language/ko-KR.min.js +1 -1
  154. package/lib/language/ko-KR.umd.js +1 -1
  155. package/lib/language/ms-MY.d.ts +2 -0
  156. package/lib/language/ms-MY.js +714 -0
  157. package/lib/language/ms-MY.min.js +1 -0
  158. package/lib/language/ms-MY.umd.js +728 -0
  159. package/lib/language/nb-NO.d.ts +2 -0
  160. package/lib/language/nb-NO.js +1 -1
  161. package/lib/language/nb-NO.min.js +1 -1
  162. package/lib/language/nb-NO.umd.js +728 -0
  163. package/lib/language/pt-BR.js +1 -1
  164. package/lib/language/pt-BR.min.js +1 -1
  165. package/lib/language/pt-BR.umd.js +1 -1
  166. package/lib/language/ru-RU.js +1 -1
  167. package/lib/language/ru-RU.min.js +1 -1
  168. package/lib/language/ru-RU.umd.js +1 -1
  169. package/lib/language/th-TH.d.ts +2 -0
  170. package/lib/language/th-TH.js +1 -1
  171. package/lib/language/th-TH.min.js +1 -1
  172. package/lib/language/th-TH.umd.js +728 -0
  173. package/lib/language/ug-CN.d.ts +2 -0
  174. package/lib/language/ug-CN.js +1 -1
  175. package/lib/language/ug-CN.min.js +1 -1
  176. package/lib/language/ug-CN.umd.js +728 -0
  177. package/lib/language/uk-UA.js +1 -1
  178. package/lib/language/uk-UA.min.js +1 -1
  179. package/lib/language/uk-UA.umd.js +1 -1
  180. package/lib/language/uz-UZ.d.ts +2 -0
  181. package/lib/language/uz-UZ.js +714 -0
  182. package/lib/language/uz-UZ.min.js +1 -0
  183. package/lib/language/uz-UZ.umd.js +728 -0
  184. package/lib/language/vi-VN.d.ts +2 -0
  185. package/lib/language/vi-VN.js +1 -1
  186. package/lib/language/vi-VN.min.js +1 -1
  187. package/lib/language/vi-VN.umd.js +728 -0
  188. package/lib/language/zh-CHT.d.ts +2 -0
  189. package/lib/language/zh-CHT.js +1 -1
  190. package/lib/language/zh-CHT.min.js +1 -1
  191. package/lib/language/zh-CHT.umd.js +728 -0
  192. package/lib/language/zh-CN.js +1 -1
  193. package/lib/language/zh-CN.min.js +1 -1
  194. package/lib/language/zh-CN.umd.js +1 -1
  195. package/lib/language/zh-TC.min.js +1 -1
  196. package/lib/print/src/print.js +4 -0
  197. package/lib/print/src/print.min.js +1 -1
  198. package/lib/print/src/util.js +45 -2
  199. package/lib/print/src/util.min.js +1 -1
  200. package/lib/pulldown/style/style.css +15 -0
  201. package/lib/pulldown/style/style.min.css +1 -1
  202. package/lib/select/style/style.css +15 -0
  203. package/lib/select/style/style.min.css +1 -1
  204. package/lib/style.css +1 -1
  205. package/lib/style.min.css +1 -1
  206. package/lib/table-select/style/style.css +15 -0
  207. package/lib/table-select/style/style.min.css +1 -1
  208. package/lib/tree-select/style/style.css +15 -0
  209. package/lib/tree-select/style/style.min.css +1 -1
  210. package/lib/ui/index.js +31 -6
  211. package/lib/ui/index.min.js +1 -1
  212. package/lib/ui/src/log.js +1 -1
  213. package/lib/ui/src/log.min.js +1 -1
  214. package/lib/vxe-date-panel/index.js +22 -0
  215. package/lib/vxe-date-panel/index.min.js +1 -0
  216. package/lib/vxe-date-panel/style/index.js +1 -0
  217. package/lib/vxe-date-panel/style/style.css +443 -0
  218. package/lib/vxe-date-panel/style/style.min.css +1 -0
  219. package/lib/vxe-date-picker/style/style.css +68 -810
  220. package/lib/vxe-date-picker/style/style.min.css +1 -1
  221. package/lib/vxe-date-range-picker/index.js +22 -0
  222. package/lib/vxe-date-range-picker/index.min.js +1 -0
  223. package/lib/vxe-date-range-picker/style/index.js +1 -0
  224. package/lib/vxe-date-range-picker/style/style.css +284 -0
  225. package/lib/vxe-date-range-picker/style/style.min.css +1 -0
  226. package/lib/vxe-pulldown/style/style.css +15 -0
  227. package/lib/vxe-pulldown/style/style.min.css +1 -1
  228. package/lib/vxe-select/style/style.css +15 -0
  229. package/lib/vxe-select/style/style.min.css +1 -1
  230. package/lib/vxe-table-select/style/style.css +15 -0
  231. package/lib/vxe-table-select/style/style.min.css +1 -1
  232. package/lib/vxe-tree-select/style/style.css +15 -0
  233. package/lib/vxe-tree-select/style/style.min.css +1 -1
  234. package/package.json +4 -5
  235. package/packages/calendar/src/calendar.ts +10 -10
  236. package/packages/components.ts +6 -0
  237. package/packages/date-panel/index.ts +16 -0
  238. package/packages/date-panel/src/date-panel.ts +1654 -0
  239. package/packages/date-panel/src/util.ts +212 -0
  240. package/packages/date-picker/index.ts +0 -1
  241. package/packages/date-picker/src/date-picker.ts +298 -1697
  242. package/packages/date-range-picker/index.ts +16 -0
  243. package/packages/date-range-picker/src/date-range-picker.ts +1196 -0
  244. package/packages/form/render/index.ts +21 -15
  245. package/packages/input/src/input.ts +15 -15
  246. package/packages/language/ar-EG.ts +1 -1
  247. package/packages/language/de-DE.ts +1 -1
  248. package/packages/language/en-US.ts +1 -1
  249. package/packages/language/es-ES.ts +1 -1
  250. package/packages/language/fr-FR.ts +1 -1
  251. package/packages/language/hu-HU.ts +1 -1
  252. package/packages/language/hy-AM.ts +1 -1
  253. package/packages/language/id-ID.ts +1 -1
  254. package/packages/language/it-IT.ts +1 -1
  255. package/packages/language/ja-JP.ts +1 -1
  256. package/packages/language/ko-KR.ts +1 -1
  257. package/packages/language/ms-MY.ts +708 -0
  258. package/packages/language/nb-NO.ts +1 -1
  259. package/packages/language/pt-BR.ts +1 -1
  260. package/packages/language/ru-RU.ts +1 -1
  261. package/packages/language/th-TH.ts +1 -1
  262. package/packages/language/ug-CN.ts +1 -1
  263. package/packages/language/uk-UA.ts +1 -1
  264. package/packages/language/uz-UZ.ts +708 -0
  265. package/packages/language/vi-VN.ts +1 -1
  266. package/packages/language/zh-CHT.ts +1 -1
  267. package/packages/language/zh-CN.ts +1 -1
  268. package/packages/print/src/print.ts +4 -0
  269. package/packages/print/src/util.ts +47 -4
  270. package/packages/ui/index.ts +30 -5
  271. package/styles/all.scss +2 -0
  272. package/styles/components/date-panel.scss +491 -0
  273. package/styles/components/date-picker.scss +62 -652
  274. package/styles/components/date-range-picker.scss +284 -0
  275. package/styles/components/pulldown.scss +10 -0
  276. package/styles/components/select.scss +8 -0
  277. package/styles/components/table-select.scss +8 -0
  278. package/styles/components/tree-select.scss +8 -0
  279. package/styles/helpers/baseMixin.scss +13 -0
  280. package/types/all.d.ts +6 -0
  281. package/types/components/button-group.d.ts +1 -1
  282. package/types/components/date-panel.d.ts +240 -0
  283. package/types/components/date-picker.d.ts +35 -142
  284. package/types/components/date-range-picker.d.ts +267 -0
  285. package/types/components/print.d.ts +8 -0
  286. package/types/ui/commands.d.ts +28 -2
  287. package/types/ui/global-config.d.ts +4 -0
  288. package/es/date-picker/src/util.js +0 -41
  289. package/lib/date-picker/src/util.js +0 -46
  290. package/lib/date-picker/src/util.min.js +0 -1
  291. package/lib/language/zh-TC.umd.js +0 -23
  292. package/packages/date-picker/src/util.ts +0 -42
  293. /package/es/icon/{iconfont.1746417522210.ttf → iconfont.1746782659171.ttf} +0 -0
  294. /package/es/icon/{iconfont.1746417522210.woff → iconfont.1746782659171.woff} +0 -0
  295. /package/es/icon/{iconfont.1746417522210.woff2 → iconfont.1746782659171.woff2} +0 -0
  296. /package/es/{iconfont.1746417522210.ttf → iconfont.1746782659171.ttf} +0 -0
  297. /package/es/{iconfont.1746417522210.woff → iconfont.1746782659171.woff} +0 -0
  298. /package/es/{iconfont.1746417522210.woff2 → iconfont.1746782659171.woff2} +0 -0
  299. /package/es/language/{zh-TC.d.ts → ar-EG.d.ts} +0 -0
  300. /package/{lib/language/zh-TC.d.ts → es/language/de-DE.d.ts} +0 -0
  301. /package/lib/icon/style/{iconfont.1746417522210.ttf → iconfont.1746782659171.ttf} +0 -0
  302. /package/lib/icon/style/{iconfont.1746417522210.woff → iconfont.1746782659171.woff} +0 -0
  303. /package/lib/icon/style/{iconfont.1746417522210.woff2 → iconfont.1746782659171.woff2} +0 -0
  304. /package/lib/{iconfont.1746417522210.ttf → iconfont.1746782659171.ttf} +0 -0
  305. /package/lib/{iconfont.1746417522210.woff → iconfont.1746782659171.woff} +0 -0
  306. /package/lib/{iconfont.1746417522210.woff2 → iconfont.1746782659171.woff2} +0 -0
package/packages/language/vi-VN.ts CHANGED
@@ -272,7 +272,7 @@ export default {
272
272
  year: 'yyyy'
273
273
  },
274
274
  weeks: {
275
- w: 'Tuần',
275
+ w: '',
276
276
  w0: 'Mặt trời',
277
277
  w1: 'Mon',
278
278
  w2: 'TUE',
package/packages/language/zh-CHT.ts CHANGED
@@ -272,7 +272,7 @@ export default {
272
272
  year: 'yyyy'
273
273
  },
274
274
  weeks: {
275
- w: '週',
275
+ w: '',
276
276
  w0: '週日',
277
277
  w1: '週一',
278
278
  w2: '週二',
package/packages/language/zh-CN.ts CHANGED
@@ -272,7 +272,7 @@ export default {
272
272
  year: 'yyyy'
273
273
  },
274
274
  weeks: {
275
- w: '周',
275
+ w: '',
276
276
  w0: '周日',
277
277
  w1: '周一',
278
278
  w2: '周二',
package/packages/print/src/print.ts CHANGED
@@ -38,6 +38,10 @@ export default defineComponent({
38
38
  type: Boolean as PropType<VxePrintPropTypes.ShowAllPageTitle>,
39
39
  default: () => getConfig().print.showAllPageTitle
40
40
  },
41
+ pageStyle: {
42
+ type: Object as PropType<VxePrintPropTypes.PageStyle>,
43
+ default: () => getConfig().print.pageStyle
44
+ },
41
45
  customStyle: {
42
46
  type: String as PropType<VxePrintPropTypes.CustomStyle>,
43
47
  default: () => getConfig().print.customStyle
package/packages/print/src/util.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import XEUtils from 'xe-utils'
2
+ import { toCssUnit } from '../../ui/src/dom'
2
3
 
3
- import type { VxePrintProps, VxePrintDefines, VxePrintConstructor, VxePrintPrivateMethods } from '../../../types'
4
+ import type { VxePrintProps, VxePrintPropTypes, VxePrintDefines, VxePrintConstructor, VxePrintPrivateMethods } from '../../../types'
4
5
 
5
6
  const browseObj = XEUtils.browse()
6
7
 
@@ -42,17 +43,59 @@ function getExportBlobByString (str: string, type: string) {
42
43
  return new Blob([str], { type: `text/${type};charset=utf-8;` })
43
44
  }
44
45
 
45
- const printMargin = 80
46
+ const defaultPrintMargin = 50
47
+
48
+ function parseMargin (val?: string | number | null | VxePrintPropTypes.PageStyle) {
49
+ let mVal: string | number = defaultPrintMargin
50
+ let top: string | number = mVal
51
+ let bottom: string | number = mVal
52
+ let left: string | number = mVal
53
+ let right: string | number = mVal
54
+ if (XEUtils.isString(val) || XEUtils.isNumber(val)) {
55
+ mVal = val
56
+ top = mVal
57
+ bottom = mVal
58
+ left = mVal
59
+ right = mVal
60
+ } else if (XEUtils.isPlainObject(val)) {
61
+ if (val.margin) {
62
+ mVal = val.margin
63
+ top = mVal
64
+ bottom = mVal
65
+ left = mVal
66
+ right = mVal
67
+ }
68
+ if (val.marginTop) {
69
+ top = val.marginTop
70
+ }
71
+ if (val.marginBottom) {
72
+ bottom = val.marginBottom
73
+ }
74
+ if (val.marginLeft) {
75
+ left = val.marginLeft
76
+ }
77
+ if (val.marginRight) {
78
+ right = val.marginRight
79
+ }
80
+ }
81
+ return {
82
+ top: toCssUnit(top),
83
+ bottom: toCssUnit(bottom),
84
+ left: toCssUnit(left),
85
+ right: toCssUnit(right)
86
+ }
87
+ }
46
88
 
47
89
  function createHtmlPage (opts: VxePrintProps & { _pageBreaks: boolean }, printHtml: string): string {
48
- const { customStyle } = opts
90
+ const { pageStyle, customStyle } = opts
91
+ const marginObj = parseMargin(pageStyle)
49
92
  return [
50
93
  '<!DOCTYPE html><html>',
51
94
  '<head>',
52
95
  '<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,minimal-ui">',
53
96
  `<title>${opts.title || ''}</title>`,
54
97
  opts._pageBreaks || (opts.pageBreaks && opts.pageBreaks.length) ? '<style media="print">@page {size: auto;margin: 0mm;}</style>' : '',
55
- `<style>.vxe-print-slots{display: none;}.vxe-print-page-break.align--center{text-align:center;}.vxe-print-page-break.align--left{text-align:left;}.vxe-print-page-break.align--right{text-align:right;}.vxe-print-page-break--header-title{font-size:1.8em;text-align:center;line-height:${printMargin}px;}.vxe-print-page-break{page-break-before:always;display:flex;flex-direction:column;height:100vh;overflow:hidden;}.vxe-print-page-break--body{display:flex;flex-direction:row;flex-grow:1;overflow: hidden;}.vxe-print-page-break--left,.vxe-print-page-break--right{flex-shrink:0;width:${printMargin}px;height:100%;}.vxe-print-page-break--header,.vxe-print-page-break--footer{flex-shrink:0;height:${printMargin}px;width:100%;}.vxe-print-page-break--content{flex-grow: 1;overflow: hidden;}.vxe-print-page-break--footer-page-number{line-height:${printMargin}px;text-align:center;}</style>`,
98
+ `<style>.vxe-print-slots{display: none;}.vxe-print-page-break.align--center{text-align:center;}.vxe-print-page-break.align--left{text-align:left;}.vxe-print-page-break.align--right{text-align:right;}.vxe-print-page-break--header-title{font-size:1.8em;line-height:${marginObj.top || 'normal'};text-align:center;}.vxe-print-page-break{page-break-before:always;display:flex;flex-direction:column;height:100vh;overflow:hidden;}.vxe-print-page-break--body{display:flex;flex-direction:row;flex-grow:1;overflow: hidden;}.vxe-print-page-break--left,.vxe-print-page-break--right{flex-shrink:0;height:100%;}.vxe-print-page-break--left{width:${marginObj.left};}.vxe-print-page-break--right{width:${marginObj.right};}.vxe-print-page-break--header,.vxe-print-page-break--footer{flex-shrink:0;width:100%;}.vxe-print-page-break--header{height:${marginObj.top};}.vxe-print-page-break--footer{height:${marginObj.bottom};}.vxe-print-page-break--content{flex-grow: 1;overflow: hidden;}.vxe-print-page-break--footer-page-number{line-height:${marginObj.bottom || 'normal'};text-align:center;}</style>`,
56
99
  '<style>.vxe-table{white-space:pre;}</style>',
57
100
  `<style>${defaultHtmlStyle}</style>`,
58
101
  customStyle ? `<style>${customStyle}</style>` : '',
package/packages/ui/index.ts CHANGED
@@ -82,22 +82,45 @@ setConfig({
82
82
  showColorExtractor: true,
83
83
  showQuick: true
84
84
  },
85
- datePicker: {
86
- // size: null,
87
- // transfer: false
85
+ datePanel: {
88
86
  // parseFormat: 'yyyy-MM-dd HH:mm:ss.SSS',
89
87
  // labelFormat: '',
90
88
  // valueFormat: '',
91
89
  startDate: new Date(1900, 0, 1),
92
90
  endDate: new Date(2100, 0, 1),
93
91
  startDay: 1,
92
+ selectDay: 1
93
+ },
94
+ datePicker: {
95
+ // size: null,
96
+ // transfer: false,
97
+ shortcutConfig: {
98
+ // position: 'left',
99
+ align: 'left',
100
+ mode: 'text',
101
+ autoClose: true
102
+ },
103
+ startDay: 1,
94
104
  selectDay: 1,
105
+ autoClose: true,
106
+ showClearButton: null,
107
+ showConfirmButton: null
108
+ },
109
+ dateRangePicker: {
110
+ // size: null,
111
+ // transfer: false,
95
112
  shortcutConfig: {
96
113
  // position: 'left',
97
114
  align: 'left',
98
115
  mode: 'text',
99
116
  autoClose: true
100
- }
117
+ },
118
+ startDay: 1,
119
+ selectDay: 1,
120
+ separator: ' ~ ',
121
+ autoClose: true,
122
+ showClearButton: null,
123
+ showConfirmButton: null
101
124
  },
102
125
  drawer: {
103
126
  // size: null,
@@ -250,7 +273,9 @@ setConfig({
250
273
  // pageSizes: [10, 15, 20, 50, 100],
251
274
  // layouts: ['PrevJump', 'PrevPage', 'Jump', 'PageCount', 'NextPage', 'NextJump', 'Sizes', 'Total']
252
275
  },
253
- print: {},
276
+ print: {
277
+ pageStyle: {}
278
+ },
254
279
  passwordInput: {
255
280
  controls: true
256
281
  },
package/styles/all.scss CHANGED
@@ -20,7 +20,9 @@
20
20
  @use './components/collapse-pane.scss';
21
21
  @use './components/color-picker.scss';
22
22
  @use './components/countdown.scss';
23
+ @use './components/date-panel.scss';
23
24
  @use './components/date-picker.scss';
25
+ @use './components/date-range-picker.scss';
24
26
  @use './components/drawer.scss';
25
27
  @use './components/empty.scss';
26
28
  @use './components/flow-design.scss';
package/styles/components/date-panel.scss ADDED
@@ -0,0 +1,491 @@
1
+ @use "sass:list";
2
+
3
+ .vxe-date-panel {
4
+ color: var(--vxe-ui-font-color);
5
+ flex-shrink: 0;
6
+ }
7
+
8
+ .vxe-date-panel--wrapper,
9
+ .vxe-date-panel--time-layout-wrapper {
10
+ border: 0 solid var(--vxe-ui-base-popup-border-color);
11
+ border-radius: var(--vxe-ui-base-border-radius);
12
+ }
13
+
14
+ .vxe-date-panel--wrapper,
15
+ .vxe-date-panel--time-left-wrapper {
16
+ display: inline-flex;
17
+ flex-direction: column;
18
+ padding: 0.8em;
19
+ }
20
+ .vxe-date-panel--time-right-wrapper {
21
+ padding: 0.8em 0.8em 0.8em 0;
22
+ }
23
+
24
+ .vxe-date-panel--time-layout-wrapper {
25
+ display: inline-flex;
26
+ flex-direction: row;
27
+ }
28
+
29
+ .vxe-date-panel--time-title {
30
+ display: flex;
31
+ align-items: center;
32
+ justify-content: center;
33
+ flex-grow: 1;
34
+ text-align: center;
35
+ border: 1px solid var(--vxe-ui-input-border-color);
36
+ border-radius: var(--vxe-ui-base-border-radius);
37
+ height: 2em;
38
+ font-weight: 700;
39
+ }
40
+
41
+ .vxe-date-panel--time-header {
42
+ position: relative;
43
+ flex-shrink: 0;
44
+ }
45
+
46
+ .vxe-date-panel--time-header,
47
+ .vxe-date-panel--picker-header {
48
+ display: flex;
49
+ flex-direction: row;
50
+ align-items: center;
51
+ height: 3em;
52
+ padding-bottom: 0.5em;
53
+ }
54
+
55
+ .vxe-date-panel--picker-header {
56
+ user-select: none;
57
+ .vxe-date-panel--picker-type-wrapper {
58
+ flex-grow: 1;
59
+ font-size: 1.1em;
60
+ }
61
+ .vxe-date-panel--picker-btn-wrapper {
62
+ flex-shrink: 0;
63
+ text-align: center;
64
+ }
65
+ }
66
+ .vxe-date-panel--picker-type-wrapper {
67
+ display: flex;
68
+ align-items: center;
69
+ .vxe-date-panel--picker-label,
70
+ .vxe-date-panel--picker-btn {
71
+ display: inline-block;
72
+ }
73
+ }
74
+ .vxe-date-panel--picker-btn-wrapper {
75
+ display: flex;
76
+ flex-direction: row;
77
+ .vxe-date-panel--picker-prev-btn,
78
+ .vxe-date-panel--picker-current-btn,
79
+ .vxe-date-panel--picker-next-btn {
80
+ height: 2.2em;
81
+ padding: 0 0.5em;
82
+ border-radius: var(--vxe-ui-base-border-radius);
83
+ border: 1px solid var(--vxe-ui-input-border-color);
84
+ margin-left: 0.5em;
85
+ i {
86
+ font-size: 1.2em;
87
+ }
88
+ }
89
+ .vxe-date-panel--picker-btn {
90
+ &:not(.is--disabled) {
91
+ &:active {
92
+ transform: scale(0.9);
93
+ }
94
+ }
95
+ }
96
+ }
97
+ .vxe-date-panel--picker-label,
98
+ .vxe-date-panel--picker-btn {
99
+ display: flex;
100
+ align-items: center;
101
+ justify-content: center;
102
+ background-color: var(--vxe-ui-layout-background-color);
103
+ }
104
+ .vxe-date-panel--picker-btn {
105
+ &.is--disabled {
106
+ color: var(--vxe-ui-font-disabled-color);
107
+ cursor: no-drop;
108
+ }
109
+ &:not(.is--disabled) {
110
+ cursor: pointer;
111
+ &:hover {
112
+ color: var(--vxe-ui-font-primary-color);
113
+ background-color: #fff;
114
+ }
115
+ &:active {
116
+ background-color: #fff;
117
+ }
118
+ }
119
+ }
120
+ .vxe-date-panel--picker-btns {
121
+ .vxe-date-panel--picker-btn {
122
+ margin-left: 0.6em;
123
+ &:first-child {
124
+ margin-left: 0;
125
+ }
126
+ }
127
+ }
128
+
129
+ .vxe-date-panel--view-wrapper {
130
+ display: flex;
131
+ flex-direction: column;
132
+ line-height: 1.5;
133
+ }
134
+ .vxe-date-panel--picker-body {
135
+ border-radius: var(--vxe-ui-base-border-radius);
136
+ border: 1px solid var(--vxe-ui-base-popup-border-color);
137
+ user-select: none;
138
+ }
139
+ .vxe-date-panel--view-header {
140
+ box-shadow: inset 0 -1px 0 0 var(--vxe-ui-base-popup-border-color);
141
+ text-align: center;
142
+ }
143
+ .vxe-date-panel--view-body {
144
+ display: inline-flex;
145
+ flex-direction: column;
146
+ width: 24em;
147
+ }
148
+ .vxe-date-panel--view-wrapper {
149
+ &.type--day,
150
+ &.type--week {
151
+ .vxe-date-panel--view-body {
152
+ height: 18em;
153
+ }
154
+ }
155
+ }
156
+ .vxe-date-panel--view-header {
157
+ .vxe-date-panel--view-row {
158
+ height: 2em;
159
+ }
160
+ }
161
+ .vxe-date-panel--view-body,
162
+ .vxe-date-panel--time-body {
163
+ height: 20em;
164
+ }
165
+ .vxe-date-panel {
166
+ &.type--time {
167
+ .vxe-date-panel--time-body {
168
+ height: 15em;
169
+ }
170
+ }
171
+ }
172
+ .vxe-date-panel--view-row {
173
+ display: flex;
174
+ flex-direction: row;
175
+ }
176
+ .vxe-date-panel--view-item {
177
+ padding: 0.2em;
178
+ &.is--prev,
179
+ &.is--next {
180
+ .vxe-date-panel--view-item-inner {
181
+ color: var(--vxe-ui-font-disabled-color);
182
+ }
183
+ .vxe-date-panel--label,
184
+ .vxe-date-panel--festival {
185
+ color: var(--vxe-ui-font-disabled-color);
186
+ }
187
+ }
188
+ &.is--now {
189
+ .vxe-date-panel--view-item-inner {
190
+ color: var(--vxe-ui-base-popup-border-color);
191
+ }
192
+ &:not(.is--selected) {
193
+ &.is--current {
194
+ color: var(--vxe-ui-font-primary-color);
195
+ .vxe-date-panel--label,
196
+ .vxe-date-panel--festival {
197
+ color: var(--vxe-ui-font-primary-color);
198
+ }
199
+ }
200
+ }
201
+ }
202
+ &.is--hover {
203
+ .vxe-date-panel--view-item-inner {
204
+ background-color: var(--vxe-ui-font-primary-tinge-color);
205
+ }
206
+ }
207
+ &.is--selected {
208
+ .vxe-date-panel--view-item-inner {
209
+ color: var(--vxe-ui-input-date-picker-selected-color);
210
+ background-color: var(--vxe-ui-font-primary-color);
211
+ }
212
+ &.is--hover {
213
+ .vxe-date-panel--view-item-inner {
214
+ box-shadow: 0 0px 6px 1px var(--vxe-ui-font-primary-color);
215
+ }
216
+ }
217
+ &.is--prev,
218
+ &.is--next {
219
+ .vxe-date-panel--label,
220
+ .vxe-date-panel--festival {
221
+ color: var(--vxe-ui-base-popup-border-color);
222
+ }
223
+ }
224
+ .vxe-date-panel--label,
225
+ .vxe-date-panel--festival {
226
+ color: var(--vxe-ui-input-date-picker-festival-selected-color);
227
+ }
228
+ .vxe-date-panel--label {
229
+ &.is-notice {
230
+ &:before {
231
+ background-color: var(--vxe-ui-input-date-picker-notice-selected-background-color);
232
+ }
233
+ }
234
+ }
235
+ }
236
+ &.is--disabled {
237
+ .vxe-date-panel--view-item-inner {
238
+ color: var(--vxe-ui-input-disabled-color);
239
+ background-color: var(--vxe-ui-input-disabled-background-color);
240
+ }
241
+ .vxe-date-panel--label,
242
+ .vxe-date-panel--festival {
243
+ color: var(--vxe-ui-input-disabled-color);
244
+ }
245
+ }
246
+ }
247
+
248
+ .vxe-date-range-picker--panel {
249
+ .vxe-date-panel--view-item {
250
+ &.is--disabled {
251
+ .vxe-date-panel--view-item-inner {
252
+ color: var(--vxe-ui-input-disabled-color);
253
+ background-color: inherit;
254
+ }
255
+ }
256
+ }
257
+ }
258
+
259
+ .vxe-date-panel--view-wrapper {
260
+ &.type--week {
261
+ .vxe-date-panel--view-item {
262
+ padding: 0.2em 0;
263
+ .vxe-date-panel--view-item-inner {
264
+ border-radius: 0;
265
+ }
266
+ &:first-child {
267
+ padding: 0.2em 0 0.2em 0.2em;
268
+ border-right: 1px solid var(--vxe-ui-base-popup-border-color);
269
+ .vxe-date-panel--view-item-inner {
270
+ color: var(--vxe-ui-input-date-festival-color);
271
+ }
272
+ }
273
+ &:last-child {
274
+ padding: 0.2em 0.2em 0.2em 0;
275
+ }
276
+ &.is--hover,
277
+ &.is--selected {
278
+ &:first-child {
279
+ .vxe-date-panel--view-item-inner {
280
+ border-radius: var(--vxe-ui-base-border-radius) 0 0 var(--vxe-ui-base-border-radius);
281
+ }
282
+ }
283
+ &:last-child {
284
+ .vxe-date-panel--view-item-inner {
285
+ border-radius: 0 var(--vxe-ui-base-border-radius) var(--vxe-ui-base-border-radius) 0;
286
+ }
287
+ }
288
+ }
289
+ &.is--now {
290
+ &:not(.is--selected) {
291
+ &:first-child {
292
+ .vxe-date-panel--view-item-inner {
293
+ color: var(--vxe-ui-font-primary-color);
294
+ }
295
+ }
296
+ }
297
+ }
298
+ }
299
+ }
300
+ }
301
+ .vxe-date-panel--view-body {
302
+ .vxe-date-panel--view-item {
303
+ cursor: pointer;
304
+ &.is--disabled {
305
+ cursor: no-drop;
306
+ }
307
+ &.is--over {
308
+ cursor: no-drop;
309
+ }
310
+ }
311
+ }
312
+ .vxe-date-panel--view-item-inner {
313
+ display: flex;
314
+ flex-direction: column;
315
+ align-items: center;
316
+ justify-content: center;
317
+ height: 100%;
318
+ width: 100%;
319
+ border: 1px solid transparent;
320
+ border-radius: var(--vxe-ui-base-border-radius);
321
+ overflow: hidden;
322
+ }
323
+ .vxe-date-panel--view-item-label {
324
+ width: 100%;
325
+ overflow: hidden;
326
+ text-overflow: ellipsis;
327
+ white-space: nowrap;
328
+ }
329
+
330
+ .vxe-date-panel--label,
331
+ .vxe-date-panel--festival {
332
+ width: 100%;
333
+ display: block;
334
+ overflow: hidden;
335
+ text-align: center;
336
+ }
337
+
338
+ .vxe-date-panel--label {
339
+ position: relative;
340
+ height: 1.4em;
341
+ line-height: 1.4em;
342
+ &.is-notice {
343
+ &:before {
344
+ content: "";
345
+ position: absolute;
346
+ width: 0.25em;
347
+ height: 0.25em;
348
+ left: 50%;
349
+ top: 0;
350
+ transform: translateX(-50%);
351
+ border-radius: 100%;
352
+ background-color: var(--vxe-ui-input-date-notice-background-color);
353
+ }
354
+ }
355
+ }
356
+ .vxe-date-panel--label--extra {
357
+ position: absolute;
358
+ right: -0.1em;
359
+ top: -0.4em;
360
+ font-size: 12px;
361
+ transform: scale(0.9);
362
+ color: var(--vxe-ui-input-date-extra-color);
363
+ &.is-important {
364
+ color: var(--vxe-ui-input-date-extra-important-color);
365
+ }
366
+ }
367
+
368
+ .vxe-date-panel--festival {
369
+ color: var(--vxe-ui-input-date-festival-color);
370
+ height: 1em;
371
+ line-height: 1em;
372
+ overflow: hidden;
373
+ &.is-important {
374
+ color: var(--vxe-ui-input-date-festival-important-color);
375
+ }
376
+ }
377
+ .vxe-date-panel--festival--label {
378
+ display: block;
379
+ font-size: 1em;
380
+ transform: scale(0.8);
381
+ }
382
+
383
+ @keyframes festivalOverlap2 {
384
+ 0%, 45%, 100% {
385
+ transform: translateY(0);
386
+ }
387
+ 50%, 95% {
388
+ transform: translateY(-14px);
389
+ }
390
+ }
391
+
392
+ @keyframes festivalOverlap3 {
393
+ 0%, 20%, 100% {
394
+ transform: translateY(0);
395
+ }
396
+ 25%, 45%, 75%, 95% {
397
+ transform: translateY(-14px);
398
+ }
399
+ 50%, 70% {
400
+ transform: translateY(-28px);
401
+ }
402
+ }
403
+
404
+ .vxe-date-panel--festival--overlap {
405
+ display: block;
406
+ font-size: 0.86em;
407
+ &.overlap--2 {
408
+ animation: festivalOverlap2 6s infinite ease-in-out;
409
+ }
410
+ &.overlap--3 {
411
+ animation: festivalOverlap3 9s infinite ease-in-out;
412
+ }
413
+ & > span {
414
+ height: 14px;
415
+ display: block;
416
+ transform: scale(0.8);
417
+ }
418
+ }
419
+
420
+ .vxe-date-panel--time-body {
421
+ position: relative;
422
+ display: flex;
423
+ flex-direction: row;
424
+ border: 1px solid var(--vxe-ui-base-popup-border-color);
425
+ flex-grow: 1;
426
+ border-radius: var(--vxe-ui-base-border-radius);
427
+ user-select: none;
428
+ & > ul {
429
+ height: 100%;
430
+ overflow: hidden;
431
+ margin: 0;
432
+ padding: 0;
433
+ width: 3.2em;
434
+ &:before,
435
+ &:after {
436
+ content: " ";
437
+ display: block;
438
+ height: 6em;
439
+ }
440
+ &:hover {
441
+ overflow-y: auto;
442
+ }
443
+ & > li {
444
+ display: block;
445
+ height: 2em;
446
+ line-height: 2em;
447
+ padding-left: 0.4em;
448
+ &:hover {
449
+ background-color: var(--vxe-ui-input-date-picker-hover-background-color);
450
+ cursor: pointer;
451
+ }
452
+ &.is--selected {
453
+ font-weight: 700;
454
+ color: var(--vxe-ui-font-primary-color);
455
+ }
456
+ }
457
+ }
458
+ .vxe-date-panel--time-minute-list {
459
+ border-left: 1px solid var(--vxe-ui-base-popup-border-color);
460
+ }
461
+ .vxe-date-panel--time-second-list {
462
+ border-left: 1px solid var(--vxe-ui-base-popup-border-color);
463
+ }
464
+ }
465
+ .vxe-date-panel {
466
+ &.type--time {
467
+ .vxe-date-panel--time-body {
468
+ & > ul {
469
+ width: 4em;
470
+ & > li {
471
+ height: 2.2em;
472
+ line-height: 2.2em;
473
+ padding-left: 0.8em;
474
+ }
475
+ }
476
+ }
477
+ }
478
+ }
479
+
480
+ .vxe-date-panel {
481
+ font-size: var(--vxe-ui-font-size-default);
482
+ &.size--medium {
483
+ font-size: var(--vxe-ui-font-size-medium);
484
+ }
485
+ &.size--small {
486
+ font-size: var(--vxe-ui-font-size-small);
487
+ }
488
+ &.size--mini {
489
+ font-size: var(--vxe-ui-font-size-mini);
490
+ }
491
+ }