This commit is contained in:
ycy 2024-04-09 13:34:54 +08:00
commit 72beb9cff4
7 changed files with 498 additions and 2 deletions

View File

@ -13,6 +13,20 @@ const data = Mock.mock({
}
]
})
const loans = Mock.mock({
"list|45": [
{
"id|+1": 1,
'proposer': '@cname',
'student': '@integer(100000000,999999999)',
'allowance': '@integer(10000,50000)',
'department': '@pick(["机电工程系","护理分院","建筑系","材料科学与工程系","环境科学与工程系"])',
'cation': '@pick(["2021-2022学年度","2022-2023学年度"])',
'loanTerm': '@pick(["已放款","未放款"])',
'timeofapplication': '@date("yyyy-MM-dd")',
}
]
})
export default [
{
url: '/get-sdy-managment-list',
@ -58,5 +72,38 @@ export default [
code: 200,
}
}
}
},
// 借款管理
{
url: '/get-sdy-loan-list',
method: 'get',
response: () => {
return {
code: 200,
data: loans
}
}
},
// 添加借款人
{
url: '/post-sdy-loan-add',
method: 'post',
response: (req) => {
const newLoan = {
id: loans.list.length + 1,
proposer: req.body.proposer,
student: req.body.student,
allowance: req.body.allowance,
department: req.body.department,
cation: req.body.cation,
loanTerm: req.body.loanTerm,
timeofapplication: req.body.timeofapplication,
}
loans.list.push(newLoan)
return {
code: 200,
data: newLoan
}
}
},
]

28
package-lock.json generated
View File

@ -10,6 +10,7 @@
"dependencies": {
"axios": "^1.6.8",
"dayjs": "^1.11.10",
"echarts": "^5.5.0",
"less": "^4.2.0",
"mockjs": "^1.1.0",
"pinia": "^2.1.7",
@ -1024,6 +1025,20 @@
"node": ">=0.4.0"
}
},
"node_modules/echarts": {
"version": "5.5.0",
"resolved": "https://registry.npmjs.org/echarts/-/echarts-5.5.0.tgz",
"integrity": "sha512-rNYnNCzqDAPCr4m/fqyUFv7fD9qIsd50S6GDFgO1DxZhncCsNsG7IfUlAlvZe5oSEQxtsjnHiUuppzccry93Xw==",
"dependencies": {
"tslib": "2.3.0",
"zrender": "5.5.0"
}
},
"node_modules/echarts/node_modules/tslib": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
"integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
},
"node_modules/ee-first": {
"version": "1.1.1",
"license": "MIT"
@ -2058,6 +2073,19 @@
"version": "3.1.1",
"dev": true,
"license": "ISC"
},
"node_modules/zrender": {
"version": "5.5.0",
"resolved": "https://registry.npmjs.org/zrender/-/zrender-5.5.0.tgz",
"integrity": "sha512-O3MilSi/9mwoovx77m6ROZM7sXShR/O/JIanvzTwjN3FORfLSr81PsUGd7jlaYOeds9d8tw82oP44+3YucVo+w==",
"dependencies": {
"tslib": "2.3.0"
}
},
"node_modules/zrender/node_modules/tslib": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
"integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
}
}
}

View File

