✨ feat:完成了可以添加学生收费金额的管理
This commit is contained in:
sundongyu
parent
220d9d4fd8
commit
4947b7e1ec
|
|
@ -1,6 +1,14 @@
|
|||
<template>
|
||||
<div style="height: 100%">
|
||||
<t-menu>
|
||||
<t-submenu value="3" title="首页">
|
||||
<template #icon>
|
||||
<t-icon name="home" />
|
||||
</template>
|
||||
<t-menu-item value="3-1" to="/home">
|
||||
<span>首页</span>
|
||||
</t-menu-item>
|
||||
</t-submenu>
|
||||
<t-submenu value="1" title="财务票据管理">
|
||||
<template #icon>
|
||||
<t-icon name="application" />
|
||||
|
|
@ -22,6 +30,9 @@
|
|||
<t-menu-item value="2-1" to="/accounts">
|
||||
<span>应收款管理</span>
|
||||
</t-menu-item>
|
||||
<t-menu-item value="2-2" to="/billCollected">
|
||||
<span>学生收款</span>
|
||||
</t-menu-item>
|
||||
</t-submenu>
|
||||
</t-menu>
|
||||
</div>
|
||||
|
|
|
|||
7
src/pages/home/index.vue
Normal file
7
src/pages/home/index.vue
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
<template>
|
||||
<div></div>
|
||||
</template>
|
||||
|
||||
<script setup></script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
|
|
@ -168,7 +168,7 @@ const InvoiceData = ref({
|
|||
//备注
|
||||
xremark: '',
|
||||
// 应收费(小写)
|
||||
xcharge: Route.query.letters[0],
|
||||
xcharge: Route.query.letters ? Route.query.letters[0] : 0,
|
||||
// 应收费(大写)
|
||||
xchargebig: '',
|
||||
//收款人
|
||||
|
|
|
|||
|
|
@ -79,9 +79,13 @@
|
|||
<t-tag v-else theme="success">{{ row.tuition }}</t-tag>
|
||||
</template>
|
||||
<template #action="{ row }">
|
||||
<t-button v-if="row.tuition === '未缴学费'" @click="handleTicket(row)"
|
||||
<t-button
|
||||
v-if="row.tuition === '未缴学费'"
|
||||
theme="danger"
|
||||
@click="handleTicket(row)"
|
||||
>清缴学费</t-button
|
||||
>
|
||||
<t-button v-else @click="hreturn(row)">退还学费</t-button>
|
||||
</template>
|
||||
</t-table>
|
||||
</div>
|
||||
|
|
@ -254,6 +258,12 @@ const handleTicket = row => {
|
|||
query: row
|
||||
})
|
||||
}
|
||||
//退还学费
|
||||
const hreturn = row => {
|
||||
router.push({
|
||||
path: 'bill-bill'
|
||||
})
|
||||
}
|
||||
onMounted(() => {
|
||||
ReceivablesList()
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<div>
|
||||
<t-table
|
||||
ref="tableRef"
|
||||
row-key="key"
|
||||
|
|
@ -16,10 +17,82 @@
|
|||
</template>
|
||||
</t-table>
|
||||
</div>
|
||||
<div v-if="judge()">
|
||||
<div
|
||||
style="
|
||||
font-size: 2rem;
|
||||
height: 5rem;
|
||||
line-height: 5rem;
|
||||
text-align: center;
|
||||
"
|
||||
>
|
||||
管理学生收费
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
<t-row justify="end">
|
||||
<t-col span="2">
|
||||
<t-button theme="default" variant="text" @click="onClick"
|
||||
>添加收费标准</t-button
|
||||
>
|
||||
</t-col>
|
||||
</t-row>
|
||||
</div>
|
||||
<t-base-table
|
||||
row-key="index"
|
||||
:data="RATES_OPTIONS"
|
||||
:columns="ratesColumns"
|
||||
@page-change="onPageChange"
|
||||
:pagination="pagination"
|
||||
>
|
||||
<template #operation="{ row }">
|
||||
<t-button theme="default" variant="text" @click="Role(row)"
|
||||
>编辑</t-button
|
||||
>
|
||||
<t-button theme="default" variant="text" @click="DeleteRole(row)"
|
||||
>删除</t-button
|
||||
>
|
||||
</template>
|
||||
</t-base-table>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<t-space>
|
||||
<t-dialog
|
||||
v-model:visible="visible"
|
||||
header="添加学生收费标准"
|
||||
width="30%"
|
||||
: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="formData.name"></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="应收金额" name="RoutingAddress">
|
||||
<t-input v-model="formData.RoutingAddress"></t-input>
|
||||
</t-form-item>
|
||||
</t-form>
|
||||
</t-space>
|
||||
</t-space>
|
||||
</t-dialog>
|
||||
</t-space>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
import { ref, computed } from 'vue'
|
||||
import { ref, computed, reactive, watchEffect } from 'vue'
|
||||
import { Input, Select } from 'tdesign-vue-next'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { useRouter } from 'vue-router'
|
||||
|
|
@ -27,7 +100,8 @@ import dayjs from 'dayjs'
|
|||
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const initData = new Array(1).fill(null).map((_, i) => ({
|
||||
const initData = reactive(
|
||||
new Array(1).fill(null).map((_, i) => ({
|
||||
key: String(i + 1),
|
||||
//学生姓名
|
||||
firstName: route.query.name,
|
||||
|
|
@ -38,6 +112,7 @@ const initData = new Array(1).fill(null).map((_, i) => ({
|
|||
letters: [],
|
||||
createTime: dayjs().format('YYYY-MM-DD')
|
||||
}))
|
||||
)
|
||||
//学生部门
|
||||
const STATUS_OPTIONS = [
|
||||
{ label: '机电工程系', value: '机电工程系' },
|
||||
|
|
@ -54,6 +129,40 @@ const CLASS_NAME = [
|
|||
{ label: '建筑1班', value: '建筑1班' },
|
||||
{ label: '护理1班', value: '护理1班' }
|
||||
]
|
||||
//学生收费标准
|
||||
let RATES_OPTIONS = reactive([
|
||||
{ label: '初级学生', value: '2000元' },
|
||||
{ label: '中级学生', value: '3000元' },
|
||||
{ label: '高级学生', value: '4000元' },
|
||||
{ label: '老年学生', value: '5000元' },
|
||||
{ label: '神级学生', value: '6000元' }
|
||||
])
|
||||
//学生收费标准表头
|
||||
const ratesColumns = [
|
||||
{ title: '学生收费标准', colKey: 'label' },
|
||||
{
|
||||
title: '学生应收费',
|
||||
colKey: 'value'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
colKey: 'operation',
|
||||
width: 200,
|
||||
align: 'center'
|
||||
}
|
||||
]
|
||||
// 弹窗表单数据
|
||||
const formData = ref({
|
||||
name: '',
|
||||
RoutingAddress: ''
|
||||
})
|
||||
// 表格分页
|
||||
const pagination = ref({
|
||||
defaultPageSize: 5,
|
||||
total: 5,
|
||||
defaultCurrent: 1
|
||||
})
|
||||
const visible = ref(false)
|
||||
const align = ref('left')
|
||||
const data = ref([...initData])
|
||||
const editableCellState = cellParams => {
|
||||
|
|
@ -146,13 +255,9 @@ const columns = computed(() => [
|
|||
return {
|
||||
multiple: true,
|
||||
minCollapsedNum: 1,
|
||||
options: [
|
||||
{ label: '初级学生', value: '2000元' },
|
||||
{ label: '中级学生', value: '3000元' },
|
||||
{ label: '高级学生', value: '4000元' },
|
||||
{ label: '老年学生', value: '5000元' },
|
||||
{ label: '神级学生', value: '6000元' }
|
||||
].filter(t => (t.show === undefined ? true : t.show()))
|
||||
options: RATES_OPTIONS.filter(t =>
|
||||
t.show === undefined ? true : t.show()
|
||||
)
|
||||
}
|
||||
},
|
||||
onEdited: context => {
|
||||
|
|
@ -192,7 +297,55 @@ const handleEdit = row => {
|
|||
path: 'bill-bill',
|
||||
query: row
|
||||
})
|
||||
console.log(row)
|
||||
}
|
||||
// 添加学生收费标准
|
||||
const onClick = context => {
|
||||
console.log('点击了确认按钮，弹出弹窗', context)
|
||||
visible.value = true
|
||||
}
|
||||
const onConfirmAnother = context => {
|
||||
console.log('点击了确认按钮', context)
|
||||
visible.value = false
|
||||
const arr = {
|
||||
label: formData.value.name,
|
||||
value: formData.value.RoutingAddress
|
||||
}
|
||||
RATES_OPTIONS.push(arr)
|
||||
}
|
||||
const onCancel = context => {
|
||||
console.log('点击了取消按钮', context)
|
||||
}
|
||||
const onCloseBtnClick = context => {
|
||||
console.log('点击了关闭按钮', context)
|
||||
}
|
||||
// 编辑学生收费标准
|
||||
const Role = row => {
|
||||
visible.value = true
|
||||
formData.value = {
|
||||
name: row.label,
|
||||
RoutingAddress: row.value
|
||||
}
|
||||
}
|
||||
// 删除学生收费标准
|
||||
const DeleteRole = row => {
|
||||
console.log('删除学生收费标准', row)
|
||||
RATES_OPTIONS.splice(RATES_OPTIONS.indexOf(row), 1)
|
||||
}
|
||||
// 监听分页变化事件
|
||||
const onPageChange = () => {
|
||||
isLoading.value = true
|
||||
const timerId = setTimeout(() => {
|
||||
isLoading.value = false
|
||||
clearInterval(timerId)
|
||||
}, 300)
|
||||
}
|
||||
// 判断表格是否显示
|
||||
const judge = () => {
|
||||
if (!route.query.name) {
|
||||
return true
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less"></style>
|
||||
|
|
|
|||
|
|
@ -9,7 +9,22 @@ import Layout from "@/layout/index.vue";
|
|||
const router = createRouter({
|
||||
history: createWebHistory(import.meta.env.BASE_URL),
|
||||
routes: [
|
||||
|
||||
{
|
||||
path: "/",
|
||||
redirect: "/home",
|
||||
meta: { title: "首页", name: "home" },
|
||||
component: Layout,
|
||||
children: [
|
||||
{
|
||||
path: "/home",
|
||||
name: "home",
|
||||
component: () => import("@/pages/home/index.vue"),
|
||||
meta: {
|
||||
title: "首页",
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: "/login",
|
||||
name: "login",
|
||||
|
|
@ -27,7 +42,7 @@ const router = createRouter({
|
|||
},
|
||||
...FinanceBillManage,
|
||||
...ReceivablesManagement
|
||||
],
|
||||
]
|
||||
});
|
||||
|
||||
export default router;
|
||||
|
|
|
|||
|
|
@ -2,8 +2,7 @@ import Layout from "@/layout/index.vue";
|
|||
|
||||
const ReceivablesManagement = [
|
||||
{
|
||||
path: "/",
|
||||
redirect: "/accounts",
|
||||
path: "/accounts",
|
||||
meta: { title: "应收款管理", name: "accounts" },
|
||||
component: Layout,
|
||||
children: [
|
||||
|
|
@ -19,7 +18,7 @@ const ReceivablesManagement = [
|
|||
path: "/billCollected",
|
||||
name: "BillCollected",
|
||||
component: () => import("@/pages/receivables-management/billCollected.vue"),
|
||||
meta: { title: "票据收款", hidden: false },
|
||||
meta: { title: "票据收款", },
|
||||
},
|
||||
{
|
||||
path: "/bill-bill",
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user