Skip to content

C
CFFP-HB
Commit 367db91a by kyle
Options

解决产品对比pdf打不开，增加我的卡券

parent c7632793
Showing with 559 additions and 26 deletions
api/api.ts
......@@ -460,4 +460,7 @@ export default {
getCardStats(data) {
return request(`${apiURL}/business-card/stats/${data.cardId}?userId=${data.userId}`, 'GET')
},
dealerCouponCardList(params) {
return request(`${sfpUrl}/dealerCoupon/inventory/list/page`, 'POST', params)
},
}
myPackageA/compare-result/compare-result.vue
......@@ -96,12 +96,10 @@
url: viewFileUrl,
landscapeFlag:false
}"
:autoLoad="index === 0"
:autoLoad="true"
:lazyLoad="true"
:maxRetryCount="2"
@loadComplete="handlePdfLoadComplete"
@loadError="handlePdfLoadError"
@pageChange="handlePageChange"
/>
</view>
......@@ -202,15 +200,14 @@ const getUrl = (fileUrl) => {
if (!fileUrl) {
uni.showToast({ title: '暂无文档', icon: 'none' });
return;
}else{
this.pdfShow = true
this.viewFileUrl = fileUrl
}
// 区分环境：H5 端直接打开 URL，其他端用原下载逻辑
if (uni.getSystemInfoSync().uniPlatform === 'web') {
// H5 方案：用浏览器新窗口打开 PDF（依赖浏览器原生支持）
const opened = window.open(fileUrl, '_blank');
pdfShow.value = true
viewFileUrl.value = fileUrl
// const opened = window.open(fileUrl, '_blank');
} else {
// 非 H5 端（小程序/APP）：保留原下载+打开逻辑
uni.downloadFile({
......@@ -284,24 +281,6 @@ const shouldHide = (groupCode, factorType) => {
// 前往PK选择页
const navigateToPKPage = () => {
uni.navigateBack()
};
// ========================== 事件处理 ==========================
const handlePdfLoadComplete = (url: string, pageCount: number) => {
console.log(`PDF加载完成: ${url}, 共 ${pageCount} 页`);
};
const handlePdfLoadError = (url: string, error: Error) => {
console.error(`PDF加载失败: ${url}`, error);
uni.showToast({
title: 'PDF加载失败',
icon: 'none',
duration: 2000
});
};
const handlePageChange = (currentPage: number, totalPages: number) => {
console.log(`页面变化: ${currentPage}/${totalPages}`);
};
// 初始化数据
......
myPackageA/ticket/alreadyUsed.vue 0 → 100644
<template>
<view class="container" :style="{paddingTop:paddingTop}">
<!-- #ifndef H5 -->
<CustomNavbar title="卡券使用记录" />
<!-- #endif -->
<view class="moduleBox" style="margin-top: 20rpx;">
<view class="module-content">
<view class="moudleHeader">
<view class="headerLeft">
<text class="bigTxt">已用卡券</text>
<text class="smallTxt">共有{{totalElements}}张</text>
</view>
<!-- <view class="headerRight">
<text class="useTxt">使用记录 <text class="iconfont icon-youjiantou "></text> </text>
</view> -->
</view>
<view class="moudleItem" v-for="(item,index) in alreadyList" :key="index">
<view class="itemTop">
<view class="itemL">
<view class="productName">
{{item.cardName}}
</view>
<view class="timeTxt">
激活时间：{{item.activeTime}}
</view>
</view>
<view class="itemR">
￥{{item.price || '--'}}
</view>
</view>
<view class="itemBottom">
激活手机号：{{item.recipientMobile?item.recipientMobile :'--'}}
</view>
</view>
<view class="moreTxt">
<!-- 点击更多的时候要请求接口拿取分页数据 -->
<text class="useTxt" @click="getMore" v-if="alreadyList.length < totalElements">更多 <text class="iconfont icon-xiala "></text> </text>
<text class="useTxt" v-if="alreadyList.length == totalElements">数据已加载完 </text>
</view>
</view>
</view>
</view>
</template>
<script setup>
import { onLoad, onShow } from '@dcloudio/uni-app'
import { ref, onMounted, nextTick } from 'vue'
import api from '@/util/api'
import commonHeader from '@/components/commonHeader/commonHeader.vue'
import dataHandling from '@/util/dataHandling'
import * as environment from '@/environments/environment'
import CustomNavbar from '@/components/CustomNavbar/CustomNavbar.vue'
import { useSafeArea } from '@/mixins/safeAreaMixin'
const { paddingTop } = useSafeArea()
const paginationInfo = ref({
"number": 1,
"size": 10,
})
const totalElements = ref()//总条数
let alreadyList = ref([])
let dealerInfo = ref({})
onMounted(() => {
})
onLoad(() => {
// getList(paginationInfo.value)
// initShare()
dataHandling.pocessTracking(null, '点击', '进入我的卡券', '进入我的卡券', '2', '0');
})
const initShare = () => {
let name = uni.getStorageSync('hoservice_name')
let shareData = {
title: '邀请您体验金融工具',
desc: `${name}邀请您免费使用金融工具`,
imgUrl: `${environment.baseURL}/ydMall/static/img/share.png`,
// path: '/myPackageA/rights/rightsActive',
link: `${environment.baseURL}/ydMall/#/myPackageA/financial/toolsList?orderFlag=3`
}
dataHandling.wxJsSdkConfig(shareData, '金融工具')
}
// 分页获取卡券数据
const getList = (paginationInfo) => {
uni.showLoading({
title: '加载中...'
})
let obj = {
"paginationInfo" : paginationInfo,
"dealerId": dealerInfo.value.id,
// "dealerId": JSON.parse(JSON.stringify(uni.getStorageSync('hoservice_userId'))), //经销商ID（必填）
"status": 3 //卡券状态: 0-未使用 1-已赠送 2-已领取 3-已激活 4-已过期/失活
}
api.dealerCouponCardList(obj).then(res => {
uni.hideLoading()
if (res.success) {
alreadyList.value = alreadyList.value.concat(res.data.list)
totalElements.value = res.data.paginationInfo.totalElements
} else {
dataHandling.showToast(res['message'])
}
})
}
const getMore = ()=>{
if(alreadyList.value.length < totalElements.value){
paginationInfo.value.number += 1
paginationInfo.value.size = 10
getList(paginationInfo.value)
}
}
onShow(()=>{
alreadyList.value = []
paginationInfo.value = {
"number": 1,
"size": 10,
}
dealerInfo.value = JSON.parse(JSON.stringify(uni.getStorageSync('dealerInfo')))
getList(paginationInfo.value)
})
</script>
<style lang="scss" scoped>
@import '../../static/css/variable.scss';
.container {
box-sizing: border-box;
background-color: rgba(235, 239, 247, 1);
.moduleBox {
box-sizing: border-box;
/* #ifdef H5 */
margin-top: 30rpx;
/* #endif */
/* #ifdef MP-WEIXIN */
// margin-top: 135rpx;
/* #endif */
padding: 0 20rpx;
.module-content {
background-color: #fff;
margin-bottom: 20rpx;
padding: 20rpx 15rpx;
border-radius: 10rpx;
}
.moudleHeader {
@include flex(center, space-between);
margin-bottom: 20rpx;
.headerLeft {
.bigTxt {
font-size: 32rpx;
}
.smallTxt {
margin-left: 5rpx;
font-size: 26rpx;
color: $system-auxiliary-deepgray;
}
}
.headerRight {
.useTxt {
font-size: 26rpx;
color: $system-auxiliary-deepgray;
}
.icon-youjiantou {
font-size: 28rpx;
color: $system-auxiliary-deepgray;
}
}
}
.moudleItem {
background-color: rgba(206, 14, 45,.05);
padding: 30rpx 20rpx;
border-radius: 10rpx;
margin-bottom: 20rpx;
.itemTop {
@include flex(center, space-between);
margin-bottom: 10rpx;
.productName {
margin-bottom: 10rpx;
font-size: 32rpx;
max-width: 400rpx;
/* 关键：单行省略号 */
white-space: nowrap;
/* 不换行 */
overflow: hidden;
/* 隐藏溢出内容 */
text-overflow: ellipsis;
/* 溢出部分用省略号表示 */
}
.timeTxt {
font-size: 26rpx;
color: $system-auxiliary-deepgray;
}
.itemR {
font-size: 28rpx;
}
}
.itemBottom {
border-top: 1px solid $system-main-color4;
font-size: 30rpx;
color: $system-main-color;
padding-top: 10rpx;
margin-top: 15rpx;
position: relative;
&::before {
content: '';
width: 22rpx;
height: 22rpx;
border-radius: 50%;
position: absolute;
left: -5%;
top: -14%;
background-color: #fff;
}
&::after {
content: '';
width: 22rpx;
height: 22rpx;
border-radius: 50%;
position: absolute;
right: -5%;
top: -14%;
background-color: #fff;
}
}
}
.moreTxt{
@include flex(center, center);
color: $system-auxiliary-deepgray;
.useTxt{
font-size: 28rpx;
}
.icon-xiala{
font-size: 26rpx;
margin-left: 5rpx;
}
}
}
}
</style>
\ No newline at end of file
myPackageA/ticket/unUsed.vue 0 → 100644
<template>
<view class="container">
<!-- #ifndef H5 -->
<CustomNavbar title="我的卡券" />
<!-- #endif -->
<view class="moduleBox" style="margin-top: 20rpx;">
<view class="module-content">
<view class="moudleHeader">
<view class="headerLeft">
<text class="bigTxt">我的卡券</text>
<text class="smallTxt">共有{{totalElements}}张</text>
</view>
<view class="headerRight" @click="viewUseRecord">
<text class="useTxt">使用记录 <text class="iconfont icon-youjiantou "></text> </text>
</view>
</view>
<view class="moudleItem" v-for="(item,index) in moduleList" :key="index">
<view class="itemTop">
<view class="itemL">
<view class="productName">
{{item.cardName}}
</view>
<view class="timeTxt">
有效期：{{item.validEndTime}}
</view>
</view>
<view class="itemR">
￥{{item.price || '--'}}
</view>
</view>
<view class="itemBottom">
权益码：{{item.redeemCode}}
</view>
</view>
<view class="moreTxt">
<!-- 点击更多的时候要请求接口拿取分页数据 -->
<text class="useTxt" @click="getMore" v-if="moduleList.length < totalElements">更多 <text class="iconfont icon-xiala "></text> </text>
<text class="useTxt" v-if="moduleList.length == totalElements">数据已加载完 </text>
</view>
</view>
</view>
</view>
</template>
<script setup>
import { onLoad, onShow } from '@dcloudio/uni-app'
import { ref, onMounted, nextTick } from 'vue'
import api from "@/api/api";
import dataHandling from '@/util/dataHandling'
import * as environment from '@/environments/environment'
const paginationInfo = ref({
"number": 1,
"size": 10,
})
const totalElements = ref()//总条数
let moduleList = ref([])
let dealerId = ref()
const viewUseRecord = ()=>{
uni.navigateTo({
url:'/myPackageA/ticket/alreadyUsed'
})
}
onMounted(() => {
})
onLoad(() => {
// dataHandling.pocessTracking(null, '点击', '进入我的卡券', '进入我的卡券', '2', '0');
})
// 分页获取卡券数据
const getList = (paginationInfo) => {
uni.showLoading({
title: '加载中...'
})
let obj = {
"paginationInfo" : paginationInfo,
"dealerId": dealerId.value,
// "dealerId": JSON.parse(JSON.stringify(uni.getStorageSync('hoservice_userId'))), //经销商ID（必填）
"status": 0 //卡券状态: 0-未使用 1-已赠送 2-已领取 3-已激活 4-已过期/失活
}
api.dealerCouponCardList(obj).then(res => {
uni.hideLoading()
if (res.success) {
moduleList.value = moduleList.value.concat(res.data.list)
totalElements.value = res.data.paginationInfo.totalElements
} else {
// uni.showToast({
// title:res['message']
// })
}
})
}
const getMore = ()=>{
if(moduleList.value.length < totalElements.value){
paginationInfo.value.number += 1
paginationInfo.value.size = 10
getList(paginationInfo.value)
}
}
onShow(()=>{
moduleList.value = []
paginationInfo.value = {
"number": 1,
"size": 10,
}
dealerId.value = JSON.parse(JSON.stringify(uni.getStorageSync('cffp_userInfo'))) ? JSON.parse(JSON.stringify(uni.getStorageSync('cffp_userInfo'))).dealerId :''
getList(paginationInfo.value)
})
</script>
<style lang="scss" scoped>
@import '@/uni.scss';
.container {
box-sizing: border-box;
background-color: rgba(235, 239, 247, 1);
padding-top:30rpx;
.moduleBox {
box-sizing: border-box;
/* #ifdef H5 */
margin-top: 30rpx;
/* #endif */
/* #ifdef MP-WEIXIN */
// margin-top: 135rpx;
/* #endif */
padding: 0 20rpx;
.module-content {
background-color: #fff;
margin-bottom: 20rpx;
padding: 20rpx 15rpx;
border-radius: 10rpx;
}
.moudleHeader {
@include flex(center, space-between);
margin-bottom: 20rpx;
.headerLeft {
.bigTxt {
font-size: 32rpx;
}
.smallTxt {
margin-left: 5rpx;
font-size: 26rpx;
color: $system-auxiliary-deepgray;
}
}
.headerRight {
.useTxt {
font-size: 26rpx;
color: $system-auxiliary-deepgray;
}
.icon-youjiantou {
font-size: 28rpx;
color: $system-auxiliary-deepgray;
}
}
}
.moudleItem {
background-color: rgba(206, 14, 45,.05);
padding: 30rpx 20rpx;
border-radius: 10rpx;
margin-bottom: 20rpx;
.itemTop {
@include flex(center, space-between);
margin-bottom: 10rpx;
.productName {
margin-bottom: 10rpx;
font-size: 32rpx;
max-width: 400rpx;
/* 关键：单行省略号 */
white-space: nowrap;
/* 不换行 */
overflow: hidden;
/* 隐藏溢出内容 */
text-overflow: ellipsis;
/* 溢出部分用省略号表示 */
}
.timeTxt {
font-size: 26rpx;
color: $system-auxiliary-deepgray;
}
.itemR {
font-size: 28rpx;
}
}
.itemBottom {
border-top: 1px solid $system-main-color4;
font-size: 34rpx;
color: $system-main-color;
padding-top: 10rpx;
margin-top: 15rpx;
position: relative;
&::before {
content: '';
width: 22rpx;
height: 22rpx;
border-radius: 50%;
position: absolute;
left: -5%;
top: -14%;
background-color: #fff;
}
&::after {
content: '';
width: 22rpx;
height: 22rpx;
border-radius: 50%;
position: absolute;
right: -5%;
top: -14%;
background-color: #fff;
}
}
}
.moreTxt{
@include flex(center, center);
color: $system-auxiliary-deepgray;
.useTxt{
font-size: 28rpx;
}
.icon-xiala{
font-size: 26rpx;
margin-left: 5rpx;
}
}
}
}
</style>
\ No newline at end of file
pages.json
......@@ -620,6 +620,20 @@
{
"navigationBarTitleText" : "我的名片"
}
},
{
"path" : "ticket/unUsed",
"style" :
{
"navigationBarTitleText" : "我的卡券"
}
},
{
"path" : "ticket/alreadyUsed",
"style" :
{
"navigationBarTitleText" : "使用记录"
}
}
]
......
pages/personalCenter/personalCenter.vue
......@@ -219,6 +219,13 @@
identity: true
},
{
title: '我的卡券',
icon: 'icon-yifukuan',
link: '/myPackageA/ticket/unUsed',
isOpen: true,
isShow: true
},
{
title: '我的售后',
icon: 'icon-shouhoufuwu',
link: '/pages/afterSales/afterSales',
......@@ -567,6 +574,7 @@
this.bootpage = false
},
isLogin() {
console.log('11111');
uni.navigateTo({
url: '/myPackageA/login/login?from=personalCenter'
})
......
uni.scss
......@@ -75,3 +75,32 @@ $uni-color-subtitle: #555555; // 二级标题颜色
$uni-font-size-subtitle:26px;
$uni-color-paragraph: #3F536E; // 文章段落颜色
$uni-font-size-paragraph:15px;
// $system-auxiliary-deepgray:#2A36AD;
//系统主题色
$system-main-color:#CE0E2D;
$system-main-color1:rgba(206, 14, 45,.1);
$system-main-color2:rgba(206, 14, 45,.2);
$system-main-color3:rgba(206, 14, 45,.3);
$system-main-color4:rgba(206, 14, 45,.4);
$system-main-color5:rgba(206, 14, 45,.5);
$system-main-color6:rgba(206, 14, 45,.6);
$system-main-color7:rgba(206, 14, 45,.7);
$system-main-color8:rgba(206, 14, 45,.8);
$system-main-color9:rgba(206, 14, 45,.9);
// 系统辅助色
$system-auxiliary-gray:#E6E6E6;
// 系统辅助色
$system-auxiliary-deepgray:#898989;
// 绝对居中
@mixin flex($alignItems, $justifyContent) {
display: flex;
align-items: $alignItems;
justify-content: $justifyContent;
}
@mixin background-cover($bg-image,$bg-size) {
background-image: url($bg-image);
background-size: $bg-size;
background-position: center;
background-repeat: no-repeat;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment