xm-datetimeforyear.vue 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. <template>
  2. <a-form-model-item>
  3. <a-checkbox
  4. slot="label"
  5. v-model="component.attrFD.formItemProps.inputProps.currentAsDefaultValue"
  6. >
  7. 默认当前年份
  8. </a-checkbox>
  9. </a-form-model-item>
  10. </template>
  11. <script>
  12. import components from './_import-components/xm-datetimeforyear-import'
  13. export const metaInfo = {
  14. caption: '年份选择',
  15. icon: 'sd-list',
  16. component: {
  17. props: ['designerData'],
  18. methods: {
  19. yearChange(value) {
  20. this.defaultValue = value
  21. if (document.getElementsByClassName('ant-calendar-picker-container').length > 0) {
  22. for (
  23. let i = 0;
  24. i < document.getElementsByClassName('ant-calendar-picker-container').length;
  25. i++
  26. ) {
  27. document.getElementsByClassName('ant-calendar-picker-container')[i].style.display =
  28. 'none'
  29. }
  30. }
  31. },
  32. handleEndOpenChange(open) {
  33. this.endOpen = open
  34. },
  35. },
  36. data() {
  37. return {
  38. endOpen: false,
  39. defaultValue: this.designerData.attr?.defaultValue || '',
  40. }
  41. },
  42. render() {
  43. // const defaultValue = this.designerData.attr?.defaultValue || ''
  44. return (
  45. <a-date-picker
  46. v-model={this.defaultValue}
  47. mode='year'
  48. picker='YYYY'
  49. format='YYYY'
  50. allow-clear={false}
  51. placeholder='选择年度'
  52. input-read-only={true}
  53. open={this.endOpen}
  54. vOn:panelChange={() => this.yearChange()}
  55. vOn:openChange={() => this.handleEndOpenChange()}
  56. />
  57. )
  58. },
  59. },
  60. order: 900,
  61. category: 'basic',
  62. }
  63. export const fieldProps = {
  64. dataType: 'string',
  65. contents: [],
  66. attr: {
  67. defaultValue: '',
  68. },
  69. attrFD: {
  70. formItemProps: { inputProps: { label: '', mode: 'year', currentAsDefaultValue: false } },
  71. },
  72. }
  73. export default {
  74. name: 'XmDatetimeforyear',
  75. components,
  76. computed: {},
  77. methods: {},
  78. }
  79. </script>
  80. <style module lang="scss">
  81. @use '@/common/design' as *;
  82. </style>