1 line
8.9 KiB
Plaintext
1 line
8.9 KiB
Plaintext
{"version":3,"file":"detail-navbar.js","sources":["../../../../../../../../src/modules/mall/goods/components/detail/detail-navbar.vue","../../../../../../../../uniComponent:/RDovQXBwL1dvcmsvYWRkci9hY2RyLXVpL3NyYy9tb2R1bGVzL21hbGwvZ29vZHMvY29tcG9uZW50cy9kZXRhaWwvZGV0YWlsLW5hdmJhci52dWU"],"sourcesContent":["<!-- 商品详情：商品/评价/详情的 nav -->\r\n<template>\r\n <su-fixed alway :bgStyles=\"{ background: '#fff' }\" :val=\"0\" noNav opacity :placeholder=\"false\">\r\n <su-status-bar />\r\n <view\r\n class=\"ui-bar ss-flex ss-col-center ss-row-between ss-p-x-20\"\r\n :style=\"[{ height: sys_navBar - sys_statusBar + 'px' }]\"\r\n >\r\n <!-- 左 -->\r\n <view class=\"icon-box ss-flex\">\r\n <view class=\"icon-button icon-button-left ss-flex ss-row-center\" @tap=\"onClickLeft\">\r\n <text class=\"sicon-back\" v-if=\"hasHistory\" />\r\n <text class=\"sicon-home\" v-else />\r\n </view>\r\n <view class=\"line\"></view>\r\n <view class=\"icon-button icon-button-right ss-flex ss-row-center\" @tap=\"onClickRight\">\r\n <text class=\"sicon-more\" />\r\n </view>\r\n </view>\r\n <!-- 中 -->\r\n <view class=\"detail-tab-card ss-flex-1\" :style=\"[{ opacity: state.tabOpacityVal }]\">\r\n <view class=\"tab-box ss-flex ss-col-center ss-row-around\">\r\n <view\r\n class=\"tab-item ss-flex-1 ss-flex ss-row-center ss-col-center\"\r\n v-for=\"item in state.tabList\"\r\n :key=\"item.value\"\r\n @tap=\"onTab(item)\"\r\n >\r\n <view class=\"tab-title\" :class=\"state.curTab === item.value ? 'cur-tab-title' : ''\">\r\n {{ item.label }}\r\n </view>\r\n <view v-show=\"state.curTab === item.value\" class=\"tab-line\"></view>\r\n </view>\r\n </view>\r\n </view>\r\n <!-- #ifdef MP -->\r\n <view :style=\"[capsuleStyle]\"></view>\r\n <!-- #endif -->\r\n </view>\r\n </su-fixed>\r\n</template>\r\n\r\n<script setup>\r\nimport { reactive } from 'vue'\r\nimport { onPageScroll } from '@dcloudio/uni-app'\r\nimport sheep from '@/sheep'\r\nimport throttle from '@/sheep/helper/throttle.js'\r\nimport { showMenuTools, closeMenuTools } from '@/sheep/hooks/useModal'\r\n\r\nconst sys_statusBar = sheep.$platform.device.statusBarHeight\r\nconst sys_navBar = sheep.$platform.navbar\r\nconst capsuleStyle = {\r\n width: sheep.$platform.capsule.width + 'px',\r\n height: sheep.$platform.capsule.height + 'px',\r\n}\r\n\r\nconst state = reactive({\r\n tabOpacityVal: 0,\r\n curTab: 'goods',\r\n tabList: [\r\n {\r\n label: '商品',\r\n value: 'goods',\r\n to: 'detail-swiper-selector',\r\n },\r\n {\r\n label: '评价',\r\n value: 'comment',\r\n to: 'detail-comment-selector',\r\n },\r\n {\r\n label: '详情',\r\n value: 'detail',\r\n to: 'detail-content-selector',\r\n },\r\n ],\r\n})\r\nconst emits = defineEmits(['clickLeft'])\r\nconst hasHistory = sheep.$router.hasHistory()\r\n\r\nfunction onClickLeft() {\r\n if (hasHistory) {\r\n sheep.$router.back()\r\n } else {\r\n sheep.$router.go('/modules/mall/index/index')\r\n }\r\n emits('clickLeft')\r\n}\r\n\r\nfunction onClickRight() {\r\n showMenuTools()\r\n}\r\n\r\nconst commentCard = {\r\n top: 0,\r\n bottom: 0,\r\n}\r\n\r\nfunction getCommentCardNode() {\r\n return new Promise((res, rej) => {\r\n uni\r\n .createSelectorQuery()\r\n .select('.detail-comment-selector')\r\n .boundingClientRect((data) => {\r\n if (data) {\r\n commentCard.top = data.top\r\n commentCard.bottom = data.top + data.height\r\n res(data)\r\n } else {\r\n res(null)\r\n }\r\n })\r\n .exec()\r\n })\r\n}\r\n\r\nfunction onTab(tab) {\r\n let scrollTop = 0\r\n if (tab.value === 'comment') {\r\n scrollTop = commentCard.top - sys_navBar + 1\r\n } else if (tab.value === 'detail') {\r\n scrollTop = commentCard.bottom - sys_navBar + 1\r\n }\r\n uni.pageScrollTo({\r\n scrollTop,\r\n duration: 200,\r\n })\r\n}\r\n\r\nonPageScroll((e) => {\r\n state.tabOpacityVal = e.scrollTop > sheep.$platform.navbar ? 1 : e.scrollTop * 0.01\r\n if (commentCard.top === 0) {\r\n throttle(() => {\r\n getCommentCardNode()\r\n }, 50)\r\n }\r\n\r\n if (e.scrollTop < commentCard.top - sys_navBar) {\r\n state.curTab = 'goods'\r\n } else if (\r\n e.scrollTop >= commentCard.top - sys_navBar &&\r\n e.scrollTop <= commentCard.bottom - sys_navBar\r\n ) {\r\n state.curTab = 'comment'\r\n } else {\r\n state.curTab = 'detail'\r\n }\r\n})\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n \r\n.icon-box {\r\n box-shadow:\r\n 0px 0px 4rpx rgba(51, 51, 51, 0.08),\r\n 0px 4rpx 6rpx 2rpx rgba(102, 102, 102, 0.12);\r\n border-radius: 30rpx;\r\n width: 134rpx;\r\n height: 56rpx;\r\n margin-left: 8rpx;\r\n border: 1px solid rgba(#fff, 0.4);\r\n .line {\r\n width: 2rpx;\r\n height: 24rpx;\r\n background: #e5e5e7;\r\n }\r\n .sicon-back {\r\n font-size: 32rpx;\r\n color: #000;\r\n }\r\n .sicon-home {\r\n font-size: 32rpx;\r\n color: #000;\r\n }\r\n .sicon-more {\r\n font-size: 32rpx;\r\n color: #000;\r\n }\r\n .icon-button {\r\n width: 67rpx;\r\n height: 56rpx;\r\n &-left:hover {\r\n background: rgba(0, 0, 0, 0.16);\r\n border-radius: 30rpx 0px 0px 30rpx;\r\n }\r\n &-right:hover {\r\n background: rgba(0, 0, 0, 0.16);\r\n border-radius: 0px 30rpx 30rpx 0px;\r\n }\r\n }\r\n}\r\n.left-box {\r\n position: relative;\r\n width: 60rpx;\r\n height: 60rpx;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n .circle {\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n width: 60rpx;\r\n height: 60rpx;\r\n background: rgba(#fff, 0.6);\r\n border: 1rpx solid #ebebeb;\r\n border-radius: 50%;\r\n box-sizing: border-box;\r\n z-index: -1;\r\n }\r\n}\r\n.right {\r\n position: relative;\r\n width: 60rpx;\r\n height: 60rpx;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n .circle {\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n width: 60rpx;\r\n height: 60rpx;\r\n background: rgba(#ffffff, 0.6);\r\n border: 1rpx solid #ebebeb;\r\n box-sizing: border-box;\r\n border-radius: 50%;\r\n z-index: -1;\r\n }\r\n}\r\n.detail-tab-card {\r\n width: 50%;\r\n .tab-item {\r\n height: 80rpx;\r\n position: relative;\r\n z-index: 11;\r\n\r\n .tab-title {\r\n font-size: 30rpx;\r\n }\r\n\r\n .cur-tab-title {\r\n font-weight: $font-weight-bold;\r\n }\r\n\r\n .tab-line {\r\n width: 60rpx;\r\n height: 6rpx;\r\n border-radius: 6rpx;\r\n position: absolute;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n bottom: 10rpx;\r\n background-color: var(--ui-BG-Main);\r\n z-index: 12;\r\n }\r\n }\r\n}\r\n</style>\r\n","import Component from 'D:/App/Work/addr/acdr-ui/src/modules/mall/goods/components/detail/detail-navbar.vue'\nwx.createComponent(Component)"],"names":["sheep","reactive","showMenuTools","uni","onPageScroll","throttle"],"mappings":";;;;;;;;;;;;;;;;;;;AAiDA,UAAM,gBAAgBA,YAAK,MAAC,UAAU,OAAO;AAC7C,UAAM,aAAaA,YAAAA,MAAM,UAAU;AACnC,UAAM,eAAe;AAAA,MACnB,OAAOA,YAAAA,MAAM,UAAU,QAAQ,QAAQ;AAAA,MACvC,QAAQA,YAAAA,MAAM,UAAU,QAAQ,SAAS;AAAA,IAC3C;AAEA,UAAM,QAAQC,cAAAA,SAAS;AAAA,MACrB,eAAe;AAAA,MACf,QAAQ;AAAA,MACR,SAAS;AAAA,QACP;AAAA,UACE,OAAO;AAAA,UACP,OAAO;AAAA,UACP,IAAI;AAAA,QACL;AAAA,QACD;AAAA,UACE,OAAO;AAAA,UACP,OAAO;AAAA,UACP,IAAI;AAAA,QACL;AAAA,QACD;AAAA,UACE,OAAO;AAAA,UACP,OAAO;AAAA,UACP,IAAI;AAAA,QACL;AAAA,MACF;AAAA,IACH,CAAC;AACD,UAAM,QAAQ;AACd,UAAM,aAAaD,YAAAA,MAAM,QAAQ,WAAY;AAE7C,aAAS,cAAc;AACrB,UAAI,YAAY;AACdA,oBAAK,MAAC,QAAQ,KAAM;AAAA,MACxB,OAAS;AACLA,0BAAM,QAAQ,GAAG,2BAA2B;AAAA,MAC7C;AACD,YAAM,WAAW;AAAA,IACnB;AAEA,aAAS,eAAe;AACtBE,yCAAe;AAAA,IACjB;AAEA,UAAM,cAAc;AAAA,MAClB,KAAK;AAAA,MACL,QAAQ;AAAA,IACV;AAEA,aAAS,qBAAqB;AAC5B,aAAO,IAAI,QAAQ,CAAC,KAAK,QAAQ;AAC/BC,sBAAG,MACA,oBAAqB,EACrB,OAAO,0BAA0B,EACjC,mBAAmB,CAAC,SAAS;AAC5B,cAAI,MAAM;AACR,wBAAY,MAAM,KAAK;AACvB,wBAAY,SAAS,KAAK,MAAM,KAAK;AACrC,gBAAI,IAAI;AAAA,UAClB,OAAe;AACL,gBAAI,IAAI;AAAA,UACT;AAAA,QACT,CAAO,EACA,KAAM;AAAA,MACb,CAAG;AAAA,IACH;AAEA,aAAS,MAAM,KAAK;AAClB,UAAI,YAAY;AAChB,UAAI,IAAI,UAAU,WAAW;AAC3B,oBAAY,YAAY,MAAM,aAAa;AAAA,MAC/C,WAAa,IAAI,UAAU,UAAU;AACjC,oBAAY,YAAY,SAAS,aAAa;AAAA,MAC/C;AACDA,oBAAAA,MAAI,aAAa;AAAA,QACf;AAAA,QACA,UAAU;AAAA,MACd,CAAG;AAAA,IACH;AAEAC,kBAAY,aAAC,CAAC,MAAM;AAClB,YAAM,gBAAgB,EAAE,YAAYJ,YAAK,MAAC,UAAU,SAAS,IAAI,EAAE,YAAY;AAC/E,UAAI,YAAY,QAAQ,GAAG;AACzBK,8BAAAA,SAAS,MAAM;AACb,6BAAoB;AAAA,QACrB,GAAE,EAAE;AAAA,MACN;AAED,UAAI,EAAE,YAAY,YAAY,MAAM,YAAY;AAC9C,cAAM,SAAS;AAAA,MACnB,WACI,EAAE,aAAa,YAAY,MAAM,cACjC,EAAE,aAAa,YAAY,SAAS,YACpC;AACA,cAAM,SAAS;AAAA,MACnB,OAAS;AACL,cAAM,SAAS;AAAA,MAChB;AAAA,IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClJD,GAAG,gBAAgB,SAAS;"} |