fix: 三期需求

zhengyiming

2025-03-19 f4d3a468d151ce6ff4ef6b2158c2b13ebae18d43

fix: 三期需求

 apps/taro/src/subpackages/order/order/InnerPage.vue

@@ -6,9 +6,9 @@
    <ProTabPane title="电费订单" pane-key="2">
      <ElectricOrder @goApplyRefund="goApplyRefund" @goRefundDetail="goRefundDetail" />
    </ProTabPane>
    <ProTabPane title="燃气订单" pane-key="3">
    <!-- <ProTabPane title="燃气订单" pane-key="3">
      <GasOrder @goApplyRefund="goApplyRefund" @goRefundDetail="goRefundDetail" />
    </ProTabPane>
    </ProTabPane> -->
  </ProTabs>
</template>


 packages/components/src/components/Image/AutoWidthImage.vue

New file
@@ -0,0 +1,73 @@
<template>
  <PreviewImage :mode="openScale ? 'scaleToFill' : 'widthFix'" :style="_style" v-bind="props" />
</template>

<script setup lang="ts">
import PreviewImage from './PreviewImage.vue';
import { previewImageProps } from './previewImage';
import Taro from '@tarojs/taro';
import { CSSProperties, computed, reactive, watch } from 'vue';

defineOptions({
  name: 'AutoWidthImage',
});

const props = defineProps({
  ...previewImageProps,
  openScale: {
    type: Boolean,
  },
});

const MaxHeight = 375;
const MaxWidth = 375;

const state = reactive({
  width: 0,
  height: 0,
});

watch(
  () => props.src,
  () => {
    if (props.src) {
      Taro.getImageInfo({
        src: props.src,
        success(result) {
          state.width = result.width;
          state.height = result.height;
        },
      });
    }
  },
  {
    immediate: true,
  }
);

const _style = computed(() => {
  if (state.width > state.height) {
    if (props.openScale) {
      const width = Math.min(MaxWidth, state.width);
      const scale = width / state.width;

      return {
        height: `${state.height * scale}px`,
        width: `${width}px`,
      } as CSSProperties;
    } else {
      return {
        width: `${state.width}px`,
        maxWidth: '100%',
      };
    }
  } else {
    const height = Math.min(MaxHeight, state.height);
    const scale = height / state.height;
    return {
      height: `${height}px`,
      width: `${state.width * scale}px`,
    } as CSSProperties;
  }
});
</script>

 packages/components/src/components/Image/PreviewImage.vue

New file
@@ -0,0 +1,57 @@
<template>
  <div :class="['preview-image-wrapper', wrapperClassName]">
    <Image @tap="handeClick" :mode="mode" :src="src" v-bind="$attrs" />
  </div>
</template>

<script setup lang="ts">
import { Image, ITouchEvent } from '@tarojs/components';
import Taro from '@tarojs/taro';
import { previewImageProps } from './previewImage';
import { reactive, computed, watch } from 'vue';

defineOptions({
  name: 'PreviewImage',
  inheritAttrs: false,
});

const props = defineProps(previewImageProps);

const state = reactive({
  width: 0,
  height: 0,
  isLoaded: false,
});

const mode = computed(() => (state.width > state.height ? 'heightFix' : 'widthFix'));

watch(
  () => props.src,
  () => {
    if (props.src) {
      Taro.getImageInfo({
        src: props.src,
        success(result) {
          state.width = result.width;
          state.height = result.height;
          state.isLoaded = true;
        },
      });
    }
  },
  {
    immediate: true,
  }
);

function handeClick(event: ITouchEvent) {
  if (props.onClick) {
    props.onClick(event);
  } else {
    Taro.previewImage({
      current: props.src,
      urls: props.urls.length > 0 ? props.urls : [props.src],
    });
  }
}
</script>

 packages/components/src/components/Image/previewImage.ts

New file
@@ -0,0 +1,18 @@
import { PropType } from 'vue';
import { ITouchEvent } from '@tarojs/components';

