充值页
2
main.js
|
|
@ -29,7 +29,7 @@ export function createApp() {
|
|||
app.config.globalProperties.$system = plus.os.name;
|
||||
// #endif
|
||||
app.config.globalProperties.$systemInfo = systemInfo
|
||||
uni.setStorageSync('version', '1.0.6.sp4')
|
||||
uni.setStorageSync('version', '1.0.6.sp5')
|
||||
app.config.globalProperties.$version = uni.getStorageSync('version')
|
||||
app.use(globalMethods);
|
||||
return {
|
||||
|
|
|
|||
|
|
@ -12,10 +12,10 @@
|
|||
|
||||
</view>
|
||||
<view class="rectangle_22292" style="position: fixed;left:0;top:0;overflow: hidden;"
|
||||
:style="{background:(data.info.avatar?`rgba(0,0,0,0)`:'linear-gradient(180deg, #bdbec3 0%, #a0a2af 100%)')
|
||||
:style="{background:(data.info.avatar&&data.headerHeight!='206'?`rgba(0,0,0,0)`:'linear-gradient(180deg, #bdbec3 0%, #a0a2af 100%)')
|
||||
, height:data.headerHeight+'px'}">
|
||||
<view v-if="data.info.avatar" style="height:400rpx;"></view>
|
||||
<image v-if="data.info.avatar" :src="data.info.avatar" mode="aspectFill"
|
||||
<image v-if="data.info.avatar&&data.headerHeight!='206'" :src="data.info.avatar" mode="aspectFill"
|
||||
style="width:100%;position: absolute;bottom: 0;left: 0;z-index:0;" :style="{height:data.headerHeight+'px'}"></image>
|
||||
<view class="status" :style="{height:$systemInfo.statusBarHeight+'px'}"> </view>
|
||||
<view class="flexcontainer" @click="openEditModalDetail()">
|
||||
|
|
@ -27,10 +27,10 @@
|
|||
{{data.info.name.substring(0,1)}}
|
||||
</view>
|
||||
<image v-else class="group_47577" :src="data.info.avatar||'/static/image/call/iosAvatar.png'"
|
||||
:style="{opacity:data.info.avatar?0:1,transform: `scale(${data.avatarScale}) translateY(${data.avatarY}px)`}" />
|
||||
:style="{opacity:data.info.avatar?(data.headerHeight=='206'?1:0):1,transform: `scale(${data.avatarScale}) translateY(${data.avatarY}px)`}" />
|
||||
</view>
|
||||
<text class="text_1" v-if="!data.info.avatar" :style="{opacity:data.scale}"> {{data.info.address}} </text>
|
||||
<text class="text_2" :style="{transform: `scale(${data.info.avatar?1:data.textScale}) translateY(${data.text2Y}px)`}">{{data.info.name||formatString(data.info.phone)}} </text>
|
||||
<text class="text_2" :style="{transform: `scale(${data.textScale}) translateY(${data.text2Y}px)`}">{{data.info.name||formatString(data.info.phone)}} </text>
|
||||
|
||||
<view class="flexcontainer_1" :style="{transform: `translateY(${data.contentY}px)`}">
|
||||
<view class="group_48123" :style="{'background-color': `rgba(128,131,146,${data.info.avatar?0.5:1})`}">
|
||||
|
|
@ -784,15 +784,15 @@
|
|||
const y = e.scrollTop;
|
||||
const max = 200;
|
||||
let p = Math.min(y / max, 1);
|
||||
data.contentY = -p * (data.info.avatar?70:90);
|
||||
data.contentY = -p * (data.info.avatar?65:90);
|
||||
data.avatarY = -p * 0;
|
||||
data.text2Y = -p * (data.info.avatar?70:130);
|
||||
data.text2Y = -p * (data.info.avatar?75:130);
|
||||
data.avatarScale = 1 - p * 0.55; // 1 → 0.6 textScale
|
||||
data.textScale = 1 - p * 0.5; // 1 → 0.6
|
||||
|
||||
data.scale = 1 - p * 1; // 1 → 0.6
|
||||
console.log(data.avatarScale )
|
||||
data.headerHeight=Math.max(206,(data.info.avatar?519:325) - y);
|
||||
console.log(data.headerHeight )
|
||||
}else{
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -36,8 +36,7 @@
|
|||
</view>
|
||||
<view class="vipList">
|
||||
<template v-for="(item, index) in data.benefitList" :key="index">
|
||||
<view class="item"
|
||||
v-if="data.goods.features == 'common' || (data.goods.features != 'common' && index < 10)">
|
||||
<view class="item" v-if="data.goods.features == 'common' || (data.goods.features != 'common' && index < 10)">
|
||||
<image :src="item.url"></image>
|
||||
<text>{{ item.name }}</text>
|
||||
</view>
|
||||
|
|
@ -113,8 +112,8 @@
|
|||
|
||||
<view class="footer-container">
|
||||
<view class="payment-method-box">
|
||||
<view class="wx-pay payment-method" v-for="(item, index) in data.payList"
|
||||
@click="onSelectPayment(item.type)" :key="index">
|
||||
<view class="wx-pay payment-method" v-for="(item, index) in data.payList" @click="onSelectPayment(item.type)"
|
||||
:key="index">
|
||||
<image class="img-select"
|
||||
:src="paymentMethod == item.type ? '/static/image/recharge/selected.png' : '/static/image/recharge/unselected.png'">
|
||||
</image>
|
||||
|
|
@ -131,8 +130,7 @@
|
|||
<view class="text">
|
||||
合计
|
||||
<text>¥</text>
|
||||
<countUp :num="$toFiexd(data.price, 2)" height="24" style="margin-top: -6px;" color="red"
|
||||
fontSize='24'>
|
||||
<countUp :num="$toFiexd(data.price, 2)" height="24" style="margin-top: -6px;" color="red" fontSize='24'>
|
||||
</countUp>
|
||||
已优惠¥{{ $toFiexd(data.coupon, 0) }}
|
||||
</view>
|
||||
|
|
@ -183,8 +181,7 @@
|
|||
</scroll-view>
|
||||
</view>
|
||||
<view class="couponButton" @click="submitActivity">
|
||||
<c-lottie ref="cLottieRef" src='/static/lottie/couponButton.json' width="305px"
|
||||
height='86px'></c-lottie>
|
||||
<c-lottie ref="cLottieRef" src='/static/lottie/couponButton.json' width="305px" height='86px'></c-lottie>
|
||||
</view>
|
||||
</view>
|
||||
</transition>
|
||||
|
|
@ -235,8 +232,7 @@
|
|||
<view>
|
||||
<view class="item" v-for="(item, index) in data.myActivity" :key="index"
|
||||
@click="(data.goods.price < (Number(item.threshold) / 100) && item.threshold != '') || !item.isStatus ? '' : setActiveId(item)">
|
||||
<view class="left"
|
||||
:class="{ left2: data.goods.price < (Number(item.threshold) / 100) || !item.isStatus }">
|
||||
<view class="left" :class="{ left2: data.goods.price < (Number(item.threshold) / 100) || !item.isStatus }">
|
||||
<view class="money">
|
||||
<text v-if="item.coupon_type_name != '折扣券'">¥</text>
|
||||
<text class="moneys">{{ item.coupon_type_name != '折扣券' ? (Number(item.coupon_value) /
|
||||
|
|
@ -254,8 +250,8 @@
|
|||
<image
|
||||
v-if="(data.goods.price < (Number(item.threshold) / 100) && item.threshold != '') || !item.isStatus"
|
||||
class="checkedImg" src="/static/image/recharge/checked1.png" mode=""></image>
|
||||
<image v-else-if="data.active_ids == item.id" class="checkedImg"
|
||||
src="/static/image/recharge/checked3.png" mode=""></image>
|
||||
<image v-else-if="data.active_ids == item.id" class="checkedImg" src="/static/image/recharge/checked3.png"
|
||||
mode=""></image>
|
||||
<image v-else class="checkedImg" src="/static/image/recharge/checked2.png" mode=""></image>
|
||||
</view>
|
||||
<view class="jjdq" v-if="isToday(item.expire_times)">
|
||||
|
|
@ -278,20 +274,20 @@
|
|||
|
||||
|
||||
<script setup>
|
||||
import customTab from "@/components/custom-tab/custom-tab.vue"
|
||||
import countUp from "@/components/countUp/countUp.vue"
|
||||
import {
|
||||
import customTab from "@/components/custom-tab/custom-tab.vue"
|
||||
import countUp from "@/components/countUp/countUp.vue"
|
||||
import {
|
||||
postJson
|
||||
} from "@/utils/requests.js"
|
||||
import {
|
||||
} from "@/utils/requests.js"
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
getCurrentInstance,
|
||||
watch,
|
||||
nextTick,
|
||||
toRefs
|
||||
} from "vue";
|
||||
import {
|
||||
} from "vue";
|
||||
import {
|
||||
onLoad,
|
||||
onShow,
|
||||
onReady,
|
||||
|
|
@ -299,55 +295,55 @@ import {
|
|||
onReachBottom,
|
||||
onBackPress,
|
||||
onUnload
|
||||
} from "@dcloudio/uni-app";
|
||||
const {
|
||||
} from "@dcloudio/uni-app";
|
||||
const {
|
||||
appContext,
|
||||
proxy
|
||||
} = getCurrentInstance();
|
||||
const popup = ref();
|
||||
const coupon = ref();
|
||||
const couponBox = ref();
|
||||
const myCoupon = ref();
|
||||
const dialogVipBenefits = [{
|
||||
} = getCurrentInstance();
|
||||
const popup = ref();
|
||||
const coupon = ref();
|
||||
const couponBox = ref();
|
||||
const myCoupon = ref();
|
||||
const dialogVipBenefits = [{
|
||||
name: "模拟微信",
|
||||
url: "/static/image/recharge/moniweixinDialog.png"
|
||||
},
|
||||
{
|
||||
},
|
||||
{
|
||||
name: "无广告",
|
||||
url: "/static/image/recharge/wuguanggaoDialog.png"
|
||||
},
|
||||
{
|
||||
},
|
||||
{
|
||||
name: "无水印",
|
||||
url: "/static/image/recharge/wushuiyinDialog.png"
|
||||
},
|
||||
{
|
||||
},
|
||||
{
|
||||
name: "专属客服",
|
||||
url: "/static/image/recharge/zhuanshukefuDialog.png"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
|
||||
// 套餐列表
|
||||
const packageList = [{
|
||||
// 套餐列表
|
||||
const packageList = [{
|
||||
name: "连续包月",
|
||||
delPrice: "89",
|
||||
price: "29",
|
||||
lifespan: "一月"
|
||||
},
|
||||
{
|
||||
},
|
||||
{
|
||||
name: "连续包季",
|
||||
delPrice: "189",
|
||||
price: "98",
|
||||
lifespan: "一季"
|
||||
},
|
||||
{
|
||||
},
|
||||
{
|
||||
name: "连续包年",
|
||||
delPrice: "365",
|
||||
price: "198",
|
||||
lifespan: "一年"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
|
||||
const data = reactive({
|
||||
const data = reactive({
|
||||
scrollLeft: 0,
|
||||
active_id: 0,
|
||||
active_ids: 0,
|
||||
|
|
@ -465,9 +461,9 @@ const data = reactive({
|
|||
isCombo: false,
|
||||
source: "uni_alipay_other",
|
||||
tradeCoupon: false
|
||||
})
|
||||
})
|
||||
|
||||
let {
|
||||
let {
|
||||
buttonText,
|
||||
selected,
|
||||
benefitList,
|
||||
|
|
@ -475,20 +471,20 @@ let {
|
|||
commentList,
|
||||
paymentMethod,
|
||||
source
|
||||
} = toRefs(data)
|
||||
} = toRefs(data)
|
||||
|
||||
/**
|
||||
/**
|
||||
* 返回监听
|
||||
*/
|
||||
onBackPress((e) => {
|
||||
onBackPress((e) => {
|
||||
if (e.from == 'backbutton' && data.appUser.vip == 1) {
|
||||
open()
|
||||
return true; //阻止返回
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
onLoad(async (option) => {
|
||||
onLoad(async (option) => {
|
||||
if (option.source) {
|
||||
data.source = option.source
|
||||
}
|
||||
|
|
@ -527,6 +523,12 @@ onLoad(async (option) => {
|
|||
item.url = item.url.replace('/static/image/recharge/',
|
||||
'/static/image/recharge/51/')
|
||||
})
|
||||
} else if (themeConfig?.theme == '0606') {
|
||||
data.banner = '/static/image/recharge/66/bannar.png'
|
||||
// data.benefitList.forEach(item => {
|
||||
// item.url = item.url.replace('/static/image/recharge/',
|
||||
// '/static/image/recharge/66/')
|
||||
// })
|
||||
}
|
||||
}
|
||||
let pages = getCurrentPages();
|
||||
|
|
@ -661,16 +663,16 @@ onLoad(async (option) => {
|
|||
})
|
||||
}
|
||||
|
||||
})
|
||||
})
|
||||
|
||||
onShow(() => {
|
||||
onShow(() => {
|
||||
if (data.isCombo) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否支付成功?',
|
||||
cancelText: '未支付',
|
||||
confirmText: "已支付",
|
||||
success: function (res) {
|
||||
success: function(res) {
|
||||
if (res.confirm) {
|
||||
console.log('用户点击确定');
|
||||
paymentResult(uni.getStorageSync('orderId'), paymentMethod.value)
|
||||
|
|
@ -681,11 +683,11 @@ onShow(() => {
|
|||
});
|
||||
data.isCombo = false
|
||||
}
|
||||
})
|
||||
onUnload(() => {
|
||||
})
|
||||
onUnload(() => {
|
||||
// uni.offNativeEventReceive()
|
||||
})
|
||||
onReady(() => {
|
||||
})
|
||||
onReady(() => {
|
||||
try {
|
||||
if (plus.os.name === 'Android') {
|
||||
let color = plus.android.newObject("android.graphics.Color");
|
||||
|
|
@ -700,7 +702,7 @@ onReady(() => {
|
|||
}
|
||||
})
|
||||
console.log("状态栏设置完毕!");
|
||||
setTimeout(function () {
|
||||
setTimeout(function() {
|
||||
uni.setNavigationBarColor({
|
||||
backgroundColor: '#fff',
|
||||
animation: { // 动画效果
|
||||
|
|
@ -709,18 +711,18 @@ onReady(() => {
|
|||
}
|
||||
})
|
||||
}, 200);
|
||||
setTimeout(function () {
|
||||
setTimeout(function() {
|
||||
plus.navigator.setStatusBarStyle("light");
|
||||
}, 200);
|
||||
}
|
||||
} catch (error) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
|
||||
function isToday(inputTime) {
|
||||
function isToday(inputTime) {
|
||||
// 获取当前日期的时间戳(去掉时分秒)
|
||||
const today = new Date();
|
||||
today.setHours(0, 0, 0, 0);
|
||||
|
|
@ -733,9 +735,9 @@ function isToday(inputTime) {
|
|||
|
||||
// 比较时间戳
|
||||
return inputTimestamp === todayTimestamp;
|
||||
}
|
||||
}
|
||||
|
||||
function calculateTimeRemaining(targetTime) {
|
||||
function calculateTimeRemaining(targetTime) {
|
||||
// 获取目标时间和当前时间的时间戳
|
||||
const target = new Date(targetTime).getTime();
|
||||
const now = new Date().getTime();
|
||||
|
|
@ -770,9 +772,9 @@ function calculateTimeRemaining(targetTime) {
|
|||
minutes: minutes,
|
||||
seconds: seconds
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
function activeClick(status) {
|
||||
function activeClick(status) {
|
||||
myCoupon.value.close()
|
||||
if (status && data.active_ids > 0) {
|
||||
let item = data.activeitems
|
||||
|
|
@ -789,14 +791,14 @@ function activeClick(status) {
|
|||
setPrice(true)
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function setActiveId(item) {
|
||||
function setActiveId(item) {
|
||||
data.active_ids = item.id
|
||||
data.activeitems = item
|
||||
}
|
||||
}
|
||||
|
||||
function setPrice(status) {
|
||||
function setPrice(status) {
|
||||
console.log("setPrice")
|
||||
if (data.incrementTimer) {
|
||||
clearInterval(data.incrementTimer);
|
||||
|
|
@ -878,9 +880,9 @@ function setPrice(status) {
|
|||
console.log("最后", data.price)
|
||||
|
||||
|
||||
}
|
||||
/* 获取我的优惠券 */
|
||||
async function getActivity() {
|
||||
}
|
||||
/* 获取我的优惠券 */
|
||||
async function getActivity() {
|
||||
let activity = await proxy.$requestPromise({
|
||||
url: 'api/activity/coupon',
|
||||
method: "GET",
|
||||
|
|
@ -912,9 +914,9 @@ async function getActivity() {
|
|||
]
|
||||
data.myActivity = deduplicateKeepLast(data.myActivity)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function deduplicateKeepLast(arr, idKey = 'id') {
|
||||
function deduplicateKeepLast(arr, idKey = 'id') {
|
||||
const map = new Map();
|
||||
|
||||
arr.forEach(item => {
|
||||
|
|
@ -923,10 +925,10 @@ function deduplicateKeepLast(arr, idKey = 'id') {
|
|||
});
|
||||
|
||||
return Array.from(map.values());
|
||||
}
|
||||
}
|
||||
|
||||
/* 领取优惠券 */
|
||||
async function submitActivity() {
|
||||
/* 领取优惠券 */
|
||||
async function submitActivity() {
|
||||
console.log("activity_id");
|
||||
let activity_id = ''
|
||||
data.activity.forEach(item => {
|
||||
|
|
@ -961,24 +963,24 @@ async function submitActivity() {
|
|||
})
|
||||
}
|
||||
|
||||
}
|
||||
/**
|
||||
}
|
||||
/**
|
||||
* @param {Object} item
|
||||
* @param {Object} index
|
||||
* 选择购买套餐
|
||||
*/
|
||||
|
||||
|
||||
/*
|
||||
防抖
|
||||
*/
|
||||
const debouncedOnSelect = debounce((items, index) => {
|
||||
/*
|
||||
防抖
|
||||
*/
|
||||
const debouncedOnSelect = debounce((items, index) => {
|
||||
onSelect(items, index);
|
||||
}, 200, false);
|
||||
}, 200, false);
|
||||
|
||||
function debounce(func, wait, immediate = true) {
|
||||
function debounce(func, wait, immediate = true) {
|
||||
let timeout;
|
||||
return function (...args) {
|
||||
return function(...args) {
|
||||
const later = () => {
|
||||
timeout = null;
|
||||
if (!immediate) func(...args);
|
||||
|
|
@ -990,8 +992,8 @@ function debounce(func, wait, immediate = true) {
|
|||
|
||||
if (callNow) func(...args);
|
||||
};
|
||||
}
|
||||
async function onSelect(items, index) {
|
||||
}
|
||||
async function onSelect(items, index) {
|
||||
data.active_id = 0
|
||||
data.activeCoupon = {}
|
||||
data.active_ids = 0
|
||||
|
|
@ -1064,8 +1066,7 @@ async function onSelect(items, index) {
|
|||
if (list.length != 0) {
|
||||
let listData = list.map(cell => {
|
||||
return {
|
||||
image: cell == 'weixin' ? '/static/image/recharge/wxpay.png' :
|
||||
'/static/image/recharge/alipay.png',
|
||||
image: cell == 'weixin' ? '/static/image/recharge/wxpay.png' : '/static/image/recharge/alipay.png',
|
||||
name: cell == 'weixin' ? '微信支付' : '支付宝支付',
|
||||
type: cell == 'weixin' ? 'wxpay' : 'alipay'
|
||||
}
|
||||
|
|
@ -1098,22 +1099,22 @@ async function onSelect(items, index) {
|
|||
]
|
||||
}
|
||||
paymentMethod.value = data.payList[0].type
|
||||
setTimeout(function () {
|
||||
setTimeout(function() {
|
||||
data.countdown = true
|
||||
}, 100);
|
||||
await setPrice(true)
|
||||
await getActivity()
|
||||
|
||||
}
|
||||
/**
|
||||
}
|
||||
/**
|
||||
* @param {Object} value
|
||||
* 选择支付方式
|
||||
*/
|
||||
function onSelectPayment(value) {
|
||||
function onSelectPayment(value) {
|
||||
paymentMethod.value = value
|
||||
}
|
||||
}
|
||||
|
||||
function open() {
|
||||
function open() {
|
||||
|
||||
uni.setStorageSync('back_number', data.back_number + 1);
|
||||
// 通过组件定义的ref调用uni-popup方法 ,如果传入参数 ,type 属性将失效 ,仅支持 ['top','left','bottom','right','center']
|
||||
|
|
@ -1143,12 +1144,12 @@ function open() {
|
|||
coupon.value.open()
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* 随机生成通知列表
|
||||
*/
|
||||
function generateNoticeList() {
|
||||
function generateNoticeList() {
|
||||
noticeList.value = []
|
||||
for (let i = 0; i <= 10; i++) {
|
||||
noticeList.value.push({
|
||||
|
|
@ -1157,11 +1158,11 @@ function generateNoticeList() {
|
|||
package: getRandomItem()
|
||||
})
|
||||
}
|
||||
}
|
||||
/**
|
||||
}
|
||||
/**
|
||||
* 下单拉取支付
|
||||
*/
|
||||
async function activateVip(type = '') {
|
||||
async function activateVip(type = '') {
|
||||
if (type == 'back') {
|
||||
proxy.$apiUserEvent('all', {
|
||||
type: "click",
|
||||
|
|
@ -1253,13 +1254,13 @@ async function activateVip(type = '') {
|
|||
uni.requestPayment({
|
||||
provider: paymentMethod.value,
|
||||
orderInfo: payData, //支付宝订单数据
|
||||
success: function (resss) {
|
||||
success: function(resss) {
|
||||
setTimeout(() => {
|
||||
uni.hideLoading();
|
||||
}, 30000);
|
||||
paymentResult(paymentRes.data.orderId, paymentMethod.value)
|
||||
},
|
||||
fail: function (err) {
|
||||
fail: function(err) {
|
||||
proxy.$apiUserEvent('all', {
|
||||
type: "event",
|
||||
key: "pay_fail",
|
||||
|
|
@ -1300,11 +1301,11 @@ async function activateVip(type = '') {
|
|||
setTimeout(() => {
|
||||
uni.hideLoading();
|
||||
}, 10000);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 支付状态轮询函数
|
||||
async function paymentResult(orderId, paytype) {
|
||||
// 支付状态轮询函数
|
||||
async function paymentResult(orderId, paytype) {
|
||||
uni.hideLoading();
|
||||
uni.showLoading({
|
||||
title: '会员发放排队中,正在实时向服务器索要,请耐心等待。',
|
||||
|
|
@ -1410,19 +1411,19 @@ async function paymentResult(orderId, paytype) {
|
|||
|
||||
// 开始轮询
|
||||
poll();
|
||||
}
|
||||
}
|
||||
|
||||
// 随机抽取一个元素
|
||||
function getRandomItem() {
|
||||
// 随机抽取一个元素
|
||||
function getRandomItem() {
|
||||
const list = ['月度会员', '季度会员', '年度会员'];
|
||||
const randomIndex = Math.floor(Math.random() * list.length);
|
||||
return list[randomIndex];
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* 随机生成时间提示语
|
||||
*/
|
||||
function generateNaturalTimeAgo() {
|
||||
function generateNaturalTimeAgo() {
|
||||
const weights = [{
|
||||
range: [1, 30],
|
||||
weight: 30,
|
||||
|
|
@ -1489,12 +1490,12 @@ function generateNaturalTimeAgo() {
|
|||
const amount = Math.floor(Math.random() * (max - min + 1)) + min;
|
||||
|
||||
return `${amount}${selected.unit}前`;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* 随机生成电话号码
|
||||
*/
|
||||
function generateMaskedPhoneNumber() {
|
||||
function generateMaskedPhoneNumber() {
|
||||
// 常见手机号段
|
||||
const prefixes = [
|
||||
'130', '131', '132', '133', '134', '135', '136', '137', '138', '139',
|
||||
|
|
@ -1517,13 +1518,13 @@ function generateMaskedPhoneNumber() {
|
|||
|
||||
// 对中间4位进行掩码处理:前3位 + **** + 后4位
|
||||
return fullNumber.replace(/(\d{3})(\d{4})(\d{4})/, '$1****$3');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
/**
|
||||
* 返回
|
||||
*/
|
||||
function back() {
|
||||
function back() {
|
||||
proxy.$apiUserEvent('all', {
|
||||
type: "click",
|
||||
key: "recharge_dialog_cancel",
|
||||
|
|
@ -1539,14 +1540,14 @@ function back() {
|
|||
}
|
||||
})
|
||||
uni.navigateBack();
|
||||
}
|
||||
}
|
||||
|
||||
function Complete() {
|
||||
function Complete() {
|
||||
data.coupon = false
|
||||
console.log("播放完成");
|
||||
}
|
||||
}
|
||||
|
||||
function shouldBeTrue(obj) {
|
||||
function shouldBeTrue(obj) {
|
||||
// 情况1: 没有 features 字段 → 返回 true
|
||||
if (!('features' in obj)) {
|
||||
return false;
|
||||
|
|
@ -1564,17 +1565,17 @@ function shouldBeTrue(obj) {
|
|||
|
||||
// 情况4: 有 features 字段且不包含 alipay → 返回 false
|
||||
return true;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
@import "@/common/main.css";
|
||||
@import "@/common/main.css";
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
* {
|
||||
* {
|
||||
box-sizing: content-box;
|
||||
}
|
||||
}
|
||||
|
||||
.couponBox {
|
||||
.couponBox {
|
||||
width: 375px;
|
||||
height: 450px;
|
||||
position: relative;
|
||||
|
|
@ -1685,18 +1686,18 @@ function shouldBeTrue(obj) {
|
|||
top: -145px;
|
||||
z-index: 3;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.couponButton {
|
||||
.couponButton {
|
||||
position: relative;
|
||||
margin-top: 37px;
|
||||
width: 305px;
|
||||
height: 86px;
|
||||
margin-left: calc(50% - 152.5px);
|
||||
z-index: 4 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.page-container {
|
||||
.page-container {
|
||||
background-color: #F7F7F7;
|
||||
padding-bottom: 240rpx;
|
||||
padding-bottom: calc(240rpx + constant(safe-area-inset-bottom)) !important;
|
||||
|
|
@ -1863,9 +1864,9 @@ function shouldBeTrue(obj) {
|
|||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes vertical-scroll {
|
||||
@keyframes vertical-scroll {
|
||||
from {
|
||||
transform: translateY(100%);
|
||||
}
|
||||
|
|
@ -1873,9 +1874,9 @@ function shouldBeTrue(obj) {
|
|||
to {
|
||||
transform: translateY(-100%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.footer-container {
|
||||
.footer-container {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
|
|
@ -1979,9 +1980,9 @@ function shouldBeTrue(obj) {
|
|||
width: 32%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-container {
|
||||
.dialog-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 80vw;
|
||||
|
|
@ -2106,16 +2107,16 @@ function shouldBeTrue(obj) {
|
|||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.back {
|
||||
.back {
|
||||
position: fixed;
|
||||
top: 100rpx;
|
||||
left: 36rpx;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.uni-margin-wrap::after {
|
||||
.uni-margin-wrap::after {
|
||||
// position: absolute;
|
||||
// content: '';
|
||||
// left: 0;
|
||||
|
|
@ -2124,9 +2125,9 @@ function shouldBeTrue(obj) {
|
|||
// height: 18px;
|
||||
// background-color: #f7f7f7;
|
||||
// border-radius: 16px 16px 0px 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.uni-margin-wrap {
|
||||
.uni-margin-wrap {
|
||||
// position: relative;
|
||||
height: auto;
|
||||
width: 100%;
|
||||
|
|
@ -2180,11 +2181,11 @@ function shouldBeTrue(obj) {
|
|||
padding: 0 100rpx;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.placeholder {
|
||||
.placeholder {
|
||||
// display: none;
|
||||
// position: relative;
|
||||
// background-color: #f7f7f7;
|
||||
|
|
@ -2192,20 +2193,20 @@ function shouldBeTrue(obj) {
|
|||
// border-radius: 1rem 1rem 0 0;
|
||||
// left: 0;
|
||||
// bottom: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
/* 由小到大缩放动画 */
|
||||
.animated-box {
|
||||
/* 由小到大缩放动画 */
|
||||
.animated-box {
|
||||
animation: scaleIn 1s ease-out forwards;
|
||||
}
|
||||
}
|
||||
|
||||
/* 延迟动画 */
|
||||
.scale-in-delay {
|
||||
/* 延迟动画 */
|
||||
.scale-in-delay {
|
||||
animation: scaleIn 0.5s ease-out 0.2s forwards;
|
||||
}
|
||||
}
|
||||
|
||||
/* 动画关键帧定义 */
|
||||
@keyframes scaleIn {
|
||||
/* 动画关键帧定义 */
|
||||
@keyframes scaleIn {
|
||||
0% {
|
||||
transform: scale(0);
|
||||
opacity: 0;
|
||||
|
|
@ -2219,17 +2220,17 @@ function shouldBeTrue(obj) {
|
|||
transform: scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.iosQuestion {
|
||||
.iosQuestion {
|
||||
.titleBox {
|
||||
.image {
|
||||
margin-top: 3px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.question {
|
||||
.question {
|
||||
margin: 20rpx 32rpx;
|
||||
padding: 17px 13px;
|
||||
background-color: #FFFFFF;
|
||||
|
|
@ -2266,9 +2267,9 @@ function shouldBeTrue(obj) {
|
|||
color: #AAAAAA;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.myCouponList {
|
||||
.myCouponList {
|
||||
margin: 20rpx 32rpx;
|
||||
padding: 17px 13px;
|
||||
height: 18px;
|
||||
|
|
@ -2335,9 +2336,9 @@ function shouldBeTrue(obj) {
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.myCouponContainer {
|
||||
.myCouponContainer {
|
||||
width: calc(100% - 52px);
|
||||
height: 400px;
|
||||
background-image: url('/static/image/recharge/myCouponContainerBg.png');
|
||||
|
|
@ -2475,16 +2476,16 @@ function shouldBeTrue(obj) {
|
|||
color: #fff;
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.white-flow {
|
||||
.white-flow {
|
||||
background: linear-gradient(-45deg, transparent, transparent, transparent, transparent, transparent, transparent, transparent, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2), transparent, transparent, transparent, transparent, transparent, transparent, transparent);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 60% 100%;
|
||||
animation: flow 2s infinite linear;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes flow {
|
||||
@keyframes flow {
|
||||
0% {
|
||||
background-position: -100% 0;
|
||||
}
|
||||
|
|
@ -2492,29 +2493,29 @@ function shouldBeTrue(obj) {
|
|||
100% {
|
||||
background-position: 200% 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .uni-countdown-day {
|
||||
::v-deep .uni-countdown-day {
|
||||
width: auto !important;
|
||||
color: #2A2617 !important;
|
||||
/* 例如,将文字颜色改为红色 */
|
||||
background-color: transparent !important;
|
||||
margin-right: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .uni-countdown-splitor-day {
|
||||
::v-deep .uni-countdown-splitor-day {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.yanhua {
|
||||
.yanhua {
|
||||
position: fixed;
|
||||
top: 170px;
|
||||
left: 15px;
|
||||
z-index: 999999;
|
||||
}
|
||||
}
|
||||
|
||||
.vipContent {
|
||||
.vipContent {
|
||||
background-color: #fff;
|
||||
margin-left: 16px;
|
||||
width: calc(100% - 32px);
|
||||
|
|
@ -2554,14 +2555,14 @@ function shouldBeTrue(obj) {
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@font-face {
|
||||
@font-face {
|
||||
font-family: 'AlipayNumber'; //字体名称
|
||||
src: url('/static/font/AlipayNumber.ttf');
|
||||
}
|
||||
}
|
||||
|
||||
.wx-font-regular {
|
||||
.wx-font-regular {
|
||||
font-family: 'AlipayNumber' !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -7,17 +7,20 @@
|
|||
</liu-drag-button>
|
||||
</view>
|
||||
<view class="flexcontainer">
|
||||
|
||||
<view class="group_48184" @click="openEditDialog">
|
||||
<view :style="{height:$systemInfo.statusBarHeight*2+96+'rpx'}" style="position: relative;width: 100%;">
|
||||
|
||||
</view>
|
||||
<view class="header">
|
||||
<view class="headerBox">
|
||||
<view :style="{height:$systemInfo.statusBarHeight*2+'rpx'}" style="position: relative;width: 100%;">
|
||||
|
||||
</view>
|
||||
<view class="header" >
|
||||
<image @click="back" src="/static/image/nav-bar/back-black.png" mode=""></image>
|
||||
<text class="text_1">借记卡详情</text>
|
||||
<text class="imgXl"></text>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="rectangle_23309">
|
||||
<view class="flexcontainer_1">
|
||||
<image class="group_13998" src="/static/image/other/bank/nyyh/eyes.png" />
|
||||
|
|
@ -141,11 +144,13 @@
|
|||
</view>
|
||||
<view class="formItem">
|
||||
<text>可用余额</text>
|
||||
<input :value="editDialog.data.availableBalance" @input="(e) => onNumberInput('availableBalance', e.detail.value)" placeholder="如: 0.00" />
|
||||
<input :value="editDialog.data.availableBalance"
|
||||
@input="(e) => onNumberInput('availableBalance', e.detail.value)" placeholder="如: 0.00" />
|
||||
</view>
|
||||
<view class="formItem">
|
||||
<text>账户余额</text>
|
||||
<input :value="editDialog.data.accountBalance" @input="(e) => onNumberInput('accountBalance', e.detail.value)" placeholder="如: 0.00" />
|
||||
<input :value="editDialog.data.accountBalance"
|
||||
@input="(e) => onNumberInput('accountBalance', e.detail.value)" placeholder="如: 0.00" />
|
||||
</view>
|
||||
<view class="formItem">
|
||||
<text>钞汇标志</text>
|
||||
|
|
@ -170,11 +175,14 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, onMounted } from 'vue';
|
||||
import {
|
||||
reactive,
|
||||
onMounted
|
||||
} from 'vue';
|
||||
|
||||
const CACHE_KEY = 'nyyh_account_info';
|
||||
const CACHE_KEY = 'nyyh_account_info';
|
||||
|
||||
const data = reactive({
|
||||
const data = reactive({
|
||||
form: {
|
||||
cardNumberPrefix: '6216',
|
||||
cardNumberSuffix: '2173',
|
||||
|
|
@ -191,45 +199,51 @@ const data = reactive({
|
|||
interestRate: '0.05000%',
|
||||
openDate: '2026/12/02',
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
const editDialog = reactive({
|
||||
const editDialog = reactive({
|
||||
show: false,
|
||||
data: {}
|
||||
});
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
onMounted(() => {
|
||||
loadCache();
|
||||
});
|
||||
});
|
||||
|
||||
function loadCache() {
|
||||
function loadCache() {
|
||||
const cache = uni.getStorageSync(CACHE_KEY);
|
||||
if (cache) {
|
||||
data.form = { ...data.form, ...cache };
|
||||
data.form = {
|
||||
...data.form,
|
||||
...cache
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function saveCache() {
|
||||
function saveCache() {
|
||||
uni.setStorageSync(CACHE_KEY, data.form);
|
||||
}
|
||||
}
|
||||
|
||||
function openEditDialog() {
|
||||
function openEditDialog() {
|
||||
editDialog.data = JSON.parse(JSON.stringify(data.form));
|
||||
editDialog.show = true;
|
||||
}
|
||||
}
|
||||
|
||||
function saveEdit() {
|
||||
data.form = { ...data.form, ...editDialog.data };
|
||||
function saveEdit() {
|
||||
data.form = {
|
||||
...data.form,
|
||||
...editDialog.data
|
||||
};
|
||||
saveCache();
|
||||
editDialog.show = false;
|
||||
uni.showToast({
|
||||
title: '保存成功',
|
||||
icon: 'success'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 格式化数字,保留两位小数并添加千分位逗号
|
||||
function formatNumber(num) {
|
||||
// 格式化数字,保留两位小数并添加千分位逗号
|
||||
function formatNumber(num) {
|
||||
if (!num && num !== 0) return '';
|
||||
let cleanNum = String(num).replace(/[^\d.]/g, '');
|
||||
const parts = cleanNum.split('.');
|
||||
|
|
@ -243,79 +257,79 @@ function formatNumber(num) {
|
|||
minimumFractionDigits: 2,
|
||||
maximumFractionDigits: 2
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 处理输入事件
|
||||
function onNumberInput(field, value) {
|
||||
// 处理输入事件
|
||||
function onNumberInput(field, value) {
|
||||
editDialog.data[field] = formatNumber(value);
|
||||
}
|
||||
}
|
||||
|
||||
function back(){
|
||||
function back() {
|
||||
uni.navigateBack()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
$color-text-primary: #1a1a1a;
|
||||
$color-text-secondary: #767676;
|
||||
$color-text-muted: #999999;
|
||||
$color-text-btn: #6a6a6a;
|
||||
$color-accent: #08c1a2;
|
||||
$color-gold: #dda94f;
|
||||
$color-bg: #f7f7f7;
|
||||
$color-white: #ffffff;
|
||||
$color-border: #e6e6e6;
|
||||
$color-text-primary: #1a1a1a;
|
||||
$color-text-secondary: #767676;
|
||||
$color-text-muted: #999999;
|
||||
$color-text-btn: #6a6a6a;
|
||||
$color-accent: #08c1a2;
|
||||
$color-gold: #dda94f;
|
||||
$color-bg: #f7f7f7;
|
||||
$color-white: #ffffff;
|
||||
$color-border: #e6e6e6;
|
||||
|
||||
.flex-row {
|
||||
.flex-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
}
|
||||
|
||||
.flex-col {
|
||||
.flex-col {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
||||
.justify-start {
|
||||
.justify-start {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
.justify-center {
|
||||
.justify-center {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
.justify-end {
|
||||
.justify-end {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
.justify-between {
|
||||
.justify-between {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
|
||||
.items-start {
|
||||
.items-start {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
.items-end {
|
||||
.items-end {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
.items-center {
|
||||
.items-center {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.no-shrink {
|
||||
.no-shrink {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.div {
|
||||
.div {
|
||||
position: relative;
|
||||
width: 750rpx;
|
||||
min-height: 1624rpx;
|
||||
|
|
@ -722,6 +736,7 @@ $color-border: #e6e6e6;
|
|||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
text {
|
||||
position: relative;
|
||||
font-size: 26rpx;
|
||||
|
|
@ -1073,10 +1088,10 @@ $color-border: #e6e6e6;
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 编辑弹窗样式 */
|
||||
.editDialog {
|
||||
/* 编辑弹窗样式 */
|
||||
.editDialog {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
|
@ -1087,9 +1102,9 @@ $color-border: #e6e6e6;
|
|||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 9999;
|
||||
}
|
||||
}
|
||||
|
||||
.editDialog_bg {
|
||||
.editDialog_bg {
|
||||
width: 680rpx;
|
||||
max-height: 80vh;
|
||||
background-color: #ffffff;
|
||||
|
|
@ -1097,9 +1112,9 @@ $color-border: #e6e6e6;
|
|||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
||||
.editDialog_header {
|
||||
.editDialog_header {
|
||||
padding: 30rpx;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
text-align: center;
|
||||
|
|
@ -1109,15 +1124,15 @@ $color-border: #e6e6e6;
|
|||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.editDialog_body {
|
||||
.editDialog_body {
|
||||
padding: 20rpx 30rpx;
|
||||
overflow-y: auto;
|
||||
max-height: 60vh;
|
||||
}
|
||||
}
|
||||
|
||||
.formItem {
|
||||
.formItem {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20rpx 0;
|
||||
|
|
@ -1136,9 +1151,9 @@ $color-border: #e6e6e6;
|
|||
color: #333;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.popup-footer {
|
||||
.popup-footer {
|
||||
display: flex;
|
||||
padding: 20rpx 30rpx;
|
||||
border-top: 1rpx solid #eee;
|
||||
|
|
@ -1163,24 +1178,29 @@ $color-border: #e6e6e6;
|
|||
background-color: #187AFF;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.headerBox{
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 750rpx;
|
||||
}
|
||||
.header{
|
||||
.header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 750rpx;
|
||||
height: 96rpx;
|
||||
justify-content: space-between;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
image{
|
||||
|
||||
image {
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
margin-left: 18rpx;
|
||||
}
|
||||
.imgXl{
|
||||
|
||||
.imgXl {
|
||||
width: 48rpx;
|
||||
margin-right: 18rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -23,7 +23,7 @@
|
|||
<image class="group_13980" src="/static/image/other/bank/zsyh/kf.png" mode="aspectFit" />
|
||||
<view class="flexcontainer_4">
|
||||
<view class="group_48144">
|
||||
<text class="text_6">20</text>
|
||||
20
|
||||
</view>
|
||||
<image class="group_13979" src="/static/image/other/bank/zsyh/more.png" mode="aspectFit" />
|
||||
</view>
|
||||
|
|
@ -1100,14 +1100,20 @@
|
|||
margin-left: 12rpx;
|
||||
border-radius: 100rpx;
|
||||
background: #ff5d5f;
|
||||
margin-bottom: -2px;
|
||||
margin-top: 4px;
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
line-height: 36rpx;
|
||||
color: #ffffff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.text_6 {
|
||||
display: block;
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
line-height: 30rpx;
|
||||
color: #ffffff;
|
||||
|
||||
}
|
||||
|
||||
.group_13979 {
|
||||
|
|
|
|||
|
After Width: | Height: | Size: 776 KiB |
|
After Width: | Height: | Size: 8.6 KiB |
|
After Width: | Height: | Size: 7.4 KiB |
|
After Width: | Height: | Size: 6.4 KiB |
|
After Width: | Height: | Size: 6.3 KiB |
|
After Width: | Height: | Size: 8.8 KiB |
|
After Width: | Height: | Size: 8.2 KiB |
|
After Width: | Height: | Size: 5.7 KiB |
|
After Width: | Height: | Size: 8.5 KiB |
|
After Width: | Height: | Size: 7.6 KiB |
|
After Width: | Height: | Size: 7.2 KiB |
|
After Width: | Height: | Size: 6.5 KiB |
|
After Width: | Height: | Size: 7.3 KiB |
|
After Width: | Height: | Size: 6.3 KiB |
|
After Width: | Height: | Size: 9.7 KiB |
|
After Width: | Height: | Size: 6.1 KiB |