fix: 对接

zhengyiming

2025-03-07 b916fb416c25a7e11c25fb62bc83f2f3434778d0

fix: 对接

 apps/taro/src/components/Layout/PageLayout.vue

@@ -119,7 +119,7 @@
@import '@/styles/common.scss';

.page-layout-wrapper {
  // background-color: $body-background-color;
  /* background-color: $body-background-color; */

  .page-layout-scroll-view-wrapper {
    display: flex;

 packages/components/package.json

@@ -43,6 +43,7 @@
    "@life-payment/core-vue": "workspace:^",
    "@nutui/icons-vue-taro": "0.0.9",
    "@nutui/nutui-taro": "4.3.13",
    "@tarojs/components": "3.6.20",
    "@tarojs/taro": "3.6.20",
    "@vitejs/plugin-vue": "^5.1.4",
    "@vitejs/plugin-vue-jsx": "^4.0.1",
@@ -54,6 +55,7 @@
  "peerDependencies": {
    "@life-payment/core-vue": "*",
    "@nutui/nutui-taro": "*",
    "@tarojs/components": "*",
    "@tarojs/taro": "*",
    "vue": "*"
  }

 packages/components/src/components/InfiniteLoading/InfiniteLoading.vue

@@ -65,6 +65,7 @@
import { Loading } from '@nutui/icons-vue-taro';
import { useScrollDistance } from 'senin-mini/hooks';
import IconBackTop from '../../assets/icon-back-top.png';
import { ScrollView } from '@tarojs/components';

defineOptions({
  name: 'InfiniteLoading',

 packages/components/src/styles/components.scss

@@ -1,48 +1,47 @@
/*postcss-pxtransform disable*/
@use './common.scss' as *;

.recharge-tips-view {
  padding: 16px;
  border-radius: 12px;
  padding: 32px;
  border-radius: 24px;
  background: linear-gradient(0deg, rgba(10, 90, 255, 0.04), rgba(10, 90, 255, 0.04)), #fff;

  .recharge-tips-title {
    color: #1f2229;
    font-size: 14px;
    font-size: 24px;
    font-weight: 700;
    line-height: 18px;
    padding: 4px 0 12px 0;
    line-height: 36px;
    padding: 8px 0 24px 0;
    border-bottom: 1px solid boleGetCssVar('color', 'primary');
  }

  .recharge-tips-content {
    color: boleGetCssVar('text-color', 'regular');
    font-size: 13px;
    font-size: 26px;
    font-weight: 400;
    line-height: 21px;
    padding-top: 16px;
    line-height: 42px;
    padding-top: 32px;

    .recharge-tips-top {
      color: #e03e2d;
      font-size: 18px;
      font-size: 36px;
    }
  }
}

.confirm-dialog-content {
  .confirm-dialog-content-tips {
    margin-bottom: 16px;
    margin-bottom: 32px;
  }

  .confirm-dialog-content-info {
    padding: 12px;
    border-radius: 8px;
    padding: 24px;
    border-radius: 16px;
    background: #f0f3fa;
    margin-bottom: 8px;
    margin-bottom: 16px;

    .confirm-dialog-content-info-item {
      display: flex;
      margin-bottom: 10px;
      margin-bottom: 20px;

      &:last-child {
        margin-bottom: 0;
@@ -50,7 +49,7 @@

      .confirm-dialog-content-info-item-label {
        color: boleGetCssVar('text-color', 'regular');
        margin-right: 6px;
        margin-right: 12px;
      }

      .confirm-dialog-content-info-item-content {
@@ -72,29 +71,29 @@
  .confirm-dialog-content-warning {
    color: boleGetCssVar('color', 'danger');
    text-align: left;
    font-size: 16px;
    line-height: 20px;
    font-size: 32px;
    line-height: 40px;
  }
}

.select-pay-type-view {
  .select-pay-type-view-item-icon {
    width: 32px;
    height: 32px;
    margin-right: 12px;
    width: 64px;
    height: 64px;
    margin-right: 24px;
  }

  .select-pay-type-view-item {
    padding-left: 20px;
    padding-left: 40px;
    display: flex;
    align-items: center;
    height: 80px;
    height: 160px;
    border: 1px solid #e2e5eb;
    border-radius: 8px;
    border-radius: 16px;
    background-color: #fff;
    margin-bottom: 16px;
    margin-bottom: 32px;
    cursor: pointer;
    font-size: 16px;
    font-size: 32px;
    color: boleGetCssVar('text-color', 'primary');
  }
}
@@ -103,26 +102,26 @@
  // padding:;

  .recharge-result-view-title {
    font-size: 18px;
    font-size: 36px;
    color: boleGetCssVar('text-color', 'primary');
    font-weight: 600;
    margin-bottom: 12px;
    margin-bottom: 24px;
    text-align: center;
    line-height: 24px;
    line-height: 48px;
  }

  .recharge-result-view-tips {
    margin-bottom: 12px;
    font-size: 16px;
    margin-bottom: 24px;
    font-size: 32px;
    color: boleGetCssVar('color', 'danger');
    line-height: 20px;
    line-height: 40px;
  }

  .recharge-result-view-warning {
    margin-bottom: 20px;
    font-size: 12px;
    margin-bottom: 40px;
    font-size: 24px;
    color: boleGetCssVar('color', 'warning');
    line-height: 16px;
    line-height: 32px;
  }

  .recharge-result-view-btn-wrapper {
@@ -130,14 +129,13 @@
    justify-content: center;

    .recharge-result-view-btn {
      padding: 0 20px;
      font-size: 16px;
      padding: 0 40px;
      font-size: 32px;
      color: boleGetCssVar('color', 'primary');
      line-height: 16px;
      line-height: 32px;
    }
  }
}


.loading-more-tips {
  color: boleGetCssVar('text-color', 'primary');

 packages/components/src/styles/index.scss

@@ -26,3 +26,28 @@

  --nut-badge-background-color: #{map.get($bole-colors, 'danger')};
}

@mixin lifeListScrollViewWithNoPadding {
  flex: 1;
  min-height: 0;
  box-sizing: border-box;
  background-color: map-get($bole-colors, 'body-background-color');
}

@mixin lifeListScrollView {
  padding: 0 map-get($bole-size, 'body-padding-h');
  @include lifeListScrollViewWithNoPadding;
}

.life-infinite-scroll-list-no-padding {
  @include lifeListScrollViewWithNoPadding;
}

.life-infinite-scroll-list {
  @include lifeListScrollView;
}

.life-page-infinite-scroll-list {
  @include lifeListScrollView;
  padding-top: 16px;
}

 packages/components/src/styles/layout.scss

@@ -1,27 +1,26 @@
/*postcss-pxtransform disable*/
@use './common.scss' as *;

.main-cell-container {
  padding-top: 92px;
  padding-top: 184px;
  .main-cell-wrapper {
    padding: boleGetCssVar('size', 'body-padding-h');
    padding-top: 24px;
    border-radius: 15px;
    padding-top: 48px;
    border-radius: 30px;
    background: #ffffff;
    box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.05);
    box-shadow: 0px 8px 40px 0px rgba(0, 0, 0, 0.05);

    .main-cell-title {
      font-size: 20px;
      font-size: 40px;
      font-weight: 600;
      text-align: center;
      color: #000000;
      line-height: 28px;
      line-height: 56px;
    }

    .main-cell-icon {
      display: flex;
      justify-content: center;
      margin-top: 20px;
      margin-top: 40px;
    }
  }
}

 packages/components/src/styles/loading.scss

@@ -9,26 +9,26 @@
  flex-direction: column;

  .no-data-img {
    width: 284px;
    height: 202px;
    width: 568px;
    height: 404px;
  }

  .no-data-text {
    font-size: 20px;
    font-size: 40px;
    color: #333333;
    line-height: 2.4;
  }
}

.loading-layout-loading-content-wrapper {
  padding: 40px;
  padding: 80px;
  display: flex;
  justify-content: center;
  align-items: center;

  .nut-icon {
    color: boleGetCssVar('text-color', 'primary');
    margin-right: 8px;
    margin-right: 16rpx;
  }

  .list-empty-hint-text {

 packages/components/src/styles/nut.scss

@@ -1,5 +1,3 @@
/*postcss-pxtransform disable*/

@use './function.scss' as *;
@use './hairline.scss' as *;


 packages/components/src/styles/orderCard.scss

@@ -5,6 +5,7 @@
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 20px;
  background-color: #fff;

  &:last-child {
    margin-bottom: 0;

 packages/components/src/styles/rechargeGrid.scss

@@ -1,19 +1,18 @@
/*postcss-pxtransform disable*/
@use './common.scss' as *;

.recharge-grid-wrapper {
  padding-left: 0 !important;
  margin-top: 20px;
  margin-top: 40px;

  .recharge-grid-item {
    .nut-grid-item__text {
      font-size: 18px;
      font-size: 36rpx;
      color: boleGetCssVar('text-color', 'primary');
    }

    .recharge-grid-item-icon {
      width: 32px;
      height: 32px;
      width: 64px;
      height: 64px;
    }
  }
}
@@ -26,16 +25,16 @@
  width: 100%;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 10px;
  grid-gap: 20px;

  .parValue-item {
    margin-right: 0;

    .nut-radio__button {
      width: 100%;
      padding: 8px 0;
      padding: 16rpx 0;
      background-color: transparent;
      border: 0.5px solid #e2e5eb;
      border: 1rpx solid #e2e5eb;
      text-align: center;
      border-radius: 4px;
      position: relative;
@@ -47,7 +46,7 @@
      overflow: hidden;

      &::after {
        border-radius: 4px;
        border-radius: 8rpx;
        background-color: rgba(251, 81, 0, 0.08);
        opacity: 1;
      }
@@ -68,51 +67,51 @@
      .amount-wrapper {
        display: flex;
        align-items: flex-end;
        margin-bottom: 2px;
        margin-bottom: 4px;

        .amount {
          font-size: 20px;
          font-size: 40px;
          font-weight: 400;
          line-height: 22px;
          line-height: 44px;
        }
        .unit {
          font-size: 12px;
          font-size: 24px;
          font-weight: 400;
          line-height: 16px;
          line-height: 32px;
        }
      }

      .price-wrapper {
        display: flex;
        color: #858d98;
        font-size: 12px;
        font-size: 24px;
        font-weight: 400;
        line-height: 16px;
        line-height: 32px;

        .price {
          color: #fb5100;
          margin-left: 3px;
          margin-left: 6px;
        }
      }

      .discountTag {
        display: none;
        position: absolute;
        padding: 1px 4px;
        border-radius: 0px 0 10px 0;
        border: 0.5px solid #fb5100;
        padding: 2px 8px;
        border-radius: 0px 0 20px 0;
        border: 1px solid #fb5100;
        background: linear-gradient(
          186deg,
          rgba(255, 129, 45, 0.08) 14.82%,
          rgba(238, 67, 67, 0.08) 91.5%
        );
        color: #fb5100;
        font-size: 11px;
        font-size: 22px;
        font-weight: 700;
        line-height: 14px;
        line-height: 28px;
        position: absolute;
        top: -1px;
        left: -1px;
        top: -2px;
        left: -2px;
      }
    }
  }
@@ -121,12 +120,12 @@
.order-bill-recharge {
  .recharge-button {
    width: 100%;
    margin: 20px 0;
    margin: 40px 0;

    .recharge-button-inner {
      display: flex;
      .recharge-button-text {
        margin-left: 10px;
        margin-left: 20px;
      }
    }
  }
@@ -134,7 +133,7 @@
  &.electric {
    .nut-dialog {
      .nut-dialog__content {
        max-height: 700px;
        max-height: 1400rpx;
      }
    }
  }

 packages/components/src/views/Order/components/ElectricOrder.vue

@@ -1,5 +1,8 @@
<template>
  <InfiniteLoading scrollViewClassName="common-infinite-scroll-list" v-bind="infiniteLoadingProps">
  <InfiniteLoading
    scrollViewClassName="life-page-infinite-scroll-list"
    v-bind="infiniteLoadingProps"
  >
    <template #renderItem="{ item }">
      <OrderCard
        title="电费充值"

 packages/components/src/views/Order/components/PhoneOrder.vue

@@ -1,5 +1,8 @@
<template>
  <InfiniteLoading scrollViewClassName="common-infinite-scroll-list" v-bind="infiniteLoadingProps">
  <InfiniteLoading
    scrollViewClassName="life-page-infinite-scroll-list"
    v-bind="infiniteLoadingProps"
  >
    <template #renderItem="{ item }">
      <OrderCard
        title="话费充值"