export const previewImageProps = {
  urls: {
    type: Array as PropType<string[]>,
    default: () => [],
  },
  wrapperClassName: {
    type: String,
  },
  src: {
    type: String,
  },
  onClick: {
    type: Function as PropType<(event: ITouchEvent) => void>,
  },
};

 packages/components/src/components/RechargeTipsView/RechargeTipsView.vue

@@ -7,23 +7,35 @@
          *同一号码充值期间【切勿多平台重复充值】！！！在下单前，请务必仔细阅读公告内容！！！若接到陌生来电，请勿轻信！！！
        </slot>
      </div>
      <div class="recharge-tips-list">
      <!-- <div class="recharge-tips-list">
        <div class="recharge-tips-item" v-for="(item, index) in props.tips" :key="index">
          {{ index + 1 }}.{{ item }}
        </div>
      </div>
      </div> -->
      <RichContent :content="introInfo" size="small" />
    </div>
  </div>
</template>

<script setup lang="ts">
import RichContent from '../RichEditCard/RichContent.vue';
import { useIntroInfo } from '../../hooks';
import { LifeRechargeConstants } from '@life-payment/core-vue';

defineOptions({
  name: 'RechargeTipsView',
});

type Props = {
  tips: string[];
  tips?: string[];
  lifePayOrderType?: LifeRechargeConstants.LifePayOrderTypeEnum;
};

const props = withDefaults(defineProps<Props>(), {});
const props = withDefaults(defineProps<Props>(), {
  tips: () => [],
});

const { introInfo } = useIntroInfo({
  lifePayOrderType: props.lifePayOrderType,
});
</script>

 packages/components/src/components/RichEditCard/RichContent.vue

New file
@@ -0,0 +1,48 @@
<template>
  <div :class="['rich-edit-content', size]">
    <template v-for="(item, index) in content" :key="index">
      <!-- <AutoWidthImage
        v-if="item.type === LifeRechargeConstants.EditorType.Image"
        wrapperClassName="rich-content-item rich-content-image-item"
        :src="setOSSLink(item.path)"
      /> -->
      <PreviewImage
        v-if="item.type === LifeRechargeConstants.EditorType.Image"
        wrapperClassName="rich-content-item rich-content-image-item"
        :src="setOSSLink(item.path)"
        style="max-width: 100%"
        mode="widthFix"
      />
      <Video
        v-else-if="item.type === LifeRechargeConstants.EditorType.Video"
        class="rich-content-item rich-content-video-item"
        :src="setOSSLink(item.path)"
      ></Video>
      <div v-else class="rich-content-item rich-content-text-item">
        {{ item.content }}
      </div>
    </template>
  </div>
</template>

<script setup lang="ts">
import AutoWidthImage from '../Image/AutoWidthImage.vue';
import { Video } from '@tarojs/components';
import { LifeRechargeConstants, LifePayIntroInfoOutput } from '@life-payment/core-vue';
import { setOSSLink } from '../../utils';
import PreviewImage from '../Image/PreviewImage.vue';

defineOptions({
  name: 'RichContent',
});

type Props = {
  content?: LifePayIntroInfoOutput[];
  size?: 'small' | 'default' | 'large';
};

const props = withDefaults(defineProps<Props>(), {
  content: () => [],
  size: 'default',
});
</script>

 packages/components/src/hooks/index.ts

@@ -276,3 +276,32 @@
    gasParValueList,
  };
}

type UseIntroInfoOptions = {
  lifePayOrderType: MaybeRef<LifeRechargeConstants.LifePayOrderTypeEnum>;
  onSuccess?: (data: API.LifePayIntroInfoOutput[]) => any;
};

