1 line
7.0 KiB
Plaintext
1 line
7.0 KiB
Plaintext
|
{"version":3,"file":"su-fixed.js","sources":["../../../../../../src/sheep/ui/su-fixed/su-fixed.vue","../../../../../../uniComponent:/RDovQXBwL1dvcmsvYWRkci9hY2RyLXVpL3NyYy9zaGVlcC91aS9zdS1maXhlZC9zdS1maXhlZC52dWU"],"sourcesContent":["<template>\r\n <view class=\"ui-fixed\">\r\n <view\r\n class=\"ui-fixed-box\"\r\n :id=\"`fixed-${uuid}`\"\r\n :class=\"[{ fixed: state.fixed }]\"\r\n :style=\"[\r\n {\r\n left: sticky ? 'auto' : '0px',\r\n top: state.fixed && !bottom ? (noNav ? val : val + sys_navBar) + 'px' : 'auto',\r\n bottom: insetHeight,\r\n zIndex: index + sheep.$zIndex.navbar,\r\n },\r\n !alway ? { opacity: state.opacityVal } : '',\r\n ]\"\r\n >\r\n <view\r\n class=\"ui-fixed-content\"\r\n @tap=\"toTop\"\r\n :style=\"[{ zIndex: index + sheep.$zIndex.navbar }]\"\r\n >\r\n <slot></slot>\r\n <view\r\n v-if=\"safeAreaInsets.bottom && bottom && isInset\"\r\n class=\"inset-bottom\"\r\n :style=\"[{ height: safeAreaInsets.bottom + 'px' }]\"\r\n ></view>\r\n </view>\r\n <view class=\"ui-fixed-bottom\" :class=\"[bg]\" v-if=\"bottom\"></view>\r\n <view\r\n class=\"ui-fixed-bg\"\r\n :class=\"[ui, bg]\"\r\n :style=\"[\r\n { zIndex: index + sheep.$zIndex.navbar - 1 },\r\n bgStyles,\r\n opacity ? { opacity: state.opacityVal } : '',\r\n ]\"\r\n ></view>\r\n </view>\r\n <view\r\n class=\"skeleton\"\r\n :style=\"[{ height: state.content.height + 'px', width: width + 'px' }]\"\r\n v-if=\"sticky ? state.fixed : placeholder && state.fixed\"\r\n ></view>\r\n </view>\r\n</template>\r\n\r\n<script setup>\r\nimport { onPageScroll } from '@dcloudio/uni-app'\r\nimport { getCurrentInstance, unref, onMounted, reactive, nextTick, computed } from 'vue'\r\nimport sheep from '@/sheep'\r\nconst { safeAreaInsets } = sheep.$platform.device\r\n\r\nconst vm = getCurrentInstance()\r\n\r\nconst uuid = sheep.$helper.guid()\r\nconst sys_navBar = sheep.$platform.navbar\r\nconst state = reactive({\r\n content: {},\r\n fixed: true,\r\n scrollTop: 0,\r\n opacityVal: 0,\r\n})\r\nconst insetHeight = computed(() => {\r\n if (state.fixed && props.bottom) {\r\n if (props.isInset) {\r\n return props.val + 'px'\r\n } else {\r\n return props.val + safeAreaInsets.bottom + 'px'\r\n }\r\n } else {\r\n return 'auto'\r\n }\r\n})\r\nconst props = defineProps({\r\n noNav: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n bottom: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n bg: {\r\n type: String,\r\n default: '',\r\n },\r\n bgStyles: {\r\n type: Object,\r\n default() {},\r\n },\r\n val: {\r\n type: Number,\r\n default: 0,\r\n },\r\n width: {\r\n type: [String, Number],\r\n default: 0,\r\n },\r\n alway: {\r\n type: Boolean,\r\n default: true,\r\n },\r\n opacity: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n index: {\r\n type: [Number, String],\r\n default: 0,\r\n },\r\n placeholder: {\r\n type: [Boolean],\r\n default: false,\r\n },\r\n sticky: {\r\n type: [Boolean],\r\n default: false,\r\n },\r\n noFixed: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n ui: {\r\n type: String,\r\n default: '',\r\n },\r\n clickTo: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n // 是否需要安全区\r\n isInset: {\r\n type: Boolean,\r\n default: true,\r\n },\r\n})\r\n\r\nstate.fixed = !unref(props.sticky)\r\nonPageScroll((e) => {\r\n const top = e.scrollTop\r\n state.scrollTop = top\r\n state.opacityVal = top > sheep.$platform.navbar ? 1 : top * 0.01\r\n})\r\n\r\nonMounted(() => {\r\n nextTick(() => {\r\n computedQuery()\r\n })\r\n})\r\n\r\nconst computedQuery = () => {\r\n uni\r\n .createSelectorQuery()\r\n .in(vm)\r\n .select(`#fixed-${uuid}`)\r\n .boundingClientRect((data) => {\r\n if (data != null) {\r\n state.content = data
|