@uxda/appkit 1.2.54 → 1.2.56

package/dist/appkit.css

@@ -1230,9 +1230,14 @@ page {
   height: 30px;
   margin-bottom: 8px;
 }
+.notice-banner.fixed {
+  position: fixed;
+  z-index: 10;
+  width: 100%;
+}
 .notice-banner .dd-notice-bar {
   position: relative;
-  background: #f2f3ff;
+  background: #e6f2ff;
   font-size: 10px;
   color: rgba(0, 0, 0, 0.8980392157);
   padding: 0 8px;

package/dist/index.js

@@ -111,7 +111,7 @@ function requestPayment$2(json) {
 
 function useSafeArea() {
   const systemInfo = Taro.getSystemInfoSync(), capsule = Taro.getMenuButtonBoundingClientRect();
-  const status = systemInfo.statusBarHeight || 0, gap = capsule.top - status, nav = capsule.height + gap * 2, safeAreaBottom = systemInfo.safeArea?.bottom || 0, bottom = systemInfo.screenHeight - safeAreaBottom;
+  const status = systemInfo.statusBarHeight || 0, gap = capsule.top - status, nav = capsule.height + gap * 2, safeAreaBottom = (systemInfo.safeArea || {}).bottom || 0, bottom = systemInfo.screenHeight - safeAreaBottom;
   return {
     status,
     nav,
@@ -246,7 +246,7 @@ const _hoisted_2$h = /* @__PURE__ */ createElementVNode(
   -1
   /* HOISTED */
 );
-const _hoisted_3$e = [
+const _hoisted_3$f = [
   _hoisted_2$h
 ];
 var script$l = /* @__PURE__ */ defineComponent({
@@ -291,7 +291,7 @@ var script$l = /* @__PURE__ */ defineComponent({
             key: 0,
             class: "dd-notice-bar__close",
             onClick: close
-          }, [..._hoisted_3$e])) : createCommentVNode("v-if", true)
+          }, [..._hoisted_3$f])) : createCommentVNode("v-if", true)
         ],
         6
         /* CLASS, STYLE */
@@ -842,7 +842,7 @@ const services$1 = [
 
 const _hoisted_1$i = { class: "view recharge-view" };
 const _hoisted_2$g = { class: "flex-grow" };
-const _hoisted_3$d = { class: "amount-footer" };
+const _hoisted_3$e = { class: "amount-footer" };
 const _hoisted_4$a = { class: "agreement" };
 var script$j = /* @__PURE__ */ defineComponent({
   __name: "RechargeView",
@@ -915,7 +915,7 @@ var script$j = /* @__PURE__ */ defineComponent({
             onChange: onAmountSelect
           }, null, 8, ["items", "selected"])
         ]),
-        createElementVNode("view", _hoisted_3$d, [
+        createElementVNode("view", _hoisted_3$e, [
           createElementVNode("view", _hoisted_4$a, [
             createVNode(_component_nut_checkbox, {
               modelValue: state.agreed,
@@ -966,7 +966,7 @@ script$j.__file = "src/payment/components/RechargeView.vue";
 
 const _hoisted_1$h = { class: "recharge-result" };
 const _hoisted_2$f = { class: "content" };
-const _hoisted_3$c = /* @__PURE__ */ createElementVNode(
+const _hoisted_3$d = /* @__PURE__ */ createElementVNode(
   "div",
   { class: "figure" },
   null,
@@ -1001,7 +1001,7 @@ var script$i = /* @__PURE__ */ defineComponent({
       const _component_nut_button = resolveComponent("nut-button");
       return openBlock(), createElementBlock("div", _hoisted_1$h, [
         createElementVNode("div", _hoisted_2$f, [
-          _hoisted_3$c,
+          _hoisted_3$d,
           createElementVNode(
             "h2",
             null,
@@ -1037,7 +1037,7 @@ script$i.__file = "src/payment/components/RechargeResult.vue";
 
 const _hoisted_1$g = { class: "tag" };
 const _hoisted_2$e = { class: "token-line number" };
-const _hoisted_3$b = { class: "number" };
+const _hoisted_3$c = { class: "number" };
 var script$h = /* @__PURE__ */ defineComponent({
   __name: "RightsPicker",
   props: {
@@ -1092,7 +1092,7 @@ var script$h = /* @__PURE__ */ defineComponent({
                     createTextVNode("\xA5"),
                     createElementVNode(
                       "span",
-                      _hoisted_3$b,
+                      _hoisted_3$c,
                       toDisplayString(amount.paymentAmount),
                       1
                       /* TEXT */
@@ -1118,7 +1118,7 @@ script$h.__file = "src/payment/components/RightsPicker.vue";
 
 const _hoisted_1$f = { class: "view recharge-view2" };
 const _hoisted_2$d = { class: "flex-grow" };
-const _hoisted_3$a = {
+const _hoisted_3$b = {
   key: 0,
   class: "bean-buy"
 };
@@ -1252,7 +1252,7 @@ var script$g = /* @__PURE__ */ defineComponent({
             selected: state.selected,
             onChange: onAmountSelect
           }, null, 8, ["items", "selected"]),
-          amounts.value[state.selected] ? (openBlock(), createElementBlock("div", _hoisted_3$a, [
+          amounts.value[state.selected] ? (openBlock(), createElementBlock("div", _hoisted_3$b, [
             createElementVNode("div", _hoisted_4$8, [
               _hoisted_5$6,
               !selectBean.value ? (openBlock(), createElementBlock(
@@ -1402,7 +1402,7 @@ const components = {
 
 const _hoisted_1$e = { class: "account-card" };
 const _hoisted_2$c = { class: "card" };
-const _hoisted_3$9 = { class: "card-row" };
+const _hoisted_3$a = { class: "card-row" };
 const _hoisted_4$7 = { class: "card-row-left" };
 const _hoisted_5$5 = /* @__PURE__ */ createElementVNode(
   "div",
@@ -1523,7 +1523,7 @@ var script$f = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$e, [
         createElementVNode("div", _hoisted_2$c, [
-          createElementVNode("div", _hoisted_3$9, [
+          createElementVNode("div", _hoisted_3$a, [
             createElementVNode("div", _hoisted_4$7, [
               _hoisted_5$5,
               createElementVNode(
@@ -1584,7 +1584,7 @@ const _hoisted_2$b = /* @__PURE__ */ createElementVNode(
   -1
   /* HOISTED */
 );
-const _hoisted_3$8 = { class: "consumption-filter-content" };
+const _hoisted_3$9 = { class: "consumption-filter-content" };
 const _hoisted_4$6 = { class: "title" };
 const _hoisted_5$4 = { class: "info" };
 const _hoisted_6$2 = ["onClick"];
@@ -1649,7 +1649,7 @@ var script$e = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$d, [
         _hoisted_2$b,
-        createElementVNode("div", _hoisted_3$8, [
+        createElementVNode("div", _hoisted_3$9, [
           (openBlock(true), createElementBlock(
             Fragment,
             null,
@@ -1715,7 +1715,7 @@ const _hoisted_2$a = /* @__PURE__ */ createElementVNode(
   -1
   /* HOISTED */
 );
-const _hoisted_3$7 = { class: "content" };
+const _hoisted_3$8 = { class: "content" };
 const _hoisted_4$5 = /* @__PURE__ */ createElementVNode(
   "div",
   { class: "title" },
@@ -1799,7 +1799,7 @@ var script$d = /* @__PURE__ */ defineComponent({
         [
           createElementVNode("div", _hoisted_1$c, [
             _hoisted_2$a,
-            createElementVNode("div", _hoisted_3$7, [
+            createElementVNode("div", _hoisted_3$8, [
               _hoisted_4$5,
               createElementVNode("div", _hoisted_5$3, [
                 createElementVNode(
@@ -1866,7 +1866,7 @@ const _hoisted_2$9 = /* @__PURE__ */ createElementVNode(
   -1
   /* HOISTED */
 );
-const _hoisted_3$6 = /* @__PURE__ */ createElementVNode(
+const _hoisted_3$7 = /* @__PURE__ */ createElementVNode(
   "div",
   { class: "desc" },
   [
@@ -1889,7 +1889,7 @@ var script$c = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$b, [
         _hoisted_2$9,
-        _hoisted_3$6,
+        _hoisted_3$7,
         createElementVNode("div", {
           class: "know",
           onClick: _cache[0] || (_cache[0] = ($event) => emit("complete"))
@@ -1912,7 +1912,7 @@ const _hoisted_2$8 = /* @__PURE__ */ createElementVNode(
   -1
   /* HOISTED */
 );
-const _hoisted_3$5 = /* @__PURE__ */ createElementVNode(
+const _hoisted_3$6 = /* @__PURE__ */ createElementVNode(
   "div",
   { class: "empty-view-text" },
   "\u6682\u65E0\u6570\u636E",
@@ -1921,7 +1921,7 @@ const _hoisted_3$5 = /* @__PURE__ */ createElementVNode(
 );
 const _hoisted_4$4 = [
   _hoisted_2$8,
-  _hoisted_3$5
+  _hoisted_3$6
 ];
 function render(_ctx, _cache) {
   return openBlock(), createElementBlock("div", _hoisted_1$a, [..._hoisted_4$4]);
@@ -1946,7 +1946,7 @@ const _hoisted_2$7 = /* @__PURE__ */ createElementVNode(
   -1
   /* HOISTED */
 );
-const _hoisted_3$4 = /* @__PURE__ */ createElementVNode(
+const _hoisted_3$5 = /* @__PURE__ */ createElementVNode(
   "div",
   { class: "tip-content" },
   "2024\u5E745\u670831\u65E5\u8D77\uFF0C\u4EBA\u6C11\u5E01\u4E0E\u4E91\u8C46\u5151\u6362\u6BD4\u4F8B\u8C03\u6574\u4E3A1\u4EBA\u6C11\u5E01=1\u4E91\u8C46\uFF0C\u4E91\u8C46\u4F59\u989D\u6839\u636E\u5151\u6362\u6BD4\u4F8B\u8C03\u6574",
@@ -1955,7 +1955,7 @@ const _hoisted_3$4 = /* @__PURE__ */ createElementVNode(
 );
 const _hoisted_4$3 = [
   _hoisted_2$7,
-  _hoisted_3$4
+  _hoisted_3$5
 ];
 var script$a = /* @__PURE__ */ defineComponent({
   __name: "Tip",
@@ -1978,7 +1978,7 @@ script$a.__file = "src/balance/components/Tip.vue";
 
 const _hoisted_1$8 = { class: "account-view" };
 const _hoisted_2$6 = { class: "scroll-content" };
-const _hoisted_3$3 = /* @__PURE__ */ createElementVNode(
+const _hoisted_3$4 = /* @__PURE__ */ createElementVNode(
   "label",
   null,
   "\u6536\u652F\u660E\u7EC6",
@@ -1986,7 +1986,7 @@ const _hoisted_3$3 = /* @__PURE__ */ createElementVNode(
   /* HOISTED */
 );
 const _hoisted_4$2 = [
-  _hoisted_3$3
+  _hoisted_3$4
 ];
 const _hoisted_5$2 = { class: "balance" };
 const _hoisted_6 = { class: "bean-box spa-between" };
@@ -2622,7 +2622,7 @@ const _hoisted_2$5 = /* @__PURE__ */ createElementVNode(
   -1
   /* HOISTED */
 );
-const _hoisted_3$2 = { class: "footer" };
+const _hoisted_3$3 = { class: "footer" };
 const _hoisted_4$1 = { class: "col" };
 const _hoisted_5$1 = { class: "col" };
 var script$8 = /* @__PURE__ */ defineComponent({
@@ -2647,7 +2647,7 @@ var script$8 = /* @__PURE__ */ defineComponent({
         default: withCtx(() => [
           createElementVNode("div", _hoisted_1$7, [
             _hoisted_2$5,
-            createElementVNode("div", _hoisted_3$2, [
+            createElementVNode("div", _hoisted_3$3, [
               createElementVNode("div", _hoisted_4$1, [
                 createVNode(_component_nut_button, {
                   class: "cancel-button",
@@ -3121,7 +3121,7 @@ script$4.__file = "src/components/dd-selector/index.vue";
 
 const _hoisted_1$3 = { class: "self-registration" };
 const _hoisted_2$3 = { class: "self-registration-body" };
-const _hoisted_3$1 = ["src"];
+const _hoisted_3$2 = ["src"];
 const _hoisted_4 = { class: "self-registration__input" };
 const _hoisted_5 = { class: "self-registration-bottom" };
 var script$3 = /* @__PURE__ */ defineComponent({
@@ -3234,7 +3234,7 @@ var script$3 = /* @__PURE__ */ defineComponent({
             src: _ctx.banner,
             class: "self-registration-banner",
             alt: ""
-          }, null, 8, _hoisted_3$1),
+          }, null, 8, _hoisted_3$2),
           createVNode(_component_nut_form, null, {
             default: withCtx(() => [
               createVNode(_component_nut_form_item, {
@@ -3552,6 +3552,7 @@ const _hoisted_1$2 = /* @__PURE__ */ createElementVNode(
   /* HOISTED */
 );
 const _hoisted_2$2 = { class: "notice-popup-bd" };
+const _hoisted_3$1 = { style: { "white-space": "pre-wrap" } };
 var script$2 = /* @__PURE__ */ defineComponent({
   __name: "NoticePopup",
   props: {
@@ -3593,8 +3594,10 @@ var script$2 = /* @__PURE__ */ defineComponent({
         default: withCtx(() => [
           _hoisted_1$2,
           createElementVNode("div", _hoisted_2$2, [
-            createTextVNode(
-              toDisplayString(_ctx.message.context) + " ",
+            createElementVNode(
+              "div",
+              _hoisted_3$1,
+              toDisplayString(_ctx.message.context),
               1
               /* TEXT */
             ),
@@ -3631,13 +3634,17 @@ const _hoisted_1$1 = /* @__PURE__ */ createElementVNode(
   -1
   /* HOISTED */
 );
-const _hoisted_2$1 = { class: "notice-banner-text" };
+const _hoisted_2$1 = {
+  class: "notice-banner-text",
+  style: { "white-space": "pre-wrap" }
+};
 const _hoisted_3 = ["onClick"];
 var script$1 = /* @__PURE__ */ defineComponent({
   __name: "NoticeBanner",
   props: {
     app: { type: String, required: true, default: "" },
-    bannerStyle: { type: null, required: false, default: "" }
+    bannerStyle: { type: null, required: false, default: "" },
+    fixed: { type: Boolean, required: false, default: false }
   },
   emits: ["detail", "close", "view"],
   setup(__props, { emit: __emit }) {
@@ -3646,6 +3653,14 @@ var script$1 = /* @__PURE__ */ defineComponent({
     const bannerMessages = ref([]);
     const popMessages = ref([]);
     const activeKey = ref(0);
+    const safeArea = useSafeArea();
+    const topStype = computed(() => {
+      if (!props.fixed) {
+        return props.bannerStyle;
+      } else {
+        return `top: ${safeArea.nav + safeArea.status}px; ${props.bannerStyle}}`;
+      }
+    });
     onMounted(() => {
       queryNoticeMsg();
     });
@@ -3666,12 +3681,12 @@ var script$1 = /* @__PURE__ */ defineComponent({
     }
     let interval = null;
     function startMessageCarousel() {
-      clearInterval(interval);
+      stopMessageCarousel();
       if (bannerMessages.value.length > 1) {
         interval = setInterval(() => {
           startMessageCalc();
           if (bannerMessages.value.length <= 1) {
-            clearInterval(interval);
+            stopMessageCarousel();
           }
         }, 3e3);
       }
@@ -3683,8 +3698,11 @@ var script$1 = /* @__PURE__ */ defineComponent({
         activeKey.value = 0;
       }
     }
-    function onClose(item, index) {
+    function stopMessageCarousel() {
       clearInterval(interval);
+    }
+    function onClose(item, index) {
+      stopMessageCarousel();
       const $http = useHttp();
       $http.post("/cas/msg/setMsgStatus", {
         device: "PC",
@@ -3709,6 +3727,12 @@ var script$1 = /* @__PURE__ */ defineComponent({
     function onView(item) {
       emits("view", item.link);
     }
+    function onTouchStart() {
+      stopMessageCarousel();
+    }
+    const onTouchEnd = debounce(() => {
+      startMessageCarousel();
+    }, 100);
     const emits = __emit;
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock(
@@ -3719,8 +3743,11 @@ var script$1 = /* @__PURE__ */ defineComponent({
             "div",
             {
               key: 0,
-              class: "notice-banner",
-              style: normalizeStyle(_ctx.bannerStyle)
+              class: normalizeClass(["notice-banner", { fixed: _ctx.fixed }]),
+              style: normalizeStyle(topStype.value),
+              onTouchstart: onTouchStart,
+              onTouchend: _cache[0] || (_cache[0] = //@ts-ignore
+              (...args) => unref(onTouchEnd) && unref(onTouchEnd)(...args))
             },
             [
               (openBlock(true), createElementBlock(
@@ -3755,8 +3782,8 @@ var script$1 = /* @__PURE__ */ defineComponent({
                 /* KEYED_FRAGMENT */
               ))
             ],
-            4
-            /* STYLE */
+            38
+            /* CLASS, STYLE, NEED_HYDRATION */
           )) : createCommentVNode("v-if", true),
           createCommentVNode(" \u7CFB\u7EDF\u516C\u544A\u5F3A\u5236\u5F39\u6846 "),
           (openBlock(true), createElementBlock(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxda/appkit",
-  "version": "1.2.54",
+  "version": "1.2.56",
   "description": "小程序应用开发包",
   "main": "dist/index.js",
   "module": "dist/index.ts",

package/src/notice/components/NoticeBanner.vue

@@ -1,5 +1,12 @@
 <template>
-  <div class="notice-banner" :style="bannerStyle" v-if="bannerMessages.length">
+  <div
+    class="notice-banner"
+    :class="{ fixed: fixed }"
+    :style="topStype"
+    v-if="bannerMessages.length"
+    @touchstart="onTouchStart"
+    @touchend="onTouchEnd"
+  >
     <DdNoticeBar
       :class="{ show: key === activeKey }"
       v-for="(item, key) in bannerMessages"
@@ -12,7 +19,7 @@
         src="https://cdn.ddjf.com/static/images/customer-center/notice-icon.png"
         alt=""
       />
-      <div class="notice-banner-text">
+      <div class="notice-banner-text" style="white-space: pre-wrap">
         {{ item.context }}
       </div>
       <div class="notice-banner-btn" @click="onDetail(item)">详情</div>
@@ -26,22 +33,26 @@
 </template>
 
 <script lang="ts" setup>
-import { onMounted, ref } from 'vue'
+import { computed, onMounted, ref } from 'vue'
 import { useHttp } from '../api'
 import { useAppKitOptions } from '../../Appkit'
 import DdNoticeBar from '../../components/dd-notice-bar/index.vue'
 import NoticePopup from './NoticePopup.vue'
 import Taro from '@tarojs/taro'
 import { useNotice } from './useNotice'
+import debounce from 'lodash/debounce'
+import { useSafeArea } from '../../shared/composables'
 
 const props = withDefaults(
   defineProps<{
     app: string
     bannerStyle?: any
+    fixed?: boolean
   }>(),
   {
     app: '',
     bannerStyle: '',
+    fixed: false,
   }
 )
 
@@ -49,6 +60,15 @@ const { toReadFun, noticeClick } = useNotice()
 const bannerMessages = ref<any[]>([]) // 横幅消息
 const popMessages = ref<any[]>([]) // 弹窗消息
 const activeKey = ref(0)
+const safeArea = useSafeArea()
+
+const topStype = computed(() => {
+  if (!props.fixed) {
+    return props.bannerStyle
+  } else {
+    return `top: ${safeArea.nav + safeArea.status}px; ${props.bannerStyle}}`
+  }
+})
 
 onMounted(() => {
   queryNoticeMsg()
@@ -78,12 +98,12 @@ async function queryNoticeMsg() {
 let interval: any = null
 // 启动消息轮播
 function startMessageCarousel() {
-  clearInterval(interval)
+  stopMessageCarousel()
   if (bannerMessages.value.length > 1) {
     interval = setInterval(() => {
       startMessageCalc()
       if (bannerMessages.value.length <= 1) {
-        clearInterval(interval)
+        stopMessageCarousel()
       }
     }, 3000)
   }
@@ -95,10 +115,14 @@ function startMessageCalc() {
     activeKey.value = 0
   }
 }
+// 停止消息轮播
+function stopMessageCarousel() {
+  clearInterval(interval)
+}
 
 // 关闭横幅
 function onClose(item: any, index: number) {
-  clearInterval(interval)
+  stopMessageCarousel()
 
   const $http = useHttp()
   $http
@@ -138,6 +162,14 @@ function onView(item) {
   emits('view', item.link)
 }
 
+// 处理手势移入/移出
+function onTouchStart() {
+  stopMessageCarousel()
+}
+const onTouchEnd = debounce(() => {
+  startMessageCarousel()
+}, 100)
+
 // 父组件事件
 const emits = defineEmits(['detail', 'close', 'view'])
 </script>
@@ -146,10 +178,15 @@ const emits = defineEmits(['detail', 'close', 'view'])
 .notice-banner {
   height: 30px;
   margin-bottom: 8px;
+  &.fixed {
+    position: fixed;
+    z-index: 10;
+    width: 100%;
+  }
 
   .dd-notice-bar {
     position: relative;
-    background: #f2f3ff;
+    background: #e6f2ff;
     font-size: 10px;
     color: #000000e5;
     padding: 0 8px;

package/src/notice/components/NoticePopup.vue

@@ -13,7 +13,7 @@
       />系统公告
     </div>
     <div class="notice-popup-bd">
-      {{ message.context }}
+      <div style="white-space: pre-wrap">{{ message.context }}</div>
       <div
         v-if="message.jumpUrl || message.link"
         class="notice-popup-bd-link"

package/src/shared/composables/useSafeArea.ts

@@ -35,7 +35,7 @@ export function useSafeArea(): SafeArea {
      */
     gap = capsule.top - status,
     nav = capsule.height + gap * 2,
-    safeAreaBottom = systemInfo.safeArea?.bottom || 0,
+    safeAreaBottom = (systemInfo.safeArea || {}).bottom || 0,
     bottom = systemInfo.screenHeight - safeAreaBottom
   return {
     status,