export function useIntroInfo({ lifePayOrderType, onSuccess }: UseIntroInfoOptions) {
  const { blLifeRecharge } = useLifeRechargeContext();

  const { data: introInfo } = useQuery({
    queryKey: ['blLifeRecharge/getIntroInfo', lifePayOrderType],
    queryFn: async () => {
      return await blLifeRecharge.services.getIntroInfo(
        {
          type: unref(lifePayOrderType),
        },
        {
          showLoading: false,
        }
      );
    },
    placeholderData: () => [] as API.LifePayIntroInfoOutput[],
    onSuccess: (data) => {
      onSuccess?.(data);
    },
  });

  return { introInfo };
}

 packages/components/src/styles/components.scss

@@ -245,3 +245,48 @@
    }
  }
}

.preview-image-wrapper {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.auto-width-image-wrapper {
  width: auto !important;
  height: auto !important;
}

.rich-edit-content {
  .rich-content-item {
    margin-bottom: 10px;

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

  .rich-content-image-item {
    display: block;
  }

  .rich-content-text-item {
    word-break: break-all;
    white-space: pre-line;
    font-size: 30px;
    line-height: 50px;
    color: boleGetCssVar('text-color', 'primary');
  }

  .rich-content-video-item {
    width: 100%;
    height: 300px;
  }

  &.small {
    .rich-content-text-item {
      font-size: 24px;
      line-height: 36px;
    }
  }
}

 packages/components/src/utils/env.ts

New file
@@ -0,0 +1,28 @@
type NODE_ENV = 'development' | 'production';

export const env = process.env.NODE_ENV as NODE_ENV;

export const OSSBaseURL =
  env === 'development'
    ? 'https://waterdroptest2.oss-cn-hangzhou.aliyuncs.com/'
    : 'https://parkmanagement.oss-cn-hangzhou.aliyuncs.com/';

export const combineURLs = (baseURL: string, relativeURL: string) => {
  return relativeURL
    ? baseURL.replace(/\/+$/, '') + '/' + relativeURL.replace(/^\/+/, '')
    : baseURL;
};

export const isAbsoluteURL = (url: string) => {
  return /^([a-z][a-z\d+\-.]*:)?\/\//i.test(url);
};

export function setOSSLink(url: string) {
  if (!url) {
    return '';
  }
  if (!isAbsoluteURL(url)) {
    return combineURLs(OSSBaseURL, url);
  }
  return url;
}

 packages/components/src/utils/index.ts

@@ -1,3 +1,4 @@
export * from './validator';
export * from './common';
export * from './recharge';
export * from './env';

 packages/components/src/views/GasBillRecharge/GasBillRechargeStep3.vue

@@ -68,7 +68,7 @@
          <div class="recharge-button-text">立即充值</div>
        </div>
      </nut-button>
      <RechargeTipsView :tips="tips">
      <RechargeTipsView :lifePayOrderType="LifeRechargeConstants.LifePayOrderTypeEnum.燃气订单">
        <template #tips-top>
          同一电费账户在充值期间切勿在多平台重复充值，下单前请仔细阅读下方须知内容。若接到陌生来电，切勿轻信！！！
        </template>
@@ -116,7 +116,6 @@
import { useGetRate, useGetGasParValue, useSetUserAccountBySelect } from '../../hooks';
import { useGasBillRechargeContext, GasUserAccountExtraProperties } from './context';
import { FormValidator, initLifePayType } from '../../utils';
import { CustomerServiceTips } from '../../constants';
import AccountAddCard from '../../components/Card/AccountAddCard.vue';
import AccountCard from '../../components/Card/AccountCard.vue';
import RechargeTipsView from '../../components/RechargeTipsView/RechargeTipsView.vue';
@@ -213,17 +212,6 @@
    }
  });
}

const tips = [
  '平台提供慢充服务，订单提交后，燃气将于0 - 72 小时内到账，若未能按时到账，系统将自动发起退款。',
  '目前平台仅支持中国燃气和北京燃气充值服务。',
  '中国燃气充值户号必须在“壹品慧”APP燃气缴费界面查询到账户信息，户号为11开头或者5开头的10位数字。',
  '北京燃气不支持欠费充值，仅支持智能表的户号，户号是9开头11位的账户进行充值。',
  '充值期间，若同一账户的充值款未到账，请勿在其他平台重复充值，因上述操作导致的资金损失，由用户自行承担。',
  '如接到陌生来电，对方以缴费或误操作等理由要求处理款项，务必立即拉黑，谨防诈骗。',
  '下单时，请您务必准确填写完整的省市及户号信息。充值完成后，发票由运营商提供，您可登录网上营业厅下载对应的电子发票。',
  CustomerServiceTips,
];

