fix: 储蓄卡信用，新增调额记录功能。
This commit is contained in:
tianyongbao
44
src/api/invest/limitHistory.js
Normal file
44
src/api/invest/limitHistory.js
Normal file
@@ -0,0 +1,44 @@
|
|||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
// 查询银行卡额度调整历史记录列表
|
||||||
|
export function listLimitHistory(query) {
|
||||||
|
return request({
|
||||||
|
url: '/invest/limitHistory/list',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 查询银行卡额度调整历史记录详细
|
||||||
|
export function getLimitHistory(id) {
|
||||||
|
return request({
|
||||||
|
url: '/invest/limitHistory/' + id,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 新增银行卡额度调整历史记录
|
||||||
|
export function addLimitHistory(data) {
|
||||||
|
return request({
|
||||||
|
url: '/invest/limitHistory',
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 修改银行卡额度调整历史记录
|
||||||
|
export function updateLimitHistory(data) {
|
||||||
|
return request({
|
||||||
|
url: '/invest/limitHistory',
|
||||||
|
method: 'put',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 删除银行卡额度调整历史记录
|
||||||
|
export function delLimitHistory(id) {
|
||||||
|
return request({
|
||||||
|
url: '/invest/limitHistory/' + id,
|
||||||
|
method: 'delete'
|
||||||
|
})
|
||||||
|
}
|
||||||
@@ -429,6 +429,20 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
,
|
,
|
||||||
|
{
|
||||||
|
"path": "pages/work/base/debitCard/adjustLimit",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "储蓄卡调额"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
,
|
||||||
|
{
|
||||||
|
"path": "pages/work/base/debitCard/limitHistory",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "调额记录"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
,
|
||||||
{
|
{
|
||||||
"path": "pages/work/base/lend/list",
|
"path": "pages/work/base/lend/list",
|
||||||
"style": {
|
"style": {
|
||||||
@@ -468,6 +482,18 @@
|
|||||||
"navigationBarTitleText": "信用卡管理"
|
"navigationBarTitleText": "信用卡管理"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/work/base/creditCard/limitHistory",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "信用卡调额记录"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/work/base/creditCard/adjustLimit",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "信用卡调额"
|
||||||
|
}
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"path": "pages/work/base/posmachine/list",
|
"path": "pages/work/base/posmachine/list",
|
||||||
"style": {
|
"style": {
|
||||||
|
|||||||
505
src/pages/work/base/creditCard/adjustLimit.vue
Normal file
505
src/pages/work/base/creditCard/adjustLimit.vue
Normal file
@@ -0,0 +1,505 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container" style="paddingBottom:1rpx;">
|
||||||
|
<u-navbar
|
||||||
|
leftIconSize="40rpx"
|
||||||
|
leftIconColor="#333333"
|
||||||
|
title="信用卡调额"
|
||||||
|
>
|
||||||
|
</u-navbar>
|
||||||
|
<view class="section">
|
||||||
|
<view class="section-title">{{ title }}</view>
|
||||||
|
<view class="form-view">
|
||||||
|
<u--form labelPosition="left" :model="form" :rules="rules" ref="uForm" label-width="auto"
|
||||||
|
:labelStyle="{ color: '#333333', fontSize: '30rpx' }">
|
||||||
|
|
||||||
|
<u-form-item label="调整前额度" prop="beforeLimit">
|
||||||
|
<u--input v-model="form.beforeLimit" disabled disabledColor="#ffffff" placeholder="调整前额度"
|
||||||
|
inputAlign="right" border="none">
|
||||||
|
<template #suffix>
|
||||||
|
<text style="color: #909399; font-size: 28rpx;">元</text>
|
||||||
|
</template>
|
||||||
|
</u--input>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
<u-form-item label="调额类型" prop="limitTypeName" required @click="handleShowLimitType">
|
||||||
|
<u--input v-model="form.limitTypeName" disabled disabledColor="#ffffff" placeholder="请选择调额类型"
|
||||||
|
inputAlign="right" border="none"></u--input>
|
||||||
|
<u-icon slot="right" name="arrow-down"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
<u-form-item label="调整类型" prop="adjustTypeName" required @click="handleShowAdjustType">
|
||||||
|
<u--input v-model="form.adjustTypeName" disabled disabledColor="#ffffff" placeholder="请选择调整类型"
|
||||||
|
inputAlign="right" border="none"></u--input>
|
||||||
|
<u-icon slot="right" name="arrow-down"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="调整后额度" prop="afterLimit" required>
|
||||||
|
<u--input v-model="form.afterLimit" type="number" placeholder="请输入调整后额度"
|
||||||
|
inputAlign="right" border="none">
|
||||||
|
<template #suffix>
|
||||||
|
<text style="color: #909399; font-size: 28rpx;">元</text>
|
||||||
|
</template>
|
||||||
|
</u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="调整额度" prop="adjustLimit">
|
||||||
|
<u--input v-model="adjustLimitDisplay" disabled disabledColor="#ffffff" placeholder="自动计算"
|
||||||
|
inputAlign="right" border="none" :style="{ color: adjustLimitColor }">
|
||||||
|
<template #suffix>
|
||||||
|
<text style="color: #909399; font-size: 28rpx;">元</text>
|
||||||
|
</template>
|
||||||
|
</u--input>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
|
||||||
|
<u-form-item label="生效日期" prop="effectDate" required @click="selectEffectDate">
|
||||||
|
<u--input v-model="form.effectDate" disabled disabledColor="#ffffff" placeholder="请选择生效日期"
|
||||||
|
inputAlign="right" border="none"></u--input>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
<u-form-item label="截止日期" prop="deadlineDate" :required="isTemporary" @click="selectDeadlineDate">
|
||||||
|
<u--input v-model="form.deadlineDate" disabled disabledColor="#ffffff" :placeholder="isTemporary ? '请选择截止日期（必填）' : '请选择截止日期（可选）'"
|
||||||
|
inputAlign="right" border="none"></u--input>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
<u-form-item label="调整时间" prop="adjustTime" required @click="selectAdjustTime">
|
||||||
|
<u--input v-model="form.adjustTime" disabled disabledColor="#ffffff" placeholder="请选择调整时间"
|
||||||
|
inputAlign="right" border="none"></u--input>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
<u-form-item label="备注" prop="remark" labelPosition="top">
|
||||||
|
<u--textarea v-model="form.remark" placeholder="请填写备注" border="none" autoHeight inputAlign="right" count
|
||||||
|
maxlength="500" style="padding:18rpx 0;"></u--textarea>
|
||||||
|
</u-form-item>
|
||||||
|
</u--form>
|
||||||
|
<view class="form-btn">
|
||||||
|
<u-button type="primary" text="提交" @click="submit"></u-button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<u-toast ref="uToast"></u-toast>
|
||||||
|
|
||||||
|
<!-- 调整类型选择器 -->
|
||||||
|
<u-picker itemHeight="88" :show="showAdjustType" :columns="adjustTypeList" keyName="dictLabel"
|
||||||
|
@cancel="handleAdjustTypeCancel" @confirm="handleAdjustTypeConfirm"></u-picker>
|
||||||
|
|
||||||
|
<!-- 调额类型选择器 -->
|
||||||
|
<u-picker itemHeight="88" :show="showLimitType" :columns="limitTypeList" keyName="dictLabel"
|
||||||
|
@cancel="handleLimitTypeCancel" @confirm="handleLimitTypeConfirm"></u-picker>
|
||||||
|
|
||||||
|
<!-- 生效日期选择器 -->
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="effectDatePickShow"
|
||||||
|
mode="date"
|
||||||
|
:minDate="-2209017600000"
|
||||||
|
ref="effectDateRef"
|
||||||
|
@cancel="effectDatePickShow=false"
|
||||||
|
@confirm="effectDateConfirm"
|
||||||
|
itemHeight="88"
|
||||||
|
></u-datetime-picker>
|
||||||
|
|
||||||
|
<!-- 截止日期选择器 -->
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="deadlineDatePickShow"
|
||||||
|
mode="date"
|
||||||
|
:minDate="-2209017600000"
|
||||||
|
ref="deadlineDateRef"
|
||||||
|
@cancel="deadlineDatePickShow=false"
|
||||||
|
@confirm="deadlineDateConfirm"
|
||||||
|
itemHeight="88"
|
||||||
|
></u-datetime-picker>
|
||||||
|
|
||||||
|
<!-- 调整时间选择器 -->
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="adjustTimePickShow"
|
||||||
|
mode="datetime"
|
||||||
|
:minDate="-2209017600000"
|
||||||
|
ref="adjustTimeRef"
|
||||||
|
@cancel="adjustTimePickShow=false"
|
||||||
|
@confirm="adjustTimeConfirm"
|
||||||
|
itemHeight="88"
|
||||||
|
></u-datetime-picker>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { getBankcardLend } from '@/api/invest/bankcardlend'
|
||||||
|
import { addLimitHistory, updateLimitHistory, getLimitHistory, listLimitHistory } from '@/api/invest/limitHistory'
|
||||||
|
import { getDicts } from '@/api/system/dict/data.js'
|
||||||
|
import { getCurrentInstance } from 'vue'
|
||||||
|
import { onLoad, onReady } from '@dcloudio/uni-app'
|
||||||
|
import { reactive, toRefs, ref, computed, watch } from 'vue'
|
||||||
|
import dayjs from 'dayjs'
|
||||||
|
|
||||||
|
const { proxy } = getCurrentInstance()
|
||||||
|
|
||||||
|
const title = ref('信用卡非柜调额')
|
||||||
|
const showAdjustType = ref(false)
|
||||||
|
const showLimitType = ref(false)
|
||||||
|
const effectDatePickShow = ref(false)
|
||||||
|
const deadlineDatePickShow = ref(false)
|
||||||
|
const adjustTimePickShow = ref(false)
|
||||||
|
const adjustTypeList = ref([])
|
||||||
|
const limitTypeList = ref([])
|
||||||
|
|
||||||
|
const data = reactive({
|
||||||
|
form: {
|
||||||
|
id: null,
|
||||||
|
name: '',
|
||||||
|
code: '',
|
||||||
|
bankCardLendId: null,
|
||||||
|
beforeLimit: '',
|
||||||
|
afterLimit: '',
|
||||||
|
adjustLimit: 0,
|
||||||
|
adjustType: '',
|
||||||
|
adjustTypeName: '',
|
||||||
|
type: '',
|
||||||
|
limitTypeName: '',
|
||||||
|
effectDate: '',
|
||||||
|
deadlineDate: '',
|
||||||
|
adjustTime: '',
|
||||||
|
remark: ''
|
||||||
|
},
|
||||||
|
rules: {
|
||||||
|
afterLimit: [
|
||||||
|
{ type: 'number', required: true, message: '调整后额度不能为空', trigger: ['change', 'blur'] }
|
||||||
|
],
|
||||||
|
adjustTypeName: [
|
||||||
|
{ type: 'string', required: true, message: '调整类型不能为空', trigger: ['change', 'blur'] }
|
||||||
|
],
|
||||||
|
limitTypeName: [
|
||||||
|
{ type: 'string', required: true, message: '调额类型不能为空', trigger: ['change', 'blur'] }
|
||||||
|
],
|
||||||
|
effectDate: [
|
||||||
|
{ type: 'string', required: true, message: '生效日期不能为空', trigger: ['change', 'blur'] }
|
||||||
|
],
|
||||||
|
adjustTime: [
|
||||||
|
{ type: 'string', required: true, message: '调整时间不能为空', trigger: ['change', 'blur'] }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
const { form, rules } = toRefs(data)
|
||||||
|
|
||||||
|
// 计算调整额度
|
||||||
|
const adjustLimitDisplay = computed(() => {
|
||||||
|
const before = parseFloat(form.value.beforeLimit) || 0
|
||||||
|
const after = parseFloat(form.value.afterLimit) || 0
|
||||||
|
const adjust = after - before
|
||||||
|
form.value.adjustLimit = adjust
|
||||||
|
return adjust > 0 ? `+${adjust}` : `${adjust}`
|
||||||
|
})
|
||||||
|
|
||||||
|
// 调整额度颜色
|
||||||
|
const adjustLimitColor = computed(() => {
|
||||||
|
const adjust = form.value.adjustLimit
|
||||||
|
if (adjust > 0) return '#52c41a'
|
||||||
|
if (adjust < 0) return '#ff4d4f'
|
||||||
|
return '#909399'
|
||||||
|
})
|
||||||
|
|
||||||
|
// 判断是否是临时额度
|
||||||
|
const isTemporary = computed(() => {
|
||||||
|
return form.value.type === '1'
|
||||||
|
})
|
||||||
|
|
||||||
|
onLoad((option) => {
|
||||||
|
form.value.id = option.id || null
|
||||||
|
form.value.bankCardLendId = option.bankCardLendId
|
||||||
|
form.value.name = option.name
|
||||||
|
|
||||||
|
if (form.value.id) {
|
||||||
|
title.value = '信用卡调额记录-修改'
|
||||||
|
} else {
|
||||||
|
title.value = '信用卡调额记录-新增'
|
||||||
|
}
|
||||||
|
|
||||||
|
getDict()
|
||||||
|
|
||||||
|
if (form.value.id) {
|
||||||
|
// 编辑模式：加载已有记录
|
||||||
|
getLimitHistoryInfo()
|
||||||
|
} else {
|
||||||
|
// 新增模式：获取当前额度
|
||||||
|
getCardInfo()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
onReady(() => {
|
||||||
|
// 默认调整时间为当前时间
|
||||||
|
form.value.adjustTime = dayjs(new Date().getTime()).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
// 默认生效日期为当前日期
|
||||||
|
form.value.effectDate = dayjs(new Date().getTime()).format('YYYY-MM-DD')
|
||||||
|
})
|
||||||
|
|
||||||
|
function getDict() {
|
||||||
|
// 调整类型
|
||||||
|
getDicts('adjust_type').then(res => {
|
||||||
|
adjustTypeList.value = [res.data]
|
||||||
|
// 如果是新增模式，默认选中"调额"
|
||||||
|
if (!form.value.id && res.data && res.data.length > 0) {
|
||||||
|
const defaultItem = res.data.find(item => item.dictLabel === '调额')
|
||||||
|
if (defaultItem) {
|
||||||
|
form.value.adjustType = defaultItem.dictValue
|
||||||
|
form.value.adjustTypeName = defaultItem.dictLabel
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// 调额类型
|
||||||
|
getDicts('limit_history_type').then(res => {
|
||||||
|
limitTypeList.value = [res.data]
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function getLimitHistoryInfo() {
|
||||||
|
getLimitHistory(form.value.id).then(res => {
|
||||||
|
form.value = { ...form.value, ...res.data }
|
||||||
|
// 获取字典显示名称
|
||||||
|
if (form.value.adjustType) {
|
||||||
|
getDicts('adjust_type').then(result => {
|
||||||
|
form.value.adjustTypeName = dictStr(form.value.adjustType, result.data)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
if (form.value.type) {
|
||||||
|
getDicts('limit_history_type').then(result => {
|
||||||
|
form.value.limitTypeName = dictStr(form.value.type, result.data)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function getCardInfo() {
|
||||||
|
// 先获取该信用卡的最新一条调额记录
|
||||||
|
listLimitHistory({
|
||||||
|
pageSize: 1,
|
||||||
|
pageNum: 1,
|
||||||
|
bankCardLendId: form.value.bankCardLendId
|
||||||
|
}).then(res => {
|
||||||
|
if (res.rows && res.rows.length > 0) {
|
||||||
|
// 如果有调额记录，使用最新记录的调整后额度作为调整前额度
|
||||||
|
const afterLimit = res.rows[0].afterLimit || 0
|
||||||
|
form.value.beforeLimit = afterLimit
|
||||||
|
// 默认调整后额度与调整前一致
|
||||||
|
form.value.afterLimit = afterLimit
|
||||||
|
} else {
|
||||||
|
// 如果没有调额记录，使用信用卡的当前额度
|
||||||
|
getBankcardLend(form.value.bankCardLendId).then(cardRes => {
|
||||||
|
const limit = cardRes.data.creditLimit || 0
|
||||||
|
form.value.beforeLimit = limit
|
||||||
|
// 默认调整后额度与调整前一致
|
||||||
|
form.value.afterLimit = limit
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}).catch(() => {
|
||||||
|
// 查询失败时，使用信用卡的当前额度
|
||||||
|
getBankcardLend(form.value.bankCardLendId).then(cardRes => {
|
||||||
|
const limit = cardRes.data.creditLimit || 0
|
||||||
|
form.value.beforeLimit = limit
|
||||||
|
// 默认调整后额度与调整前一致
|
||||||
|
form.value.afterLimit = limit
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
// 获取信用卡账号
|
||||||
|
getBankcardLend(form.value.bankCardLendId).then(res => {
|
||||||
|
form.value.code = res.data.code || ''
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function dictStr(val, arr) {
|
||||||
|
let str = ''
|
||||||
|
arr.map(item => {
|
||||||
|
if (item.dictValue === val) {
|
||||||
|
str = item.dictLabel
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return str
|
||||||
|
}
|
||||||
|
|
||||||
|
// 调整类型选择
|
||||||
|
function handleShowAdjustType() {
|
||||||
|
if (adjustTypeList.value[0].length === 0) {
|
||||||
|
proxy.$refs['uToast'].show({
|
||||||
|
message: '调整类型为空',
|
||||||
|
type: 'warning'
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
showAdjustType.value = true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleAdjustTypeConfirm(e) {
|
||||||
|
form.value.adjustTypeName = e.value[0].dictLabel
|
||||||
|
form.value.adjustType = e.value[0].dictValue
|
||||||
|
showAdjustType.value = false
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleAdjustTypeCancel() {
|
||||||
|
showAdjustType.value = false
|
||||||
|
}
|
||||||
|
|
||||||
|
// 调额类型选择
|
||||||
|
function handleShowLimitType() {
|
||||||
|
if (limitTypeList.value[0].length === 0) {
|
||||||
|
proxy.$refs['uToast'].show({
|
||||||
|
message: '调额类型为空',
|
||||||
|
type: 'warning'
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
showLimitType.value = true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleLimitTypeConfirm(e) {
|
||||||
|
form.value.limitTypeName = e.value[0].dictLabel
|
||||||
|
form.value.type = e.value[0].dictValue
|
||||||
|
showLimitType.value = false
|
||||||
|
|
||||||
|
// 如果不是临时额度，清空截止日期
|
||||||
|
if (form.value.limitTypeName !== '临时额度') {
|
||||||
|
form.value.deadlineDate = ''
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleLimitTypeCancel() {
|
||||||
|
showLimitType.value = false
|
||||||
|
}
|
||||||
|
|
||||||
|
// 生效日期选择
|
||||||
|
function selectEffectDate() {
|
||||||
|
effectDatePickShow.value = true
|
||||||
|
proxy.$refs['effectDateRef'].innerValue = form.value.effectDate
|
||||||
|
? new Date(form.value.effectDate).getTime()
|
||||||
|
: new Date().getTime()
|
||||||
|
}
|
||||||
|
|
||||||
|
function effectDateConfirm(e) {
|
||||||
|
form.value.effectDate = dayjs(e.value).format('YYYY-MM-DD')
|
||||||
|
effectDatePickShow.value = false
|
||||||
|
}
|
||||||
|
|
||||||
|
// 截止日期选择
|
||||||
|
function selectDeadlineDate() {
|
||||||
|
deadlineDatePickShow.value = true
|
||||||
|
proxy.$refs['deadlineDateRef'].innerValue = form.value.deadlineDate
|
||||||
|
? new Date(form.value.deadlineDate).getTime()
|
||||||
|
: new Date().getTime()
|
||||||
|
}
|
||||||
|
|
||||||
|
function deadlineDateConfirm(e) {
|
||||||
|
form.value.deadlineDate = dayjs(e.value).format('YYYY-MM-DD')
|
||||||
|
deadlineDatePickShow.value = false
|
||||||
|
}
|
||||||
|
|
||||||
|
// 调整时间选择
|
||||||
|
function selectAdjustTime() {
|
||||||
|
adjustTimePickShow.value = true
|
||||||
|
proxy.$refs['adjustTimeRef'].innerValue = form.value.adjustTime
|
||||||
|
? new Date(form.value.adjustTime).getTime()
|
||||||
|
: new Date().getTime()
|
||||||
|
}
|
||||||
|
|
||||||
|
function adjustTimeConfirm(e) {
|
||||||
|
form.value.adjustTime = dayjs(e.value).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
adjustTimePickShow.value = false
|
||||||
|
}
|
||||||
|
|
||||||
|
// 提交
|
||||||
|
function submit() {
|
||||||
|
proxy.$refs['uForm'].validate().then(() => {
|
||||||
|
// 如果是临时额度，检查截止日期是否填写
|
||||||
|
if (isTemporary.value && !form.value.deadlineDate) {
|
||||||
|
proxy.$refs['uToast'].show({
|
||||||
|
message: '临时额度必须填写截止日期',
|
||||||
|
type: 'error'
|
||||||
|
})
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const submitData = { ...form.value }
|
||||||
|
|
||||||
|
if (form.value.id) {
|
||||||
|
// 修改
|
||||||
|
updateLimitHistory(submitData).then(res => {
|
||||||
|
proxy.$refs['uToast'].show({
|
||||||
|
message: '修改成功',
|
||||||
|
complete() {
|
||||||
|
setTimeout(() => {
|
||||||
|
uni.navigateBack()
|
||||||
|
}, 1500)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
// 新增
|
||||||
|
addLimitHistory(submitData).then(res => {
|
||||||
|
proxy.$refs['uToast'].show({
|
||||||
|
message: '调额成功',
|
||||||
|
complete() {
|
||||||
|
setTimeout(() => {
|
||||||
|
uni.navigateBack()
|
||||||
|
}, 1500)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.section {
|
||||||
|
margin: 24rpx;
|
||||||
|
padding: 0;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.section-title {
|
||||||
|
padding: 16rpx 24rpx;
|
||||||
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||||
|
color: #ffffff;
|
||||||
|
line-height: 1.2;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: '';
|
||||||
|
width: 6rpx;
|
||||||
|
height: 28rpx;
|
||||||
|
background: #ffffff;
|
||||||
|
border-radius: 3rpx;
|
||||||
|
margin-right: 12rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-view {
|
||||||
|
padding: 24rpx;
|
||||||
|
|
||||||
|
.form-btn {
|
||||||
|
padding-top: 16rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.form-btn .u-button {
|
||||||
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
|
||||||
|
border: none !important;
|
||||||
|
border-radius: 24rpx !important;
|
||||||
|
height: 80rpx !important;
|
||||||
|
box-shadow: 0 4rpx 16rpx rgba(102, 126, 234, 0.4) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-btn .u-button__text {
|
||||||
|
font-size: 30rpx !important;
|
||||||
|
font-weight: 500 !important;
|
||||||
|
letter-spacing: 2rpx !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
495
src/pages/work/base/creditCard/limitHistory.vue
Normal file
495
src/pages/work/base/creditCard/limitHistory.vue
Normal file
@@ -0,0 +1,495 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<u-navbar
|
||||||
|
leftIconSize="40rpx"
|
||||||
|
leftIconColor="#333333"
|
||||||
|
:title="pageTitle"
|
||||||
|
>
|
||||||
|
</u-navbar>
|
||||||
|
|
||||||
|
<u-sticky offsetTop="0rpx" customNavHeight="0rpx">
|
||||||
|
<view class="header-view">
|
||||||
|
<view class="card-info-header">
|
||||||
|
<view class="info-item">
|
||||||
|
<text class="info-label">卡名称：</text>
|
||||||
|
<text class="info-value">{{ cardInfo.name || '--' }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="info-item">
|
||||||
|
<text class="info-label">卡账号：</text>
|
||||||
|
<text class="info-value">{{ cardInfo.code || '--' }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="add-btn" @click="handleAdd()">
|
||||||
|
<uni-icons type="plusempty" size="18" color="#667eea"></uni-icons>
|
||||||
|
<text>新增调额</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-sticky>
|
||||||
|
|
||||||
|
<u-list @scrolltolower="loadmore" :spaceHeight="116" lowerThreshold="100">
|
||||||
|
<u-list-item v-for="(item, index) in listData" :key="index">
|
||||||
|
<view class="list-item" @click="enterDetails(item)">
|
||||||
|
<view class="item-header">
|
||||||
|
<view class="header-left">
|
||||||
|
<view class="adjust-icon" :class="item.adjustLimit > 0 ? 'icon-up' : 'icon-down'">
|
||||||
|
<uni-icons :type="item.adjustLimit > 0 ? 'arrow-up' : 'arrow-down'" size="20" color="#ffffff"></uni-icons>
|
||||||
|
</view>
|
||||||
|
<view class="header-info">
|
||||||
|
<text class="adjust-type">{{ item.adjustTypeName || dictStr(item.adjustType, adjustTypeList) }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="header-center">
|
||||||
|
<text class="adjust-time">{{ formatDate(item.adjustTime) }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="adjust-amount" :class="item.adjustLimit > 0 ? 'amount-up' : 'amount-down'">
|
||||||
|
<text>{{ item.adjustLimit > 0 ? '+' : '' }}{{ item.adjustLimit }}元</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="card-body">
|
||||||
|
<view class="info-row">
|
||||||
|
<view class="info-item">
|
||||||
|
<text class="info-label">调额类型</text>
|
||||||
|
<text class="info-value">{{ item.limitTypeName || dictStr(item.type, limitTypeList) || '--' }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="info-item">
|
||||||
|
<text class="info-label">调整前额度</text>
|
||||||
|
<text class="info-value">{{ item.beforeLimit }}元</text>
|
||||||
|
</view>
|
||||||
|
<view class="info-item">
|
||||||
|
<text class="info-label">调整后额度</text>
|
||||||
|
<text class="info-value orange">{{ item.afterLimit }}元</text>
|
||||||
|
</view>
|
||||||
|
<view class="info-item">
|
||||||
|
<text class="info-label">生效日期</text>
|
||||||
|
<text class="info-value">{{ item.effectDate || '--' }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="info-item" v-if="item.deadlineDate">
|
||||||
|
<text class="info-label">截止日期</text>
|
||||||
|
<text class="info-value">{{ item.deadlineDate }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="info-item info-item-full" v-if="item.remark">
|
||||||
|
<text class="info-label">备注</text>
|
||||||
|
<text class="info-value">{{ item.remark }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="operate" @click.stop>
|
||||||
|
<view class="btn-edit" @click="handleEdit(item)">
|
||||||
|
<uni-icons type="compose" size="16" color="#667eea"></uni-icons>
|
||||||
|
<text>修改</text>
|
||||||
|
</view>
|
||||||
|
<view class="btn-delete" @click="handleDelete(item)">
|
||||||
|
<uni-icons type="trash" size="16" color="#f5576c"></uni-icons>
|
||||||
|
<text>删除</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-list-item>
|
||||||
|
<view>
|
||||||
|
</view>
|
||||||
|
<u-loadmore :status="status" loadingIcon="semicircle" height="88" fontSize="32rpx" @loadmore="loadmore" />
|
||||||
|
</u-list>
|
||||||
|
</view>
|
||||||
|
<!-- 悬停按钮-->
|
||||||
|
<suspend></suspend>
|
||||||
|
<refresh></refresh>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { listLimitHistory, delLimitHistory } from '@/api/invest/limitHistory'
|
||||||
|
import { getBankcardLend } from '@/api/invest/bankcardlend'
|
||||||
|
import { getDicts } from '@/api/system/dict/data.js'
|
||||||
|
import { onLoad, onShow } from '@dcloudio/uni-app'
|
||||||
|
import { reactive, toRefs, ref, computed } from 'vue'
|
||||||
|
|
||||||
|
const pageNum = ref(1)
|
||||||
|
const listData = ref([])
|
||||||
|
const isShow = ref(false)
|
||||||
|
const status = ref('loadmore')
|
||||||
|
const adjustTypeList = ref([])
|
||||||
|
const limitTypeList = ref([])
|
||||||
|
const bankCardLendId = ref('')
|
||||||
|
const cardName = ref('')
|
||||||
|
const cardInfo = ref({
|
||||||
|
name: '',
|
||||||
|
code: ''
|
||||||
|
})
|
||||||
|
|
||||||
|
const pageTitle = computed(() => {
|
||||||
|
return cardName.value ? `${cardName.value} - 调额记录` : '调额记录'
|
||||||
|
})
|
||||||
|
|
||||||
|
const data = reactive({
|
||||||
|
queryParams: {
|
||||||
|
bankCardLendId: ''
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
const { queryParams } = toRefs(data)
|
||||||
|
|
||||||
|
onLoad((option) => {
|
||||||
|
bankCardLendId.value = option.bankCardLendId
|
||||||
|
cardName.value = option.name || ''
|
||||||
|
queryParams.value.bankCardLendId = option.bankCardLendId
|
||||||
|
getDict()
|
||||||
|
getCardInfo()
|
||||||
|
getList()
|
||||||
|
})
|
||||||
|
|
||||||
|
onShow(() => {
|
||||||
|
if (isShow.value) {
|
||||||
|
listData.value = []
|
||||||
|
pageNum.value = 1
|
||||||
|
getList()
|
||||||
|
isShow.value = false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
function loadmore() {
|
||||||
|
pageNum.value += 1
|
||||||
|
if (status.value == 'loadmore') {
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function getList() {
|
||||||
|
status.value = 'loading'
|
||||||
|
listLimitHistory({ pageSize: 10, pageNum: pageNum.value, ...queryParams.value }).then(res => {
|
||||||
|
listData.value = listData.value.concat(res.rows)
|
||||||
|
if (listData.value.length < res.total) {
|
||||||
|
status.value = 'loadmore'
|
||||||
|
} else {
|
||||||
|
status.value = 'nomore'
|
||||||
|
}
|
||||||
|
}).catch(() => {
|
||||||
|
status.value = 'nomore'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function getDict() {
|
||||||
|
// 调整类型
|
||||||
|
getDicts('adjust_type').then(res => {
|
||||||
|
adjustTypeList.value = res.data
|
||||||
|
})
|
||||||
|
// 调额类型
|
||||||
|
getDicts('limit_history_type').then(res => {
|
||||||
|
limitTypeList.value = res.data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function getCardInfo() {
|
||||||
|
getBankcardLend(bankCardLendId.value).then(res => {
|
||||||
|
cardInfo.value.name = res.data.name || ''
|
||||||
|
cardInfo.value.code = res.data.code || ''
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function dictStr(val, arr) {
|
||||||
|
let str = ''
|
||||||
|
arr.map(item => {
|
||||||
|
if (item.dictValue === val) {
|
||||||
|
str = item.dictLabel
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return str
|
||||||
|
}
|
||||||
|
|
||||||
|
function formatDate(dateTime) {
|
||||||
|
if (!dateTime) return '--'
|
||||||
|
// 只取日期部分 YYYY-MM-DD
|
||||||
|
return dateTime.split(' ')[0]
|
||||||
|
}
|
||||||
|
|
||||||
|
function enterDetails(item) {
|
||||||
|
// 可以添加详情页面
|
||||||
|
handleEdit(item)
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleEdit(item) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/work/base/creditCard/adjustLimit?id=${item.id}&bankCardLendId=${bankCardLendId.value}&name=${cardName.value}`
|
||||||
|
})
|
||||||
|
isShow.value = true
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleAdd() {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/work/base/creditCard/adjustLimit?bankCardLendId=${bankCardLendId.value}&name=${cardName.value}`
|
||||||
|
})
|
||||||
|
isShow.value = true
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleDelete(item) {
|
||||||
|
uni.showModal({
|
||||||
|
title: '确认删除',
|
||||||
|
content: '确定要删除这条调额记录吗？',
|
||||||
|
confirmText: '删除',
|
||||||
|
cancelText: '取消',
|
||||||
|
confirmColor: '#f5576c',
|
||||||
|
cancelColor: '#909399',
|
||||||
|
success: function (res) {
|
||||||
|
if (res.confirm) {
|
||||||
|
delLimitHistory(item.id).then(() => {
|
||||||
|
uni.showToast({
|
||||||
|
title: '删除成功',
|
||||||
|
icon: 'success'
|
||||||
|
})
|
||||||
|
pageNum.value = 1
|
||||||
|
listData.value = []
|
||||||
|
getList()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
page {
|
||||||
|
height: 100%;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
.container {
|
||||||
|
background: #f5f7fa;
|
||||||
|
min-height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-view {
|
||||||
|
padding: 12rpx 32rpx;
|
||||||
|
background-color: #ffffff;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.05);
|
||||||
|
gap: 24rpx;
|
||||||
|
|
||||||
|
.card-info-header {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 8rpx;
|
||||||
|
|
||||||
|
.info-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.info-label {
|
||||||
|
color: #667eea;
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-value {
|
||||||
|
color: #333333;
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.add-btn {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 6rpx;
|
||||||
|
padding: 12rpx 24rpx;
|
||||||
|
background: rgba(102, 126, 234, 0.08);
|
||||||
|
border-radius: 24rpx;
|
||||||
|
border: 2rpx solid rgba(102, 126, 234, 0.3);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.95);
|
||||||
|
background: rgba(102, 126, 234, 0.12);
|
||||||
|
}
|
||||||
|
|
||||||
|
text {
|
||||||
|
color: #667eea;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.list-item {
|
||||||
|
margin: 10rpx 24rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.98);
|
||||||
|
box-shadow: 0 1rpx 6rpx rgba(0, 0, 0, 0.06);
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 16rpx 24rpx;
|
||||||
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||||
|
gap: 16rpx;
|
||||||
|
|
||||||
|
.header-left {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
.adjust-icon {
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-right: 12rpx;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
&.icon-up {
|
||||||
|
background: rgba(82, 196, 26, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.icon-down {
|
||||||
|
background: rgba(255, 77, 79, 0.3);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-info {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.adjust-type {
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: 1.2;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-center {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.adjust-time {
|
||||||
|
color: rgba(255, 255, 255, 0.9);
|
||||||
|
font-size: 30rpx;
|
||||||
|
line-height: 1;
|
||||||
|
font-weight: 500;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.adjust-amount {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 700;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
&.amount-up {
|
||||||
|
color: #52c41a;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.amount-down {
|
||||||
|
color: #ff4d4f;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-body {
|
||||||
|
padding: 24rpx;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-row {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 24rpx;
|
||||||
|
|
||||||
|
.info-item {
|
||||||
|
flex: 0 0 calc(50% - 12rpx);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 4rpx;
|
||||||
|
min-width: 0;
|
||||||
|
|
||||||
|
&.info-item-full {
|
||||||
|
flex: 0 0 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-label {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #667eea;
|
||||||
|
font-weight: 500;
|
||||||
|
background: rgba(102, 126, 234, 0.08);
|
||||||
|
padding: 6rpx 12rpx;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
align-self: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-value {
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #333;
|
||||||
|
font-weight: 500;
|
||||||
|
line-height: 1.5;
|
||||||
|
word-break: break-all;
|
||||||
|
|
||||||
|
&.orange {
|
||||||
|
color: #fa8c16;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:not(.info-item-full) .info-value {
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.operate {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
padding: 16rpx 24rpx 24rpx;
|
||||||
|
gap: 16rpx;
|
||||||
|
|
||||||
|
.btn-edit,
|
||||||
|
.btn-delete {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 6rpx;
|
||||||
|
padding: 0 24rpx;
|
||||||
|
height: 64rpx;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.95);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-edit {
|
||||||
|
background: rgba(102, 126, 234, 0.1);
|
||||||
|
color: #667eea;
|
||||||
|
border: 1rpx solid rgba(102, 126, 234, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-delete {
|
||||||
|
background: rgba(245, 87, 108, 0.1);
|
||||||
|
color: #f5576c;
|
||||||
|
border: 1rpx solid rgba(245, 87, 108, 0.3);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -80,6 +80,10 @@
|
|||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="operate" @click.stop>
|
<view class="operate" @click.stop>
|
||||||
|
<view class="btn-limit" @click="handleLimitHistory(item)">
|
||||||
|
<uni-icons type="list" size="16" color="#fa8c16"></uni-icons>
|
||||||
|
<text>调额记录</text>
|
||||||
|
</view>
|
||||||
<view class="btn-edit" @click="handleEdit(item)">
|
<view class="btn-edit" @click="handleEdit(item)">
|
||||||
<uni-icons type="compose" size="16" color="#667eea"></uni-icons>
|
<uni-icons type="compose" size="16" color="#667eea"></uni-icons>
|
||||||
<text>修改</text>
|
<text>修改</text>
|
||||||
@@ -248,6 +252,10 @@ function formatCardCode(code) {
|
|||||||
uni.navigateTo({ url: `/pages/work/base/creditCard/addEdit` })
|
uni.navigateTo({ url: `/pages/work/base/creditCard/addEdit` })
|
||||||
isShow.value = true
|
isShow.value = true
|
||||||
}
|
}
|
||||||
|
function handleLimitHistory(item) {
|
||||||
|
uni.navigateTo({ url: `/pages/work/base/creditCard/limitHistory?bankCardLendId=${item.id}&name=${item.name}` })
|
||||||
|
isShow.value = true
|
||||||
|
}
|
||||||
function handleDelete(item) {
|
function handleDelete(item) {
|
||||||
uni.showModal({
|
uni.showModal({
|
||||||
title: '确认删除',
|
title: '确认删除',
|
||||||
@@ -553,6 +561,7 @@ page {
|
|||||||
gap: 16rpx;
|
gap: 16rpx;
|
||||||
padding: 16rpx 24rpx 24rpx;
|
padding: 16rpx 24rpx 24rpx;
|
||||||
|
|
||||||
|
.btn-limit,
|
||||||
.btn-edit,
|
.btn-edit,
|
||||||
.btn-delete {
|
.btn-delete {
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -571,6 +580,12 @@ page {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.btn-limit {
|
||||||
|
background: rgba(250, 140, 22, 0.1);
|
||||||
|
color: #fa8c16;
|
||||||
|
border-color: rgba(250, 140, 22, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
.btn-edit {
|
.btn-edit {
|
||||||
background: rgba(102, 126, 234, 0.1);
|
background: rgba(102, 126, 234, 0.1);
|
||||||
color: #667eea;
|
color: #667eea;
|
||||||
|
|||||||
470
src/pages/work/base/debitCard/adjustLimit.vue
Normal file
470
src/pages/work/base/debitCard/adjustLimit.vue
Normal file
@@ -0,0 +1,470 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container" style="paddingBottom:1rpx;">
|
||||||
|
<u-navbar
|
||||||
|
leftIconSize="40rpx"
|
||||||
|
leftIconColor="#333333"
|
||||||
|
title="储蓄卡非柜调额"
|
||||||
|
>
|
||||||
|
</u-navbar>
|
||||||
|
<view class="section">
|
||||||
|
<view class="section-title">{{ title }}</view>
|
||||||
|
<view class="form-view">
|
||||||
|
<u--form labelPosition="left" :model="form" :rules="rules" ref="uForm" label-width="auto"
|
||||||
|
:labelStyle="{ color: '#333333', fontSize: '30rpx' }">
|
||||||
|
|
||||||
|
<u-form-item label="调整前额度" prop="beforeLimit">
|
||||||
|
<u--input v-model="form.beforeLimit" disabled disabledColor="#ffffff" placeholder="调整前额度"
|
||||||
|
inputAlign="right" border="none">
|
||||||
|
<template #suffix>
|
||||||
|
<text style="color: #909399; font-size: 28rpx;">元</text>
|
||||||
|
</template>
|
||||||
|
</u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="调整类型" prop="adjustTypeName" required @click="handleShowAdjustType">
|
||||||
|
<u--input v-model="form.adjustTypeName" disabled disabledColor="#ffffff" placeholder="请选择调整类型"
|
||||||
|
inputAlign="right" border="none"></u--input>
|
||||||
|
<u-icon slot="right" name="arrow-down"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="调整后额度" prop="afterLimit" required>
|
||||||
|
<u--input v-model="form.afterLimit" type="number" placeholder="请输入调整后额度"
|
||||||
|
inputAlign="right" border="none">
|
||||||
|
<template #suffix>
|
||||||
|
<text style="color: #909399; font-size: 28rpx;">元</text>
|
||||||
|
</template>
|
||||||
|
</u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="调整额度" prop="adjustLimit">
|
||||||
|
<u--input v-model="adjustLimitDisplay" disabled disabledColor="#ffffff" placeholder="自动计算"
|
||||||
|
inputAlign="right" border="none" :style="{ color: adjustLimitColor }">
|
||||||
|
<template #suffix>
|
||||||
|
<text style="color: #909399; font-size: 28rpx;">元</text>
|
||||||
|
</template>
|
||||||
|
</u--input>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
|
||||||
|
<u-form-item label="生效日期" prop="effectDate" required @click="selectEffectDate">
|
||||||
|
<u--input v-model="form.effectDate" disabled disabledColor="#ffffff" placeholder="请选择生效日期"
|
||||||
|
inputAlign="right" border="none"></u--input>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
<u-form-item label="截止日期" prop="deadlineDate" @click="selectDeadlineDate">
|
||||||
|
<u--input v-model="form.deadlineDate" disabled disabledColor="#ffffff" placeholder="请选择截止日期（可选）"
|
||||||
|
inputAlign="right" border="none"></u--input>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
<u-form-item label="调整时间" prop="adjustTime" required @click="selectAdjustTime">
|
||||||
|
<u--input v-model="form.adjustTime" disabled disabledColor="#ffffff" placeholder="请选择调整时间"
|
||||||
|
inputAlign="right" border="none"></u--input>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
<u-form-item label="备注" prop="remark" labelPosition="top">
|
||||||
|
<u--textarea v-model="form.remark" placeholder="请填写备注" border="none" autoHeight inputAlign="right" count
|
||||||
|
maxlength="500" style="padding:18rpx 0;"></u--textarea>
|
||||||
|
</u-form-item>
|
||||||
|
</u--form>
|
||||||
|
<view class="form-btn">
|
||||||
|
<u-button type="primary" text="提交" @click="submit"></u-button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<u-toast ref="uToast"></u-toast>
|
||||||
|
|
||||||
|
<!-- 调整类型选择器 -->
|
||||||
|
<u-picker itemHeight="88" :show="showAdjustType" :columns="adjustTypeList" keyName="dictLabel"
|
||||||
|
@cancel="handleAdjustTypeCancel" @confirm="handleAdjustTypeConfirm"></u-picker>
|
||||||
|
|
||||||
|
<!-- 生效日期选择器 -->
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="effectDatePickShow"
|
||||||
|
mode="date"
|
||||||
|
:minDate="-2209017600000"
|
||||||
|
ref="effectDateRef"
|
||||||
|
@cancel="effectDatePickShow=false"
|
||||||
|
@confirm="effectDateConfirm"
|
||||||
|
itemHeight="88"
|
||||||
|
></u-datetime-picker>
|
||||||
|
|
||||||
|
<!-- 截止日期选择器 -->
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="deadlineDatePickShow"
|
||||||
|
mode="date"
|
||||||
|
:minDate="-2209017600000"
|
||||||
|
ref="deadlineDateRef"
|
||||||
|
@cancel="deadlineDatePickShow=false"
|
||||||
|
@confirm="deadlineDateConfirm"
|
||||||
|
itemHeight="88"
|
||||||
|
></u-datetime-picker>
|
||||||
|
|
||||||
|
<!-- 调整时间选择器 -->
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="adjustTimePickShow"
|
||||||
|
mode="datetime"
|
||||||
|
:minDate="-2209017600000"
|
||||||
|
ref="adjustTimeRef"
|
||||||
|
@cancel="adjustTimePickShow=false"
|
||||||
|
@confirm="adjustTimeConfirm"
|
||||||
|
itemHeight="88"
|
||||||
|
></u-datetime-picker>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { getBankcardLend } from '@/api/invest/bankcardlend'
|
||||||
|
import { addLimitHistory, updateLimitHistory, getLimitHistory, listLimitHistory } from '@/api/invest/limitHistory'
|
||||||
|
import { getDicts } from '@/api/system/dict/data.js'
|
||||||
|
import { getCurrentInstance } from 'vue'
|
||||||
|
import { onLoad, onReady } from '@dcloudio/uni-app'
|
||||||
|
import { reactive, toRefs, ref, computed, watch } from 'vue'
|
||||||
|
import dayjs from 'dayjs'
|
||||||
|
|
||||||
|
const { proxy } = getCurrentInstance()
|
||||||
|
|
||||||
|
const title = ref('储蓄卡非柜调额')
|
||||||
|
const showAdjustType = ref(false)
|
||||||
|
const effectDatePickShow = ref(false)
|
||||||
|
const deadlineDatePickShow = ref(false)
|
||||||
|
const adjustTimePickShow = ref(false)
|
||||||
|
const adjustTypeList = ref([])
|
||||||
|
|
||||||
|
const data = reactive({
|
||||||
|
form: {
|
||||||
|
id: null,
|
||||||
|
name: '',
|
||||||
|
cardNumber: '',
|
||||||
|
type: '1', // 储蓄卡类型
|
||||||
|
bankCardLendId: null,
|
||||||
|
beforeLimit: '',
|
||||||
|
afterLimit: '',
|
||||||
|
adjustLimit: 0,
|
||||||
|
adjustType: '',
|
||||||
|
adjustTypeName: '',
|
||||||
|
effectDate: '',
|
||||||
|
deadlineDate: '',
|
||||||
|
adjustTime: '',
|
||||||
|
remark: ''
|
||||||
|
},
|
||||||
|
rules: {
|
||||||
|
afterLimit: [
|
||||||
|
{ type: 'number', required: true, message: '调整后额度不能为空', trigger: ['change', 'blur'] }
|
||||||
|
],
|
||||||
|
adjustTypeName: [
|
||||||
|
{ type: 'string', required: true, message: '调整类型不能为空', trigger: ['change', 'blur'] }
|
||||||
|
],
|
||||||
|
effectDate: [
|
||||||
|
{ type: 'string', required: true, message: '生效日期不能为空', trigger: ['change', 'blur'] }
|
||||||
|
],
|
||||||
|
adjustTime: [
|
||||||
|
{ type: 'string', required: true, message: '调整时间不能为空', trigger: ['change', 'blur'] }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
const { form, rules } = toRefs(data)
|
||||||
|
|
||||||
|
// 计算调整额度
|
||||||
|
const adjustLimitDisplay = computed(() => {
|
||||||
|
const before = parseFloat(form.value.beforeLimit) || 0
|
||||||
|
const after = parseFloat(form.value.afterLimit) || 0
|
||||||
|
const adjust = after - before
|
||||||
|
form.value.adjustLimit = adjust
|
||||||
|
return adjust > 0 ? `+${adjust}` : `${adjust}`
|
||||||
|
})
|
||||||
|
|
||||||
|
// 调整额度颜色
|
||||||
|
const adjustLimitColor = computed(() => {
|
||||||
|
const adjust = form.value.adjustLimit
|
||||||
|
if (adjust > 0) return '#52c41a'
|
||||||
|
if (adjust < 0) return '#ff4d4f'
|
||||||
|
return '#909399'
|
||||||
|
})
|
||||||
|
|
||||||
|
onLoad((option) => {
|
||||||
|
form.value.id = option.id || null
|
||||||
|
form.value.bankCardLendId = option.bankCardLendId
|
||||||
|
form.value.name = option.name
|
||||||
|
|
||||||
|
if (form.value.id) {
|
||||||
|
title.value = '储蓄卡非柜调额记录-修改'
|
||||||
|
} else {
|
||||||
|
title.value = '储蓄卡非柜调额记录-新增'
|
||||||
|
}
|
||||||
|
|
||||||
|
getDict()
|
||||||
|
|
||||||
|
if (form.value.id) {
|
||||||
|
// 编辑模式：加载已有记录
|
||||||
|
getLimitHistoryInfo()
|
||||||
|
} else {
|
||||||
|
// 新增模式：获取当前额度
|
||||||
|
getCardInfo()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
onReady(() => {
|
||||||
|
// 默认调整时间为当前时间
|
||||||
|
form.value.adjustTime = dayjs(new Date().getTime()).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
// 默认生效日期为当前日期
|
||||||
|
form.value.effectDate = dayjs(new Date().getTime()).format('YYYY-MM-DD')
|
||||||
|
})
|
||||||
|
|
||||||
|
function getDict() {
|
||||||
|
// 调整类型
|
||||||
|
getDicts('adjust_type').then(res => {
|
||||||
|
adjustTypeList.value = [res.data]
|
||||||
|
// 如果是新增模式，默认选中"调额"
|
||||||
|
if (!form.value.id && res.data && res.data.length > 0) {
|
||||||
|
const defaultItem = res.data.find(item => item.dictLabel === '调额')
|
||||||
|
if (defaultItem) {
|
||||||
|
form.value.adjustType = defaultItem.dictValue
|
||||||
|
form.value.adjustTypeName = defaultItem.dictLabel
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function getLimitHistoryInfo() {
|
||||||
|
getLimitHistory(form.value.id).then(res => {
|
||||||
|
form.value = { ...form.value, ...res.data }
|
||||||
|
// 获取字典显示名称
|
||||||
|
getDicts('adjust_type').then(result => {
|
||||||
|
form.value.adjustTypeName = dictStr(form.value.adjustType, result.data)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function getCardInfo() {
|
||||||
|
// 先获取该储蓄卡的最新一条调额记录
|
||||||
|
listLimitHistory({
|
||||||
|
pageSize: 1,
|
||||||
|
pageNum: 1,
|
||||||
|
bankCardLendId: form.value.bankCardLendId
|
||||||
|
}).then(res => {
|
||||||
|
if (res.rows && res.rows.length > 0) {
|
||||||
|
// 如果有调额记录，使用最新记录的调整后额度作为调整前额度
|
||||||
|
const afterLimit = res.rows[0].afterLimit || 0
|
||||||
|
form.value.beforeLimit = afterLimit
|
||||||
|
// 默认调整后额度与调整前一致
|
||||||
|
form.value.afterLimit = afterLimit
|
||||||
|
} else {
|
||||||
|
// 如果没有调额记录，使用储蓄卡的当前额度
|
||||||
|
getBankcardLend(form.value.bankCardLendId).then(cardRes => {
|
||||||
|
const limit = cardRes.data.limit || 0
|
||||||
|
form.value.beforeLimit = limit
|
||||||
|
// 默认调整后额度与调整前一致
|
||||||
|
form.value.afterLimit = limit
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}).catch(() => {
|
||||||
|
// 查询失败时，使用储蓄卡的当前额度
|
||||||
|
getBankcardLend(form.value.bankCardLendId).then(cardRes => {
|
||||||
|
const limit = cardRes.data.limit || 0
|
||||||
|
form.value.beforeLimit = limit
|
||||||
|
// 默认调整后额度与调整前一致
|
||||||
|
form.value.afterLimit = limit
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
// 获取储蓄卡账号
|
||||||
|
getBankcardLend(form.value.bankCardLendId).then(res => {
|
||||||
|
form.value.cardNumber = res.data.cardNumber || ''
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function dictStr(val, arr) {
|
||||||
|
let str = ''
|
||||||
|
arr.map(item => {
|
||||||
|
if (item.dictValue === val) {
|
||||||
|
str = item.dictLabel
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return str
|
||||||
|
}
|
||||||
|
|
||||||
|
// 调整类型选择
|
||||||
|
function handleShowAdjustType() {
|
||||||
|
if (adjustTypeList.value[0].length === 0) {
|
||||||
|
proxy.$refs['uToast'].show({
|
||||||
|
message: '调整类型为空',
|
||||||
|
type: 'warning'
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
showAdjustType.value = true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleAdjustTypeConfirm(e) {
|
||||||
|
form.value.adjustTypeName = e.value[0].dictLabel
|
||||||
|
form.value.adjustType = e.value[0].dictValue
|
||||||
|
showAdjustType.value = false
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleAdjustTypeCancel() {
|
||||||
|
showAdjustType.value = false
|
||||||
|
}
|
||||||
|
|
||||||
|
// 生效日期选择
|
||||||
|
function selectEffectDate() {
|
||||||
|
effectDatePickShow.value = true
|
||||||
|
proxy.$refs['effectDateRef'].innerValue = form.value.effectDate
|
||||||
|
? new Date(form.value.effectDate).getTime()
|
||||||
|
: new Date().getTime()
|
||||||
|
}
|
||||||
|
|
||||||
|
function effectDateConfirm(e) {
|
||||||
|
form.value.effectDate = dayjs(e.value).format('YYYY-MM-DD')
|
||||||
|
effectDatePickShow.value = false
|
||||||
|
}
|
||||||
|
|
||||||
|
// 截止日期选择
|
||||||
|
function selectDeadlineDate() {
|
||||||
|
deadlineDatePickShow.value = true
|
||||||
|
proxy.$refs['deadlineDateRef'].innerValue = form.value.deadlineDate
|
||||||
|
? new Date(form.value.deadlineDate).getTime()
|
||||||
|
: new Date().getTime()
|
||||||
|
}
|
||||||
|
|
||||||
|
function deadlineDateConfirm(e) {
|
||||||
|
form.value.deadlineDate = dayjs(e.value).format('YYYY-MM-DD')
|
||||||
|
deadlineDatePickShow.value = false
|
||||||
|
}
|
||||||
|
|
||||||
|
// 调整时间选择
|
||||||
|
function selectAdjustTime() {
|
||||||
|
adjustTimePickShow.value = true
|
||||||
|
proxy.$refs['adjustTimeRef'].innerValue = form.value.adjustTime
|
||||||
|
? new Date(form.value.adjustTime).getTime()
|
||||||
|
: new Date().getTime()
|
||||||
|
}
|
||||||
|
|
||||||
|
function adjustTimeConfirm(e) {
|
||||||
|
form.value.adjustTime = dayjs(e.value).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
adjustTimePickShow.value = false
|
||||||
|
}
|
||||||
|
|
||||||
|
// 提交
|
||||||
|
function submit() {
|
||||||
|
proxy.$refs['uForm'].validate().then(() => {
|
||||||
|
const submitData = { ...form.value }
|
||||||
|
|
||||||
|
if (form.value.id) {
|
||||||
|
// 修改
|
||||||
|
updateLimitHistory(submitData).then(res => {
|
||||||
|
proxy.$refs['uToast'].show({
|
||||||
|
message: '修改成功',
|
||||||
|
complete() {
|
||||||
|
setTimeout(() => {
|
||||||
|
uni.navigateBack()
|
||||||
|
}, 1500)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
// 新增
|
||||||
|
addLimitHistory(submitData).then(res => {
|
||||||
|
proxy.$refs['uToast'].show({
|
||||||
|
message: '调额成功',
|
||||||
|
complete() {
|
||||||
|
setTimeout(() => {
|
||||||
|
uni.navigateBack()
|
||||||
|
}, 1500)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.section {
|
||||||
|
margin: 24rpx;
|
||||||
|
padding: 0;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.section-title {
|
||||||
|
padding: 16rpx 24rpx;
|
||||||
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||||
|
color: #ffffff;
|
||||||
|
line-height: 1.2;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: '';
|
||||||
|
width: 6rpx;
|
||||||
|
height: 28rpx;
|
||||||
|
background: #ffffff;
|
||||||
|
border-radius: 3rpx;
|
||||||
|
margin-right: 12rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-view {
|
||||||
|
padding: 24rpx;
|
||||||
|
|
||||||
|
.form-btn {
|
||||||
|
padding-top: 16rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-info {
|
||||||
|
padding: 24rpx;
|
||||||
|
border-bottom: 2rpx solid #f5f7fa;
|
||||||
|
|
||||||
|
.card-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 12rpx 0;
|
||||||
|
|
||||||
|
&:not(:last-child) {
|
||||||
|
margin-bottom: 8rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-label {
|
||||||
|
color: #667eea;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
background: rgba(102, 126, 234, 0.08);
|
||||||
|
padding: 6rpx 16rpx;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-value {
|
||||||
|
color: #333333;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
flex: 1;
|
||||||
|
text-align: right;
|
||||||
|
margin-left: 16rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.form-btn .u-button {
|
||||||
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
|
||||||
|
border: none !important;
|
||||||
|
border-radius: 24rpx !important;
|
||||||
|
height: 80rpx !important;
|
||||||
|
box-shadow: 0 4rpx 16rpx rgba(102, 126, 234, 0.4) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-btn .u-button__text {
|
||||||
|
font-size: 30rpx !important;
|
||||||
|
font-weight: 500 !important;
|
||||||
|
letter-spacing: 2rpx !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
486
src/pages/work/base/debitCard/limitHistory.vue
Normal file
486
src/pages/work/base/debitCard/limitHistory.vue
Normal file
@@ -0,0 +1,486 @@
|
|||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<u-navbar
|
||||||
|
leftIconSize="40rpx"
|
||||||
|
leftIconColor="#333333"
|
||||||
|
:title="pageTitle"
|
||||||
|
>
|
||||||
|
</u-navbar>
|
||||||
|
|
||||||
|
<u-sticky offsetTop="0rpx" customNavHeight="0rpx">
|
||||||
|
<view class="header-view">
|
||||||
|
<view class="card-info-header">
|
||||||
|
<view class="info-item">
|
||||||
|
<text class="info-label">卡名称：</text>
|
||||||
|
<text class="info-value">{{ cardInfo.name || '--' }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="info-item">
|
||||||
|
<text class="info-label">卡账号：</text>
|
||||||
|
<text class="info-value">{{ cardInfo.code || '--' }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="add-btn" @click="handleAdd()">
|
||||||
|
<uni-icons type="plusempty" size="18" color="#667eea"></uni-icons>
|
||||||
|
<text>新增调额</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-sticky>
|
||||||
|
|
||||||
|
<u-list @scrolltolower="loadmore" :spaceHeight="116" lowerThreshold="100">
|
||||||
|
<u-list-item v-for="(item, index) in listData" :key="index">
|
||||||
|
<view class="list-item" @click="enterDetails(item)">
|
||||||
|
<view class="item-header">
|
||||||
|
<view class="header-left">
|
||||||
|
<view class="adjust-icon" :class="item.adjustLimit > 0 ? 'icon-up' : 'icon-down'">
|
||||||
|
<uni-icons :type="item.adjustLimit > 0 ? 'arrow-up' : 'arrow-down'" size="20" color="#ffffff"></uni-icons>
|
||||||
|
</view>
|
||||||
|
<view class="header-info">
|
||||||
|
<text class="adjust-type">{{ item.adjustTypeName || dictStr(item.adjustType, adjustTypeList) }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="header-center">
|
||||||
|
<text class="adjust-time">{{ formatDate(item.adjustTime) }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="adjust-amount" :class="item.adjustLimit > 0 ? 'amount-up' : 'amount-down'">
|
||||||
|
<text>{{ item.adjustLimit > 0 ? '+' : '' }}{{ item.adjustLimit }}元</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="card-body">
|
||||||
|
<view class="info-row">
|
||||||
|
<view class="info-item">
|
||||||
|
<text class="info-label">调整前额度</text>
|
||||||
|
<text class="info-value">{{ item.beforeLimit }}元</text>
|
||||||
|
</view>
|
||||||
|
<view class="info-item">
|
||||||
|
<text class="info-label">调整后额度</text>
|
||||||
|
<text class="info-value orange">{{ item.afterLimit }}元</text>
|
||||||
|
</view>
|
||||||
|
<view class="info-item">
|
||||||
|
<text class="info-label">生效日期</text>
|
||||||
|
<text class="info-value">{{ item.effectDate || '--' }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="info-item" v-if="item.deadlineDate">
|
||||||
|
<text class="info-label">截止日期</text>
|
||||||
|
<text class="info-value">{{ item.deadlineDate }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="info-item info-item-full" v-if="item.remark">
|
||||||
|
<text class="info-label">备注</text>
|
||||||
|
<text class="info-value">{{ item.remark }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="operate" @click.stop>
|
||||||
|
<view class="btn-edit" @click="handleEdit(item)">
|
||||||
|
<uni-icons type="compose" size="16" color="#667eea"></uni-icons>
|
||||||
|
<text>修改</text>
|
||||||
|
</view>
|
||||||
|
<view class="btn-delete" @click="handleDelete(item)">
|
||||||
|
<uni-icons type="trash" size="16" color="#f5576c"></uni-icons>
|
||||||
|
<text>删除</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-list-item>
|
||||||
|
<view>
|
||||||
|
</view>
|
||||||
|
<u-loadmore :status="status" loadingIcon="semicircle" height="88" fontSize="32rpx" @loadmore="loadmore" />
|
||||||
|
</u-list>
|
||||||
|
</view>
|
||||||
|
<!-- 悬停按钮-->
|
||||||
|
<suspend></suspend>
|
||||||
|
<refresh></refresh>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { listLimitHistory, delLimitHistory } from '@/api/invest/limitHistory'
|
||||||
|
import { getBankcardLend } from '@/api/invest/bankcardlend'
|
||||||
|
import { getDicts } from '@/api/system/dict/data.js'
|
||||||
|
import { onLoad, onShow } from '@dcloudio/uni-app'
|
||||||
|
import { reactive, toRefs, ref, computed } from 'vue'
|
||||||
|
|
||||||
|
const pageNum = ref(1)
|
||||||
|
const listData = ref([])
|
||||||
|
const isShow = ref(false)
|
||||||
|
const status = ref('loadmore')
|
||||||
|
const adjustTypeList = ref([])
|
||||||
|
const bankCardLendId = ref('')
|
||||||
|
const cardName = ref('')
|
||||||
|
const cardInfo = ref({
|
||||||
|
name: '',
|
||||||
|
cardNumber: ''
|
||||||
|
})
|
||||||
|
|
||||||
|
const pageTitle = computed(() => {
|
||||||
|
return cardName.value ? `${cardName.value} - 调额记录` : '调额记录'
|
||||||
|
})
|
||||||
|
|
||||||
|
const data = reactive({
|
||||||
|
queryParams: {
|
||||||
|
bankCardLendId: ''
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
const { queryParams } = toRefs(data)
|
||||||
|
|
||||||
|
onLoad((option) => {
|
||||||
|
bankCardLendId.value = option.bankCardLendId
|
||||||
|
cardName.value = option.name || ''
|
||||||
|
queryParams.value.bankCardLendId = option.bankCardLendId
|
||||||
|
getDict()
|
||||||
|
getCardInfo()
|
||||||
|
getList()
|
||||||
|
})
|
||||||
|
|
||||||
|
onShow(() => {
|
||||||
|
if (isShow.value) {
|
||||||
|
listData.value = []
|
||||||
|
pageNum.value = 1
|
||||||
|
getList()
|
||||||
|
isShow.value = false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
function loadmore() {
|
||||||
|
pageNum.value += 1
|
||||||
|
if (status.value == 'loadmore') {
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function getList() {
|
||||||
|
status.value = 'loading'
|
||||||
|
listLimitHistory({ pageSize: 10, pageNum: pageNum.value, ...queryParams.value }).then(res => {
|
||||||
|
listData.value = listData.value.concat(res.rows)
|
||||||
|
if (listData.value.length < res.total) {
|
||||||
|
status.value = 'loadmore'
|
||||||
|
} else {
|
||||||
|
status.value = 'nomore'
|
||||||
|
}
|
||||||
|
}).catch(() => {
|
||||||
|
status.value = 'nomore'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function getDict() {
|
||||||
|
// 调整类型
|
||||||
|
getDicts('adjust_type').then(res => {
|
||||||
|
adjustTypeList.value = res.data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function getCardInfo() {
|
||||||
|
getBankcardLend(bankCardLendId.value).then(res => {
|
||||||
|
cardInfo.value.name = res.data.name || ''
|
||||||
|
cardInfo.value.code = res.data.code || ''
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function dictStr(val, arr) {
|
||||||
|
let str = ''
|
||||||
|
arr.map(item => {
|
||||||
|
if (item.dictValue === val) {
|
||||||
|
str = item.dictLabel
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return str
|
||||||
|
}
|
||||||
|
|
||||||
|
function formatDate(dateTime) {
|
||||||
|
if (!dateTime) return '--'
|
||||||
|
// 只取日期部分 YYYY-MM-DD
|
||||||
|
return dateTime.split(' ')[0]
|
||||||
|
}
|
||||||
|
|
||||||
|
function enterDetails(item) {
|
||||||
|
// 可以添加详情页面
|
||||||
|
handleEdit(item)
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleEdit(item) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/work/base/debitCard/adjustLimit?id=${item.id}&bankCardLendId=${bankCardLendId.value}&name=${cardName.value}`
|
||||||
|
})
|
||||||
|
isShow.value = true
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleAdd() {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/work/base/debitCard/adjustLimit?bankCardLendId=${bankCardLendId.value}&name=${cardName.value}`
|
||||||
|
})
|
||||||
|
isShow.value = true
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleDelete(item) {
|
||||||
|
uni.showModal({
|
||||||
|
title: '确认删除',
|
||||||
|
content: '确定要删除这条调额记录吗？',
|
||||||
|
confirmText: '删除',
|
||||||
|
cancelText: '取消',
|
||||||
|
confirmColor: '#f5576c',
|
||||||
|
cancelColor: '#909399',
|
||||||
|
success: function (res) {
|
||||||
|
if (res.confirm) {
|
||||||
|
delLimitHistory(item.id).then(() => {
|
||||||
|
uni.showToast({
|
||||||
|
title: '删除成功',
|
||||||
|
icon: 'success'
|
||||||
|
})
|
||||||
|
pageNum.value = 1
|
||||||
|
listData.value = []
|
||||||
|
getList()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
page {
|
||||||
|
height: 100%;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
.container {
|
||||||
|
background: #f5f7fa;
|
||||||
|
min-height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-view {
|
||||||
|
padding: 12rpx 32rpx;
|
||||||
|
background-color: #ffffff;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.05);
|
||||||
|
gap: 24rpx;
|
||||||
|
|
||||||
|
.card-info-header {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 8rpx;
|
||||||
|
|
||||||
|
.info-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.info-label {
|
||||||
|
color: #667eea;
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-value {
|
||||||
|
color: #333333;
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.add-btn {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 6rpx;
|
||||||
|
padding: 12rpx 24rpx;
|
||||||
|
background: rgba(102, 126, 234, 0.08);
|
||||||
|
border-radius: 24rpx;
|
||||||
|
border: 2rpx solid rgba(102, 126, 234, 0.3);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.95);
|
||||||
|
background: rgba(102, 126, 234, 0.12);
|
||||||
|
}
|
||||||
|
|
||||||
|
text {
|
||||||
|
color: #667eea;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.list-item {
|
||||||
|
margin: 10rpx 24rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.98);
|
||||||
|
box-shadow: 0 1rpx 6rpx rgba(0, 0, 0, 0.06);
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 16rpx 24rpx;
|
||||||
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||||
|
gap: 16rpx;
|
||||||
|
|
||||||
|
.header-left {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
.adjust-icon {
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-right: 12rpx;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
&.icon-up {
|
||||||
|
background: rgba(82, 196, 26, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.icon-down {
|
||||||
|
background: rgba(255, 77, 79, 0.3);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-info {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.adjust-type {
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: 1.2;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-center {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.adjust-time {
|
||||||
|
color: rgba(255, 255, 255, 0.9);
|
||||||
|
font-size: 30rpx;
|
||||||
|
line-height: 1;
|
||||||
|
font-weight: 500;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.adjust-amount {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 700;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
&.amount-up {
|
||||||
|
color: #52c41a;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.amount-down {
|
||||||
|
color: #ff4d4f;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-body {
|
||||||
|
padding: 24rpx;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-row {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 24rpx;
|
||||||
|
|
||||||
|
.info-item {
|
||||||
|
flex: 0 0 calc(50% - 12rpx);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 4rpx;
|
||||||
|
min-width: 0;
|
||||||
|
|
||||||
|
&.info-item-full {
|
||||||
|
flex: 0 0 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-label {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #667eea;
|
||||||
|
font-weight: 500;
|
||||||
|
background: rgba(102, 126, 234, 0.08);
|
||||||
|
padding: 6rpx 12rpx;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
align-self: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-value {
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #333;
|
||||||
|
font-weight: 500;
|
||||||
|
line-height: 1.5;
|
||||||
|
word-break: break-all;
|
||||||
|
|
||||||
|
&.orange {
|
||||||
|
color: #fa8c16;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:not(.info-item-full) .info-value {
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.operate {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
padding: 16rpx 24rpx 24rpx;
|
||||||
|
gap: 16rpx;
|
||||||
|
|
||||||
|
.btn-edit,
|
||||||
|
.btn-delete {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 6rpx;
|
||||||
|
padding: 0 24rpx;
|
||||||
|
height: 64rpx;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.95);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-edit {
|
||||||
|
background: rgba(102, 126, 234, 0.1);
|
||||||
|
color: #667eea;
|
||||||
|
border: 1rpx solid rgba(102, 126, 234, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-delete {
|
||||||
|
background: rgba(245, 87, 108, 0.1);
|
||||||
|
color: #f5576c;
|
||||||
|
border: 1rpx solid rgba(245, 87, 108, 0.3);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -84,6 +84,10 @@
|
|||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="operate" @click.stop>
|
<view class="operate" @click.stop>
|
||||||
|
<view class="btn-limit" @click="handleLimitHistory(item)">
|
||||||
|
<uni-icons type="list" size="16" color="#fa8c16"></uni-icons>
|
||||||
|
<text>调额记录</text>
|
||||||
|
</view>
|
||||||
<view class="btn-edit" @click="handleEdit(item)">
|
<view class="btn-edit" @click="handleEdit(item)">
|
||||||
<uni-icons type="compose" size="16" color="#667eea"></uni-icons>
|
<uni-icons type="compose" size="16" color="#667eea"></uni-icons>
|
||||||
<text>修改</text>
|
<text>修改</text>
|
||||||
@@ -254,6 +258,10 @@ function selectStatus(item) {
|
|||||||
uni.navigateTo({ url: `/pages/work/base/debitCard/addEdit` })
|
uni.navigateTo({ url: `/pages/work/base/debitCard/addEdit` })
|
||||||
isShow.value = true
|
isShow.value = true
|
||||||
}
|
}
|
||||||
|
function handleLimitHistory(item) {
|
||||||
|
uni.navigateTo({ url: `/pages/work/base/debitCard/limitHistory?bankCardLendId=${item.id}&name=${item.name}` })
|
||||||
|
isShow.value = true
|
||||||
|
}
|
||||||
function handleDelete(item) {
|
function handleDelete(item) {
|
||||||
uni.showModal({
|
uni.showModal({
|
||||||
title: '确认删除',
|
title: '确认删除',
|
||||||
@@ -640,6 +648,7 @@ page {
|
|||||||
gap: 16rpx;
|
gap: 16rpx;
|
||||||
|
|
||||||
.btn-edit,
|
.btn-edit,
|
||||||
|
.btn-limit,
|
||||||
.btn-delete {
|
.btn-delete {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@@ -663,6 +672,12 @@ page {
|
|||||||
border: 1rpx solid rgba(102, 126, 234, 0.3);
|
border: 1rpx solid rgba(102, 126, 234, 0.3);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.btn-limit {
|
||||||
|
background: rgba(250, 140, 22, 0.1);
|
||||||
|
color: #fa8c16;
|
||||||
|
border: 1rpx solid rgba(250, 140, 22, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
.btn-delete {
|
.btn-delete {
|
||||||
background: rgba(245, 87, 108, 0.1);
|
background: rgba(245, 87, 108, 0.1);
|
||||||
color: #f5576c;
|
color: #f5576c;
|
||||||
|
|||||||
Reference in New Issue
Block a user