@ -11,6 +11,7 @@
"dependencies": {
"axios": "^1.6.8",
"dayjs": "^1.11.10",
"echarts": "^5.5.0",
"less": "^4.2.0",
"mockjs": "^1.1.0",
"pinia": "^2.1.7",

View File

@ -1,8 +1,17 @@
import request from '@/utils/request'
// 收款管理
export function APIReceivablesList() {
return request.get('/get-sdy-managment-list')
}
//查询收款
export function APIReceivablesAdd(data) {
return request.post('/post-sdy-managment-find', data)
}
//贷款管理
export function APILoansList() {
return request.get('/get-sdy-loan-list')
}
//查询贷款
export function APILoansAdd(data) {
return request.post('/post-sdy-loan-add', data)
}

View File

@ -45,6 +45,9 @@
<t-menu-item value="3-2" to="/billCollected">
<span>学生收款</span>
</t-menu-item>
<t-menu-item value="3-3" to="/student-loan">
<span>助学贷款</span>
</t-menu-item>
</t-submenu>
<t-submenu value="4" title="学生管理">
<template #icon>

View File

@ -0,0 +1,402 @@
<template>
<div class="back-color">
<!-- 表单 -->
<div class="search-form">
<t-form
ref="form"
:data="formData"
reset-type="initial"
colon
@reset="onReset"
@submit="onSubmit"
>
<t-row>
<t-col :span="3">
<t-form-item label="学生姓名" name="name">
<t-input v-model="formData.name"></t-input>
</t-form-item>
</t-col>
<t-col :span="3">
<t-form-item label="学号" name="studentnumber">
<t-input v-model="formData.studentnumber"></t-input>
</t-form-item>
</t-col>
<t-col :push="4" :span="2">
<t-button type="submit" class="button" style="margin-left: -0.5rem"
>搜索</t-button
>
<t-button type="reset" style="margin-left: 1.5rem">重置</t-button>
</t-col>
</t-row>
</t-form>
</div>
<!-- 表格 -->
<div>
<div>
<t-row>
<t-col :span="3" :offset="10" style="margin-bottom: 0.5rem">
<t-button theme="default" variant="text" @click="onClick"
>申请助学贷款</t-button
>
</t-col>
</t-row>
</div>
<t-table
row-key="id"
:data="data"
:columns="columns"
table-layout="fixed"
size="medium"
:pagination="pagination"
:show-header="true"
cell-empty-content="-"
resizable
lazy-load
:loading="loading"
@row-click="handleRowClick"
@page-change="onPageChange"
>
</t-table>
</div>
<!-- 图表 -->
<div style="background-color: #fff; margin-top: 4rem; display: flex">
<div ref="chartContainer" style="width: 45rem; height: 35rem"></div>
<div>
<t-select
v-model="value"
placeholder="请选择"
:options="options"
size="medium"
@change="handleChange"
style="width: 200px; display: inline-block; margin-right: 20px"
/>
</div>
</div>
<!-- 弹出框 -->
<div>
<t-space>
<t-dialog
v-model:visible="visible"
header="申请贷款"
width="20%"
:on-cancel="onCancel"
:on-close-btn-click="onCloseBtnClick"
:on-confirm="onConfirmAnother"
:close-on-overlay-click="false"
>
<t-space direction="vertical" style="width: 100%">
<t-space direction="vertical" size="large">
<t-form
ref="form"
:data="formData"
reset-type="initial"
colon
@reset="onReset"
>
<t-form-item label="申请人" name="name">
<t-input v-model="addData.proposer"></t-input>
</t-form-item>
<t-form-item label="学号" name="RoutingAddress">
<t-input v-model="addData.student"></t-input>
</t-form-item>
<t-form-item label="所在部门" name="RoutingAddress">
<t-input v-model="addData.department"></t-input>
</t-form-item>
<t-form-item label="助学金额" name="RoutingAddress">
<t-input v-model="addData.allowance"></t-input>
</t-form-item>
<t-form-item label="是否下款" name="RoutingAddress">
<t-input v-model="addData.loanTerm"></t-input>
</t-form-item>
<t-form-item label="申请时间" name="RoutingAddress">
<t-input v-model="addData.timeofapplication"></t-input>
</t-form-item>
</t-form>
</t-space>
</t-space>
</t-dialog>
</t-space>
</div>
</div>
</template>
<script setup>
import { ref, onMounted } from 'vue'
import {
APILoansList,
APILoansAdd
} from '@/api/receivables-management/management'
import * as echarts from 'echarts'
//
const data = ref([])
//
const formData = ref({
name: '',
studentnumber: ''
})
//
const loading = ref(false)
//
const columns = ref([
{ colKey: 'proposer', title: '申请人', width: '100' },
{ colKey: 'student', title: '学号', width: '100' },
{ colKey: 'department', title: '所在部门', width: '100' },
{ colKey: 'allowance', title: '助学金额', width: '100' },
{ colKey: 'loanTerm', title: '是否下款', width: '100' },
{ colKey: 'timeofapplication', title: '申请时间', width: '100' },
{ colKey: 'status', title: '操作', width: '100' }
])
//
const pagination = ref({
defaultCurrent: 1,
defaultPageSize: 10,
total: 30
})
//
const visible = ref(false)
//
const addData = ref({
proposer: '',
student: '',
department: '',
allowance: '',
loanTerm: '',
timeofapplication: ''
})
//
const options = [
{ label: '年', value: '年' },
{ label: '部门', value: '部门' }
]
//
const value = ref('年')
const handleRowClick = e => {
console.log(e)
}
//
const onPageChange = () => {
loading.value = true
const timerId = setTimeout(() => {
loading.value = false
clearInterval(timerId)
}, 300)
}
//
const LoansList = async () => {
const res = await APILoansList()
data.value = res.data.list
pagination.value.total = res.data.list.length
}
//
const onReset = () => {
LoansList()
}
//
const onSubmit = async () => {}
//
const onClick = context => {
console.log('点击了确认按钮,弹出弹窗', context)
visible.value = true
}
const onConfirmAnother = async context => {
console.log('点击了确认按钮', context)
await APILoansAdd(addData.value)
visible.value = false
}
const onCancel = context => {
console.log('点击了取消按钮', context)
}
const onCloseBtnClick = context => {
console.log('点击了关闭按钮', context)
}
//
const chartContainer = ref(null)
let option = {
title: {
text: '助学贷学生明细表',
left: 'center'
},
tooltip: {
trigger: 'item',
formatter: '助学贷学生:{b}<br/>申请助学贷款:{c}人'
},
legend: {
left: 'left'
},
xAxis: {
type: 'category',
name: 'x',
splitLine: { show: false },
data: [
'1月',
'2月',
'3月',
'4月',
'5月',
'6月',
'7月',
'8月',
'9月',
'10月',
'11月',
'12月'
]
},
grid: {
left: '0%',
right: '0%',
bottom: '0%',
containLabel: true
},
yAxis: {
type: 'log',
name: 'y',
minorSplitLine: {
show: true
}
},
series: [
{
name: '今年',
type: 'line',
data: [10, 3, 9, 27, 81, 247, 74, 80, 70, 30, 40, 50]
},
{
name: '去年',
type: 'line',
data: [12, 2, 4, 8, 16, 32, 64, 128, 25, 51, 50, 100]
}
]
}
const eoption = option => {
const chart = echarts.init(chartContainer.value)
chart.setOption(option)
}
onMounted(() => {
eoption(option)
})
//
const handleChange = value => {
if (value === '年') {
let option = {
title: {
text: '助学贷学生明细表',
left: 'center'
},
tooltip: {
trigger: 'item',
formatter: '助学贷学生:{b}<br/>申请助学贷款:{c}人'
},
legend: {
left: 'left'
},
xAxis: {
type: 'category',
name: 'x',
splitLine: { show: false },
data: [
'1月',
'2月',
'3月',
'4月',
'5月',
'6月',
'7月',
'8月',
'9月',
'10月',
'11月',
'12月'
]
},
grid: {
left: '0%',
right: '0%',
bottom: '0%',
containLabel: true
},
yAxis: {
type: 'log',
name: 'y',
minorSplitLine: {
show: true
}
},
series: [
{
name: '今年',
type: 'line',
data: [10, 3, 9, 27, 81, 247, 74, 80, 70, 30, 40, 50]
},
{
name: '去年',
type: 'line',
data: [12, 2, 4, 8, 16, 32, 64, 128, 25, 51, 50, 100]
}
]
}
eoption(option)
} else if (value === '部门') {
let option1 = {
title: {
text: '助学贷学生明细表',
left: 'center'
},
tooltip: {
trigger: 'item',
formatter: '助学贷学生:{b}<br/>申请助学贷款:{c}人'
},
legend: {
left: 'left'
},
xAxis: {
type: 'category',
name: 'x',
splitLine: { show: false },
data: ['机电工程系', '护理系', '建筑系', '人文系', '社会系']
},
grid: {
left: '0%',
right: '0%',
bottom: '0%',
containLabel: true
},
yAxis: {
type: 'log',
name: 'y',
minorSplitLine: {
show: true
}
},
series: [
{
name: '今年',
type: 'line',
data: [74, 80, 70, 30, 40, 50]
},
{
name: '去年',
type: 'line',
data: [64, 128, 25, 51, 50, 100]
}
]
}
eoption(option1)
}
}
onMounted(() => {
LoansList()
})
</script>
<style lang="less" scoped>
.search-form {
margin-bottom: 1.5rem;
background-color: #fff;
height: 4rem;
padding-top: 1rem;
}
</style>

View File

@ -25,6 +25,12 @@ const ReceivablesManagement = [
name: "BillBill",
component: () => import("@/pages/receivables-management/Bill.vue"),
meta: { title: "票据", hidden: false },
},
{
path: "/student-loan",
name: "StudentLoan",
component: () => import("@/pages/receivables-management/studentLoan.vue"),
meta: { title: "助学贷款", },
}
],
},