const confirmDialogVisible = ref(false);


 packages/components/src/views/PhoneBillRecharge/PhoneBillRechargeStep2.vue

@@ -72,7 +72,7 @@
          <div class="recharge-button-text">立即充值</div>
        </div>
      </nut-button>
      <RechargeTipsView :tips="tips" />
      <RechargeTipsView :lifePayOrderType="LifeRechargeConstants.LifePayOrderTypeEnum.话费订单" />
    </div>
    <ConfirmDialog v-model:visible="confirmDialogVisible" @ok="goPay">
      <template #info>
@@ -109,7 +109,6 @@
import ConfirmDialog from '../../components/Dialog/ConfirmDialog.vue';
import ConfirmDialogInfoItem from '../../components/Dialog/ConfirmDialogInfoItem.vue';
import { useGetRate, useGetPhoneParValue, useSetUserAccountBySelect } from '../../hooks';
import { CustomerServiceTips } from '../../constants';
import AccountAddCard from '../../components/Card/AccountAddCard.vue';
import AccountCard from '../../components/Card/AccountCard.vue';
import { usePhoneBillRechargeContext, PhoneUserAccountExtraProperties } from './context';
@@ -204,15 +203,6 @@
    }
  });
}

const tips = [
  '平台提供慢充服务，订单提交后，话费将于0 - 24小时内到账。若未能按时到账，系统将自动发起退款。',
  '充值期间，若同一号码款项未到账，请勿在其他平台重复充值；主副卡不可同时充值。因上述操作导致的资金损失，由用户自行承担。',
  '本平台话费充值服务不适用于已停机号码。电信号码若有欠费，也无法完成充值。电信已完成维护的区域包括：广东、江苏、湖北、四川、江西、河北、河南、福建、辽宁。其它区域正在分批次进行维护中，在此期间可能会出现充值不成功并自动退款的情况，请您谅解。',
  '如接到陌生来电，对方以缴费或误操作等理由要求处理款项，务必立即拉黑，谨防诈骗。',
  '充值发票由运营商提供，您可登录网上营业厅下载电子发票。',
  CustomerServiceTips,
];

const confirmDialogVisible = ref(false);


 packages/components/src/views/electricBillRecharge/ElectricBillRechargeStep2.vue

@@ -74,7 +74,7 @@
          <div class="recharge-button-text">立即充值</div>
        </div>
      </nut-button>
      <RechargeTipsView :tips="tips" />
      <RechargeTipsView :lifePayOrderType="LifeRechargeConstants.LifePayOrderTypeEnum.电费订单" />
    </div>
    <ConfirmDialog v-model:visible="confirmDialogVisible" @ok="goPay">
      <template #tips>
@@ -120,7 +120,6 @@
import ConfirmDialogInfoItem from '../../components/Dialog/ConfirmDialogInfoItem.vue';
import { useGetRate, useGetElectricParValue, useSetUserAccountBySelect } from '../../hooks';
import { FormValidator, initLifePayType } from '../../utils';
import { CustomerServiceTips } from '../../constants';
import AccountAddCard from '../../components/Card/AccountAddCard.vue';
import AccountCard from '../../components/Card/AccountCard.vue';
import { useElectricBillRechargeContext, ElectricUserAccountExtraProperties } from './context';
@@ -221,15 +220,6 @@
    }
  });
}

