diff --git a/App.vue b/App.vue index 5acc5a1..445bdcd 100644 --- a/App.vue +++ b/App.vue @@ -8,12 +8,12 @@ export default { setToken(options.query?.token) } const whiteList = [ - // 'pages/shareRegist/index', + 'pages/shareRegist/index', // 'pages/shareRegist/success', 'pages/login/index', // 'pages/wechatPay/bfPay/', // 'pages/wechatPay/hfPay/', - // 'pages/shareArea/hiList', + 'pages/shareArea/hiList', // 'pages/shareArea/hiOrder', // 'pages/pay/hiPay' ] diff --git a/components/cl-tabbar.vue b/components/cl-tabbar.vue index 3d7b54d..2035a8b 100644 --- a/components/cl-tabbar.vue +++ b/components/cl-tabbar.vue @@ -1,65 +1,159 @@ - - - \ No newline at end of file diff --git a/components/share/DefaultSharePage.vue b/components/share/DefaultSharePage.vue new file mode 100644 index 0000000..69aaaaa --- /dev/null +++ b/components/share/DefaultSharePage.vue @@ -0,0 +1,320 @@ + + + + + diff --git a/components/share/README.md b/components/share/README.md new file mode 100644 index 0000000..b278567 --- /dev/null +++ b/components/share/README.md @@ -0,0 +1,178 @@ +# 分享组件说明 + +## SpecialSharePage 组件 + +特殊场景分享页面组件，通过接口获取base64格式的背景图片。 + +### 主要特性 + +- 📱 **响应式**：适配各种屏幕尺寸 +- 🎨 **可定制**：支持样式自定义 +- 🔄 **重试机制**：支持接口调用失败时的重试 +- 🌐 **接口获取**：自动通过接口获取背景图片 +- 🖼️ **Base64支持**：接口返回base64格式的背景图片 + +### 使用方法 + +```vue + + + +``` + +### Props + +| 参数 | 类型 | 默认值 | 说明 | +| ----------------------- | ------- | ------ | ------------------------ | +| `qrCodeImage` | String | '' | 二维码图片（base64格式） | +| `userInfo` | Object | {} | 用户信息对象 | +| `isWechat` | Boolean | false | 是否为微信环境 | +| `isLoaded` | Boolean | false | 是否加载完成 | +| `skipImageVerification` | Boolean | false | 跳过图片验证（调试用） | + +### Events + +| 事件名 | 参数 | 说明 | +| ------------------------ | ---------- | ---------------- | +| `share-generated` | dataUrl | 分享图片生成成功 | +| `background-image-error` | error | 背景图片加载错误 | +| `background-image-retry` | retryCount | 背景图片重试 | + +### 方法 + +| 方法名 | 说明 | +| ------------------------------- | ------------------------------------ | +| `generateShareImage()` | 生成分享图片 | +| `retryGetBackgroundImage()` | 手动重试获取背景图 | +| `getStatusInfo()` | 获取当前状态信息（调试用） | +| `handleShareGenerated(dataUrl)` | 处理图片生成成功后的逻辑（内部方法） | + +### 接口配置 + +组件使用 `getSharedImg` 接口获取背景图片： + +```javascript +// 在 config/login.js 中配置接口 +export const getSharedImg = () => { + return http.get('/api/share/background') +} +``` + +接口应返回以下格式： + +```javascript +{ + code: 200, + data: 'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD...', + message: 'success' +} +``` + +### 调试 + +```javascript +// 生成分享图片 +this.$refs.specialSharePage.generateShareImage() + +// 手动重试获取背景图 +this.$refs.specialSharePage.retryGetBackgroundImage() + +// 获取当前状态信息 +const status = this.$refs.specialSharePage.getStatusInfo() +console.log('组件状态:', status) +/* +输出示例： +{ + specialBackgroundImage: '123456 bytes', + qrCodeImage: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEU...', + backgroundImageLoaded: true, + isLoadingBackground: false, + imageLoadRetryCount: 0, + isReady: true +} +*/ +``` + +### 工作流程 + +1. **组件挂载**：自动调用 `getSharedImg` 接口获取背景图 +2. **显示加载**：显示"正在获取背景图片..."状态 +3. **接口响应**：处理接口返回的base64背景图数据 +4. **准备就绪**：背景图和二维码都准备好后可以生成分享图片 +5. **生成图片**：使用html2canvas截取页面生成分享图片 +6. **处理结果**： + - 关闭loading状态 + - 显示成功提示（"图片生成成功，请长按保存"） + - 调用内部 `handleShareGenerated` 方法处理 + - 通过 `share-generated` 事件通知父组件 + +### 图片生成流程 + +``` +用户点击生成按钮 + ↓ +检查前置条件（二维码、背景图） + ↓ +显示 "生成图片中..." loading + ↓ +使用 html2canvas 截取页面 + ↓ +生成成功 → 关闭loading → 显示成功提示 → 发送事件 + ↓ +生成失败 → 关闭loading → 显示错误提示 +``` + +### 错误处理 + +- **接口调用失败**：自动重试最多3次 +- **重试机制**：通过 `background-image-retry` 事件通知重试状态 +- **最终失败**：通过 `background-image-error` 事件通知错误 + +### 注意事项 + +1. 确保 `getSharedImg` 接口返回完整的base64格式图片 +2. 组件会在mounted生命周期自动调用接口 +3. 支持手动重试机制，适用于网络不稳定的情况 +4. 生成的图片为JPEG格式，质量为100% +5. 组件支持长按保存分享图片 +6. 接口失败时会显示相应的错误状态 +7. **图片生成成功后会自动显示提示信息**，无需在父组件中重复处理 +8. **组件内部和外部都会收到图片生成事件**，可根据需要在父组件中添加额外逻辑 diff --git a/components/share/SpecialSharePage.vue b/components/share/SpecialSharePage.vue new file mode 100644 index 0000000..69e7ddd --- /dev/null +++ b/components/share/SpecialSharePage.vue @@ -0,0 +1,501 @@ + + + + + diff --git a/config/goods.js b/config/goods.js index f6c14bc..2519dd3 100644 --- a/config/goods.js +++ b/config/goods.js @@ -1,86 +1,119 @@ /* - * @Descripttion: - * @version: + * @Descripttion: + * @version: * @Author: kBank * @Date: 2022-11-23 11:10:29 */ /* -* @Descripttion: -* @version: -* @Author: kBank -* @Date: 2022-11-23 11:10:29 -*/ + * @Descripttion: + * @version: + * @Author: kBank + * @Date: 2022-11-23 11:10:29 + */ const http = uni.$u.http //商品列表 -export const getAllGoods = (params) => http.post('/sale/api/wares/query-spe-wares', params) +export const getAllGoods = params => + http.post('/sale/api/wares/query-spe-wares', params) //商品详情 -export const waresDetail = (params) => http.post('/sale/api/wares/query-spe-wares-detail', params) +export const waresDetail = params => + http.post('/sale/api/wares/query-spe-wares-detail', params) //嗨粉海粉短信 -export const verification = (params) => http.get('/member/api/sms/fans-verification', { params }) +export const verification = params => + http.get('/member/api/sms/fans-verification', { params }) //嗨粉选择省市区 -export const getAllAreaList = (params) => http.get('system/api/area/provinceList', { params }) +export const getAllAreaList = params => + http.get('system/api/area/provinceList', { params }) //嗨粉选择国家 -export const getCountry = (params) => http.get('system/api/country/list', { params }) +export const getCountry = params => + http.get('system/api/country/list', { params }) //海粉注册 -export const regShareMember = (params) => http.post('/member/api/member/reg-share-member', params) +export const regShareMember = params => + http.post('/member/api/member/reg-share-member', params) //hi粉注册 -export const hiRegister = (params) => http.post('/member/api/fans/register', params) +export const hiRegister = params => + http.post('/member/api/fans/register', params) //幂等性 -export const generate = (params) => http.get('/system/api/idempotent/generate', { params }) +export const generate = params => + http.get('/system/api/idempotent/generate', { params }) //发货 -export const deliveryList = (params) => http.get('/system/pub/enums/delivery-list', { params }) +export const deliveryList = params => + http.get('/system/pub/enums/delivery-list', { params }) //海粉渠道 -export const jxhhSource = (params) => http.get('/sale/api/t-source/list/' + params) +export const jxhhSource = params => + http.get('/sale/api/t-source/list/' + params) //海粉分类 -export const optionList = (params) => http.post('/sale/api/twares-category-category/option-list', params ) +export const optionList = params => + http.post('/sale/api/twares-category-category/option-list', params) //海粉商品 -export const sharingWares = (params) => http.get('/sale/api/wares/sharing-zone-wares', { params }) +export const sharingWares = params => + http.get('/sale/api/wares/sharing-zone-wares', { params }) //分享邮费查询 -export const queryAdressPostage = (params) => http.post('/sale/api/order/self-order-postage', params) +export const queryAdressPostage = params => + http.post('/sale/api/order/self-order-postage', params) //嗨粉分享确认订单 -export const confirmFunShareOrder = (params) => http.post('/sale/api/order/confirm-self-fun-order', params) +export const confirmFunShareOrder = params => + http.post('/sale/api/order/confirm-self-fun-order', params) //海粉商品详情 -export const sharingWaresDetail = (params) => http.get('/sale/api/wares/query-spe-sharing-wares-detail', { params }) +export const sharingWaresDetail = params => + http.get('/sale/api/wares/query-spe-sharing-wares-detail', { params }) //海粉订单确认 -export const confirmShareOrder = (params) => http.post('/sale/api/order/confirm-share-order', params) +export const confirmShareOrder = params => + http.post('/sale/api/order/confirm-share-order', params) //获取购物车 -export const getShopping = (params) => http.get('/sale/api/shopping/getShopping', { params }) +export const getShopping = params => + http.get('/sale/api/shopping/getShopping', { params }) //分类列表 -export const classifyList = (params) => http.get('/sale/api/area-classify/list', { params }) +export const classifyList = params => + http.get('/sale/api/area-classify/list', { params }) //加减购物车 -export const plusReduceShopping = (params) => http.post('/sale/api/shopping/plusReduceShopping', params) +export const plusReduceShopping = params => + http.post('/sale/api/shopping/plusReduceShopping', params) //多删购物车 -export const batchDelShopping = (params) => http.post('/sale/api/shopping/batchDelShopping', params) +export const batchDelShopping = params => + http.post('/sale/api/shopping/batchDelShopping', params) //添加购物车 -export const addShopping = (params) => http.post('/sale/api/shopping/addShopping', params) +export const addShopping = params => + http.post('/sale/api/shopping/addShopping', params) //菜单权限 -export const menuList = (params) => http.get('/system/api/menu/list', { params }) +export const menuList = params => http.get('/system/api/menu/list', { params }) //海粉分享 -export const shareCode = (params) => http.get('/member/api/share/share-code-h5', { params }) +export const shareCode = params => + http.get('/member/api/share/share-code-h5', { params }) //嗨粉分享 -export const fansCode = (params) => http.get('/member/api/share/fans-code-h5', { params }) +export const fansCode = params => + http.get('/member/api/share/fans-code-h5', { params }) //获取购物车数量 -export const getShoppingCount = (params) => http.get('/sale/api/shopping/getShoppingCount', { params }) +export const getShoppingCount = params => + http.get('/sale/api/shopping/getShoppingCount', { params }) //获取购物车数小 -export const getSmallCount = (params) => http.get('/sale/api/shopping/getAreaShoppingCount', { params }) +export const getSmallCount = params => + http.get('/sale/api/shopping/getAreaShoppingCount', { params }) //获取分享前缀 -export const prefix = (params) => http.get('/member/api/member/query-country-prefix/' + params, ) +export const prefix = params => + http.get('/member/api/member/query-country-prefix/' + params) //校验分享编号 -export const validateMember = (params) => http.get('/member/api/member/validate-share-member/' + params, ) +export const validateMember = params => + http.get('/member/api/member/validate-share-member/' + params) //获取国家 -export const currencyList = (params) => http.get('/system/api/country/list' , {params} ) +export const currencyList = params => + http.get('/system/api/country/list', { params }) //0元注册时 -export const checkShare = (params) => http.get('/member/api/share/check-share-code' , {params} ) +export const checkShare = params => + http.get('/member/api/share/check-share-code', { params }) //海粉订单详情 -export const waresinfo = (params) => http.post('/sale/api/wares/query-confirm-waresinfo', params) +export const waresinfo = params => + http.post('/sale/api/wares/query-confirm-waresinfo', params) //hi粉确认订单 -export const fansConfirm = (params) => http.post('/sale/api/order/fans-confirm-order', params) +export const fansConfirm = params => + http.post('/sale/api/order/fans-confirm-order', params) //购物车注册下单校验弹框 -export const energyShop = (params) => http.post('/sale/api/wares/query-energy-silo', params) +export const energyShop = params => + http.post('/sale/api/wares/query-energy-silo', params) //hi粉确认订单 -export const energyShopSilo = (params) => http.post('/sale/api/order/valid-silo', params) \ No newline at end of file +export const energyShopSilo = params => + http.post('/sale/api/order/valid-silo', params) diff --git a/config/login.js b/config/login.js index 3597429..a461fe0 100644 --- a/config/login.js +++ b/config/login.js @@ -105,9 +105,9 @@ export const getMenuList = params => //海粉默认登录（H5扫码使用） export const autoLogin = params => http.post('/member/auth/api/auto-login', params) -//海粉商品 +//分享列表商品 export const queryWares = params => - http.post('/sale/api/wares/query-spe-wares-copy', params) + http.get('/sale/api/wares/list-wares-share', { params }) //保存礼品地址 export const saveGiftAddress = params => http.post('/member/api/member-gift/update-gift', params) diff --git a/config/market.js b/config/market.js index 0cf0d67..6e1f1bd 100644 --- a/config/market.js +++ b/config/market.js @@ -9,62 +9,61 @@ const http = uni.$u.http //考核明细接口 -export const getAssessList = (params) => http.get('/member/api/assess/assessList', { - params -}) +export const getAssessList = params => + http.get('/member/api/assess/assessList', { + params, + }) //考核分红积分 -export const getAssAchieve = (params) => http.get('/member/api/assess/assAchieve', { - params -}) - +export const getAssAchieve = params => + http.get('/member/api/assess/assAchieve', { + params, + }) //考核状态复购考核 -export const getAssessStatusList = (params) => http.get('/system/pub/enums/member-assess-status', { - params -}) +export const getAssessStatusList = params => + http.get('/system/pub/enums/member-assess-status', { + params, + }) //注册等级下拉选 -export const getGradeList = (params) => http.get('/system/api/grade/list', { - params -}) - +export const getGradeList = params => + http.get('/system/api/grade/list', { + params, + }) //注册列表 -export const getRegList = (params) => http.get('/member/api/market-news/reg-list', { - params -}) +export const getRegList = params => + http.get('/member/api/market-news/reg-list', { + params, + }) //招商列表 -export const tripleCycleList = (params) => http.get('/member/api/market-news/triple_cycle_list', { - params -}) - -//海粉列表 -export const seaFlourList = (params) => http.get('/member/api/market-news/sea_flour_list', { - params -}) +export const tripleCycleList = params => + http.get('/member/api/market-news/triple_cycle_list', { + params, + }) //菜单列表 -export const menuList = (params) => http.get('/system/api/menu/list', { - params -}) +export const menuList = params => + http.get('/system/api/menu/list', { + params, + }) //直推列表 -export const parentList = (params) => http.get('/member/api/member/parent-list', { - params -}) - - +export const parentList = params => + http.get('/member/api/member/parent-list', { + params, + }) // 抗衰能量仓列表 -export const getSiloList = (params) => http.post('/member/api/silo/list', params) - - +export const getSiloList = params => http.post('/member/api/silo/list', params) //查询能量仓明细 -export const getSiloDetail = (params) => http.post('/member/api/silo/detail', params) +export const getSiloDetail = params => + http.post('/member/api/silo/detail', params) // 沙棘公益列表 -export const treeList = (params) => http.get('/activity/api/tree-rule-pick/member-info-list', { - params -}) +export const treeList = params => + http.get('/activity/api/tree-rule-pick/member-info-list', { + params, + }) diff --git a/config/pay.js b/config/pay.js index c2f7430..63816e2 100644 --- a/config/pay.js +++ b/config/pay.js @@ -30,7 +30,7 @@ export const bindTlConfirm = params => //汇付绑卡 export const bindHfConfirm = params => http.post('/pay/ada-fast/bind-confirm', params) -//银行卡支付获取验证码 + export const unifiedorder = params => http.post('/pay/unifiedorder', params) //汇付银行卡确认 export const payConfirmHf = params => diff --git a/config/request.js b/config/request.js index a5cfc05..b963395 100644 --- a/config/request.js +++ b/config/request.js @@ -19,7 +19,7 @@ module.exports = vm => { //#ifdef DEV_SERVER console.log('DEV_SERVER') - config.baseURL = 'http://192.168.0.86:8080' + config.baseURL = 'http://localhost:8080' //#endif //#ifdef QA_SERVER diff --git a/config/share.js b/config/share.js new file mode 100644 index 0000000..e825d35 --- /dev/null +++ b/config/share.js @@ -0,0 +1,4 @@ +const http = uni.$u.http + +export const getShareCode = params => + http.get('/member/api/share/get-shared-img', { params }) diff --git a/package-lock.json b/package-lock.json index 60403a1..1943147 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,6 +9,7 @@ "version": "1.0.0", "license": "ISC", "dependencies": { + "@zumer/snapdom": "^1.9.6", "axios": "^1.5.0", "echarts": "^4.9.0", "file-saver": "^2.0.5", @@ -766,6 +767,12 @@ "dev": true, "peer": true }, + "node_modules/@zumer/snapdom": { + "version": "1.9.6", + "resolved": "https://registry.npmjs.org/@zumer/snapdom/-/snapdom-1.9.6.tgz", + "integrity": "sha512-JxEJKoGCZpUfai/Nboii6a0vJWoYACO7ohGjnPSGRjhv0V0Mglq8acPaZcAGy4K+Mh4at+D05NAjBKqzQNTOHA==", + "license": "MIT" + }, "node_modules/acorn": { "version": "6.4.2", "resolved": "https://mirrors.cloud.tencent.com/npm/acorn/-/acorn-6.4.2.tgz", @@ -3557,7 +3564,7 @@ }, "node_modules/html2canvas": { "version": "1.4.1", - "resolved": "https://registry.npmmirror.com/html2canvas/-/html2canvas-1.4.1.tgz", + "resolved": "https://registry.npmjs.org/html2canvas/-/html2canvas-1.4.1.tgz", "integrity": "sha512-fPU6BHNpsyIhr8yyMpTLLxAbkaK8ArIBcmZIRiBLiDhjeqvXolaEmDGmELFuX9I4xDcaKKcJl+TKZLqruBbmWA==", "license": "MIT", "dependencies": { diff --git a/package.json b/package.json index fa975b2..b2747bf 100644 --- a/package.json +++ b/package.json @@ -4,6 +4,7 @@ "description": "h5", "main": "main.js", "dependencies": { + "@zumer/snapdom": "^1.9.6", "axios": "^1.5.0", "echarts": "^4.9.0", "file-saver": "^2.0.5", diff --git a/pages.json b/pages.json index 9f7a74b..a6df4ea 100644 --- a/pages.json +++ b/pages.json @@ -821,6 +821,13 @@ "enablePullDownRefresh": false } }, + { + "path": "pages/mine/share/index", + "style": { + "navigationBarHidden": true, + "navigationStyle": "custom" + } + }, { "path": "pages/mine/honorHall/honorHall", "style": { @@ -881,7 +888,7 @@ "pagePath": "pages/shoppingCar/index" }, { - "pagePath": "pages/email/index" + "pagePath": "pages/mine/share/index" }, { "pagePath": "pages/mine/index" diff --git a/pages/market/investmentList/investmentList.vue b/pages/market/investmentList/investmentList.vue index a765138..81481d7 100644 --- a/pages/market/investmentList/investmentList.vue +++ b/pages/market/investmentList/investmentList.vue @@ -16,7 +16,6 @@ - @@ -24,10 +23,9 @@ import * as mar from '@/config/market.js' import direct from '@/components/invest/direct.vue' import circulation from '@/components/invest/circulation.vue' -import hignFans from '@/components/invest/hignFans.vue' import { formatMsToDate } from '@/util/index' export default { - components: { direct, hignFans, circulation }, + components: { direct, circulation }, data() { return { navIndex: 0, @@ -122,7 +120,7 @@ export default { .styles { border: none !important; color: #fff !important; - background: #005BAC; + background: #005bac; } .top-lists { width: 100%; @@ -202,7 +200,7 @@ export default { } .seatch_r { - background: #005BAC; + background: #005bac; border-radius: 50%; padding: 8rpx; margin-left: 24rpx; diff --git a/pages/mine/share/index.vue b/pages/mine/share/index.vue new file mode 100644 index 0000000..5020478 --- /dev/null +++ b/pages/mine/share/index.vue @@ -0,0 +1,243 @@ + + + + + diff --git a/pages/pay/hiPay.vue b/pages/pay/hiPay.vue index 4848cc1..b694c47 100644 --- a/pages/pay/hiPay.vue +++ b/pages/pay/hiPay.vue @@ -13,162 +13,245 @@ ￥{{ paramsPost.orderAmount | numberToCurrency }} - {{ '请在' }} {{ countDown }}{{ '内完成支付，否则订单将会被自动取消' }} - + --> - - - - - - {{ '在线支付' }} + + + + + {{ '在线支付' }} + + + + + {{ '宝付微信支付' }} - - - - {{ '宝付微信支付' }} - - - - - + + + + + + + + + {{ '宝付微信扫码' }} - - - - {{ '宝付微信扫码' }} - - - - - + + + + + + + + + {{ '汇付微信支付' }} + + + + + + + + + + {{ '微信支付' }} + + + + + + + + + + + {{ '支付宝支付' }} + + + + + + + + + + {{ '汇付银行卡' }} + + + + + {{ item.bankName }} ({{ item.bankNo }}) + 解绑 + - - - - {{ '汇付微信支付' }} + + + + - - - - - - - - - {{ '汇付银行卡' }} ({{ '暂不支持信用卡' }}) - - - - - {{ item.bankName }} ({{ item.bankNo }}) - - - - - - - - - {{ '绑定银行卡' }} - + + + {{ '绑定银行卡' }} - - - - 通联微信支付 - - - - - + + + + + 通联微信支付 - - - - {{ '通联银行卡' }} ({{ '暂不支持信用卡' }}) + + + + + + + + + {{ '京东银行卡' }} + + + + + {{ item.bankName }} ({{ item.bankNo }}) + + + + + - - - - {{ item.bankName }} ({{ item.bankNo }}) - - - - - - - - - {{ '绑定银行卡' }} - + + + {{ '绑定银行卡' }} - - - - {{ '京东银行卡' }} ({{ '暂不支持信用卡' }}) + + + + + 京东收银台 + + + + + + + + + + {{ '通联银行卡' }} + + + + + {{ item.bankName }} ({{ item.bankNo }}) + + + + + - - - - {{ item.bankName }} ({{ item.bankNo }}) - - - - - - - - - {{ '绑定银行卡' }} - + + + {{ '绑定银行卡' }} - - + + @@ -225,7 +308,10 @@
- + @@ -234,15 +320,23 @@ import * as api from '@/config/pay.js' import QRCode from 'qrcodejs2' import { removeToken } from '@/config/auth.js' -import hiSuccess from '@/components/hiSuccess.vue' +import successDialog from '@/components/successDialog.vue' import * as act from '@/config/activity.js' +import { + PAY_REDIRECT_URL, + PAY_TYPE, + PAY_CHANEL, + PAY_AUTH, +} from '@/util/constant.js' var payStatus export default { components: { - hiSuccess, + successDialog, }, data() { return { + PAY_TYPE, + PAY_AUTH, payList: {}, isLoading: false, clockTime: '', @@ -257,12 +351,12 @@ export default { }, paramsPost: '', isShare: false, //分享用户第一次爆单 - userInfo: '', + userInfo: uni.getStorageSync('User'), activeNames: 1, whatPay: '', hfList: [], jdList: [], - businessType: '', + businessType: 1, isBank: '', isPw: false, codeValue: '', @@ -271,9 +365,7 @@ export default { sucPay: 0, content: '支付成功', wxPopup: false, - luckydrawData: {}, isRecharge: false, - czJe: '', tlList: [], } }, @@ -286,51 +378,12 @@ export default { ) this.pkCountry = uni.getStorageSync('pkCountry') - // if (this.paramsPost.isRecharge) { - // this.isRecharge = this.paramsPost.isRecharge - // this.businessType = 3 - // uni.setNavigationBarTitle({ - // title: '充值' - // }); - // } else { - // uni.setNavigationBarTitle({ - // title: '订单支付' - // }); - // this.isRecharge = false - // if (JSON.parse(options.paramsPost).orderType == 4) { + this.orderCode = this.paramsPost.orderCode - // this.luckydrawData = this.paramsPost.luckydrawData - // // 抽奖支付处理（查询订单支付信息以及显示等） - // this.businessType = 4 //抽奖 - // this.specialArea = this.paramsPost.specialArea - // this.getLuckdrawDetail() - // } else { - // this.userInfo = uni.getStorageSync('User') - // if ( - // this.userInfo.registerFans == 0 - // ) { - // this.isShare = true - // } - - // this.specialArea = - // this.paramsPost.specialArea || this.paramsPost.orderType - // this.orderCode = this.paramsPost.orderCode - // this.businessType = options.businessType - // // this.getInfo() - - // // 获取订单信息 - // this.getOrderInfo() - // if (!this.isShare) { - // // 获取消费信息 - // this.getSpendInfo() - // } - // } - // } // 获取支付配置 this.getPayConfig() - this.downTime() - // clearInterval(this.clockTime) + // this.downTime() }, onShow() { @@ -338,22 +391,6 @@ export default { // this.getBankList() }, methods: { - //查询充值抽奖次数 - getLuckdrawDetail() { - // 抽奖支付处理（查询订单支付信息以及显示等） - act - .getLuckdrawDetail({ - pkBaseId: this.luckydrawData.pkBaseId, - payNum: this.luckydrawData.payNum, - }) - .then(res => { - if (res.code == 200) { - this.orderData.orderAmount = res.data.toBePaidMoney - this.payDetail = res.data - // this.downTime() - } - }) - }, closewxPopup() { this.wxPopup = false this.$refs.qrCodeUrlWx.innerHTML = '' @@ -387,7 +424,7 @@ export default { this.isLoading = false this.isPw = false removeToken() - this.$refs.hiSuccess.showSuccess(res.data) + this.$refs.successDialog.showSuccess(res.data) }) }, payPw() { @@ -411,7 +448,7 @@ export default { url(obj).then(res => { if (res.code == 200) { // this.isPw = false - // this.$refs.hiSuccess.showSuccess(res.data) + // this.$refs.successDialog.showSuccess(res.data) uni.showToast({ title: res.msg, icon: 'none', @@ -431,66 +468,52 @@ export default { } }) }, - quickPay(cz) { - // 非银行卡 - if (typeof this.whatPay == 'number') { - if (this.whatPay == 12) { - this.scanPayBfWx(5) - } else if (this.whatPay == 13) { - this.scanPayBfWx(6) - } else if (this.whatPay == 11) { - this.scanPayBfWxJump(5) - } else if (this.whatPay == 32) { - this.scanPayTlWxJump(3) + async quickPay() { + if ( + ![ + PAY_TYPE.HUI_FU_BANK_CARD, + PAY_TYPE.JING_DONG_BANK_CARD, + PAY_TYPE.TONG_LIAN_BANK_CARD, + ].includes(this.whatPay.slice(0, 2)) + ) { + if ([PAY_TYPE.JING_DONG_H5].includes(this.whatPay)) { + this.redirectPay(PAY_CHANEL[this.whatPay]) + } else if ( + [PAY_TYPE.BAO_FU_WECHAT_SCAN, PAY_TYPE.HUI_FU_WECHAT].includes( + this.whatPay + ) + ) { + this.scanPayBfWx(PAY_CHANEL[this.whatPay]) + } else if (this.whatPay == PAY_TYPE.WECHAT_PAY) { + this.scanPayWx(PAY_CHANEL[this.whatPay]) + } else if (this.whatPay == PAY_TYPE.ALI_PAY) { + this.scanPayAl(PAY_CHANEL[this.whatPay]) } } else { - if (this.whatPay.slice(0, 2) == 'hf') { - let indexed = this.whatPay.slice(2, 4) - let params = { - businessType: 1, //订单类型 - businessCode: this.orderCode, - payChannel: 6, //汇付 - payType: 3, //银行卡 - bindCode: this.hfList[indexed].bindCode, - } - api.unifiedorder(params).then(response => { - this.isBank = 'hf' - this.bindCode = this.hfList[indexed].bindCode - this.isPw = true - }) - this.checkPayStatus(params) - } else if (this.whatPay.slice(0, 2) == 'jd') { - let indexed = this.whatPay.slice(2, 4) - - let params = { - businessType: 1, //订单类型 - businessCode: this.orderCode, - payChannel: 4, //京东 - payType: 3, //银行卡 - bindCode: this.jdList[indexed].bindCode, - } - api.unifiedorder(params).then(response => { - this.isBank = 'jd' - this.bindCode = this.jdList[indexed].bindCode - this.isPw = true - }) - this.checkPayStatus(params) - } else if (this.whatPay.slice(0, 2) == 'tl') { - let indexed = this.whatPay.slice(2, 4) - let params = { - businessType: 1, //订单类型 - businessCode: this.orderCode, - payChannel: 3, //通联 - payType: 3, //银行卡 - bindCode: this.tlList[indexed].bindCode, - } - api.unifiedorder(params).then(response => { - this.isBank = 'tl' - this.bindCode = this.tlList[indexed].bindCode - this.isPw = true - }) - this.checkPayStatus(params) + const indexed = this.whatPay.slice(2, 4) + const payTypeEnum = this.whatPay.slice(0, 2) + const bankListMap = { + [PAY_TYPE.HUI_FU_BANK_CARD]: this.hfList[indexed].bindCode, + [PAY_TYPE.JING_DONG_BANK_CARD]: this.jdList[indexed].bindCode, + [PAY_TYPE.TONG_LIAN_BANK_CARD]: this.tlList[indexed].bindCode, } + this.bindCode = bankListMap[payTypeEnum] + const params = { + businessType: this.businessType, //订单类型 + payChannel: PAY_CHANEL[payTypeEnum], + payType: 3, //银行卡 + bindCode: bankListMap[payTypeEnum], + } + if (!isRecharge) { + Object.assign(params, { + businessCode: this.orderCode, + }) + } + api.unifiedorder(params).then(response => { + this.isBank = this.whatPay.slice(0, 2) + this.isPw = true + this.checkPayStatus(params) + }) } }, // 宝付微信支付 @@ -527,6 +550,47 @@ export default { }) this.checkPayStatus(params) }, + redirectPay(payChannel) { + this.getPayAuthToken(payChannel).then(url => { + if (navigator.userAgent.includes('MicroMessenger')) { + window.location.href = url + } else { + window.open(url) + } + }) + }, + getPayAuthToken(payChannel) { + return new Promise((resolve, reject) => { + const extParam = { + isRecharge: false, + orderCode: this.orderCode, + specialArea: 1, + isSharePay: true, + } + // 将extParam对象转换为JSON字符串，再转换为base64编码 + const extParamBase64 = btoa(JSON.stringify(extParam)) + const params = { + payChannel: payChannel, + payType: 2, + appletFlag: 0, + businessType: this.businessType, + businessCode: this.orderCode, + extParam: extParamBase64, + } + api.unifiedorder(params).then(res => { + if (res.code === 200) { + resolve(res.data) + this.checkPayStatus(params) + } else { + uni.showToast({ + title: res.msg, + icon: 'none', + }) + reject(res.msg) + } + }) + }) + }, scanPayBfWx(val) { let params = { businessType: 1, @@ -567,9 +631,7 @@ export default { getPayConfig() { api.payConfig().then(res => { this.payList = res.data - this.$nextTick(() => { - this.$refs.collapse.init() - }) + this.$forceUpdate() }) }, @@ -753,10 +815,9 @@ export default { .flex_ac { display: flex; align-items: center; - width: 100%; justify-content: space-between; border-bottom: 1px solid rgba(0, 0, 0, 0.1); - padding: 18rpx 0; + padding: 18rpx 20rpx; } .flex_ac1 { @@ -766,7 +827,7 @@ export default { width: 100%; justify-content: space-between; border-bottom: 1px solid rgba(0, 0, 0, 0.1); - padding: 18rpx 0; + // padding: 18rpx 0; } .flex_ac_i { @@ -786,10 +847,6 @@ export default { } } -::v-deep .u-collapse-item__content__text { - padding: 0px 15px; -} - .pad { width: 100%; display: flex; diff --git a/pages/shareArea/hiList.vue b/pages/shareArea/hiList.vue index 8899597..3904588 100644 --- a/pages/shareArea/hiList.vue +++ b/pages/shareArea/hiList.vue @@ -1,37 +1,52 @@ - @@ -40,138 +55,476 @@ import * as api from '@/config/login.js' import { setToken } from '@/config/auth.js' export default { - data(){ - return{ - pkParent:'', - goodList:[], - placeParent:'' + data() { + return { + pkParent: '', + goodList: [], + placeParent: '', } }, - filters:{ - seles(value){ - - if(value>999){ - return 999 + '+' - }else{ - return value - } - - } + filters: { + seles(value) { + if (value > 999) { + return 999 + '+' + } else { + return value + } }, + }, onLoad(options) { this.pkParent = options.pkParent this.getToken() - }, - methods:{ - getToken(){ - api.autoLogin({ - pkParent:this.pkParent - }).then(res=>{ - setToken(res.data.access_token, res.data.expires_in) - this.getList() - this.getCode() - }) + methods: { + getToken() { + api + .autoLogin({ + pkParent: this.pkParent, + }) + .then(res => { + setToken(res.data.access_token, res.data.expires_in) + this.getList() + this.getCode() + }) }, - getCode(){ - api.fansConvertCode( - this.pkParent - ).then(res=>{ + getCode() { + api.fansConvertCode(this.pkParent).then(res => { this.placeParent = res.msg - uni.setStorageSync('placeParent', this.placeParent) + uni.setStorageSync('placeParent', this.placeParent) }) }, - getList(){ - api.queryWares({ - shareMemberCode:this.pkParent - }).then(res=>{ - this.goodList = res.data + getList() { + api + .queryWares({ + shareMemberCode: this.pkParent, + }) + .then(res => { + this.goodList = res.data + }) + }, + goBuy(item) { + uni.navigateTo({ + url: '/pages/shareArea/hiOrder?allData=' + JSON.stringify(item), }) }, - goBuy(item){ - uni.navigateTo({ url: '/pages/shareArea/hiOrder?allData=' + JSON.stringify(item)}) - } - } + }, } \ No newline at end of file + +@keyframes fadeInUp { + from { + opacity: 0; + transform: translateY(30rpx); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes slideInUp { + from { + opacity: 0; + transform: translateY(40rpx); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes pulse { + 0%, + 100% { + transform: scale(1); + } + 50% { + transform: scale(1.02); + } +} + +@keyframes priceHighlight { + 0%, + 100% { + color: #005bac; + } + 50% { + color: #0066cc; + transform: scale(1.05); + } +} + +@keyframes promoBreathe { + 0%, + 100% { + transform: scale(1); + box-shadow: 0 8rpx 24rpx rgba(255, 107, 53, 0.4); + } + 50% { + transform: scale(1.05); + box-shadow: 0 12rpx 32rpx rgba(255, 107, 53, 0.6); + } +} + +@keyframes shimmer { + 0% { + left: -100%; + } + 50% { + left: -100%; + } + 100% { + left: 100%; + } +} + +// 商品卡片延迟动画 +.goodList_i:nth-child(1) { + animation-delay: 0.1s; +} +.goodList_i:nth-child(2) { + animation-delay: 0.2s; +} +.goodList_i:nth-child(3) { + animation-delay: 0.3s; +} +.goodList_i:nth-child(4) { + animation-delay: 0.4s; +} +.goodList_i:nth-child(5) { + animation-delay: 0.5s; +} +.goodList_i:nth-child(n + 6) { + animation-delay: 0.6s; +} + +// 响应式优化 +@media (max-width: 750rpx) { + .header-section { + padding: 40rpx 24rpx 50rpx; + + .hero-content { + .hero-title .hero-main { + font-size: 36rpx; + } + } + } + + .goodList { + .goodList_i { + padding: 20rpx; + + .cover { + width: 200rpx; + height: 200rpx; + } + + .goodList_ir { + margin-left: 20rpx; + + .tit1 { + font-size: 28rpx; + } + + .goodList_ib { + .price-container { + .price { + font-size: 32rpx; + } + } + } + + .toBuy { + padding: 18rpx 0; + font-size: 26rpx; + } + } + } + } +} + diff --git a/pages/shareArea/hiOrder.vue b/pages/shareArea/hiOrder.vue index 4152fe4..24e0eef 100644 --- a/pages/shareArea/hiOrder.vue +++ b/pages/shareArea/hiOrder.vue @@ -14,57 +14,40 @@ {{ '会员信息' }} - + - + - + - - - - - {{ form.pkCountryLabel }} - - - - - - - - - {{ form.pkSettleCountryLabel }} - - - - - + + - - + - @@ -82,23 +64,29 @@ - - + - + - + - + - + - + - 商品信息 @@ -205,19 +163,6 @@ - - - - - - {{ '请阅读并同意' }} - 《{{ '购买协议' }}》 - @@ -256,7 +201,6 @@ :columns="countryList" keyName="label" > - { uni.setStorageSync('mToken', res.msg) @@ -461,14 +400,6 @@ export default { }, goBuy() { this.$refs.uForm.validate().then(res => { - if (this.agreementShow.length == 0) { - uni.showToast({ - title: '请阅读并同意购买协议', - icon: 'none', - duration: 1500, - }) - return - } this.isLoading = true api .fansConfirm( @@ -492,9 +423,14 @@ export default { pkWares: this.allData.pkId, skuList: [], } - this.allData.specsSkuParamsList.forEach(item => { + console.log( + '%c [ carList ]-419', + 'font-size:13px; background:#b131b9; color:#f575fd;', + this.allData + ) + this.allData.productGroup.forEach(item => { carList.skuList.push({ - pkWaresSku: item.pkWaresSpecsSku, + pkWaresSku: item.pkSkuId, quantity: item.quantity, }) }) @@ -547,7 +483,7 @@ export default { } .kuang { // margin-top: 20rpx; - padding: 20rpx 40rpx; + // padding: 20rpx 40rpx; background: #fff; // box-shadow: 0px 2px 10px 0px rgba(204, 204, 204, 0.5); // border-radius: 10px 10px 10px 10px; @@ -573,22 +509,16 @@ export default { display: flex; justify-content: space-between; width: 100%; - border-width: 0.5px !important; - border-color: #dadbde !important; - border-style: solid; - border-radius: 4px; padding: 6px 9px; } .pickerHui { display: flex; justify-content: space-between; width: 100%; - border-width: 0.5px !important; - border-color: #dadbde !important; - border-style: solid; + border-radius: 4px; - padding: 6px 9px; - background: #f5f7fa; + // padding: 6px 9px; + // background: #f5f7fa; } .kuang_t { display: flex; @@ -784,4 +714,9 @@ export default { background: #f6f6f6; padding: 0 28rpx 28rpx 28rpx; } +.u-form-item { + ::v-deep .u-form-item__body { + padding: 20rpx 30rpx !important; + } +} diff --git a/pages/shareRegist/index.vue b/pages/shareRegist/index.vue index f12969a..beb499c 100644 --- a/pages/shareRegist/index.vue +++ b/pages/shareRegist/index.vue @@ -1,97 +1,95 @@