通话和银行卡优化
This commit is contained in:
小李
parent
a47cc2a9cd
commit
0616283418
|
|
@ -16,7 +16,7 @@
|
|||
, 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"
|
||||
style="width:100%;position: absolute;bottom: 0;left: 0;z-index:0;" :style="{height:data.headerHeight+'rpx'}"></image>
|
||||
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()">
|
||||
<image @click.stop="back()" class="group_48089" src="/static/image/call/detail/iosBack.png" :style="{position: 'fixed',
|
||||
|
|
@ -30,7 +30,7 @@
|
|||
:style="{opacity:data.info.avatar?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.textScale}) translateY(${data.text2Y}px)`}">{{data.info.name||formatString(data.info.phone)}} </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>
|
||||
|
||||
<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})`}">
|
||||
|
|
@ -768,6 +768,7 @@
|
|||
data.index = Number(option.index)
|
||||
let listArr = uni.getStorageSync('callLog')
|
||||
data.info = listArr[data.index]
|
||||
data.info.avatar='/static/logo.png'
|
||||
data.list = data.info.list || data.list
|
||||
console.log(data.info)
|
||||
data.headerHeight=data.info.avatar?519:325
|
||||
|
|
@ -783,9 +784,9 @@
|
|||
const y = e.scrollTop;
|
||||
const max = 200;
|
||||
let p = Math.min(y / max, 1);
|
||||
data.contentY = -p * 90;
|
||||
data.contentY = -p * (data.info.avatar?70:90);
|
||||
data.avatarY = -p * 0;
|
||||
data.text2Y = -p * 130;
|
||||
data.text2Y = -p * (data.info.avatar?70:130);
|
||||
data.avatarScale = 1 - p * 0.55; // 1 → 0.6 textScale
|
||||
data.textScale = 1 - p * 0.5; // 1 → 0.6
|
||||
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
<view class="group_45764" v-if="!selectedImage" :style="{'padding-top':$systemInfo.statusBarHeight+'px'}">
|
||||
<view class="rectangle_23284">
|
||||
<view class="flexcontainer">
|
||||
<view class="group_8">
|
||||
<view class="group_8" @click="back">
|
||||
<image class="frame" src="/static/image/other/bank/gsyh/back.png" />
|
||||
</view>
|
||||
<view class="group_7">
|
||||
|
|
@ -40,7 +40,8 @@
|
|||
<text class="text_2">{{data.form.cardType}}</text>
|
||||
<view class="text_3">
|
||||
{{maskCardNumber(data.form.cardNumber)}}
|
||||
<text style="color:#3E82BD;margin-left: 52rpx;" @click="data.isShow=true">查看</text>
|
||||
<view
|
||||
style="color:#3E82BD;margin-left: 52rpx;text-align: center;font-size: 22rpx; width: 52rpx;height: 32rpx;background: #F3F6FB;border-radius: 2px 2px 2px 2px;" @click="data.isShow=true">查看</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -381,7 +382,9 @@ onMounted(() => {
|
|||
}
|
||||
// #endif
|
||||
});
|
||||
|
||||
function back(){
|
||||
uni.navigateBack()
|
||||
}
|
||||
function loadCache() {
|
||||
const cache = uni.getStorageSync(CACHE_KEY);
|
||||
if (cache) {
|
||||
|
|
@ -758,6 +761,7 @@ function onNumberInput(field, value) {
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-left: 22rpx;
|
||||
width: calc(100% - 130rpx);
|
||||
}
|
||||
|
||||
.text_2 {
|
||||
|
|
@ -768,6 +772,8 @@ function onNumberInput(field, value) {
|
|||
.text_3 {
|
||||
font-size: 26rpx;
|
||||
color: #333333;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.group_48162 {
|
||||
|
|
|
|||
|
|
@ -6,10 +6,13 @@
|
|||
<c-lottie ref="cLottieRef" :src='$watermark()' width="94px" height='74px' :loop="true"></c-lottie>
|
||||
</liu-drag-button>
|
||||
</view>
|
||||
<view class="group_45764" >
|
||||
<view class="flexcontainer_1" :style="{'padding-top':$systemInfo.statusBarHeight+'px','backgroundColor':data.navbar.bgColor}">
|
||||
<view class="group_45764">
|
||||
<!-- ,'backgroundColor':data.navbar.bgColor -->
|
||||
<view class="flexcontainer_box" v-if="!selectedImage">
|
||||
<view :style="{'height':$systemInfo.statusBarHeight+'px','width':'100%'}"></view>
|
||||
<view class="flexcontainer_1">
|
||||
<view class="group_8">
|
||||
<view class="rectangle_18503">
|
||||
<view class="rectangle_18503" @click="back">
|
||||
<image class="frame" src="/static/image/other/bank/jsyh/back.png" />
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -21,6 +24,7 @@
|
|||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="" :style="{height:$systemInfo.statusBarHeight*2+96+'rpx'}">
|
||||
|
||||
</view>
|
||||
|
|
@ -33,25 +37,34 @@
|
|||
</view>
|
||||
</view>
|
||||
<view class="flexcontainer_3">
|
||||
<text class="text_2"> {{data.form.bankName}}（{{data.form.cardNumber.substring(data.form.cardNumber.length-4)}}） </text>
|
||||
<text class="text_2">
|
||||
{{data.form.bankName}}（{{data.form.cardNumber.substring(data.form.cardNumber.length-4)}}） </text>
|
||||
<view class="flexcontainer_4">
|
||||
<image class="group_13982" src="/static/image/other/bank/jsyh/editor.png" />
|
||||
<image class="group_48197" src="/static/image/other/bank/jsyh/zc.png" /><text class="text_3"> 修改别名 </text>
|
||||
<!-- <image class="group_48197" src="/static/image/other/bank/jsyh/zc.png" /> -->
|
||||
<view class="group_48197">
|
||||
正常
|
||||
</view>
|
||||
<text class="text_3"> 修改别名
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
<text class="text_4" @click.stop="data.isShow=true"> 查看卡号 </text>
|
||||
</view>
|
||||
<text class="text_5"> 卡片类型：{{data.form.cardType}} </text><text class="text_6"> 账户类别：{{data.form.accountType}} </text>
|
||||
<text class="text_5"> 卡片类型：{{data.form.cardType}} </text><text class="text_6"> 账户类别：{{data.form.accountType}}
|
||||
</text>
|
||||
<view class="flexcontainer_5">
|
||||
<view class="flexcontainer_6"><text class="text_7"> 到期日期：{{data.form.expiryDate}} </text><text class="text_8"> 开户网点：{{data.form.branchName}} </text></view>
|
||||
<view class="flexcontainer_6"><text class="text_7"> 到期日期：{{data.form.expiryDate}} </text><text
|
||||
class="text_8"> 开户网点：{{data.form.branchName}} </text></view>
|
||||
<image class="group_48196" src="/static/image/other/bank/jsyh/code.png" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<NavBar v-if="selectedImage" title="拼图" bgColor="#EFEFEF" noBack @back="closeImageEdit" isRightButton @right-click="confirmImage">
|
||||
<NavBar v-if="selectedImage" title="拼图" bgColor="#EFEFEF" noBack @back="closeImageEdit" isRightButton
|
||||
@right-click="confirmImage">
|
||||
</NavBar>
|
||||
<view class="group_48190" >
|
||||
<view class="group_48190">
|
||||
<view class="rectangle_23318">
|
||||
<image class="group_13999" src="/static/image/other/bank/jsyh/rightIcon.png" />
|
||||
<image class="frame_1" src="/static/image/other/bank/jsyh/wx.png" />
|
||||
|
|
@ -59,7 +72,7 @@
|
|||
<text class="text_9"> 快捷支付 </text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="group_48191" @click="openEditDialog" >
|
||||
<view class="group_48191" @click="openEditDialog">
|
||||
<view class="rectangle_23317">
|
||||
<view class="rectangle_23316">
|
||||
<text class="text_10"> {{data.form.accountCategory}} </text>
|
||||
|
|
@ -75,25 +88,25 @@
|
|||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="group_48192" @click="openEditDialog" >
|
||||
<view class="group_48192" @click="openEditDialog">
|
||||
<view class="rectangle_23319">
|
||||
<text class="text_14"> 出入金剩余额度 </text>
|
||||
<view class="flexcontainer_8">
|
||||
<image
|
||||
class="group_48193"
|
||||
src="/static/image/other/bank/jsyh/gth.png" /><text class="text_15"> (含非绑定账户转账、现金存取、消费缴费) </text>
|
||||
<image class="group_48193" src="/static/image/other/bank/jsyh/gth.png" /><text class="text_15">
|
||||
(含非绑定账户转账、现金存取、消费缴费) </text>
|
||||
</view>
|
||||
<view class="flexcontainer_9">
|
||||
<text class="text_16"> 日出金: </text><text class="text_17"> 日入金: </text><text class="text_18"> ¥ {{data.form.dayOut}} </text><text class="text_19"> ¥ {{data.form.dayIn}} </text>
|
||||
<text class="text_16"> 日出金: </text><text class="text_17"> 日入金: </text><text class="text_18"> ¥
|
||||
{{data.form.dayOut}} </text><text class="text_19"> ¥ {{data.form.dayIn}} </text>
|
||||
</view>
|
||||
<view class="flexcontainer_10">
|
||||
<text class="text_20"> 年出金: </text><text class="text_21"> 年入金: </text><text class="text_22"> ¥ {{data.form.yearOut}} </text><text class="text_23"> ¥ {{data.form.yearIn}} </text>
|
||||
<text class="text_20"> 年出金: </text><text class="text_21"> 年入金: </text><text class="text_22"> ¥
|
||||
{{data.form.yearOut}} </text><text class="text_23"> ¥ {{data.form.yearIn}} </text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="!selectedImage" class="image-box" @touchstart="handleTouchStart" @touchend="handleTouchEnd">
|
||||
<image
|
||||
class="div_8a4931ca0f8a124896aa57f966f7f1cf"
|
||||
<image class="div_8a4931ca0f8a124896aa57f966f7f1cf"
|
||||
:src="data.footerImage || '/static/image/other/bank/jsyh/footerImg.png'" mode="aspectFill" />
|
||||
</view>
|
||||
<view v-else class="scroll-image-box flex-1">
|
||||
|
|
@ -174,23 +187,28 @@
|
|||
</view>
|
||||
<view class="formItem">
|
||||
<text>可用余额</text>
|
||||
<input :value="editDialog.data.balance" @input="(e) => onNumberInput('balance', e.detail.value)" placeholder="如: 2.71" />
|
||||
<input :value="editDialog.data.balance" @input="(e) => onNumberInput('balance', e.detail.value)"
|
||||
placeholder="如: 2.71" />
|
||||
</view>
|
||||
<view class="formItem">
|
||||
<text>日出金额度</text>
|
||||
<input :value="editDialog.data.dayOut" @input="(e) => onNumberInput('dayOut', e.detail.value)" placeholder="如: 50,000.00" />
|
||||
<input :value="editDialog.data.dayOut" @input="(e) => onNumberInput('dayOut', e.detail.value)"
|
||||
placeholder="如: 50,000.00" />
|
||||
</view>
|
||||
<view class="formItem">
|
||||
<text>日入金额度</text>
|
||||
<input :value="editDialog.data.dayIn" @input="(e) => onNumberInput('dayIn', e.detail.value)" placeholder="如: 50,000.00" />
|
||||
<input :value="editDialog.data.dayIn" @input="(e) => onNumberInput('dayIn', e.detail.value)"
|
||||
placeholder="如: 50,000.00" />
|
||||
</view>
|
||||
<view class="formItem">
|
||||
<text>年出金额度</text>
|
||||
<input :value="editDialog.data.yearOut" @input="(e) => onNumberInput('yearOut', e.detail.value)" placeholder="如: 200,000.00" />
|
||||
<input :value="editDialog.data.yearOut" @input="(e) => onNumberInput('yearOut', e.detail.value)"
|
||||
placeholder="如: 200,000.00" />
|
||||
</view>
|
||||
<view class="formItem">
|
||||
<text>年入金额度</text>
|
||||
<input :value="editDialog.data.yearIn" @input="(e) => onNumberInput('yearIn', e.detail.value)" placeholder="如: 200,000.00" />
|
||||
<input :value="editDialog.data.yearIn" @input="(e) => onNumberInput('yearIn', e.detail.value)"
|
||||
placeholder="如: 200,000.00" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="popup-footer">
|
||||
|
|
@ -202,7 +220,12 @@
|
|||
</view>
|
||||
</template>
|
||||
<script setup>
|
||||
import { reactive, onMounted, ref, getCurrentInstance } from 'vue';
|
||||
import {
|
||||
reactive,
|
||||
onMounted,
|
||||
ref,
|
||||
getCurrentInstance
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad,
|
||||
onShow,
|
||||
|
|
@ -210,14 +233,14 @@ import { reactive, onMounted, ref, getCurrentInstance } from 'vue';
|
|||
|
||||
onPageScroll
|
||||
} from "@dcloudio/uni-app";
|
||||
const CACHE_KEY = 'jsyh_account_info';
|
||||
const FOOTER_IMAGE_KEY = 'jsyh_footer_image';
|
||||
const CACHE_KEY = 'jsyh_account_info';
|
||||
const FOOTER_IMAGE_KEY = 'jsyh_footer_image';
|
||||
|
||||
const instance = getCurrentInstance();
|
||||
const instance = getCurrentInstance();
|
||||
|
||||
const data = reactive({
|
||||
navbar:{
|
||||
bgColor : 'rgba(0,0,0,0)'
|
||||
const data = reactive({
|
||||
navbar: {
|
||||
bgColor: 'rgba(0,0,0,0)'
|
||||
},
|
||||
form: {
|
||||
bankName: '建设银行',
|
||||
|
|
@ -237,16 +260,16 @@ const data = reactive({
|
|||
footerImage: '',
|
||||
showMask: false,
|
||||
isShow: false,
|
||||
});
|
||||
});
|
||||
|
||||
const selectedImage = ref('');
|
||||
const scrollTop = ref(0);
|
||||
let longPressTimer = null;
|
||||
const selectedImage = ref('');
|
||||
const scrollTop = ref(0);
|
||||
let longPressTimer = null;
|
||||
|
||||
const editDialog = reactive({
|
||||
const editDialog = reactive({
|
||||
show: false,
|
||||
data: {}
|
||||
});
|
||||
});
|
||||
onPageScroll((e) => {
|
||||
if (e.scrollTop > 45) {
|
||||
data.navbar.bgColor = '#2d60d5'
|
||||
|
|
@ -255,43 +278,49 @@ const editDialog = reactive({
|
|||
}
|
||||
|
||||
})
|
||||
onMounted(() => {
|
||||
onMounted(() => {
|
||||
loadCache();
|
||||
// 加载保存的footer图片
|
||||
const savedFooter = uni.getStorageSync(FOOTER_IMAGE_KEY);
|
||||
if (savedFooter) {
|
||||
data.footerImage = savedFooter;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
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'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 长按事件处理
|
||||
const handleTouchStart = (e) => {
|
||||
// 长按事件处理
|
||||
const handleTouchStart = (e) => {
|
||||
// 兼容iOS上滑HOME条
|
||||
const systemInfo = uni.getSystemInfoSync();
|
||||
if (systemInfo.platform === 'ios' && systemInfo.safeAreaInsets?.bottom) {
|
||||
|
|
@ -306,17 +335,17 @@ const handleTouchStart = (e) => {
|
|||
uni.vibrateShort();
|
||||
chooseImage();
|
||||
}, 1200);
|
||||
};
|
||||
};
|
||||
|
||||
const handleTouchEnd = () => {
|
||||
const handleTouchEnd = () => {
|
||||
if (longPressTimer) {
|
||||
clearTimeout(longPressTimer);
|
||||
longPressTimer = null;
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
// 选择图片
|
||||
const chooseImage = () => {
|
||||
// 选择图片
|
||||
const chooseImage = () => {
|
||||
uni.chooseImage({
|
||||
count: 1,
|
||||
sourceType: ['album'],
|
||||
|
|
@ -325,20 +354,20 @@ const chooseImage = () => {
|
|||
data.showMask = true;
|
||||
}
|
||||
});
|
||||
};
|
||||
};
|
||||
|
||||
// 关闭蒙层
|
||||
const closeMask = () => {
|
||||
// 关闭蒙层
|
||||
const closeMask = () => {
|
||||
data.showMask = false;
|
||||
};
|
||||
};
|
||||
|
||||
// 图片滚动监听
|
||||
const onImageScroll = (e) => {
|
||||
// 图片滚动监听
|
||||
const onImageScroll = (e) => {
|
||||
scrollTop.value = e.detail.scrollTop;
|
||||
};
|
||||
};
|
||||
|
||||
// 确认裁剪
|
||||
const confirmImage = () => {
|
||||
// 确认裁剪
|
||||
const confirmImage = () => {
|
||||
uni.showLoading({
|
||||
title: '处理中...'
|
||||
});
|
||||
|
|
@ -434,15 +463,15 @@ const confirmImage = () => {
|
|||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
};
|
||||
|
||||
// 关闭图片编辑
|
||||
const closeImageEdit = () => {
|
||||
// 关闭图片编辑
|
||||
const closeImageEdit = () => {
|
||||
selectedImage.value = '';
|
||||
};
|
||||
};
|
||||
|
||||
// 格式化数字，保留两位小数并添加千分位逗号
|
||||
function formatNumber(num) {
|
||||
// 格式化数字，保留两位小数并添加千分位逗号
|
||||
function formatNumber(num) {
|
||||
if (!num && num !== 0) return '';
|
||||
let cleanNum = String(num).replace(/[^\d.]/g, '');
|
||||
const parts = cleanNum.split('.');
|
||||
|
|
@ -456,20 +485,20 @@ function formatNumber(num) {
|
|||
minimumFractionDigits: 2,
|
||||
maximumFractionDigits: 2
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 处理输入事件
|
||||
function onNumberInput(field, value) {
|
||||
// 处理输入事件
|
||||
function onNumberInput(field, value) {
|
||||
editDialog.data[field] = formatNumber(value);
|
||||
}
|
||||
}
|
||||
|
||||
// 每四位添加空格
|
||||
function addSpaceEveryFourChars(str) {
|
||||
// 每四位添加空格
|
||||
function addSpaceEveryFourChars(str) {
|
||||
return str.replace(/(.{4})/g, '$1 ').trim();
|
||||
}
|
||||
}
|
||||
|
||||
// 复制卡号
|
||||
function copyCardNumber() {
|
||||
// 复制卡号
|
||||
function copyCardNumber() {
|
||||
uni.setClipboardData({
|
||||
data: data.form.cardNumber,
|
||||
success: () => {
|
||||
|
|
@ -480,65 +509,69 @@ function copyCardNumber() {
|
|||
data.isShow = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function back() {
|
||||
uni.navigateBack()
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
* {
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
|
||||
.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: 1862rpx;
|
||||
|
|
@ -563,29 +596,28 @@ function copyCardNumber() {
|
|||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
z-index: 5;
|
||||
margin-top: 46rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 图片编辑样式 */
|
||||
.image-box {
|
||||
/* 图片编辑样式 */
|
||||
.image-box {
|
||||
width: 750rpx;
|
||||
height: 460rpx;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-image-box {
|
||||
.scroll-image-box {
|
||||
width: 100%;
|
||||
min-height: 0;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
|
||||
.crop-image-target {
|
||||
.crop-image-target {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.dashed-line-box {
|
||||
.dashed-line-box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
|
|
@ -609,9 +641,9 @@ function copyCardNumber() {
|
|||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mask {
|
||||
.mask {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
|
@ -628,10 +660,10 @@ function copyCardNumber() {
|
|||
width: 360rpx;
|
||||
height: 360rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 组 45764 */
|
||||
.group_45764 {
|
||||
/* 组 45764 */
|
||||
.group_45764 {
|
||||
width: 750rpx;
|
||||
// height: 658rpx;
|
||||
padding-bottom: 70rpx;
|
||||
|
|
@ -642,9 +674,10 @@ function copyCardNumber() {
|
|||
z-index: 0;
|
||||
margin-top: 0;
|
||||
margin-left: 0;
|
||||
background-image: url(/static/image/other/bank/jsyh/headerBg.png);
|
||||
background-size: 100% 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url(/static/image/other/bank/jsyh/headerBg.png);
|
||||
background-size: 100% 100%;
|
||||
background-repeat: no-repeat;
|
||||
|
||||
.rectangle_23313 {
|
||||
position: relative;
|
||||
width: 750rpx;
|
||||
|
|
@ -709,18 +742,25 @@ background-repeat: no-repeat;
|
|||
}
|
||||
}
|
||||
|
||||
.flexcontainer_1 {
|
||||
.flexcontainer_box {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 750rpx;
|
||||
background-image: url(/static/image/other/bank/jsyh/headerBg.png);
|
||||
background-size: 100% 100%;
|
||||
background-repeat: no-repeat;
|
||||
z-index: 999 !important;
|
||||
}
|
||||
|
||||
.flexcontainer_1 {
|
||||
|
||||
display: flex;
|
||||
width: 750rpx;
|
||||
height: 96rpx;
|
||||
flex-direction: row;
|
||||
align-items: flex-start;
|
||||
isolation: isolate;
|
||||
margin-left: 0;
|
||||
z-index: 999 !important;
|
||||
justify-content: space-between;
|
||||
.group_8 {
|
||||
position: relative;
|
||||
|
|
@ -789,6 +829,7 @@ background-repeat: no-repeat;
|
|||
margin-left: 0;
|
||||
-webkit-mask-image: linear-gradient(0, #d8d8d8, #d8d8d8);
|
||||
justify-content: flex-end;
|
||||
|
||||
.group_13980 {
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
|
|
@ -934,6 +975,12 @@ background-repeat: no-repeat;
|
|||
position: relative;
|
||||
margin-left: 152rpx;
|
||||
margin-top: 0;
|
||||
background: #D6DEF1;
|
||||
border-radius: 2px 2px 2px 2px;
|
||||
text-align: center;
|
||||
line-height: 34rpx;
|
||||
font-size: 10px;
|
||||
color: #5D7ED7;
|
||||
}
|
||||
|
||||
.text_3 {
|
||||
|
|
@ -1089,10 +1136,10 @@ background-repeat: no-repeat;
|
|||
margin-top: 42rpx;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 组 48190 */
|
||||
.group_48190 {
|
||||
/* 组 48190 */
|
||||
.group_48190 {
|
||||
position: relative;
|
||||
width: 750rpx;
|
||||
display: flex;
|
||||
|
|
@ -1105,6 +1152,7 @@ background-repeat: no-repeat;
|
|||
z-index: 9;
|
||||
height: 140rpx;
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
|
||||
.rectangle_23318 {
|
||||
position: relative;
|
||||
width: 700rpx;
|
||||
|
|
@ -1158,7 +1206,7 @@ background-repeat: no-repeat;
|
|||
left: 0;
|
||||
font-size: 32rpx;
|
||||
font-family: 'PingFang SC';
|
||||
font-weight: 400;
|
||||
font-weight: bold;
|
||||
line-height: 36rpx;
|
||||
color: #1a1a1a;
|
||||
white-space: pre;
|
||||
|
|
@ -1169,10 +1217,10 @@ background-repeat: no-repeat;
|
|||
z-index: 2;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 组 48191 */
|
||||
.group_48191 {
|
||||
/* 组 48191 */
|
||||
.group_48191 {
|
||||
position: relative;
|
||||
width: 700rpx;
|
||||
height: 206rpx;
|
||||
|
|
@ -1207,7 +1255,8 @@ background-repeat: no-repeat;
|
|||
margin-right: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 1;
|
||||
margin-top: 24rpx;
|
||||
|
||||
|
|
@ -1219,9 +1268,6 @@ background-repeat: no-repeat;
|
|||
line-height: 40rpx;
|
||||
color: #2066c1;
|
||||
white-space: pre;
|
||||
height: 40rpx;
|
||||
margin-top: 14rpx;
|
||||
margin-bottom: -6rpx;
|
||||
width: max-content;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
|
@ -1252,6 +1298,7 @@ background-repeat: no-repeat;
|
|||
margin-top: 34rpx;
|
||||
margin-left: 22rpx;
|
||||
justify-content: space-between;
|
||||
|
||||
.group_14000 {
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
|
|
@ -1263,7 +1310,7 @@ background-repeat: no-repeat;
|
|||
.text_11 {
|
||||
font-size: 32rpx;
|
||||
font-family: 'PingFang SC';
|
||||
font-weight: 400;
|
||||
font-weight: bold;
|
||||
line-height: 36rpx;
|
||||
color: #1a1a1a;
|
||||
white-space: pre;
|
||||
|
|
@ -1306,10 +1353,10 @@ background-repeat: no-repeat;
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 组 48192 */
|
||||
.group_48192 {
|
||||
/* 组 48192 */
|
||||
.group_48192 {
|
||||
position: relative;
|
||||
width: 700rpx;
|
||||
height: 264rpx;
|
||||
|
|
@ -1320,6 +1367,8 @@ background-repeat: no-repeat;
|
|||
margin-top: 24rpx;
|
||||
margin-left: 26rpx;
|
||||
|
||||
margin-bottom: 46rpx;
|
||||
|
||||
.rectangle_23319 {
|
||||
position: relative;
|
||||
width: 700rpx;
|
||||
|
|
@ -1547,10 +1596,10 @@ background-repeat: no-repeat;
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 编辑弹窗样式 */
|
||||
.editDialog {
|
||||
/* 编辑弹窗样式 */
|
||||
.editDialog {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
|
@ -1561,9 +1610,9 @@ background-repeat: no-repeat;
|
|||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 9999;
|
||||
}
|
||||
}
|
||||
|
||||
.editDialog_bg {
|
||||
.editDialog_bg {
|
||||
width: 680rpx;
|
||||
max-height: 80vh;
|
||||
background-color: #ffffff;
|
||||
|
|
@ -1571,9 +1620,9 @@ background-repeat: no-repeat;
|
|||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
||||
.editDialog_header {
|
||||
.editDialog_header {
|
||||
padding: 30rpx;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
text-align: center;
|
||||
|
|
@ -1583,15 +1632,15 @@ background-repeat: no-repeat;
|
|||
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;
|
||||
|
|
@ -1610,9 +1659,9 @@ background-repeat: no-repeat;
|
|||
color: #333;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.popup-footer {
|
||||
.popup-footer {
|
||||
display: flex;
|
||||
padding: 20rpx 30rpx;
|
||||
border-top: 1rpx solid #eee;
|
||||
|
|
@ -1634,13 +1683,13 @@ background-repeat: no-repeat;
|
|||
}
|
||||
|
||||
.btn-save {
|
||||
background-color: #187AFF ;
|
||||
background-color: #187AFF;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 卡号弹窗样式 */
|
||||
.dask {
|
||||
/* 卡号弹窗样式 */
|
||||
.dask {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
|
|
@ -1699,6 +1748,5 @@ background-repeat: no-repeat;
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
|
||||
</view>
|
||||
<view class="header">
|
||||
<image src="/static/image/nav-bar/back-black.png" mode=""></image>
|
||||
<image @click="back" src="/static/image/nav-bar/back-black.png" mode=""></image>
|
||||
<text class="text_1">借记卡详情</text>
|
||||
<text class="imgXl"></text>
|
||||
</view>
|
||||
|
|
@ -249,6 +249,10 @@ function formatNumber(num) {
|
|||
function onNumberInput(field, value) {
|
||||
editDialog.data[field] = formatNumber(value);
|
||||
}
|
||||
|
||||
function back(){
|
||||
uni.navigateBack()
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
@ -362,7 +366,8 @@ $color-border: #e6e6e6;
|
|||
.rectangle_23309 {
|
||||
position: relative;
|
||||
width: 686rpx;
|
||||
height: 484rpx;
|
||||
// height: 484rpx;
|
||||
padding-bottom: 28rpx;
|
||||
border-radius: 12rpx;
|
||||
background-color: $color-white;
|
||||
box-shadow: 0rpx 0rpx 20rpx 0rpx rgba(0, 0, 0, 0.2);
|
||||
|
|
@ -443,7 +448,7 @@ $color-border: #e6e6e6;
|
|||
font-size: 32rpx;
|
||||
font-family: 'PingFang SC';
|
||||
line-height: 30rpx;
|
||||
font-weight: 400;
|
||||
font-weight: bold;
|
||||
color: $color-text-primary;
|
||||
}
|
||||
|
||||
|
|
@ -451,7 +456,7 @@ $color-border: #e6e6e6;
|
|||
font-size: 28rpx;
|
||||
font-family: 'PingFang SC';
|
||||
line-height: 30rpx;
|
||||
font-weight: 400;
|
||||
font-weight: bold;
|
||||
color: $color-text-primary;
|
||||
}
|
||||
}
|
||||
|
|
@ -472,7 +477,7 @@ $color-border: #e6e6e6;
|
|||
.flexcontainer_2 {
|
||||
width: 222rpx;
|
||||
height: 26rpx;
|
||||
margin-top: 47rpx;
|
||||
margin-top: 26rpx;
|
||||
|
||||
.text_6 {
|
||||
position: absolute;
|
||||
|
|
@ -606,7 +611,7 @@ $color-border: #e6e6e6;
|
|||
}
|
||||
|
||||
.flexcontainer_5 {
|
||||
margin-top: 28rpx;
|
||||
margin-top: 26rpx;
|
||||
|
||||
.text_12 {
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -1091,7 +1091,7 @@
|
|||
width: 60rpx;
|
||||
height: 52rpx;
|
||||
margin-left: 44rpx;
|
||||
margin-top: 32rpx;
|
||||
margin-top: 28rpx;
|
||||
}
|
||||
|
||||
.group_48144 {
|
||||
|
|
@ -1148,7 +1148,7 @@
|
|||
.group_48142 {
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
margin-top: 8rpx;
|
||||
margin-top: 6rpx;
|
||||
}
|
||||
|
||||
.path {
|
||||
|
|
@ -1195,6 +1195,7 @@
|
|||
font-size: 30rpx;
|
||||
line-height: 42rpx;
|
||||
color: #1a1a1a;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.text_10 {
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 950 B After Width: | Height: | Size: 2.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 431 B After Width: | Height: | Size: 1.4 KiB |
Loading…
Reference in New Issue