const tips = [
  '平台提供慢充服务，订单提交后，电费将于0 - 72 小时内到账，若未能按时到账，系统将自动发起退款。',
  '充值期间，若同一账户的充值款未到账，请勿在其他平台重复充值，因上述操作导致的资金损失，由用户自行承担。',
  '为确保充值顺利进行，目前平台不支持对欠款金额超过1000元的账户进行充值，且每次充值金额必须高于欠费总额。',
  '如接到陌生来电，对方以缴费或误操作等理由要求处理款项，务必立即拉黑，谨防诈骗。',
  '下单时，请您务必准确填写完整的省市及户号信息。充值完成后，发票由运营商提供，您可登录网上营业厅下载对应的电子发票。',
  CustomerServiceTips,
];

const confirmDialogVisible = ref(false);


 packages/components/vite.config.ts

@@ -20,6 +20,9 @@
      external: Object.keys(pkg.peerDependencies),
    },
  },
  define: {
    'process.env.NODE_ENV': JSON.stringify('production'),
  },
  plugins: [
    vue(),
    // jsx、tsx语法支持

 packages/core/modern.config.ts

@@ -3,4 +3,9 @@
export default defineConfig({
  plugins: [moduleTools()],
  buildPreset: 'npm-library',
  // buildConfig: {
  //   define: {
  //     'process.env.NODE_ENV': process.env.NODE_ENV || 'production',
  //   },
  // },
});

 packages/core/src/lifeRechargeConstants.ts

@@ -135,4 +135,27 @@
    [GasOrgCodeEnum.中燃燃气]: '中燃燃气',
    [GasOrgCodeEnum.北京燃气]: '北京燃气',
  };

  export enum EditorType {
    /**
     * 文本
     */
    Text,
    /**
     * 图片
     */
    Image,
    /**
     * 视频
     */
    Video,
    /**
     * 富文本
     */
    Rich,
    /**
     * 微信的内容
     */
    WXContent,
  }
}

 packages/core/src/lifeRechargeServices.ts

@@ -315,6 +315,17 @@
      ...(options || {}),
    });
  }

  /** 获取须知 GET /api/LifePay/GetIntroInfo */
  async getIntroInfo(params: APIgetIntroInfoParams, options?: RequestConfig) {
    return this.request<LifePayIntroInfoOutput[]>('/api/LifePay/GetIntroInfo', {
      method: 'GET',
      params: {
        ...params,
      },
      ...(options || {}),
    });
  }
}

export interface PhoneMesssageCodeLoginInput {
@@ -725,3 +736,22 @@
  checkChannelId?: string;
  orderNo?: string;
}

export interface APIgetIntroInfoParams {
  type?: LifeRechargeConstants.LifePayOrderTypeEnum;
}

export interface LifePayIntroInfoOutput {
  type?: IntroInfoTypeEnum;
  lifePayType?: LifeRechargeConstants.LifePayOrderTypeEnum;
  /** 摘要 */
  contentSummary?: string;
  /** 文本内容 */
  content?: string;
  /** 图片/视频路径 */
  path?: string;
  /** 排序 */
  sequence?: number;
}

export type IntroInfoTypeEnum = 0 | 1 | 2 | 3 | 4;

 packages/services/api/LifePay.ts

@@ -29,6 +29,21 @@
  });
}

/** 手续费费率配置 POST /api/LifePay/CreateEditLifePayPremium */
export async function createEditLifePayPremium(
  body: API.LifePayPremiumInput[],
  options?: API.RequestConfig
) {
  return request<number>('/api/LifePay/CreateEditLifePayPremium', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    data: body,
    ...(options || {}),
  });
}

/** 折扣配置 POST /api/LifePay/CreateEditLifePayRate */
export async function createEditLifePayRate(
  body: API.LifePayRateInput[],
@@ -119,6 +134,18 @@
  });
}

/** 须知配置 POST /api/LifePay/EditIntroInfo */
export async function editIntroInfo(body: API.LifePayIntroInfoInput, options?: API.RequestConfig) {
  return request<number>('/api/LifePay/EditIntroInfo', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    data: body,
    ...(options || {}),
  });
}

