el-plus-powerful-table
Version:
## [DOCS](https://peng-xiao-shuai.github.io/vite-vue-admin-docs/zh-CN/component_directive/component/powerful-table-doc.html)
1 lines • 4.31 kB
Source Map (JSON)
{"version":3,"file":"FDatePicker.mjs","sources":["../../../packages/filter/src/FDatePicker.tsx"],"sourcesContent":["import { ElDatePicker, ElIcon } from 'element-plus'\nimport { ArrowUp } from '@element-plus/icons-vue'\nimport { props } from './common'\nimport type { App } from 'vue'\nimport type { SFCWithInstall } from '~/index'\nimport { SizeSymbol } from '~/keys'\n\nconst FDatePicker = defineComponent({\n name: 'PTFDatePicker',\n props,\n emits: ['headerFilterChange'],\n setup(props, { emit, expose }) {\n const size = inject(SizeSymbol)\n const datePickerRef = ref<any>()\n const state: import('./common').State & {\n defaultTime: Date[]\n } = reactive({\n value: '',\n visible: false,\n defaultTime: [\n new Date(2000, 1, 1, 0, 0, 0),\n new Date(2000, 2, 1, 23, 59, 59),\n ],\n })\n\n const datePickerChange = (value: any) => {\n if (!value) state.value = ''\n emit('headerFilterChange', value, props.headerData)\n }\n\n const stop = watchEffect(() => {\n if (props.list.length && state.value?.length) {\n datePickerChange(state.value)\n }\n })\n\n onBeforeUnmount(() => {\n stop()\n })\n\n // 暴露状态\n expose({\n state,\n header: props.headerData,\n })\n\n return () => (\n <span\n style={state.value ? { color: 'var(--el-color-primary)' } : {}}\n onClick={async (e) => {\n e.stopPropagation()\n state.visible = !state.visible\n if (!state.visible) return\n await nextTick()\n datePickerRef.value.focus()\n }}\n >\n {props.headerData.label}\n <ElIcon class={state.visible ? 'arrow-down' : 'arrow-up'}>\n <ArrowUp />\n </ElIcon>\n <ElDatePicker\n v-model={state.value}\n type=\"datetimerange\"\n value-format=\"YYYY-MM-DD HH:mm:ss\"\n default-time={state.defaultTime}\n ref={datePickerRef}\n class=\"date_style\"\n style=\"padding: 0; overflow: hidden\"\n size={size}\n onUpdate:modelValue={datePickerChange}\n onVisible-change={(b: boolean) => {\n state.visible = b\n }}\n ></ElDatePicker>\n </span>\n )\n },\n})\n\nconst PTFDatePicker = FDatePicker as SFCWithInstall<typeof FDatePicker>\nPTFDatePicker.install = (app: App) => {\n app.component(FDatePicker.name!, FDatePicker)\n}\nexport { PTFDatePicker, FDatePicker }\nexport default FDatePicker\n"],"names":["FDatePicker","defineComponent","props","emit","expose","size","inject","SizeSymbol","datePickerRef","ref","state","reactive","datePickerChange","value","stop","watchEffect","_a","onBeforeUnmount","_createVNode","e","nextTick","ElIcon","ArrowUp","ElDatePicker","$event","b","PTFDatePicker","app"],"mappings":";;;;;AAKA,MAAAA,IAAA,gBAAAC,EAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAAC;AAAA,EACA,OAAA,CAAA,oBAAA;AAAA,EACA,MAAAA,GAAA;AAAA,IACA,MAAAC;AAAA,IACA,QAAAC;AAAA,EACA,GAAA;AACA,UAAAC,IAAAC,EAAAC,CAAA,GACAC,IAAAC,KACAC,IAAAC,EAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA;AAAA,MACA,aAAA,CAAA,IAAA,KAAA,KAAA,GAAA,GAAA,GAAA,GAAA,CAAA,GAAA,IAAA,KAAA,KAAA,GAAA,GAAA,IAAA,IAAA,EAAA,CAAA;AAAA,IACA,CAAA,GACAC,IAAA,CAAAC,MAAA;AACA,MAAAA,MAAAH,EAAA,QAAA,KACAP,EAAA,sBAAAU,GAAAX,EAAA,UAAA;AAAA,IACA,GACAY,IAAAC,EAAA,MAAA;;AACA,MAAAb,EAAA,KAAA,YAAAc,IAAAN,EAAA,UAAA,QAAAM,EAAA,WACAJ,EAAAF,EAAA,KAAA;AAAA,IAEA,CAAA;AACA,WAAAO,EAAA,MAAA;AACA,MAAAH;IACA,CAAA,GAGAV,EAAA;AAAA,MACA,OAAAM;AAAA,MACA,QAAAR,EAAA;AAAA,IACA,CAAA,GACA,MAAAgB,EAAA,QAAA;AAAA,MACA,OAAAR,EAAA,QAAA;AAAA,QACA,OAAA;AAAA,MACA,IAAA,CAAA;AAAA,MACA,SAAA,OAAAS,MAAA;AAGA,QAFAA,EAAA,gBAAA,GACAT,EAAA,UAAA,CAAAA,EAAA,SACAA,EAAA,YACA,MAAAU,EAAA,GACAZ,EAAA,MAAA;MACA;AAAA,IACA,GAAA,CAAAN,EAAA,WAAA,OAAAgB,EAAAG,GAAA;AAAA,MACA,OAAAX,EAAA,UAAA,eAAA;AAAA,IACA,GAAA;AAAA,MACA,SAAA,MAAA,CAAAQ,EAAAI,GAAA,MAAA,IAAA,CAAA;AAAA,IACA,CAAA,GAAAJ,EAAAK,GAAA;AAAA,MACA,YAAAb,EAAA;AAAA,MACA,uBAAA,CAAA,CAAAc,MAAAd,EAAA,QAAAc,GAAAZ,CAAA;AAAA,MACA,MAAA;AAAA,MACA,gBAAA;AAAA,MACA,gBAAAF,EAAA;AAAA,MACA,KAAAF;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA,MAAAH;AAAA,MACA,oBAAA,CAAAoB,MAAA;AACA,QAAAf,EAAA,UAAAe;AAAA,MACA;AAAA,IACA,GAAA,IAAA,CAAA,CAAA;AAAA,EACA;AACA,CAAA,GACAC,IAAA1B;AACA0B,EAAA,UAAA,CAAAC,MAAA;AACA,EAAAA,EAAA,UAAA3B,EAAA,MAAAA,CAAA;AACA;"}