{"version":3,"file":"su-inner-navbar.js","sources":["../../../../../../src/sheep/ui/su-inner-navbar/su-inner-navbar.vue","../../../../../../uniComponent:/RDovQXBwL1dvcmsvYWRkci9hY2RyLXVpL3NyYy9zaGVlcC91aS9zdS1pbm5lci1uYXZiYXIvc3UtaW5uZXItbmF2YmFyLnZ1ZQ"],"sourcesContent":["<template>\r\n  <su-fixed\r\n    :noFixed=\"props.noFixed\"\r\n    :alway=\"props.alway\"\r\n    :bgStyles=\"props.bgStyles\"\r\n    :val=\"0\"\r\n    :index=\"props.zIndex\"\r\n    noNav\r\n    :bg=\"props.bg\"\r\n    :ui=\"props.ui\"\r\n    :opacity=\"props.opacity\"\r\n    :placeholder=\"props.placeholder\"\r\n  >\r\n    <su-status-bar />\r\n    <!-- \r\n      :class=\"[{ 'border-bottom': !props.opacity && props.bg != 'bg-none' }]\"\r\n     -->\r\n    <view class=\"ui-navbar-box\">\r\n      <view\r\n        class=\"ui-bar ss-p-x-20\"\r\n        :class=\"state.isDark ? 'text-white' : 'text-black'\"\r\n        :style=\"[{ height: sys_navBar - sys_statusBar + 'px' }]\"\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        <slot name=\"center\">\r\n          <view class=\"center navbar-title\">{{ title }}</view>\r\n        </slot>\r\n        <!-- #ifdef MP -->\r\n        <view :style=\"[state.capsuleStyle]\"></view>\r\n        <!-- #endif -->\r\n      </view>\r\n    </view>\r\n  </su-fixed>\r\n</template>\r\n\r\n<script setup>\r\n/**\r\n * 标题栏 - 基础组件navbar\r\n *\r\n * @param {Number}  zIndex = 100  \t\t\t\t\t\t\t- 层级\r\n * @param {Boolean}  back = true \t\t\t\t\t\t\t- 是否返回上一页\r\n * @param {String}  backtext = ''  \t\t\t\t\t\t\t- 返回文本\r\n * @param {String}  bg = 'bg-white'  \t\t\t\t\t\t- 公共Class\r\n * @param {String}  status = ''  \t\t\t\t\t\t\t- 状态栏颜色\r\n * @param {Boolean}  alway = true\t\t\t\t\t\t\t- 是否常驻\r\n * @param {Boolean}  opacity = false  \t\t\t\t\t\t- 是否开启透明渐变\r\n * @param {Boolean}  noFixed = false  \t\t\t\t\t\t- 是否浮动\r\n * @param {String}  ui = ''\t\t\t\t\t\t\t\t\t- 公共Class\r\n * @param {Boolean}  capsule = false  \t\t\t\t\t\t- 是否开启胶囊返回\r\n * @param {Boolean}  stopBack = false \t\t\t\t\t    - 是否禁用返回\r\n * @param {Boolean}  placeholder = true \t\t\t\t\t- 是否开启占位\r\n * @param {Object}   bgStyles = {} \t\t\t\t\t    \t- 背景样式\r\n *\r\n */\r\n\r\nimport { computed, reactive, onBeforeMount, ref } from 'vue'\r\nimport sheep from '@/sheep'\r\nimport { onPageScroll } from '@dcloudio/uni-app'\r\nimport { showMenuTools, closeMenuTools } from '@/sheep/hooks/useModal'\r\n\r\n// 本地数据\r\nconst state = reactive({\r\n  statusCur: '',\r\n  capsuleStyle: {},\r\n  capsuleBack: {},\r\n  isDark: true,\r\n})\r\n\r\nconst sys_statusBar = sheep.$platform.device.statusBarHeight\r\nconst sys_navBar = sheep.$platform.navbar\r\n\r\nconst props = defineProps({\r\n  zIndex: {\r\n    type: Number,\r\n    default: 100,\r\n  },\r\n\r\n  title: {\r\n    // 返回文本\r\n    type: String,\r\n    default: '',\r\n  },\r\n  bg: {\r\n    type: String,\r\n    default: 'bg-white',\r\n  },\r\n  // 常驻\r\n  alway: {\r\n    type: Boolean,\r\n    default: true,\r\n  },\r\n  opacity: {\r\n    // 是否开启滑动渐变\r\n    type: Boolean,\r\n    default: true,\r\n  },\r\n  noFixed: {\r\n    // 是否浮动\r\n    type: Boolean,\r\n    default: true,\r\n  },\r\n  ui: {\r\n    type: String,\r\n    default: '',\r\n  },\r\n  capsule: {\r\n    // 是否开启胶囊返回\r\n    type: Boolean,\r\n    default: false,\r\n  },\r\n  stopBack: {\r\n    type: Boolean,\r\n    default: false,\r\n  },\r\n  placeholder: {\r\n    type: [Boolean],\r\n    default: false,\r\n  },\r\n  bgStyles: {\r\n    type: Object,\r\n    default() {},\r\n  },\r\n})\r\n\r\nconst emits = defineEmits(['navback', 'clickLeft'])\r\nconst hasHistory = sheep.$router.hasHistory()\r\n\r\nonBeforeMount(() => {\r\n  init()\r\n})\r\n\r\nonPageScroll((e) => {\r\n  const top = e.scrollTop\r\n  state.isDark = top < sheep.$platform.navbar\r\n})\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\nfunction onClickRight() {\r\n  showMenuTools()\r\n}\r\n\r\n// 初始化\r\nconst init = () => {\r\n  // #ifdef MP-ALIPAY\r\n  my.hideAllFavoriteMenu()\r\n  // #endif\r\n  state.capsuleStyle = {\r\n    width: sheep.$platform.capsule.width + 'px',\r\n    height: sheep.$platform.capsule.height + 'px',\r\n  }\r\n\r\n  state.capsuleBack = state.capsuleStyle\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n \r\n.icon-box {\r\n  width: 134rpx;\r\n  height: 56rpx;\r\n  margin-left: 8rpx;\r\n  border: 1px solid rgba(#fff, 0.4);\r\n  border-radius: 30rpx;\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  .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  }\r\n  .sicon-home {\r\n    font-size: 32rpx;\r\n  }\r\n  .sicon-more {\r\n    font-size: 32rpx;\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.navbar-title {\r\n  font-size: 36rpx;\r\n}\r\n.tools-icon {\r\n  font-size: 40rpx;\r\n}\r\n.ui-navbar-box {\r\n  width: 100%;\r\n  background-color: transparent;\r\n\r\n  .ui-bar {\r\n    position: relative;\r\n    z-index: 2;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: space-between;\r\n    white-space: nowrap;\r\n\r\n    .left {\r\n      @include flex-bar;\r\n\r\n      .back {\r\n        @include flex-bar;\r\n\r\n        .back-icon {\r\n          @include flex-center;\r\n          width: 56rpx;\r\n          height: 56rpx;\r\n          margin: 0 10rpx;\r\n          font-size: 46rpx !important;\r\n\r\n          &.opacityIcon {\r\n            position: relative;\r\n            background-color: rgba(127, 127, 127, 0.5);\r\n            border-radius: 50%;\r\n\r\n            &::after {\r\n              position: absolute;\r\n              top: 0;\r\n              left: 0;\r\n              display: block;\r\n              width: 200%;\r\n              height: 200%;\r\n              pointer-events: none;\r\n              content: '';\r\n              border: 1px solid currentColor;\r\n              border-radius: inherit;\r\n              opacity: 0.1;\r\n              transform: scale(0.5);\r\n              transform-origin: 0 0;\r\n            }\r\n\r\n            &::before {\r\n              transform: scale(0.9);\r\n            }\r\n          }\r\n        }\r\n        /* #ifdef  MP-ALIPAY */\r\n        ._icon-back {\r\n          opacity: 0;\r\n        }\r\n        /* #endif */\r\n      }\r\n\r\n      .capsule {\r\n        @include flex-bar;\r\n        position: relative;\r\n        border-radius: 100px;\r\n\r\n        &.dark {\r\n          background-color: rgba(255, 255, 255, 0.5);\r\n        }\r\n\r\n        &.light {\r\n          background-color: rgba(0, 0, 0, 0.15);\r\n        }\r\n\r\n        &::after {\r\n          position: absolute;\r\n          top: 20%;\r\n          left: 50%;\r\n          display: block;\r\n          width: 1px;\r\n          height: 60%;\r\n          pointer-events: none;\r\n          content: '';\r\n          background-color: currentColor;\r\n          opacity: 0.1;\r\n        }\r\n\r\n        &::before {\r\n          position: absolute;\r\n          top: 0;\r\n          left: 0;\r\n          display: block;\r\n          width: 200%;\r\n          height: 200%;\r\n          pointer-events: none;\r\n          content: '';\r\n          border: 1px solid currentColor;\r\n          border-radius: inherit;\r\n          opacity: 0.1;\r\n          transform: scale(0.5);\r\n          transform-origin: 0 0;\r\n        }\r\n\r\n        .capsule-back,\r\n        .capsule-home {\r\n          @include flex-center;\r\n          flex: 1;\r\n        }\r\n\r\n        &.isFristPage {\r\n          .capsule-back,\r\n          &::after {\r\n            display: none;\r\n          }\r\n        }\r\n      }\r\n    }\r\n\r\n    .right {\r\n      @include flex-bar;\r\n\r\n      .right-content {\r\n        @include flex;\r\n        flex-direction: row-reverse;\r\n      }\r\n    }\r\n\r\n    .center {\r\n      @include flex-center;\r\n      // text-align: center;\r\n      position: absolute;\r\n      left: 50%;\r\n      text-overflow: ellipsis;\r\n      transform: translateX(-50%);\r\n\r\n      .image {\r\n        display: block;\r\n        max-width: calc(100vw - 200px);\r\n        height: 36px;\r\n      }\r\n    }\r\n  }\r\n\r\n  .ui-bar-bg {\r\n    position: absolute;\r\n    top: 0;\r\n    z-index: 1;\r\n    width: 100%;\r\n    height: 100%;\r\n    pointer-events: none;\r\n  }\r\n}\r\n</style>\r\n","import Component from 'D:/App/Work/addr/acdr-ui/src/sheep/ui/su-inner-navbar/su-inner-navbar.vue'\nwx.createComponent(Component)"],"names":["reactive","sheep","onBeforeMount","onPageScroll","showMenuTools"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsEA,UAAM,QAAQA,cAAAA,SAAS;AAAA,MACrB,WAAW;AAAA,MACX,cAAc,CAAE;AAAA,MAChB,aAAa,CAAE;AAAA,MACf,QAAQ;AAAA,IACV,CAAC;AAED,UAAM,gBAAgBC,YAAK,MAAC,UAAU,OAAO;AAC7C,UAAM,aAAaA,YAAAA,MAAM,UAAU;AAEnC,UAAM,QAAQ;AAqDd,UAAM,QAAQ;AACd,UAAM,aAAaA,YAAAA,MAAM,QAAQ,WAAY;AAE7CC,kBAAAA,cAAc,MAAM;AAClB,WAAM;AAAA,IACR,CAAC;AAEDC,kBAAY,aAAC,CAAC,MAAM;AAClB,YAAM,MAAM,EAAE;AACd,YAAM,SAAS,MAAMF,YAAK,MAAC,UAAU;AAAA,IACvC,CAAC;AAED,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;AACA,aAAS,eAAe;AACtBG,yCAAe;AAAA,IACjB;AAGA,UAAM,OAAO,MAAM;AAIjB,YAAM,eAAe;AAAA,QACnB,OAAOH,YAAAA,MAAM,UAAU,QAAQ,QAAQ;AAAA,QACvC,QAAQA,YAAAA,MAAM,UAAU,QAAQ,SAAS;AAAA,MAC1C;AAED,YAAM,cAAc,MAAM;AAAA,IAC5B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvKA,GAAG,gBAAgB,SAAS;"}