/** 获取用户户号分页数据 POST /api/LifePay/GetAccountPage */
export async function getAccountPage(
  body: API.QueryUserAccountListInput,
@@ -184,6 +211,29 @@
      'Content-Type': 'application/json',
    },
    data: body,
    ...(options || {}),
  });
}

/** 获取须知 GET /api/LifePay/GetIntroInfo */
export async function getIntroInfo(
  // 叠加生成的Param类型 (非body参数swagger默认没有生成对象)
  params: API.APIgetIntroInfoParams,
  options?: API.RequestConfig
) {
  return request<API.LifePayIntroInfoOutput[]>('/api/LifePay/GetIntroInfo', {
    method: 'GET',
    params: {
      ...params,
    },
    ...(options || {}),
  });
}

/** 获取全部缴费渠道 GET /api/LifePay/GetLifePayChannlesAllList */
export async function getLifePayChannlesAllList(options?: API.RequestConfig) {
  return request<API.CreateEditPayChannelsInput[]>('/api/LifePay/GetLifePayChannlesAllList', {
    method: 'GET',
    ...(options || {}),
  });
}
@@ -287,6 +337,14 @@
  });
}

/** 获取手续费费率 GET /api/LifePay/GetPremium */
export async function getPremium(options?: API.RequestConfig) {
  return request<API.LifePayPremiumListOutput[]>('/api/LifePay/GetPremium', {
    method: 'GET',
    ...(options || {}),
  });
}

/** 获取折扣 GET /api/LifePay/GetRate */
export async function getRate(options?: API.RequestConfig) {
  return request<API.LifePayRateListOutput[]>('/api/LifePay/GetRate', {

 packages/services/api/typings.d.ts

@@ -168,6 +168,10 @@
    moduleId?: string;
  }

  interface APIgetIntroInfoParams {
    type?: LifePayOrderTypeEnum;
  }

  interface APIgetLifePayChannlesDtoParams {
    id?: string;
  }
@@ -469,6 +473,7 @@
    channlesName?: string;
    channlesNum?: string;
    channlesRate?: number;
    channlesRakeRate?: number;
    switchType?: LifePaySwitchTypeEnum;
    status?: LifePayChannelsStatsEnum;
    channlesType?: LifePayChannlesTypeEnum;
@@ -924,6 +929,8 @@
    roleNames: string[];
  }

  type IntroInfoTypeEnum = 0 | 1 | 2 | 3 | 4;

  interface IStringValueType {
    name?: string;
    properties?: Record<string, any>;
@@ -1003,6 +1010,37 @@

  type LifePayChannlesTypeEnum = 10 | 20;

  interface LifePayIntroInfoDetail {
    type?: IntroInfoTypeEnum;
    /** 摘要 */
    contentSummary?: string;
    /** 文本内容 */
    content?: string;
    /** 图片/视频路径 */
    path?: string;
    /** 排序 */
    sequence?: number;
  }

  interface LifePayIntroInfoInput {
    lifePayType?: LifePayOrderTypeEnum;
    /** 更新内容 */
    data?: LifePayIntroInfoDetail[];
  }

  interface LifePayIntroInfoOutput {
    type?: IntroInfoTypeEnum;
    lifePayType?: LifePayOrderTypeEnum;
    /** 摘要 */
    contentSummary?: string;
    /** 文本内容 */
    content?: string;
    /** 图片/视频路径 */
    path?: string;
    /** 排序 */
    sequence?: number;
  }

  interface LifePayOrderListOutput {
    id?: string;
    userId?: string;
@@ -1056,6 +1094,18 @@
    phoneNumber: string;
  }

  interface LifePayPremiumInput {
    premiumType?: LifePayTypeEnum;
    rate?: number;
    id?: string;
  }

  interface LifePayPremiumListOutput {
    premiumType?: LifePayTypeEnum;
    rate?: number;
    id?: string;
  }

  interface LifePayRateInput {
    rateType?: LifePayRateTypeEnum;
    rate?: number;