various-ui

Version:

This is a test version of the Vue 3 component library

1 lines • 8.68 kB

Source Map (JSON)

{"version":3,"file":"index.vue2.mjs","sources":["../../../../packages/components/time-picker/index.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { defineComponent as __MACROS_defineComponent } from \"vue\";\nexport default /*#__PURE__*/ __MACROS_defineComponent({ name: \"UiTimePicker\" });\n</script>\n<template>\r\n \r\n <div class=\"ui-time-picker\" ref=\"container\" v-bind=\"binds.container\">\r\n \r\n <div class=\"ui-form-control\" @click=\"show\">\r\n <input class=\"ui-time-context\" type=\"text\" aria-name=\"start\" v-bind=\"binds.start\" readonly />\r\n <div class=\"ui-time-rect\"></div>\r\n <input class=\"ui-time-context\" type=\"text\" aria-name=\"end\" v-bind=\"binds.end\" readonly />\r\n </div>\r\n\r\n \r\n <Transition v-on=\"ons.candidates\">\r\n <div class=\"ui-form-candidates\" ref=\"candidates\" v-if=\"visible\" v-bind=\"binds.candidates\">\r\n <div class=\"ui-form-candidate-container\">\r\n <div class=\"ui-time-picker-candidates\">\r\n <div class=\"ui-time-picker-candidate\">\r\n <div class=\"ui-candidate-name\">{{ placeholder.start }}</div>\r\n <div class=\"ui-candidate-controls\">\r\n <div class=\"ui-candidate-division\"></div>\r\n <ui-simplebar ref=\"sHourser\" :height=\"210\" trigger=\"Hover\" @scroll=\"methods.scroll(0, sHourser, false)\">\r\n <template v-for=\"(_, number) in 24\">\r\n <div class=\"ui-candidate\" :class=\"{ 'ui-active': sTime[0] == number }\" @click=\"sHourser?.move(number * 30)\">\r\n {{ number.toString().padStart(2, \"0\") }}\r\n </div>\r\n </template>\r\n </ui-simplebar>\r\n\r\n <ui-simplebar ref=\"sMinuteser\" :height=\"210\" trigger=\"Hover\" @scroll=\"methods.scroll(1, sMinuteser, false)\">\r\n <template v-for=\"(_, number) in 60\">\r\n <div class=\"ui-candidate\" :class=\"{ 'ui-active': sTime[1] == number }\" @click=\"sMinuteser?.move(number * 30)\">\r\n {{ number.toString().padStart(2, \"0\") }}\r\n </div>\r\n </template>\r\n </ui-simplebar>\r\n\r\n <template v-if=\"mode != 'minutes'\">\r\n <ui-simplebar ref=\"sSecondser\" :height=\"210\" trigger=\"Hover\" @scroll=\"methods.scroll(2, sSecondser, false)\">\r\n <template v-for=\"(_, number) in 60\">\r\n <div\r\n class=\"ui-candidate\"\r\n :class=\"{ 'ui-active': sTime[2] == number }\"\r\n @click=\"sSecondser?.move(number * 30)\">\r\n {{ number.toString().padStart(2, \"0\") }}\r\n </div>\r\n </template>\r\n </ui-simplebar>\r\n </template>\r\n </div>\r\n </div>\r\n\r\n <div class=\"ui-time-picker-candidate\">\r\n <div class=\"ui-candidate-name\">{{ placeholder.end }}</div>\r\n <div class=\"ui-candidate-controls\">\r\n <div class=\"ui-candidate-division\"></div>\r\n <ui-simplebar ref=\"eHourser\" :height=\"210\" trigger=\"Hover\" @scroll=\"methods.scroll(0, eHourser, true)\">\r\n <template v-for=\"(_, number) in 24\">\r\n <div class=\"ui-candidate\" :class=\"{ 'ui-active': eTime[0] == number }\" @click=\"eHourser?.move(number * 30)\">\r\n {{ number.toString().padStart(2, \"0\") }}\r\n </div>\r\n </template>\r\n </ui-simplebar>\r\n\r\n <ui-simplebar ref=\"eMinuteser\" :height=\"210\" trigger=\"Hover\" @scroll=\"methods.scroll(1, eMinuteser, true)\">\r\n <template v-for=\"(_, number) in 60\">\r\n <div class=\"ui-candidate\" :class=\"{ 'ui-active': eTime[1] == number }\" @click=\"eMinuteser?.move(number * 30)\">\r\n {{ number.toString().padStart(2, \"0\") }}\r\n </div>\r\n </template>\r\n </ui-simplebar>\r\n\r\n <template v-if=\"mode != 'minutes'\">\r\n <ui-simplebar ref=\"eSecondser\" :height=\"210\" trigger=\"Hover\" @scroll=\"methods.scroll(2, eSecondser, true)\">\r\n <template v-for=\"(_, number) in 60\">\r\n <div\r\n class=\"ui-candidate\"\r\n :class=\"{ 'ui-active': eTime[2] == number }\"\r\n @click=\"eSecondser?.move(number * 30)\">\r\n {{ number.toString().padStart(2, \"0\") }}\r\n </div>\r\n </template>\r\n </ui-simplebar>\r\n </template>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </Transition>\r\n </div>\r\n</template>\r\n\r\n<script lang=\"ts\" setup>\r\n//* Vue\r\nimport { onBeforeUnmount } from \"vue\";\r\n//* 组件引入\r\nimport UiSimplebar from \"@various/components/simplebar\";\r\n//* 组件属性\r\nimport { UiTimePickerPropsOption, UiTimePickerEmits } from \"./src/component\";\r\nimport { useComposable } from \"./src/composable\";\r\n\r\n//* 组件属性注册\r\nconst emits = defineEmits(UiTimePickerEmits);\r\nconst define = defineProps(UiTimePickerPropsOption);\r\n\r\n//* 组合函数\r\nconst { ons, vars, refs, nodes, binds, methods, computeds } = useComposable(define, emits);\r\nconst { sTime, eTime } = computeds;\r\nconst { show, hidden } = methods;\r\nconst { sHourser, sMinuteser, sSecondser, eHourser, eMinuteser, eSecondser, candidates, container } = nodes;\r\nconst { visible } = refs;\r\n\r\n//* 组件初始化\r\nmethods.init();\r\n\r\n//* 组件卸载时释放内存\r\nonBeforeUnmount(() => {\r\n vars.observer?.disconnect();\r\n});\r\n\r\n//* 组件属性导出\r\ndefineExpose({ show, hidden });\r\n;\r\n</script>\r\n"],"names":["__MACROS_defineComponent"],"mappings":";;;;;;;;;;;;;;;;;;;AAEA,MAA6B,WAAA,GAAAA,eAAA,CAAyB,EAAE,IAAA,EAAM,gBAAgB,CAAA,CAAA;;;;;;AAuG9E,IAAA,MAAM,KAAQ,GAAA,MAAA,CAAA;AACd,IAAA,MAAM,MAAS,GAAA,OAAA,CAAA;AAGf,IAAM,MAAA,EAAE,GAAK,EAAA,IAAA,EAAM,IAAM,EAAA,KAAA,EAAO,KAAO,EAAA,OAAA,EAAS,SAAU,EAAA,GAAI,aAAc,CAAA,MAAA,EAAQ,KAAK,CAAA,CAAA;AACzF,IAAM,MAAA,EAAE,KAAO,EAAA,KAAA,EAAU,GAAA,SAAA,CAAA;AACzB,IAAM,MAAA,EAAE,IAAM,EAAA,MAAA,EAAW,GAAA,OAAA,CAAA;AACzB,IAAM,MAAA,EAAE,UAAU,UAAY,EAAA,UAAA,EAAY,UAAU,UAAY,EAAA,UAAA,EAAY,UAAY,EAAA,SAAA,EAAc,GAAA,KAAA,CAAA;AACtG,IAAM,MAAA,EAAE,SAAY,GAAA,IAAA,CAAA;AAGpB,IAAA,OAAA,CAAQ,IAAK,EAAA,CAAA;AAGb,IAAA,eAAA,CAAgB,MAAM;;AAClB,MAAA,CAAA,EAAA,GAAA,IAAA,CAAK,aAAL,IAAe,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,UAAA,EAAA,CAAA;AAAA,KAClB,CAAA,CAAA;AAGD,IAAa,QAAA,CAAA,EAAE,IAAM,EAAA,MAAA,EAAQ,CAAA,CAAA;AAC7B,IAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}