| | |
| | | <view class="search-section"> |
| | | <view class="search-bar"> |
| | | <view class="search-input"> |
| | | <up-input v-model="filters.borrowerName" placeholder="借款人姓名" clearable /> |
| | | <up-input class="search-text" placeholder="请输入客户名称搜索" v-model="searchForm.borrowerName" clearable /> |
| | | </view> |
| | | <view class="search-input"> |
| | | <uni-datetime-picker type="daterange" v-model="filters.borrowDate" @change="onDateChange" /> |
| | | <view class="filter-button" @click="handleQuery"> |
| | | <up-icon name="search" size="24" color="#999"></up-icon> |
| | | </view> |
| | | <view class="search-input"> |
| | | <up-picker :columns="[statusOptions]" key-name="label" v-model="statusIndex" @confirm="onStatusConfirm"> |
| | | <up-input readonly :value="statusLabel" placeholder="借款状态" /> |
| | | </up-picker> |
| | | </view> |
| | | <view class="filter-button" @click="getList"> |
| | | <up-icon name="search" size="24" color="#999" /> |
| | | </view> |
| | | </view> |
| | | <view class="actions"> |
| | | <u-button type="primary" size="small" @click="goAdd">新增</u-button> |
| | | </view> |
| | | </view> |
| | | <view class="ledger-list" v-if="list.length>0"> |
| | |
| | | <view class="detail-row"><text class="detail-label">实际还款日期</text><text class="detail-value">{{ item.repayDate || '--' }}</text></view> |
| | | <view class="detail-row"><text class="detail-label">备注</text><text class="detail-value">{{ item.remark || '--' }}</text></view> |
| | | </view> |
| | | <view class="card-actions"> |
| | | <u-button size="small" @click="goEdit(item)">编辑</u-button> |
| | | <u-button size="small" type="warning" @click="goRepay(item)" :disabled="item.status!==1">还款</u-button> |
| | | <u-button size="small" type="error" @click="confirmDelete(item)">删除</u-button> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view class="no-data" v-else><text>暂无数据</text></view> |
| | | |
| | | <up-popup :show="formShow" mode="bottom" @close="closeForm"> |
| | | <view class="popup"> |
| | | <view class="popup-header">{{ formMode==='add'?'新增借款': formMode==='repay'?'还款':'编辑借款' }}</view> |
| | | <up-form :model="form" :rules="rules" ref="formRef"> |
| | | <up-form-item label="借款人姓名" prop="borrowerName"> |
| | | <up-input v-model="form.borrowerName" placeholder="请输入" /> |
| | | </up-form-item> |
| | | <up-form-item label="借款金额" prop="borrowAmount"> |
| | | <up-input type="number" v-model="form.borrowAmount" placeholder="请输入" /> |
| | | </up-form-item> |
| | | <up-form-item label="借款利率(%)" prop="interestRate"> |
| | | <up-input type="number" v-model="form.interestRate" placeholder="例如 5.85" /> |
| | | </up-form-item> |
| | | <up-form-item label="借款日期" prop="borrowDate"> |
| | | <uni-datetime-picker type="date" v-model="form.borrowDate" /> |
| | | </up-form-item> |
| | | <up-form-item v-if="formMode==='repay'" label="实际还款日期" prop="repayDate"> |
| | | <uni-datetime-picker type="date" v-model="form.repayDate" /> |
| | | </up-form-item> |
| | | <up-form-item label="备注" prop="remark"> |
| | | <up-textarea v-model="form.remark" autoHeight /> |
| | | </up-form-item> |
| | | </up-form> |
| | | <view class="popup-actions"> |
| | | <u-button @click="closeForm">取消</u-button> |
| | | <u-button type="primary" @click="submitForm">保存</u-button> |
| | | </view> |
| | | </view> |
| | | </up-popup> |
| | | </view> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { ref, reactive } from "vue"; |
| | | import { onShow } from "@dcloudio/uni-app"; |
| | | import { listPage, delAccountLoan } from "@/api/financialManagement/loanManagement"; |
| | | import { listPage } from "@/api/financialManagement/loanManagement"; |
| | | |
| | | const list = ref([]); |
| | | const filters = reactive({ borrowerName: "", borrowDate: null, entryDateStart: undefined, entryDateEnd: undefined, status: undefined }); |
| | | const statusOptions = ref([{ label: "全部", value: undefined }, { label: "待还款", value: 1 }, { label: "已还款", value: 2 }]); |
| | | const statusIndex = ref([0]); |
| | | const statusLabel = ref(""); |
| | | const searchForm = reactive({ borrowerName: "", current: -1, size: -1 }); |
| | | |
| | | const formShow = ref(false); |
| | | const formMode = ref("add"); |
| | | const formRef = ref(); |
| | | const form = reactive({ |
| | | id: undefined, |
| | | borrowerName: "", |
| | | borrowAmount: undefined, |
| | | interestRate: undefined, |
| | | borrowDate: undefined, |
| | | repayDate: undefined, |
| | | remark: "", |
| | | status: undefined, |
| | | }); |
| | | const rules = { |
| | | borrowerName: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | borrowAmount: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | interestRate: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | borrowDate: [{ required: true, message: "请选择", trigger: "change" }], |
| | | repayDate: [{ validator: (_r, v, cb)=>{ if (formMode.value==='repay' && !v) return cb(new Error('请选择')); cb(); }, trigger: "change" }], |
| | | }; |
| | | |
| | | const getList = () => { |
| | | const extra = {}; |
| | | if (filters.entryDateStart && filters.entryDateEnd) { |
| | | extra.entryDateStart = filters.entryDateStart; |
| | | extra.entryDateEnd = filters.entryDateEnd; |
| | | } |
| | | if (filters.status) extra.status = filters.status; |
| | | listPage({ borrowerName: filters.borrowerName, ...extra, current: 1, size: 100 }) |
| | | listPage({ ...searchForm, current: -1, size: -1 }) |
| | | .then(res => { |
| | | const records = res?.data?.records ?? res?.records ?? []; |
| | | list.value = records; |
| | | }); |
| | | }; |
| | | |
| | | const onDateChange = (val) => { |
| | | if (val && val.length === 2) { |
| | | filters.entryDateStart = val[0]; |
| | | filters.entryDateEnd = val[1]; |
| | | } else { |
| | | filters.entryDateStart = undefined; |
| | | filters.entryDateEnd = undefined; |
| | | } |
| | | const handleQuery = () => { |
| | | searchForm.current = 1; |
| | | getList(); |
| | | }; |
| | | |
| | | const statusText = (s) => s===1?'待还款': s===2?'已还款':''; |
| | | const statusType = (s) => s===1?'error': s===2?'success':'primary'; |
| | | const fmtAmount = (v) => { |
| | |
| | | if (v===undefined || v===null || v==='') return '-'; |
| | | const n = parseFloat(v); |
| | | return n.toFixed(2) + '%'; |
| | | }; |
| | | |
| | | const goAdd = () => { |
| | | uni.navigateTo({ url: "/pages/financialManagement/loanManagement/edit?type=add" }); |
| | | }; |
| | | const goEdit = (row) => { |
| | | uni.navigateTo({ url: `/pages/financialManagement/loanManagement/edit?type=edit&id=${row.id}` }); |
| | | }; |
| | | const goRepay = (row) => { |
| | | uni.navigateTo({ url: `/pages/financialManagement/loanManagement/edit?type=repay&id=${row.id}` }); |
| | | }; |
| | | const confirmDelete = (row) => { |
| | | uni.showModal({ |
| | | title: "提示", |
| | | content: "确认删除该记录?", |
| | | success: async (r) => { |
| | | if (r.confirm) { |
| | | const ids = Array.isArray(row) ? row.map(i=>i.id) : [row.id]; |
| | | const res = await delAccountLoan(ids); |
| | | if (res?.code === 200) getList(); |
| | | } |
| | | }, |
| | | }); |
| | | }; |
| | | |
| | | const onStatusConfirm = (e) => { |
| | | const item = statusOptions.value[e.value[0]]; |
| | | if (item) { |
| | | filters.status = item.value; |
| | | statusLabel.value = item.label || ""; |
| | | } |
| | | }; |
| | | |
| | | const goBack = () => { |