Compare commits
No commits in common. "dev" and "master" have entirely different histories.
|
@ -1,6 +0,0 @@
|
|||
import sdy from './modules/sdy'
|
||||
import ycy from './modules/ycy'
|
||||
export default [
|
||||
...sdy,
|
||||
...ycy
|
||||
]
|
|
@ -1,99 +0,0 @@
|
|||
import Mock from "mockjs"
|
||||
|
||||
const student = Mock.mock({
|
||||
"list|100": [
|
||||
{
|
||||
"Id|+1": 1,
|
||||
"name": "@cname",
|
||||
"gender": `@pick(['男', '女'])`,
|
||||
"studentId": "@integer(1000000000,9999999999)",
|
||||
"department": `@pick(['机电工程系', '护理分院','建筑系','材料科学与工程系','环境科学与工程系'])`,
|
||||
"major": `@pick(['机械制造与自动化', '材料科学与工程', '环境科学与工程', '建筑工程', '护理学'])`,
|
||||
"classes": `@pick(['机制1班', '材料1班', '环境1班', '建筑1班','护理1班'])`,
|
||||
"status": `@pick(['休学', '退学', '复学'])`,
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
export default [
|
||||
{
|
||||
url: '/api-list',
|
||||
method: 'get',
|
||||
response: () => {
|
||||
return {
|
||||
code: 200,
|
||||
data: student
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
url: '/api-updateStudent',
|
||||
method: 'post',
|
||||
response(req) {
|
||||
// 假设req.body的结构是{Id: '唯一标识', ...其他字段}
|
||||
const requestBody = req.body;
|
||||
const studentId = requestBody.Id;
|
||||
|
||||
// 模拟检查数据库中是否存在该id
|
||||
// 在真实环境中,这一步应当由后端服务完成
|
||||
const students = getMockStudents(); // 假设这是存储模拟学生数据的地方
|
||||
const existingStudent = students.find(student => student.id === studentId);
|
||||
|
||||
if (existingStudent) {
|
||||
// 更新数据库中的学生信息(在模拟中,我们直接修改内存中的数据)
|
||||
Object.assign(existingStudent, requestBody);
|
||||
return {
|
||||
code: 200,
|
||||
message: '更新成功',
|
||||
data: existingStudent
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
code: 404,
|
||||
message: '未找到具有该ID的学生'
|
||||
};
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
url: '/api-student',
|
||||
method: 'post',
|
||||
response: (req) => {
|
||||
if (req.body.name !== '') {
|
||||
return student.list.filter(item => item.name.includes(req.body.name))
|
||||
}
|
||||
else if (req.body.studentId !== '') {
|
||||
const studentId = Number(req.body.studentId)
|
||||
if (!isNaN(studentId)) {
|
||||
return student.list.filter(item => item.studentId === studentId)
|
||||
} else {
|
||||
return {
|
||||
code: 400,
|
||||
message: 'Invalid student number format'
|
||||
}
|
||||
}
|
||||
}
|
||||
else if (req.body.name !== '') {
|
||||
return student.list.filter(item => item.name.includes(req.body.name))
|
||||
}
|
||||
else if (req.body.gender !== '') {
|
||||
return student.list.filter(item => item.gender.includes(req.body.gender))
|
||||
}
|
||||
else if (req.body.department !== '') {
|
||||
return student.list.filter(item => item.grade.includes(req.body.department))
|
||||
}
|
||||
else if (req.body.major !== '') {
|
||||
return student.list.filter(item => item.major.includes(req.body.major))
|
||||
}
|
||||
else if (req.body.classes !== '') {
|
||||
return student.list.filter(item => item.classes.includes(req.body.classes))
|
||||
}
|
||||
else if (req.body.status !== '') {
|
||||
return student.list.filter(item => item.major.includes(req.body.status))
|
||||
}
|
||||
return {
|
||||
code: 200,
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
|
@ -1,618 +0,0 @@
|
|||
import Mock from "mockjs"
|
||||
const data = Mock.mock({
|
||||
"list|200": [
|
||||
{
|
||||
"id|+1": '1',
|
||||
"name": "@cname",
|
||||
"studentnumber": "@integer(1000000000,9999999999)",
|
||||
"department": `@pick(['机电工程系', '护理分院','建筑系','材料科学与工程系','环境科学与工程系'])`,
|
||||
"major": `@pick(['机械制造与自动化', '材料科学与工程', '环境科学与工程', '建筑工程', '护理学'])`,
|
||||
"grade": `@pick(['机制1班', '材料1班', '环境1班', '建筑1班','护理1班'])`,
|
||||
"tuition": `@pick(['已付学费', '未缴学费'])`,
|
||||
"tu": 16800,
|
||||
}
|
||||
]
|
||||
})
|
||||
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': "@now('yyyy-MM-dd')",
|
||||
}
|
||||
]
|
||||
})
|
||||
const daily = Mock.mock({
|
||||
'list|10': [
|
||||
{
|
||||
'date': "@now('yyyy-MM-dd')",
|
||||
'tuiti': '@integer(10000,50000)',
|
||||
'incidentals': '@integer(1000,5000)',
|
||||
'materials': '@integer(1000,5000)',
|
||||
'major': '@integer(1000,5000)',
|
||||
'grade': '@integer(1000,5000)',
|
||||
'tuit': '@integer(10000,50000)',
|
||||
'cost': '@integer(10000,50000)',
|
||||
'tuition': '@integer(10000,50000)',
|
||||
}
|
||||
]
|
||||
})
|
||||
const paragraph = Mock.mock({
|
||||
'list|15': [
|
||||
{
|
||||
'name': '@cname',
|
||||
department: '机电工程系',
|
||||
grade: '机制1班',
|
||||
counselor: '王刚',
|
||||
cellPhone: '13354679999',
|
||||
money: 16800,
|
||||
condition: '未还款'
|
||||
},
|
||||
{
|
||||
'name': '@cname',
|
||||
department: '护理分院',
|
||||
grade: '护理1班',
|
||||
counselor: '李昆',
|
||||
cellPhone: '18845065230',
|
||||
money: 24000,
|
||||
condition: '未还款'
|
||||
},
|
||||
{
|
||||
'name': '@cname',
|
||||
department: '建筑系',
|
||||
grade: '建筑1班',
|
||||
counselor: '张明',
|
||||
cellPhone: '16656664666',
|
||||
money: 12000,
|
||||
condition: '未还款'
|
||||
}
|
||||
]
|
||||
})
|
||||
const analysis = Mock.mock({
|
||||
list: [
|
||||
{
|
||||
id: 1,
|
||||
name: '机电工程系',
|
||||
studentnumber: 120,
|
||||
department: 120,
|
||||
major: 80,
|
||||
grade: '1344000',
|
||||
tuition: 40,
|
||||
weigrade: 672000,
|
||||
shition: 2016000
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: '护理分院',
|
||||
studentnumber: 200,
|
||||
department: 200,
|
||||
major: 120,
|
||||
grade: '2016000',
|
||||
tuition: 80,
|
||||
weigrade: 1344000,
|
||||
shition: 33600000
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: '建筑系',
|
||||
studentnumber: 300,
|
||||
department: 300,
|
||||
major: 200,
|
||||
grade: '2016000',
|
||||
tuition: 100,
|
||||
weigrade: 1680000,
|
||||
shition: 5040000
|
||||
}
|
||||
]
|
||||
})
|
||||
const message = Mock.mock({
|
||||
'list|10': [
|
||||
{
|
||||
'id|+1': 1,
|
||||
//学生姓名
|
||||
'name': '@cname',
|
||||
//学生学号
|
||||
'studentNumber': '@integer(132000000,1329999999)',
|
||||
//性别
|
||||
'gender': '@pick(["男","女"])',
|
||||
//年龄
|
||||
'age': '@integer(20,21)',
|
||||
//学院
|
||||
'date': '@date',
|
||||
//籍贯
|
||||
'nativePlace': "@city",
|
||||
//民族
|
||||
'nation': '汉族',
|
||||
//入学时间
|
||||
'enrollmentyear': '@now("yyyy")',
|
||||
//部门
|
||||
'college': '机电工程系',
|
||||
//专业
|
||||
'major': '机械制造与自动化',
|
||||
//部门
|
||||
'grade': '机制1班',
|
||||
//辅导员
|
||||
'tutor': '王刚',
|
||||
//手机号
|
||||
'phone': '@integer(13200000000,13299999999)',
|
||||
},
|
||||
{
|
||||
'id|+1': 11,
|
||||
//学生姓名
|
||||
'name': '@cname',
|
||||
//学生学号
|
||||
'studentNumber': '@integer(188000000,18899999999)',
|
||||
//性别
|
||||
'gender': '@pick(["男","女"])',
|
||||
//年龄
|
||||
'age': '@integer(20,21)',
|
||||
//学院
|
||||
'date': '@date',
|
||||
//籍贯
|
||||
'nativePlace': "@city",
|
||||
//民族
|
||||
'nation': '汉族',
|
||||
//入学时间
|
||||
'enrollmentyear': '@now("yyyy")',
|
||||
//部门
|
||||
'college': '护理分院',
|
||||
//专业
|
||||
'major': '护理学',
|
||||
//部门
|
||||
'grade': '护理学1班',
|
||||
//辅导员
|
||||
'tutor': '张明',
|
||||
//手机号
|
||||
'phone': '@integer(18800000000,18899999999)',
|
||||
},
|
||||
{
|
||||
'id|+1': 21,
|
||||
//学生姓名
|
||||
'name': '@cname',
|
||||
//学生学号
|
||||
'studentNumber': '@integer(186000000,1869999999)',
|
||||
//性别
|
||||
'gender': '@pick(["男","女"])',
|
||||
//年龄
|
||||
'age': '@integer(20,21)',
|
||||
//出生时间
|
||||
'date': '@date',
|
||||
//籍贯
|
||||
'nativePlace': "@city",
|
||||
//民族
|
||||
'nation': '汉族',
|
||||
//入学时间
|
||||
'enrollmentyear': '@now("yyyy")',
|
||||
//部门
|
||||
'college': '建筑系',
|
||||
//专业
|
||||
'major': '建筑工程',
|
||||
//部门
|
||||
'grade': '建筑1班',
|
||||
//辅导员
|
||||
'tutor': '李宇',
|
||||
//手机号
|
||||
'phone': '@integer(18600000000,18699999999)',
|
||||
}
|
||||
]
|
||||
})
|
||||
const mitigate = Mock.mock({
|
||||
'list|10': [
|
||||
{
|
||||
'id|+1': 1,
|
||||
//学生姓名
|
||||
'name': '@cname',
|
||||
//学生学号
|
||||
'studentNumber': '@integer(132000000,1329999999)',
|
||||
//性别
|
||||
'gender': '@pick(["男","女"])',
|
||||
//年龄
|
||||
'age': '@integer(20,21)',
|
||||
//学费
|
||||
'tuition': 16800,
|
||||
//减免金额
|
||||
'mitigate': 12800,
|
||||
//入学时间
|
||||
'enrollmentyear': '@now("yyyy")',
|
||||
//部门
|
||||
'college': '机电工程系',
|
||||
//专业
|
||||
'major': '机械制造与自动化',
|
||||
//部门
|
||||
'grade': '机制1班',
|
||||
//辅导员
|
||||
'tutor': '王刚',
|
||||
},
|
||||
{
|
||||
'id|+1': 11,
|
||||
//学生姓名
|
||||
'name': '@cname',
|
||||
//学生学号
|
||||
'studentNumber': '@integer(188000000,18899999999)',
|
||||
//性别
|
||||
'gender': '@pick(["男","女"])',
|
||||
//年龄
|
||||
'age': '@integer(20,21)',
|
||||
'tuition': 16800,
|
||||
//减免金额
|
||||
'mitigate': 10000,
|
||||
//入学时间
|
||||
'enrollmentyear': '@now("yyyy")',
|
||||
//部门
|
||||
'college': '护理分院',
|
||||
//专业
|
||||
'major': '护理学',
|
||||
//部门
|
||||
'grade': '护理学1班',
|
||||
//辅导员
|
||||
'tutor': '张明',
|
||||
},
|
||||
{
|
||||
'id|+1': 21,
|
||||
//学生姓名
|
||||
'name': '@cname',
|
||||
//学生学号
|
||||
'studentNumber': '@integer(186000000,1869999999)',
|
||||
//性别
|
||||
'gender': '@pick(["男","女"])',
|
||||
//年龄
|
||||
'age': '@integer(20,21)',
|
||||
'tuition': 16800,
|
||||
//减免金额
|
||||
'mitigate': 12000,
|
||||
//入学时间
|
||||
'enrollmentyear': '@now("yyyy")',
|
||||
//部门
|
||||
'college': '建筑系',
|
||||
//专业
|
||||
'major': '建筑工程',
|
||||
//部门
|
||||
'grade': '建筑1班',
|
||||
//辅导员
|
||||
'tutor': '李宇',
|
||||
}
|
||||
]
|
||||
})
|
||||
const premium = Mock.mock({
|
||||
'list|10': [
|
||||
{
|
||||
'id|+1': 1,
|
||||
//学生姓名
|
||||
'name': '@cname',
|
||||
//学生学号
|
||||
'studentNumber': '@integer(132000000,1329999999)',
|
||||
//性别
|
||||
'gender': '@pick(["男","女"])',
|
||||
//年龄
|
||||
'age': '@integer(20,21)',
|
||||
//退费金额
|
||||
'tuition': 16800,
|
||||
//入学时间
|
||||
'enrollmentyear': '@now("yyyy")',
|
||||
//部门
|
||||
'college': '机电工程系',
|
||||
//专业
|
||||
'major': '机械制造与自动化',
|
||||
//部门
|
||||
'grade': '机制1班',
|
||||
//辅导员
|
||||
'tutor': '王刚',
|
||||
},
|
||||
{
|
||||
'id|+1': 11,
|
||||
//学生姓名
|
||||
'name': '@cname',
|
||||
//学生学号
|
||||
'studentNumber': '@integer(188000000,18899999999)',
|
||||
//性别
|
||||
'gender': '@pick(["男","女"])',
|
||||
//年龄
|
||||
'age': '@integer(20,21)',
|
||||
//退费金额
|
||||
'tuition': 16800,
|
||||
//入学时间
|
||||
'enrollmentyear': '@now("yyyy")',
|
||||
//部门
|
||||
'college': '护理分院',
|
||||
//专业
|
||||
'major': '护理学',
|
||||
//部门
|
||||
'grade': '护理学1班',
|
||||
//辅导员
|
||||
'tutor': '张明',
|
||||
},
|
||||
{
|
||||
'id|+1': 21,
|
||||
//学生姓名
|
||||
'name': '@cname',
|
||||
//学生学号
|
||||
'studentNumber': '@integer(186000000,1869999999)',
|
||||
//性别
|
||||
'gender': '@pick(["男","女"])',
|
||||
//年龄
|
||||
'age': '@integer(20,21)',
|
||||
//退费金额
|
||||
'tuition': 16800,
|
||||
//入学时间
|
||||
'enrollmentyear': '@now("yyyy")',
|
||||
//部门
|
||||
'college': '建筑系',
|
||||
//专业
|
||||
'major': '建筑工程',
|
||||
//部门
|
||||
'grade': '建筑1班',
|
||||
//辅导员
|
||||
'tutor': '李宇',
|
||||
}
|
||||
]
|
||||
})
|
||||
|
||||
export default [
|
||||
//应收管理列表
|
||||
{
|
||||
url: '/get-sdy-managment-list',
|
||||
method: 'get',
|
||||
response: () => {
|
||||
return {
|
||||
code: 200,
|
||||
data: data
|
||||
}
|
||||
}
|
||||
},
|
||||
// 应收管理搜索
|
||||
{
|
||||
url: '/post-sdy-managment-find',
|
||||
method: 'post',
|
||||
response: (req) => {
|
||||
if (req.body.name !== '') {
|
||||
return data.list.filter(item => item.name.includes(req.body.name))
|
||||
}
|
||||
else if (req.body.studentnumber !== '') {
|
||||
const studentnumber = Number(req.body.studentnumber)
|
||||
if (!isNaN(studentnumber)) {
|
||||
return data.list.filter(item => item.studentnumber === studentnumber)
|
||||
} else {
|
||||
return {
|
||||
code: 400,
|
||||
message: 'Invalid student number format'
|
||||
}
|
||||
}
|
||||
}
|
||||
else if (req.body.department !== '') {
|
||||
return data.list.filter(item => item.department.includes(req.body.department))
|
||||
}
|
||||
else if (req.body.major !== '') {
|
||||
return data.list.filter(item => item.major.includes(req.body.major))
|
||||
}
|
||||
else if (req.body.grade !== '') {
|
||||
return data.list.filter(item => item.grade.includes(req.body.grade))
|
||||
}
|
||||
else if (req.body.tuition !== '') {
|
||||
return data.list.filter(item => item.tuition.includes(req.body.tuition))
|
||||
}
|
||||
return {
|
||||
code: 200,
|
||||
}
|
||||
}
|
||||
},
|
||||
// 借款管理
|
||||
{
|
||||
url: '/get-sdy-loan-list',
|
||||
method: 'get',
|
||||
response: () => {
|
||||
return {
|
||||
code: 200,
|
||||
data: loans
|
||||
}
|
||||
}
|
||||
},
|
||||
// 借款管理搜索
|
||||
{
|
||||
url: '/post-sdy-loan-find',
|
||||
method: 'post',
|
||||
response: (req) => {
|
||||
if (req.body.name !== '') {
|
||||
const arr = loans.list.filter(item => item.proposer.includes(req.body.name))
|
||||
return arr
|
||||
} else if (req.body.studentnumber !== '') {
|
||||
const studentnumber = Number(req.body.studentnumber)
|
||||
const arr = loans.list.filter(item => item.student === studentnumber)
|
||||
return arr
|
||||
}
|
||||
return {
|
||||
code: 200,
|
||||
data: arr
|
||||
}
|
||||
}
|
||||
},
|
||||
// 添加借款人
|
||||
{
|
||||
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
|
||||
}
|
||||
}
|
||||
},
|
||||
// 当日明细列表
|
||||
{
|
||||
url: '/get-sdy-daily-list',
|
||||
method: 'get',
|
||||
response: () => {
|
||||
return {
|
||||
code: 200,
|
||||
data: daily
|
||||
}
|
||||
}
|
||||
},
|
||||
// 学生催款表
|
||||
{
|
||||
url: '/get-sdy-paragraph-list',
|
||||
method: 'get',
|
||||
response: () => {
|
||||
return {
|
||||
code: 200,
|
||||
data: paragraph
|
||||
}
|
||||
}
|
||||
},
|
||||
// 学生催款表搜索
|
||||
{
|
||||
url: '/post-sdy-paragraph-find',
|
||||
method: 'post',
|
||||
response: (req) => {
|
||||
if (req.body.name !== '') {
|
||||
const arr = paragraph.list.filter(item => item.name.includes(req.body.name))
|
||||
return arr
|
||||
} else if (req.body.studentnumber !== '') {
|
||||
const arr = paragraph.list.filter(item => item.department.includes(req.body.studentnumber))
|
||||
return arr
|
||||
} else if (req.body.counselor !== '') {
|
||||
const arr = paragraph.list.filter(item => item.counselor.includes(req.body.counselor))
|
||||
return arr
|
||||
} else if (req.body.tutor !== '') {
|
||||
const arr = paragraph.list.filter(item => item.grade.includes(req.body.tutor))
|
||||
return arr
|
||||
}
|
||||
|
||||
return {
|
||||
code: 200,
|
||||
data: arr
|
||||
}
|
||||
}
|
||||
},
|
||||
// 学院分析
|
||||
{
|
||||
url: '/get-sdy-analysis-list',
|
||||
method: 'get',
|
||||
response: () => {
|
||||
return {
|
||||
code: 200,
|
||||
data: analysis
|
||||
}
|
||||
}
|
||||
},
|
||||
// 学生信息统计
|
||||
{
|
||||
url: '/get-sdy-message-list',
|
||||
method: 'get',
|
||||
response: () => {
|
||||
return {
|
||||
code: 200,
|
||||
data: message
|
||||
}
|
||||
}
|
||||
},
|
||||
// 学生信息统计搜索
|
||||
{
|
||||
url: '/post-sdy-message-find',
|
||||
method: 'post',
|
||||
response: (req) => {
|
||||
if (req.body.name !== '') {
|
||||
const arr = message.list.filter(item => item.name.includes(req.body.name))
|
||||
return arr
|
||||
} else if (req.body.studentnumber !== '') {
|
||||
const arr = message.list.filter(item => item.department.includes(req.body.studentnumber))
|
||||
return arr
|
||||
} else if (req.body.college !== '') {
|
||||
const arr = message.list.filter(item => item.counselor.includes(req.body.counselor))
|
||||
return arr
|
||||
} else if (req.body.grade !== '') {
|
||||
const arr = message.list.filter(item => item.grade.includes(req.body.grade))
|
||||
return arr
|
||||
}
|
||||
return {
|
||||
code: 200,
|
||||
data: arr
|
||||
}
|
||||
}
|
||||
},
|
||||
// 减免管理
|
||||
{
|
||||
url: '/get-sdy-mitigate-list',
|
||||
method: 'get',
|
||||
response: () => {
|
||||
return {
|
||||
code: 200,
|
||||
data: mitigate
|
||||
}
|
||||
}
|
||||
},
|
||||
// 减免管理搜索
|
||||
{
|
||||
url: '/post-sdy-mitigate-find',
|
||||
method: 'post',
|
||||
response: (req) => {
|
||||
if (req.body.name !== '') {
|
||||
const arr = mitigate.list.filter(item => item.name.includes(req.body.name))
|
||||
return arr
|
||||
} else if (req.body.studentnumber !== '') {
|
||||
const arr = mitigate.list.filter(item => item.department.includes(req.body.studentnumber))
|
||||
return arr
|
||||
} else if (req.body.college !== '') {
|
||||
const arr = mitigate.list.filter(item => item.counselor.includes(req.body.counselor))
|
||||
return arr
|
||||
} else if (req.body.tutor !== '') {
|
||||
const arr = mitigate.list.filter(item => item.tutor.includes(req.body.tutor))
|
||||
return arr
|
||||
}
|
||||
return {
|
||||
code: 200,
|
||||
data: arr
|
||||
}
|
||||
}
|
||||
},
|
||||
// 退费管理
|
||||
{
|
||||
url: '/get-sdy-premium-list',
|
||||
method: 'get',
|
||||
response: () => {
|
||||
return {
|
||||
code: 200,
|
||||
data: premium
|
||||
}
|
||||
}
|
||||
},
|
||||
// 退费管理搜索
|
||||
{
|
||||
url: '/post-sdy-premium-find',
|
||||
method: 'post',
|
||||
response: (req) => {
|
||||
if (req.body.name !== '') {
|
||||
const arr = premium.list.filter(item => item.name.includes(req.body.name))
|
||||
return arr
|
||||
} else if (req.body.studentnumber !== '') {
|
||||
const arr = premium.list.filter(item => item.department.includes(req.body.studentnumber))
|
||||
return arr
|
||||
} else if (req.body.college !== '') {
|
||||
const arr = premium.list.filter(item => item.counselor.includes(req.body.counselor))
|
||||
return arr
|
||||
} else if (req.body.tutor !== '') {
|
||||
const arr = premium.list.filter(item => item.tutor.includes(req.body.tutor))
|
||||
return arr
|
||||
}
|
||||
return {
|
||||
code: 200,
|
||||
data: arr
|
||||
}
|
||||
}
|
||||
},
|
||||
]
|
|
@ -1,279 +0,0 @@
|
|||
import Mock from "mockjs";
|
||||
|
||||
// 入库列表
|
||||
const StockList = Mock.mock({
|
||||
"list|20-30": [
|
||||
{
|
||||
"id|+1": 0,
|
||||
billserial: "@integer(100000000,199999999)1",
|
||||
billType: "@integer(0,4)",
|
||||
stockNum: "@integer(1,2)",
|
||||
stockDate: "@date",
|
||||
operator: "@cname",
|
||||
remark: " @integer(10000000000,19999999999)",
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
// 领用列表
|
||||
const ReceiptList = Mock.mock([
|
||||
{
|
||||
"list|20-30": [
|
||||
{
|
||||
"id|+1": 0,
|
||||
billserial: "@integer(100000000,199999999)1",
|
||||
proposer: "孙东宇",
|
||||
billType: "@integer(0,4)",
|
||||
receiptNum: "@integer(1,10)",
|
||||
receiptDate: "@date",
|
||||
useInfo: "@csentence",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
"list|20-30": [
|
||||
{
|
||||
"id|+1": 0,
|
||||
billserial: "@integer(100000000,199999999)1",
|
||||
proposer: "杨春宇",
|
||||
billType: "@integer(0,4)",
|
||||
receiptNum: "@integer(1,10)",
|
||||
receiptDate: "@date",
|
||||
useInfo: "@csentence",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
"list|20-30": [
|
||||
{
|
||||
"id|+1": 0,
|
||||
billserial: "@integer(100000000,199999999)1",
|
||||
proposer: "吕才卓",
|
||||
billType: "@integer(0,4)",
|
||||
receiptNum: "@integer(1,10)",
|
||||
receiptDate: "@date",
|
||||
useInfo: "@csentence",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
"list|20-30": [
|
||||
{
|
||||
"id|+1": 0,
|
||||
billserial: "@integer(100000000,199999999)1",
|
||||
proposer: "刘欣宇",
|
||||
billType: "@integer(0,4)",
|
||||
receiptNum: "@integer(1,10)",
|
||||
receiptDate: "@date",
|
||||
useInfo: "@csentence",
|
||||
},
|
||||
],
|
||||
},
|
||||
]);
|
||||
|
||||
// 退领列表
|
||||
const quitneckList = Mock.mock([
|
||||
{
|
||||
list: [
|
||||
{
|
||||
"id|+1": 0,
|
||||
billserial: "@integer(100000000,199999999)1",
|
||||
proposer: "孙东宇",
|
||||
billType: "@integer(0,4)",
|
||||
receiptNum: "@integer(1,10)",
|
||||
receiptDate: "@date",
|
||||
useInfo: "@csentence",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
list: [
|
||||
{
|
||||
"id|+1": 0,
|
||||
billserial: "@integer(100000000,199999999)1",
|
||||
proposer: "杨春宇",
|
||||
billType: "@integer(0,4)",
|
||||
receiptNum: "@integer(1,10)",
|
||||
receiptDate: "@date",
|
||||
useInfo: "@csentence",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
list: [
|
||||
{
|
||||
"id|+1": 0,
|
||||
billserial: "@integer(100000000,199999999)1",
|
||||
proposer: "吕才卓",
|
||||
billType: "@integer(0,4)",
|
||||
receiptNum: "@integer(1,10)",
|
||||
receiptDate: "@date",
|
||||
useInfo: "@csentence",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
list: [
|
||||
{
|
||||
"id|+1": 0,
|
||||
billserial: "@integer(100000000,199999999)1",
|
||||
proposer: "刘欣宇",
|
||||
billType: "@integer(0,4)",
|
||||
receiptNum: "@integer(1,10)",
|
||||
receiptDate: "@date",
|
||||
useInfo: "@csentence",
|
||||
},
|
||||
],
|
||||
},
|
||||
]);
|
||||
|
||||
// 人员名单
|
||||
const personName = () => {
|
||||
return [
|
||||
{
|
||||
label: "员工名单",
|
||||
children: [
|
||||
{
|
||||
label: "孙东宇",
|
||||
},
|
||||
{
|
||||
label: "杨春宇",
|
||||
},
|
||||
{
|
||||
label: "吕才卓",
|
||||
},
|
||||
{
|
||||
label: "刘欣宇",
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
};
|
||||
|
||||
// 退库列表
|
||||
const CancelList = Mock.mock({
|
||||
"list|20-30": [
|
||||
{
|
||||
"id|+1": 0,
|
||||
billserial: "@integer(100000000,199999999)1",
|
||||
billType: "@integer(0,4)",
|
||||
cancelNum: "@integer(1,10)张",
|
||||
appleDate: "@date",
|
||||
proposer: "@cname",
|
||||
approvalStatus: "@integer(0,3)",
|
||||
reason: " @integer(10000000000,19999999999)",
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
// 报损列表
|
||||
const breakageList = Mock.mock({
|
||||
"list|20-30": [
|
||||
{
|
||||
"id|+1": 0,
|
||||
billserial: "@integer(100000000,199999999)1",
|
||||
billType: "@integer(0,4)",
|
||||
breakNum: "@integer(1,2)",
|
||||
breakDate: "@date",
|
||||
operator: "@cname",
|
||||
breakStatus: "@integer(0,2)",
|
||||
breakInfo: "@csentence",
|
||||
},
|
||||
],
|
||||
});
|
||||
//
|
||||
const detailReportList = Mock.mock({
|
||||
"list|5": [
|
||||
{
|
||||
"id|+1": 0,
|
||||
branch: "@cname",
|
||||
stockNum: "@integer(1,20)张",
|
||||
cancelNum: "@integer(0,20)张",
|
||||
receiveNum: "@integer(0,20)张",
|
||||
breakNum: "@integer(0,20)张",
|
||||
destoryNum: "@integer(0,20)张",
|
||||
grossBillRatio: "25%",
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
export default [
|
||||
{
|
||||
url: "/api/stockList",
|
||||
method: "get",
|
||||
response: () => {
|
||||
return {
|
||||
code: 200,
|
||||
data: StockList,
|
||||
};
|
||||
},
|
||||
},
|
||||
{
|
||||
url: "/api/cancelList",
|
||||
method: "get",
|
||||
response: () => {
|
||||
return {
|
||||
code: 200,
|
||||
data: CancelList,
|
||||
};
|
||||
},
|
||||
},
|
||||
{
|
||||
url: "/api/personName",
|
||||
method: "get",
|
||||
response: () => {
|
||||
const list = personName();
|
||||
return {
|
||||
code: 200,
|
||||
data: list,
|
||||
};
|
||||
},
|
||||
},
|
||||
{
|
||||
url: "/api/receiptList",
|
||||
method: "post",
|
||||
response: (req) => {
|
||||
if (req.body.name === "孙东宇") {
|
||||
return {
|
||||
code: 200,
|
||||
data: ReceiptList[0].list,
|
||||
};
|
||||
} else if (req.body.name === "杨春宇") {
|
||||
return {
|
||||
code: 200,
|
||||
data: ReceiptList[1].list,
|
||||
};
|
||||
} else if (req.body.name === "吕才卓") {
|
||||
return {
|
||||
code: 200,
|
||||
data: ReceiptList[2].list,
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
code: 200,
|
||||
data: ReceiptList[3].list,
|
||||
};
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
url: "/api/breakageList",
|
||||
method: "get",
|
||||
response: () => {
|
||||
return {
|
||||
code: 200,
|
||||
data: breakageList,
|
||||
};
|
||||
},
|
||||
},
|
||||
{
|
||||
url: "/api/detailReportList",
|
||||
method: "get",
|
||||
response: () => {
|
||||
return {
|
||||
code: 200,
|
||||
data: detailReportList,
|
||||
};
|
||||
},
|
||||
},
|
||||
];
|
4155
package-lock.json
generated
4155
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
12
package.json
12
package.json
|
@ -10,28 +10,16 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"axios": "^1.6.8",
|
||||
"dayjs": "^1.11.10",
|
||||
"echarts": "^5.5.0",
|
||||
"exceljs": "^4.4.0",
|
||||
"file-saver": "^2.0.5",
|
||||
"less": "^4.2.0",
|
||||
"mockjs": "^1.1.0",
|
||||
"pdfmake": "^0.2.10",
|
||||
"pinia": "^2.1.7",
|
||||
"pinia-plugin-persistedstate": "^3.2.1",
|
||||
"prettier": "^3.2.5",
|
||||
"sortablejs": "^1.15.2",
|
||||
"tdesign-vue-next": "^1.9.3",
|
||||
"vite-plugin-mock": "^3.0.1",
|
||||
"vue": "^3.4.21",
|
||||
"vue-draggable-plus": "^0.4.0",
|
||||
"vue-router": "^4.3.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vitejs/plugin-vue": "^5.0.4",
|
||||
"@vitejs/plugin-vue-jsx": "^3.1.0",
|
||||
"gulp": "^5.0.0",
|
||||
"sass": "^1.74.1",
|
||||
"vite": "^5.1.6"
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,8 +0,0 @@
|
|||
{
|
||||
"$schema": "https://json.schemastore.org/prettierrc",
|
||||
"semi": false,
|
||||
"tabWidth": 2,
|
||||
"singleQuote": true,
|
||||
"printWidth":200,
|
||||
"trailingComma": "none"
|
||||
}
|
BIN
public/favicon.ico
Normal file
BIN
public/favicon.ico
Normal file
Binary file not shown.
After Width: | Height: | Size: 4.2 KiB |
|
@ -1,7 +0,0 @@
|
|||
import request from "@/utils/requestMock";
|
||||
|
||||
const API = {
|
||||
BACKAGE_LIST: "/breakageList",
|
||||
};
|
||||
|
||||
export const reqBreakageList = () => request.get(API.BACKAGE_LIST);
|
|
@ -1,7 +0,0 @@
|
|||
import request from "@/utils/requestMock";
|
||||
|
||||
const API = {
|
||||
CANCEL_LIST: "/cancelList",
|
||||
};
|
||||
|
||||
export const reqCancelList = () => request.get(API.CANCEL_LIST);
|
|
@ -1,7 +0,0 @@
|
|||
import request from "@/utils/requestMock";
|
||||
|
||||
const API = {
|
||||
DETAILREPORT_LIST: "/detailReportList",
|
||||
};
|
||||
|
||||
export const reqDetailReportList = () => request.get(API.DETAILREPORT_LIST);
|
|
@ -1,9 +0,0 @@
|
|||
import request from "@/utils/requestMock";
|
||||
|
||||
const API = {
|
||||
PERSON_LIST: "/personName",
|
||||
RECEIPT_LIST: "/receiptList",
|
||||
};
|
||||
|
||||
export const reqPersonName = () => request.get(API.PERSON_LIST);
|
||||
export const reqReceiptList = (data) => request.post(API.RECEIPT_LIST, data);
|
|
@ -1,7 +0,0 @@
|
|||
import request from "@/utils/requestMock";
|
||||
|
||||
const API = {
|
||||
STOCK_LIST: "/stockList",
|
||||
};
|
||||
|
||||
export const reqStockList = () => request.get(API.STOCK_LIST);
|
|
@ -1,8 +0,0 @@
|
|||
import request from "@/utils/request";
|
||||
// 统一管理接口
|
||||
const API = {
|
||||
LOGIN_URL: "/api/login",
|
||||
};
|
||||
|
||||
export const reqUser = (data) => request.post(API.LOGIN_URL,data);
|
||||
// export const reqUserone = (data) => request.post(API.LOGIN_URL, data);
|
|
@ -1,7 +0,0 @@
|
|||
import request from "@/utils/request";
|
||||
// 统一管理接口
|
||||
const API = {
|
||||
PASSWORD_URL: "/api/password",
|
||||
};
|
||||
|
||||
export const reqPassword = () => request.post(API.PASSWORD_URL);
|
|
@ -1,61 +0,0 @@
|
|||
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 APILoansFind(data) {
|
||||
return request.post('/post-sdy-loan-find', data)
|
||||
}
|
||||
//添加贷款
|
||||
export function APILoansAdd(data) {
|
||||
return request.post('/post-sdy-loan-add', data)
|
||||
}
|
||||
// 借款管理
|
||||
export function APIDailyList() {
|
||||
return request.get('/get-sdy-daily-list')
|
||||
}
|
||||
//催缴管理
|
||||
export function APIParagraphList() {
|
||||
return request.get('/get-sdy-paragraph-list')
|
||||
}
|
||||
//催缴搜索
|
||||
export function APIParagraphFind(data) {
|
||||
return request.post('/post-sdy-paragraph-find', data)
|
||||
}
|
||||
//学院分析
|
||||
export function APIAnalysisList() {
|
||||
return request.get('/get-sdy-analysis-list')
|
||||
}
|
||||
//学生信息统计
|
||||
export function APIMessageList() {
|
||||
return request.get('/get-sdy-message-list')
|
||||
}
|
||||
//学生信息搜索
|
||||
export function APIMessageFind(data) {
|
||||
return request.post('/post-sdy-message-find', data)
|
||||
}
|
||||
//减免管理
|
||||
export function APIMitigateList() {
|
||||
return request.get('/get-sdy-mitigate-list')
|
||||
}
|
||||
//减免搜索
|
||||
export function APIMitigateFind(data) {
|
||||
return request.post('/post-sdy-mitigate-find', data)
|
||||
}
|
||||
// 退费管理
|
||||
export function APIPremiumList() {
|
||||
return request.get('/get-sdy-premium-list')
|
||||
}
|
||||
//退费搜索
|
||||
export function APIPremiumFind(data) {
|
||||
return request.post('/post-sdy-premium-find', data)
|
||||
}
|
|
@ -1,18 +0,0 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
export function getList() {
|
||||
return request.get('/api-list')
|
||||
}
|
||||
export function getStudents(studentData) {
|
||||
return request.post('/api-student', studentData)
|
||||
}
|
||||
|
||||
export function updateStudent(updateStudent) {
|
||||
return request.post('/api-updateStudent', updateStudent)
|
||||
}
|
||||
|
||||
// const API = {
|
||||
// STUDENT_URL: "/api/user",
|
||||
// };
|
||||
|
||||
// export const reqStudent = () => request.get(API.STUDENT_URL);
|
Binary file not shown.
Before Width: | Height: | Size: 226 KiB |
Binary file not shown.
Before Width: | Height: | Size: 1.8 MiB |
|
@ -1,89 +0,0 @@
|
|||
<template>
|
||||
<div style="height: 100%">
|
||||
<div ref="barChartRef" :style="{ width: width, height: height }"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import * as echarts from "echarts";
|
||||
import { onMounted, ref } from "vue";
|
||||
|
||||
// 定义图表容器引用
|
||||
const barChartRef = ref(null);
|
||||
|
||||
const { categories, seriesData, title, legendList } = defineProps({
|
||||
// 横坐标
|
||||
categories: {
|
||||
type: Array,
|
||||
required: true,
|
||||
},
|
||||
// 纵坐标
|
||||
seriesData: {
|
||||
type: Array,
|
||||
required: true,
|
||||
},
|
||||
// 标题
|
||||
title: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
// 图例
|
||||
legendList: {
|
||||
type: Array,
|
||||
required: true,
|
||||
},
|
||||
// 宽度
|
||||
width: {
|
||||
type: String,
|
||||
default: "100%",
|
||||
},
|
||||
// 高度
|
||||
height: {
|
||||
type: String,
|
||||
default: "100%",
|
||||
},
|
||||
});
|
||||
|
||||
// 配置图表数据和选项
|
||||
const option = {
|
||||
title: {
|
||||
text: title,
|
||||
left: "center",
|
||||
top: "10",
|
||||
},
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
axisPointer: {
|
||||
type: "shadow",
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
data: legendList, // 根据实际需求替换为对应系列名称
|
||||
bottom: "10",
|
||||
},
|
||||
xAxis: {
|
||||
type: "category",
|
||||
data: categories,
|
||||
},
|
||||
yAxis: {
|
||||
type: "value",
|
||||
},
|
||||
series: seriesData,
|
||||
};
|
||||
|
||||
// 在组件挂载后初始化ECharts实例并设置选项
|
||||
onMounted(() => {
|
||||
const barChartContainer = barChartRef.value;
|
||||
if (barChartContainer) {
|
||||
const myChart = echarts.init(barChartContainer);
|
||||
myChart.setOption(option);
|
||||
|
||||
// 添加窗口resize事件监听,自动调整图表大小
|
||||
window.addEventListener("resize", () => {
|
||||
myChart.resize();
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
|
@ -1,117 +0,0 @@
|
|||
<template>
|
||||
<div style="height: 100%">
|
||||
<div ref="lineChartRef" :style="{ width: width, height: height }">
|
||||
111111
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import * as echarts from "echarts";
|
||||
import { onMounted, ref } from "vue";
|
||||
|
||||
// 定义图表容器引用
|
||||
const lineChartRef = ref(null);
|
||||
|
||||
const { categories, seriesData, titleP, legendList } = defineProps({
|
||||
// 横坐标
|
||||
categories: {
|
||||
type: Array,
|
||||
required: true,
|
||||
},
|
||||
// 纵坐标
|
||||
seriesData: {
|
||||
type: Array,
|
||||
required: true,
|
||||
},
|
||||
titleP: {
|
||||
type: String,
|
||||
default: "示例折线图",
|
||||
},
|
||||
// 图例
|
||||
legendList: {
|
||||
type: Array,
|
||||
required: true,
|
||||
},
|
||||
width: {
|
||||
type: String,
|
||||
default: "100%",
|
||||
},
|
||||
height: {
|
||||
type: String,
|
||||
default: "100%",
|
||||
},
|
||||
});
|
||||
|
||||
// 配置图表数据和选项
|
||||
const option = {
|
||||
title: {
|
||||
text: titleP,
|
||||
left: "center",
|
||||
top: "2",
|
||||
},
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
axisPointer: {
|
||||
type: "cross",
|
||||
label: {
|
||||
backgroundColor: "#6a7985",
|
||||
},
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
data: legendList,
|
||||
bottom: 0,
|
||||
},
|
||||
grid: {
|
||||
left: "3%",
|
||||
right: "3%",
|
||||
bottom: "9%",
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: {
|
||||
type: "category",
|
||||
boundaryGap: false,
|
||||
data: categories,
|
||||
axisTick: {
|
||||
alignWithLabel: true,
|
||||
},
|
||||
},
|
||||
yAxis: {
|
||||
type: "value",
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
type: "dashed",
|
||||
},
|
||||
},
|
||||
},
|
||||
series: seriesData.map((serie, index) => ({
|
||||
...serie,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
},
|
||||
smooth: true,
|
||||
itemStyle: {
|
||||
color: `rgba(${Math.random() * 255}, ${Math.random() * 255}, ${
|
||||
Math.random() * 255
|
||||
}, 0.8)`,
|
||||
},
|
||||
})),
|
||||
};
|
||||
|
||||
// 在组件挂载后初始化ECharts实例并设置选项
|
||||
onMounted(() => {
|
||||
const lineChartContainer = lineChartRef.value;
|
||||
if (lineChartContainer) {
|
||||
const myChart = echarts.init(lineChartContainer);
|
||||
myChart.setOption(option);
|
||||
|
||||
// 添加窗口resize事件监听,自动调整图表大小
|
||||
window.addEventListener("resize", () => {
|
||||
myChart.resize();
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
|
@ -1,82 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
<div ref="pieChartRef" :style="{ width: width, height: height }"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import * as echarts from "echarts";
|
||||
import { onMounted, ref } from "vue";
|
||||
|
||||
// 定义图表容器引用
|
||||
const pieChartRef = ref(null);
|
||||
|
||||
const { titleP, dataP } = defineProps({
|
||||
// 图表数据
|
||||
dataP: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
titleP: {
|
||||
type: String,
|
||||
default: "",
|
||||
},
|
||||
width: {
|
||||
type: String,
|
||||
default: "100%",
|
||||
},
|
||||
height: {
|
||||
type: String,
|
||||
default: "100%",
|
||||
},
|
||||
});
|
||||
|
||||
// 配置图表数据和选项
|
||||
const option = {
|
||||
title: {
|
||||
text: titleP,
|
||||
left: "center",
|
||||
},
|
||||
tooltip: {
|
||||
trigger: "item",
|
||||
formatter: "{a} <br/>{b}: {c} ({d}%)",
|
||||
},
|
||||
legend: {
|
||||
orient: "vertical",
|
||||
left: "0",
|
||||
top: "50",
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: "访问来源",
|
||||
type: "pie",
|
||||
radius: "50%",
|
||||
left: "50",
|
||||
data: dataP,
|
||||
emphasis: {
|
||||
itemStyle: {
|
||||
shadowBlur: 10,
|
||||
shadowOffsetX: 0,
|
||||
shadowColor: "rgba(0, 0, 0, 0.5)",
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
// 在组件挂载后初始化ECharts实例并设置选项
|
||||
onMounted(() => {
|
||||
const pieChartContainer = pieChartRef.value;
|
||||
if (pieChartContainer) {
|
||||
const myChart = echarts.init(pieChartContainer);
|
||||
myChart.setOption(option);
|
||||
|
||||
// 添加窗口resize事件监听,自动调整图表大小
|
||||
window.addEventListener("resize", () => {
|
||||
myChart.resize();
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
|
@ -1,44 +0,0 @@
|
|||
<template>
|
||||
<t-row style="width: 100%">
|
||||
<t-col :span="colNum">
|
||||
<t-row :gutter="[24, 24]" style="margin-left: 0.3rem">
|
||||
<slot name="scarchName"> </slot>
|
||||
</t-row>
|
||||
</t-col>
|
||||
<t-col :span="btnNum" class="operation-container">
|
||||
<t-form-item style="margin-right: 1rem">
|
||||
<slot name="scarchBtn"> </slot>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
</t-row>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { number } from "echarts";
|
||||
|
||||
const { colNum, btnNum } = defineProps({
|
||||
colNum: {
|
||||
type: Number,
|
||||
default: 10,
|
||||
},
|
||||
btnNum: {
|
||||
type: Number,
|
||||
default: 2,
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.operation-container {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
|
||||
.expand {
|
||||
.t-button__text {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,105 +0,0 @@
|
|||
<template>
|
||||
<div style="height: 100%">
|
||||
<t-menu style="height: 92vh">
|
||||
<t-submenu value="1" title="首页">
|
||||
<template #icon>
|
||||
<t-icon name="home" />
|
||||
</template>
|
||||
<t-menu-item value="1-1" to="/home">
|
||||
<span>首页</span>
|
||||
</t-menu-item>
|
||||
</t-submenu>
|
||||
<t-submenu value="2" title="财务票据管理">
|
||||
<template #icon>
|
||||
<t-icon name="application" />
|
||||
</template>
|
||||
<t-menu-item value="2-1" to="/Bill/BillStock">
|
||||
<span>票据入库</span>
|
||||
</t-menu-item>
|
||||
<t-menu-item value="2-2" to="/Bill/BillCancel">
|
||||
<span>票据退库</span>
|
||||
</t-menu-item>
|
||||
<t-menu-item value="2-3" to="/Bill/BillReceipt">
|
||||
<span>票据领用</span>
|
||||
</t-menu-item>
|
||||
<t-menu-item value="2-4" to="/Bill/BillQuitneck">
|
||||
<span>票据退领</span>
|
||||
</t-menu-item>
|
||||
<t-menu-item value="2-5" to="/Bill/BillBreakagek">
|
||||
<span>票据报损</span>
|
||||
</t-menu-item>
|
||||
<t-menu-item value="2-6" to="/Bill/BillDestroy">
|
||||
<span>票据核销</span>
|
||||
</t-menu-item>
|
||||
<t-menu-item value="2-7" to="/Bill/DetailReport">
|
||||
<span>报表明细</span>
|
||||
</t-menu-item>
|
||||
<t-menu-item value="2-8" to="/Bill/BillDraw">
|
||||
<span>票据列表</span>
|
||||
</t-menu-item>
|
||||
<t-menu-item value="2-9" to="/Bill/drag">
|
||||
<span>拖拽效果</span>
|
||||
</t-menu-item>
|
||||
</t-submenu>
|
||||
<t-submenu value="3" title="应收款管理">
|
||||
<template #icon>
|
||||
<t-icon name="application" />
|
||||
</template>
|
||||
<t-menu-item value="3-1" to="/accounts">
|
||||
<span>应收款管理</span>
|
||||
</t-menu-item>
|
||||
<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-menu-item value="3-4" to="/daily">
|
||||
<span>收费日报表</span>
|
||||
</t-menu-item>
|
||||
<t-menu-item value="3-5" to="/mitigate">
|
||||
<span>减免明细表</span>
|
||||
</t-menu-item>
|
||||
<t-menu-item value="3-6" to="/return-premium">
|
||||
<span>退费明细表</span>
|
||||
</t-menu-item>
|
||||
<t-menu-item value="3-7" to="/rrrearage">
|
||||
<span>欠费明细表</span>
|
||||
</t-menu-item>
|
||||
<t-menu-item value="3-8" to="/charge-schedule">
|
||||
<span>学生催款单</span>
|
||||
</t-menu-item>
|
||||
<t-menu-item value="3-9" to="/faculty-analysis">
|
||||
<span>部门分析表</span>
|
||||
</t-menu-item>
|
||||
<t-menu-item value="3-10" to="/student-information">
|
||||
<span>学生信息统计表</span>
|
||||
</t-menu-item>
|
||||
<t-menu-item value="3-11" to="/shi-yan">
|
||||
<span>实验</span>
|
||||
</t-menu-item>
|
||||
</t-submenu>
|
||||
<t-submenu value="4" title="学生管理">
|
||||
<template #icon>
|
||||
<t-icon name="application" />
|
||||
</template>
|
||||
<t-menu-item value="4-1" to="/Students">
|
||||
<span>学生管理</span>
|
||||
</t-menu-item>
|
||||
</t-submenu>
|
||||
</t-menu>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup></script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.t-demo-collapse-btn {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: #4b4b4b;
|
||||
border-color: transparent;
|
||||
--ripple-color: #383838;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,14 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
<t-layout>
|
||||
<t-content>
|
||||
<RouterView />
|
||||
</t-content>
|
||||
<!-- <t-footer style="height: 2px">Footer</t-footer> -->
|
||||
</t-layout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup></script>
|
||||
|
||||
<style lang="less" scoped></style>
|
|
@ -1,58 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
<t-head-menu v-model="menu1Value" theme="light" @change="changeHandler">
|
||||
<template #logo>
|
||||
<img
|
||||
height="28"
|
||||
src="https://tdesign.gtimg.com/site/baseLogo-light.png"
|
||||
alt="logo"
|
||||
/>
|
||||
</template>
|
||||
<t-menu-item value="item1"> 菜单1 </t-menu-item>
|
||||
<t-menu-item value="item2"> 菜单2 </t-menu-item>
|
||||
<t-menu-item value="item4" :disabled="true"> 禁用菜单 </t-menu-item>
|
||||
<template #operations>
|
||||
<t-button variant="text" shape="square">
|
||||
<template #icon><t-icon name="search" /></template>
|
||||
</t-button>
|
||||
<t-button variant="text" shape="square">
|
||||
<template #icon><t-icon name="mail" /></template>
|
||||
</t-button>
|
||||
<t-button variant="text" shape="square">
|
||||
<template #icon><t-icon name="user" /></template>
|
||||
</t-button>
|
||||
<t-button variant="text" shape="square">
|
||||
<template #icon><t-icon name="ellipsis" /></template>
|
||||
</t-button>
|
||||
</template>
|
||||
</t-head-menu>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
|
||||
const menu1Value = ref('item2')
|
||||
|
||||
const changeHandler = active => {
|
||||
console.log('change', active)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.t-menu__operations {
|
||||
.t-button {
|
||||
margin-left: 8px;
|
||||
}
|
||||
}
|
||||
.t-demo-menu--dark {
|
||||
.t-button {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: #4b4b4b;
|
||||
border-color: transparent;
|
||||
--ripple-color: #383838;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,22 +0,0 @@
|
|||
<template>
|
||||
<t-layout>
|
||||
<t-header>
|
||||
<LHeader />
|
||||
</t-header>
|
||||
<t-layout>
|
||||
<t-aside>
|
||||
<LAside />
|
||||
</t-aside>
|
||||
<t-content>
|
||||
<LContent />
|
||||
</t-content>
|
||||
</t-layout>
|
||||
</t-layout>
|
||||
</template>
|
||||
<script setup>
|
||||
import LHeader from "./components/LayoutHeader.vue";
|
||||
import LAside from "./components/LayoutAside.vue";
|
||||
import LContent from "./components/LayoutContent.vue";
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
23
src/main.js
23
src/main.js
|
@ -1,19 +1,16 @@
|
|||
import "./style/index.css";
|
||||
import './style/index.css'
|
||||
|
||||
import { createApp } from "vue";
|
||||
import { createPinia } from "pinia";
|
||||
import piniaPluginPersistedstate from "pinia-plugin-persistedstate";
|
||||
import TDesign from "tdesign-vue-next";
|
||||
import { createApp } from 'vue'
|
||||
import { createPinia } from 'pinia'
|
||||
import TDesign from 'tdesign-vue-next';
|
||||
|
||||
import App from "./App.vue";
|
||||
import router from "./router";
|
||||
import App from './App.vue'
|
||||
import router from './router'
|
||||
|
||||
const app = createApp(App);
|
||||
const app = createApp(App)
|
||||
|
||||
const pinia = createPinia();
|
||||
pinia.use(piniaPluginPersistedstate);
|
||||
app.use(pinia);
|
||||
app.use(router);
|
||||
app.use(createPinia())
|
||||
app.use(router)
|
||||
app.use(TDesign);
|
||||
|
||||
app.mount("#app");
|
||||
app.mount('#app')
|
||||
|
|
|
@ -1,377 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<t-layout style="height: 90%; background-color: #f5f7fb">
|
||||
<t-header class="scarch-box">
|
||||
<t-form
|
||||
ref="form"
|
||||
:data="formData"
|
||||
label-width="calc(2em + 40px)"
|
||||
layout="inline"
|
||||
scroll-to-first-error="smooth"
|
||||
class="scarch-from"
|
||||
@reset="resetting"
|
||||
@submit="headerQuery"
|
||||
>
|
||||
<scarch-box :btnNum="4" :colNum="8">
|
||||
<template #scarchName>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="票据编号:" name="billserial">
|
||||
<t-input class="form-item-content" v-model="formData.billserial" maxlength="10"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="报损日期:" name="breakDate">
|
||||
<t-date-picker class="form-item-content" v-model="formData.breakDate" clearable />
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="票据类型:" name="billType">
|
||||
<t-select class="form-item-content" v-model="formData.billType" placeholder="请选择票据类型" clearable>
|
||||
<t-option v-for="item in billType" :key="item.value" :value="item.value" :label="item.label"></t-option>
|
||||
</t-select>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="报损状态:" name="breakStatus" style="margin-bottom: 0.3rem">
|
||||
<t-select class="form-item-content" v-model="formData.breakStatus" placeholder="请选择报损状态" clearable>
|
||||
<t-option v-for="item in billStatus" :key="item.value" :value="item.value" :label="item.label"></t-option>
|
||||
</t-select>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
</template>
|
||||
<template #scarchBtn>
|
||||
<t-button theme="primary" type="submit">查询</t-button>
|
||||
<t-button theme="default" type="reset">重置</t-button>
|
||||
</template>
|
||||
</scarch-box>
|
||||
</t-form>
|
||||
</t-header>
|
||||
<t-content class="table-box">
|
||||
<div class="table-header">
|
||||
<div>
|
||||
<h4 style="font-size: 110%">票据报损列表</h4>
|
||||
</div>
|
||||
<div>
|
||||
<t-button theme="primary" size="small" @click="breakageAdd">
|
||||
<template #icon><add-icon /></template>
|
||||
新增报损票据
|
||||
</t-button>
|
||||
<t-button shape="circle" theme="primary" @click="refresh" style="margin-left: 0.8rem">
|
||||
<template #icon><load-icon /></template>
|
||||
</t-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<t-base-table
|
||||
hover
|
||||
row-key="index"
|
||||
:loading="loading"
|
||||
:data="tableData"
|
||||
:columns="columns"
|
||||
:pagination="pagination"
|
||||
class="table"
|
||||
:max-height="550"
|
||||
>
|
||||
<template #status="slotProps">
|
||||
<t-button
|
||||
theme="default"
|
||||
variant="text"
|
||||
size="small"
|
||||
@click="breakEdit(slotProps)"
|
||||
:disabled="slotProps.row.breakStatus === 0 || slotProps.row.breakStatus === 1"
|
||||
>修改</t-button
|
||||
>
|
||||
<t-popconfirm content="确认删除吗" @confirm="breakDelete(slotProps)">
|
||||
<t-button theme="default" variant="text" size="small" :disabled="slotProps.row.breakStatus === 0">删除</t-button>
|
||||
</t-popconfirm>
|
||||
</template>
|
||||
</t-base-table>
|
||||
</t-content>
|
||||
</t-layout>
|
||||
<t-space>
|
||||
<t-dialog
|
||||
ref="postForm"
|
||||
v-model:visible="visiblePost"
|
||||
:header="headerTitle"
|
||||
width="40%"
|
||||
:confirm-on-enter="true"
|
||||
:on-close="closePost"
|
||||
:confirm-btn="null"
|
||||
:cancel-btn="null"
|
||||
>
|
||||
<list-form :activeForm="'break'" @childForm="breakEvent" :editFrom="editFrom" />
|
||||
</t-dialog>
|
||||
</t-space>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
import scarchBox from "@/components/scarchBox.vue";
|
||||
import listForm from "./form/index.vue";
|
||||
import { billType, billStatus } from "./codeValue/index";
|
||||
import { ref, onMounted } from "vue";
|
||||
import { MessagePlugin } from "tdesign-vue-next";
|
||||
import { AddIcon, LoadIcon } from "tdesign-icons-vue-next";
|
||||
import { useBreakage } from "@/stores/billBreakage";
|
||||
|
||||
// 数据
|
||||
const loading = ref(false);
|
||||
const visiblePost = ref(false);
|
||||
const breakageList = useBreakage();
|
||||
const tableData = ref([]);
|
||||
const data = ref([]);
|
||||
const headerTitle = ref("");
|
||||
const editFrom = ref();
|
||||
// 表格表头
|
||||
const columns = ref([
|
||||
{
|
||||
colKey: "serial-number",
|
||||
title: "序号",
|
||||
width: 50,
|
||||
},
|
||||
{
|
||||
colKey: "billserial",
|
||||
title: "票据编号",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "billType",
|
||||
title: "票据类型",
|
||||
align: "center",
|
||||
width: "100",
|
||||
cell: (h, { row }) => {
|
||||
const type = billType.find((type) => type.value === row.billType);
|
||||
return type ? type.label : "未知";
|
||||
},
|
||||
},
|
||||
{
|
||||
colKey: "breakNum",
|
||||
title: "报损数量",
|
||||
align: "center",
|
||||
width: "100",
|
||||
cell: (h, { row }) => {
|
||||
return row.breakNum + "张";
|
||||
},
|
||||
},
|
||||
{
|
||||
colKey: "breakDate",
|
||||
title: "报损日期",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "operator",
|
||||
title: "操作员",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "breakStatus",
|
||||
title: "报损状态",
|
||||
align: "center",
|
||||
width: "100",
|
||||
cell: (h, { row }) => {
|
||||
const status = billStatus.find((item) => item.value === row.breakStatus);
|
||||
return (
|
||||
<t-tag theme={tagColor(row.breakStatus)} variant="light">
|
||||
{status.label}
|
||||
</t-tag>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
colKey: "breakInfo",
|
||||
title: "报损原因",
|
||||
ellipsis: true,
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "status",
|
||||
title: "操作",
|
||||
width: 120,
|
||||
align: "center",
|
||||
fixed: "right",
|
||||
},
|
||||
]);
|
||||
|
||||
// 获取票据列表
|
||||
const tableList = async () => {
|
||||
loading.value = true;
|
||||
tableData.value = await breakageList.getBreakageList();
|
||||
data.value = await breakageList.getBreakageList();
|
||||
pagination.value.total = tableData.value.length;
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false;
|
||||
clearInterval(timerId);
|
||||
}, 300);
|
||||
};
|
||||
|
||||
// 判断tag标签的颜色
|
||||
const tagColor = (value) => {
|
||||
switch (value) {
|
||||
case 0:
|
||||
return "warning";
|
||||
case 1:
|
||||
return "success";
|
||||
case 2:
|
||||
return "danger";
|
||||
}
|
||||
};
|
||||
// 刷新列表
|
||||
const refresh = () => {
|
||||
tableList();
|
||||
};
|
||||
|
||||
// 查询表单
|
||||
const formData = ref({
|
||||
billserial: "",
|
||||
billType: "",
|
||||
breakStatus: "",
|
||||
breakDate: "",
|
||||
});
|
||||
|
||||
// 分页
|
||||
const pagination = ref({
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 50,
|
||||
});
|
||||
|
||||
// 查询表单重置
|
||||
const resetting = () => {
|
||||
formData.value = {
|
||||
billserial: "",
|
||||
billType: "",
|
||||
breakStatus: "",
|
||||
breakDate: "",
|
||||
};
|
||||
getNewTable();
|
||||
};
|
||||
|
||||
// 查询
|
||||
const headerQuery = () => {
|
||||
tableData.value = data.value;
|
||||
if (
|
||||
formData.value.billserial === "" &&
|
||||
(formData.value.billType === undefined || formData.value.billType === "") &&
|
||||
(formData.value.breakStatus === undefined || formData.value.breakStatus === "") &&
|
||||
formData.value.breakDate === ""
|
||||
) {
|
||||
getNewTable();
|
||||
} else {
|
||||
const list = tableData.value.filter((item) => {
|
||||
let arrList;
|
||||
if (formData.value.billserial === item.billserial) {
|
||||
arrList = item;
|
||||
}
|
||||
if (formData.value.billType === item.billType) {
|
||||
arrList = item;
|
||||
}
|
||||
if (formData.value.breakStatus === item.breakStatus) {
|
||||
arrList = item;
|
||||
}
|
||||
if (formData.value.breakDate === item.breakDate) {
|
||||
arrList = item;
|
||||
}
|
||||
if (
|
||||
formData.value.billserial === "" &&
|
||||
formData.value.billType === "" &&
|
||||
formData.value.breakStatus === "" &&
|
||||
formData.value.breakDate === ""
|
||||
) {
|
||||
arrList = item;
|
||||
}
|
||||
return arrList;
|
||||
});
|
||||
tableData.value = list;
|
||||
// @ts-expect-error
|
||||
pagination.value.total = list.length;
|
||||
}
|
||||
};
|
||||
// 打开窗口
|
||||
const breakageAdd = () => {
|
||||
visiblePost.value = true;
|
||||
headerTitle.value = "新增报损票据";
|
||||
};
|
||||
|
||||
// 关闭窗口
|
||||
const closePost = () => {
|
||||
visiblePost.value = false;
|
||||
};
|
||||
|
||||
// 新增
|
||||
const breakEvent = async (data) => {
|
||||
data.breakStatus = 0;
|
||||
await breakageList.addBreakageList(data);
|
||||
getNewTable();
|
||||
MessagePlugin.success("提交成功");
|
||||
visiblePost.value = false;
|
||||
};
|
||||
|
||||
// 修改
|
||||
const breakEdit = (item) => {
|
||||
headerTitle.value = "修改报损票据";
|
||||
visiblePost.value = true;
|
||||
tableData.value.forEach((itemTable) => {
|
||||
if (itemTable.id === item.row.id) {
|
||||
editFrom.value = itemTable;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 删除
|
||||
const breakDelete = async (itme) => {
|
||||
await breakageList.deleteBreakageList(itme.row);
|
||||
getNewTable();
|
||||
};
|
||||
|
||||
// 弹出框表单重置
|
||||
const onReset = () => {};
|
||||
|
||||
// 判断menuManagement里面是否存在数据
|
||||
const getNewTable = () => {
|
||||
let arr = JSON.parse(localStorage.getItem("breakageList"));
|
||||
if (arr) {
|
||||
tableData.value = arr.breakageList;
|
||||
data.value = arr.breakageList;
|
||||
pagination.value.total = tableData.value.length;
|
||||
} else {
|
||||
tableList();
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getNewTable();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.scarch-box {
|
||||
width: 100%;
|
||||
background-color: @base-white-color;
|
||||
margin-bottom: 2rem;
|
||||
.scarch-from {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.table-box {
|
||||
height: 42rem;
|
||||
background-color: @base-white-color;
|
||||
padding: 1rem;
|
||||
padding-top: 0;
|
||||
.table-header {
|
||||
height: 3rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
:deep(.t-form__controls-content) {
|
||||
justify-content: space-between;
|
||||
}
|
||||
</style>
|
|
@ -1,357 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<t-layout style="height: 90%; background-color: #f5f7fb">
|
||||
<t-header class="scarch-box">
|
||||
<t-form
|
||||
ref="form"
|
||||
:data="scarchData"
|
||||
label-width="calc(2em + 40px)"
|
||||
layout="inline"
|
||||
scroll-to-first-error="smooth"
|
||||
class="scarch-from"
|
||||
@reset="resetting"
|
||||
@submit="headerQuery"
|
||||
>
|
||||
<scarch-box :btnNum="4" :colNum="8">
|
||||
<template #scarchName>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="票据编号:" name="billserial">
|
||||
<t-input class="form-item-content" v-model="scarchData.billserial" maxlength="10"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="退库日期:" name="appleDate">
|
||||
<t-date-picker class="form-item-content" v-model="scarchData.appleDate" clearable />
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="票据类型:" name="billType">
|
||||
<t-select class="form-item-content" v-model="scarchData.billType" placeholder="请选择票据类型" clearable>
|
||||
<t-option v-for="item in billType" :key="item.value" :value="item.value" :label="item.label"></t-option>
|
||||
</t-select>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="审批状态:" name="approvalStatus" style="margin-bottom: 0.3rem">
|
||||
<t-select class="form-item-content" v-model="scarchData.approvalStatus" placeholder="请选择审批状态" clearable>
|
||||
<t-option v-for="item in exaStatus" :key="item.value" :value="item.value" :label="item.label"></t-option>
|
||||
</t-select>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
</template>
|
||||
<template #scarchBtn>
|
||||
<t-button theme="primary" type="submit">查询</t-button>
|
||||
<t-button theme="default" type="reset">重置</t-button>
|
||||
</template>
|
||||
</scarch-box>
|
||||
</t-form>
|
||||
</t-header>
|
||||
<t-content class="table-box">
|
||||
<div class="table-header">
|
||||
<div>
|
||||
<h4 style="font-size: 110%">票据退库列表</h4>
|
||||
</div>
|
||||
<div>
|
||||
<t-button shape="circle" theme="primary" @click="refresh" style="margin-left: 0.8rem">
|
||||
<template #icon><load-icon /></template>
|
||||
</t-button>
|
||||
</div>
|
||||
</div>
|
||||
<t-base-table
|
||||
hover
|
||||
row-key="index"
|
||||
:loading="loading"
|
||||
:data="tableData"
|
||||
:columns="columns"
|
||||
:pagination="pagination"
|
||||
class="table"
|
||||
:max-height="550"
|
||||
>
|
||||
<template #status="slotProps">
|
||||
<t-button theme="default" variant="text" size="small" @click="Approve(slotProps)">
|
||||
<span v-if="slotProps.row.approvalStatus === 0">{{ "审批" }}</span>
|
||||
<span v-if="slotProps.row.approvalStatus === 3">{{ "重新审批" }}</span>
|
||||
</t-button>
|
||||
</template>
|
||||
</t-base-table>
|
||||
</t-content>
|
||||
</t-layout>
|
||||
|
||||
<t-space>
|
||||
<t-dialog
|
||||
ref="postForm"
|
||||
v-model:visible="visiblePost"
|
||||
header="审批"
|
||||
width="40%"
|
||||
:confirm-on-enter="true"
|
||||
:on-close="closePost"
|
||||
:confirm-btn="null"
|
||||
:cancel-btn="null"
|
||||
>
|
||||
<list-form :activeForm="'cancel'" @childForm="cancelromEvent" />
|
||||
</t-dialog>
|
||||
</t-space>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
import scarchBox from "@/components/scarchBox.vue";
|
||||
import listForm from "./form/index.vue";
|
||||
import { billType, exaStatus } from "./codeValue/index.js";
|
||||
import { ref, onMounted } from "vue";
|
||||
import { MessagePlugin } from "tdesign-vue-next";
|
||||
import { LoadIcon } from "tdesign-icons-vue-next";
|
||||
import { useCancel } from "@/stores/billCancel";
|
||||
// 分页
|
||||
const pagination = ref({
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 50,
|
||||
});
|
||||
|
||||
// 查询表单
|
||||
const scarchData = ref({
|
||||
billserial: "",
|
||||
billType: "",
|
||||
appleDate: "",
|
||||
approvalStatus: [],
|
||||
});
|
||||
|
||||
// 数据
|
||||
const loading = ref(false);
|
||||
const visiblePost = ref(false);
|
||||
const cancelList = useCancel();
|
||||
const tableData = ref([]);
|
||||
const data = ref([]);
|
||||
const headerTiTle = ref("");
|
||||
// 表格表头
|
||||
const columns = ref([
|
||||
{
|
||||
colKey: "serial-number",
|
||||
title: "序号",
|
||||
width: 50,
|
||||
},
|
||||
{
|
||||
colKey: "billserial",
|
||||
title: "票据编号",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "billType",
|
||||
title: "票据类型",
|
||||
align: "center",
|
||||
width: "100",
|
||||
cell: (h, { row }) => {
|
||||
const type = billType.find((type) => type.value === row.billType);
|
||||
return type ? type.label : "未知";
|
||||
},
|
||||
},
|
||||
{
|
||||
colKey: "cancelNum",
|
||||
title: "退库数量",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "appleDate",
|
||||
title: "申请时间",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "proposer",
|
||||
title: "申请人",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "approvalStatus",
|
||||
title: "审批状态",
|
||||
align: "center",
|
||||
width: "100",
|
||||
cell: (h, { row }) => {
|
||||
const status = exaStatus.find((item) => item.value === row.approvalStatus);
|
||||
return (
|
||||
<t-tag theme={tagColor(row.approvalStatus)} variant="light">
|
||||
{status.label}
|
||||
</t-tag>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
colKey: "reason",
|
||||
title: "退库原因",
|
||||
ellipsis: true,
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "status",
|
||||
title: "操作",
|
||||
width: 120,
|
||||
align: "center",
|
||||
fixed: "right",
|
||||
},
|
||||
]);
|
||||
|
||||
// 弹出框表单
|
||||
const dialogData = ref({
|
||||
approver: "",
|
||||
approvalDate: "",
|
||||
approvalReason: "",
|
||||
});
|
||||
|
||||
// 获取票据列表
|
||||
const tableList = async () => {
|
||||
loading.value = true;
|
||||
tableData.value = await cancelList.getCancelList();
|
||||
data.value = await cancelList.getCancelList();
|
||||
pagination.value.total = tableData.value.length;
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false;
|
||||
clearInterval(timerId);
|
||||
}, 300);
|
||||
};
|
||||
|
||||
// 判断tag标签的颜色
|
||||
const tagColor = (value) => {
|
||||
switch (value) {
|
||||
case 0:
|
||||
return "default";
|
||||
case 1:
|
||||
return "warning";
|
||||
case 2:
|
||||
return "success";
|
||||
case 3:
|
||||
return "danger";
|
||||
}
|
||||
};
|
||||
|
||||
// 刷新列表
|
||||
const refresh = () => {
|
||||
tableList();
|
||||
};
|
||||
|
||||
// 查询
|
||||
const headerQuery = () => {
|
||||
tableData.value = data.value;
|
||||
if (
|
||||
scarchData.value.billserial === "" &&
|
||||
(scarchData.value.billType === undefined || scarchData.value.billType === "") &&
|
||||
(scarchData.value.approvalStatus === undefined || scarchData.value.approvalStatus === "") &&
|
||||
scarchData.value.appleDate === ""
|
||||
) {
|
||||
getNewTable();
|
||||
} else {
|
||||
const list = tableData.value.filter((item) => {
|
||||
let arrList;
|
||||
if (scarchData.value.billserial === item.billserial) {
|
||||
arrList = item;
|
||||
}
|
||||
if (scarchData.value.billType === item.billType) {
|
||||
arrList = item;
|
||||
}
|
||||
if (scarchData.value.approvalStatus === item.approvalStatus) {
|
||||
arrList = item;
|
||||
}
|
||||
if (scarchData.value.appleDate === item.appleDate) {
|
||||
arrList = item;
|
||||
}
|
||||
if (
|
||||
scarchData.value.billserial === "" &&
|
||||
scarchData.value.billType === "" &&
|
||||
scarchData.value.appleDate === "" &&
|
||||
scarchData.value.approvalStatus === ""
|
||||
) {
|
||||
arrList = item;
|
||||
}
|
||||
console.log(arrList);
|
||||
return arrList;
|
||||
});
|
||||
tableData.value = list;
|
||||
pagination.value.total = list.length;
|
||||
}
|
||||
};
|
||||
// 查询表单重置
|
||||
const resetting = () => {
|
||||
scarchData.value = {
|
||||
billserial: "",
|
||||
billType: "",
|
||||
appleDate: "",
|
||||
approvalStatus,
|
||||
};
|
||||
getNewTable();
|
||||
};
|
||||
const rowItem = ref({});
|
||||
const Approve = (value) => {
|
||||
dialogData.value = {
|
||||
approver: "",
|
||||
approvalDate: "",
|
||||
approvalReason: "",
|
||||
};
|
||||
visiblePost.value = true;
|
||||
rowItem.value = value;
|
||||
};
|
||||
|
||||
// 表单重置
|
||||
const onReset = () => {};
|
||||
|
||||
// 表单提交
|
||||
const cancelromEvent = async () => {
|
||||
rowItem.value.row.approvalStatus = 1;
|
||||
await cancelList.editApprovalStatus(rowItem.value);
|
||||
getNewTable();
|
||||
MessagePlugin.success("提交成功");
|
||||
visiblePost.value = false;
|
||||
};
|
||||
|
||||
// 关闭窗口
|
||||
const closePost = () => {
|
||||
visiblePost.value = false;
|
||||
};
|
||||
|
||||
// 判断menuManagement里面是否存在数据
|
||||
const getNewTable = () => {
|
||||
let arr = JSON.parse(localStorage.getItem("CancelList"));
|
||||
if (arr) {
|
||||
tableData.value = arr.cancelList;
|
||||
data.value = arr.cancelList;
|
||||
pagination.value.total = tableData.value.length;
|
||||
} else {
|
||||
tableList();
|
||||
}
|
||||
};
|
||||
onMounted(() => {
|
||||
getNewTable();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.scarch-box {
|
||||
width: 100%;
|
||||
background-color: @base-white-color;
|
||||
margin-bottom: 2rem;
|
||||
.scarch-from {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.table-box {
|
||||
height: 42rem;
|
||||
background-color: @base-white-color;
|
||||
padding: 1rem;
|
||||
padding-top: 0;
|
||||
.table-header {
|
||||
height: 3rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
:deep(.t-form__controls-content) {
|
||||
justify-content: space-between;
|
||||
}
|
||||
</style>
|
|
@ -1,314 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<t-layout style="height: 90%; background-color: #f5f7fb">
|
||||
<t-header class="scarch-box">
|
||||
<t-form
|
||||
ref="form"
|
||||
:data="formData"
|
||||
label-width="calc(2em + 40px)"
|
||||
layout="inline"
|
||||
scroll-to-first-error="smooth"
|
||||
class="scarch-from form-responsive"
|
||||
@reset="resetting"
|
||||
@submit="headerQuery"
|
||||
>
|
||||
<scarch-box :btnNum="4" :colNum="8">
|
||||
<template #scarchName>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="票据编号:" name="billserial">
|
||||
<t-input v-model="formData.billserial" class="form-item-content" maxlength="10"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="报损日期:" name="breakDate">
|
||||
<t-date-picker v-model="formData.breakDate" class="form-item-content" clearable />
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="票据类型:" name="billType">
|
||||
<t-select v-model="formData.billType" placeholder="请选择票据类型" class="form-item-content" clearable>
|
||||
<t-option v-for="item in billType" :key="item.value" :value="item.value" :label="item.label"></t-option>
|
||||
</t-select>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
</template>
|
||||
<template #scarchBtn>
|
||||
<t-button theme="primary" type="submit">查询</t-button>
|
||||
<t-button theme="default" type="reset">重置</t-button>
|
||||
</template>
|
||||
</scarch-box>
|
||||
</t-form>
|
||||
</t-header>
|
||||
<t-content class="table-box">
|
||||
<div class="table-header">
|
||||
<div>
|
||||
<h4 style="font-size: 110%">票据核销列表</h4>
|
||||
</div>
|
||||
<div>
|
||||
<t-button shape="circle" theme="primary" @click="refresh" style="margin-left: 0.8rem">
|
||||
<template #icon><load-icon /></template>
|
||||
</t-button>
|
||||
</div>
|
||||
</div>
|
||||
<t-base-table
|
||||
hover
|
||||
row-key="index"
|
||||
:loading="loading"
|
||||
:data="tableData"
|
||||
:columns="columns"
|
||||
:pagination="pagination"
|
||||
class="table"
|
||||
:height="550"
|
||||
>
|
||||
<template #status="slotProps">
|
||||
<t-button theme="default" variant="text" size="small" @click="breakEdit(slotProps)">审核</t-button>
|
||||
</template>
|
||||
</t-base-table>
|
||||
</t-content>
|
||||
</t-layout>
|
||||
<t-space>
|
||||
<t-dialog
|
||||
ref="postForm"
|
||||
v-model:visible="visiblePost"
|
||||
:header="headerTitle"
|
||||
width="40%"
|
||||
:confirm-on-enter="true"
|
||||
:on-close="closePost"
|
||||
:confirm-btn="null"
|
||||
:cancel-btn="null"
|
||||
>
|
||||
<list-form :activeForm="'destroy'" @childForm="destroyEvent" />
|
||||
</t-dialog>
|
||||
</t-space>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import scarchBox from "@/components/scarchBox.vue";
|
||||
import listForm from "./form/index.vue";
|
||||
import { billType, billStatus } from "./codeValue/index";
|
||||
import { ref, onMounted } from "vue";
|
||||
import { MessagePlugin } from "tdesign-vue-next";
|
||||
import { AddIcon, LoadIcon } from "tdesign-icons-vue-next";
|
||||
import { useDestroy } from "@/stores/billDestroy";
|
||||
|
||||
// 数据
|
||||
const loading = ref(false);
|
||||
const visiblePost = ref(false);
|
||||
|
||||
const destroyList = useDestroy();
|
||||
const tableData = ref([]);
|
||||
const data = ref([]);
|
||||
const headerTitle = ref("审核");
|
||||
const rowItem = ref({});
|
||||
// 表格表头
|
||||
const columns = ref([
|
||||
{
|
||||
colKey: "serial-number",
|
||||
title: "序号",
|
||||
width: 50,
|
||||
},
|
||||
{
|
||||
colKey: "billserial",
|
||||
title: "票据编号",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "billType",
|
||||
title: "票据类型",
|
||||
align: "center",
|
||||
width: "100",
|
||||
cell: (h, { row }) => {
|
||||
const type = billType.find((type) => type.value === row.billType);
|
||||
return type ? type.label : "未知";
|
||||
},
|
||||
},
|
||||
{
|
||||
colKey: "breakNum",
|
||||
title: "报损数量",
|
||||
align: "center",
|
||||
width: "100",
|
||||
cell: (h, { row }) => {
|
||||
return `${row.breakNum}张`;
|
||||
},
|
||||
},
|
||||
{
|
||||
colKey: "breakDate",
|
||||
title: "报损日期",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "operator",
|
||||
title: "报损人员",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "breakInfo",
|
||||
title: "报损原因",
|
||||
ellipsis: true,
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "status",
|
||||
title: "操作",
|
||||
width: 120,
|
||||
align: "center",
|
||||
fixed: "right",
|
||||
},
|
||||
]);
|
||||
|
||||
// 获取票据列表
|
||||
const tableList = async () => {
|
||||
loading.value = true;
|
||||
tableData.value = await destroyList.getDestroyList();
|
||||
data.value = await destroyList.getDestroyList();
|
||||
pagination.value.total = tableData.value.length;
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false;
|
||||
clearInterval(timerId);
|
||||
}, 300);
|
||||
};
|
||||
|
||||
// 刷新列表
|
||||
const refresh = () => {
|
||||
tableList();
|
||||
};
|
||||
|
||||
// 查询表单
|
||||
const formData = ref({
|
||||
billserial: "",
|
||||
billType: "",
|
||||
breakStatus: "",
|
||||
breakDate: "",
|
||||
});
|
||||
|
||||
// 分页
|
||||
const pagination = ref({
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 50,
|
||||
});
|
||||
|
||||
// 查询表单重置
|
||||
const resetting = () => {
|
||||
formData.value = {
|
||||
billserial: "",
|
||||
billType: "",
|
||||
breakStatus: "",
|
||||
breakDate: "",
|
||||
};
|
||||
getNewTable();
|
||||
};
|
||||
|
||||
// 查询
|
||||
const headerQuery = () => {
|
||||
tableData.value = data.value;
|
||||
if (
|
||||
formData.value.billserial === "" &&
|
||||
(formData.value.billType === undefined || formData.value.billType === "") &&
|
||||
formData.value.breakDate === ""
|
||||
) {
|
||||
getNewTable();
|
||||
} else {
|
||||
const list = tableData.value.filter((item) => {
|
||||
let arrList;
|
||||
if (formData.value.billserial === item.billserial) {
|
||||
arrList = item;
|
||||
}
|
||||
if (formData.value.billType === item.billType) {
|
||||
arrList = item;
|
||||
}
|
||||
if (formData.value.breakDate === item.breakDate) {
|
||||
arrList = item;
|
||||
}
|
||||
if (formData.value.billserial === "" && formData.value.billType === "" && formData.value.breakDate === "") {
|
||||
arrList = item;
|
||||
}
|
||||
return arrList;
|
||||
});
|
||||
tableData.value = list;
|
||||
pagination.value.total = list.length;
|
||||
}
|
||||
};
|
||||
// 打开窗口
|
||||
const breakageAdd = () => {
|
||||
visiblePost.value = true;
|
||||
};
|
||||
|
||||
// 关闭窗口
|
||||
const closePost = () => {
|
||||
visiblePost.value = false;
|
||||
};
|
||||
|
||||
// 新增
|
||||
const destroyEvent = async (data) => {
|
||||
data = {
|
||||
...rowItem.value.row,
|
||||
breakStatus: Number(data.Status),
|
||||
};
|
||||
await destroyList.auditDestroyList(data);
|
||||
getNewTable();
|
||||
visiblePost.value = false;
|
||||
MessagePlugin.success("提交成功");
|
||||
};
|
||||
|
||||
// 审核
|
||||
const breakEdit = (item) => {
|
||||
visiblePost.value = true;
|
||||
rowItem.value = item;
|
||||
};
|
||||
|
||||
// 弹出框表单重置
|
||||
const onReset = () => {};
|
||||
|
||||
// 判断breakageList里面是否存在数据
|
||||
const getNewTable = () => {
|
||||
let arr = JSON.parse(localStorage.getItem("breakageList"));
|
||||
if (arr) {
|
||||
tableData.value = arr.destroyList;
|
||||
data.value = arr.destroyList;
|
||||
pagination.value.total = tableData.value.length;
|
||||
}
|
||||
if (arr === null) {
|
||||
tableData.value = [];
|
||||
pagination.value.total = tableData.value.length;
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getNewTable();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.scarch-box {
|
||||
width: 100%;
|
||||
background-color: @base-white-color;
|
||||
margin-bottom: 2rem;
|
||||
.scarch-from {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.table-box {
|
||||
height: 42rem;
|
||||
background-color: @base-white-color;
|
||||
padding: 1rem;
|
||||
padding-top: 0;
|
||||
.table-header {
|
||||
height: 3rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
:deep(.t-form__controls-content) {
|
||||
justify-content: space-between;
|
||||
}
|
||||
</style>
|
|
@ -1,314 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<t-layout style="height: 90%; background-color: #f5f7fb">
|
||||
<t-header class="scarch-box">
|
||||
<t-form
|
||||
ref="form"
|
||||
:data="formData"
|
||||
label-width="calc(2em + 40px)"
|
||||
layout="inline"
|
||||
scroll-to-first-error="smooth"
|
||||
class="scarch-from"
|
||||
@reset="resetting"
|
||||
@submit="headerQuery"
|
||||
>
|
||||
<scarch-box :btnNum="4" :colNum="8">
|
||||
<template #scarchName>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="票据编号:" name="billserial">
|
||||
<t-input v-model="formData.billserial" class="form-item-content" maxlength="10"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="入库日期:" name="stockDate">
|
||||
<t-date-picker v-model="formData.stockDate" class="form-item-content" clearable />
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="票据类型:" name="billType">
|
||||
<t-select v-model="formData.billType" placeholder="请选择票据类型" class="form-item-content" clearable>
|
||||
<t-option v-for="item in billType" :key="item.value" :value="item.value" :label="item.label"></t-option>
|
||||
</t-select>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
</template>
|
||||
<template #scarchBtn>
|
||||
<t-button theme="primary" type="submit">查询</t-button>
|
||||
<t-button theme="default" type="reset">重置</t-button>
|
||||
</template>
|
||||
</scarch-box>
|
||||
</t-form>
|
||||
</t-header>
|
||||
<t-content class="table-box">
|
||||
<div class="table-header">
|
||||
<div>
|
||||
<h4 style="font-size: 110%">票据列表</h4>
|
||||
</div>
|
||||
<div>
|
||||
<t-button shape="circle" theme="primary" @click="refresh" style="margin-left: 0.8rem">
|
||||
<template #icon><load-icon /></template>
|
||||
</t-button>
|
||||
</div>
|
||||
</div>
|
||||
<t-base-table
|
||||
hover
|
||||
row-key="index"
|
||||
:loading="loading"
|
||||
:data="tableData"
|
||||
:columns="columns"
|
||||
:pagination="pagination"
|
||||
class="table"
|
||||
:max-height="550"
|
||||
>
|
||||
<template #status="slotProps">
|
||||
<t-button theme="default" variant="text" size="small" @click="exportPdf(slotProps)">导出pdf</t-button>
|
||||
</template>
|
||||
</t-base-table>
|
||||
</t-content>
|
||||
</t-layout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import scarchBox from "@/components/scarchBox.vue";
|
||||
import { billType } from "./codeValue/index";
|
||||
import { ref, onMounted } from "vue";
|
||||
import { MessagePlugin } from "tdesign-vue-next";
|
||||
import { LoadIcon } from "tdesign-icons-vue-next";
|
||||
import { useStock } from "@/stores/billStock";
|
||||
import { exportToPDF } from "@/utils/pdf";
|
||||
|
||||
// 数据
|
||||
const loading = ref(false);
|
||||
const stockList = useStock();
|
||||
const tableData = ref();
|
||||
const data = ref();
|
||||
// 表格表头
|
||||
const columns = ref([
|
||||
{
|
||||
colKey: "serial-number",
|
||||
title: "序号",
|
||||
width: 50,
|
||||
},
|
||||
{
|
||||
colKey: "billserial",
|
||||
title: "票据编号",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "billType",
|
||||
title: "票据类型",
|
||||
align: "center",
|
||||
width: "100",
|
||||
cell: (h, { row }) => {
|
||||
const type = billType.find((type) => type.value === row.billType);
|
||||
return type ? type.label : "未知";
|
||||
},
|
||||
},
|
||||
{
|
||||
colKey: "stockNum",
|
||||
title: "入库数量",
|
||||
align: "center",
|
||||
width: "100",
|
||||
cell: (h, { row }) => {
|
||||
return `${row.stockNum}张`;
|
||||
},
|
||||
},
|
||||
{
|
||||
colKey: "stockDate",
|
||||
title: "入库日期",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "operator",
|
||||
title: "操作员",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "remark",
|
||||
title: "备注",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "status",
|
||||
title: "操作",
|
||||
width: 120,
|
||||
align: "center",
|
||||
fixed: "right",
|
||||
},
|
||||
]);
|
||||
|
||||
// 获取票据列表
|
||||
const tableList = async () => {
|
||||
loading.value = true;
|
||||
tableData.value = await stockList.getStockList();
|
||||
data.value = await stockList.getStockList();
|
||||
pagination.value.total = tableData.value.length;
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false;
|
||||
clearInterval(timerId);
|
||||
}, 300);
|
||||
};
|
||||
|
||||
// 刷新列表
|
||||
const refresh = () => {
|
||||
tableList();
|
||||
};
|
||||
|
||||
// 查询表单
|
||||
const formData = ref({
|
||||
billserial: "",
|
||||
billType: "",
|
||||
stockDate: "",
|
||||
});
|
||||
|
||||
// 分页
|
||||
const pagination = ref({
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 50,
|
||||
});
|
||||
|
||||
// 查询表单重置
|
||||
const resetting = () => {
|
||||
formData.value = {
|
||||
billserial: "",
|
||||
billType: "",
|
||||
stockDate: "",
|
||||
};
|
||||
getNewTable();
|
||||
};
|
||||
|
||||
// 查询
|
||||
const headerQuery = () => {
|
||||
tableData.value = data.value;
|
||||
if (
|
||||
formData.value.billserial === "" &&
|
||||
(formData.value.billType === undefined || formData.value.billType === "") &&
|
||||
formData.value.stockDate === ""
|
||||
) {
|
||||
getNewTable();
|
||||
} else {
|
||||
const list = tableData.value.filter((item) => {
|
||||
let arrList;
|
||||
if (formData.value.billserial === item.billserial) {
|
||||
arrList = item;
|
||||
}
|
||||
if (formData.value.billType === item.billType) {
|
||||
arrList = item;
|
||||
}
|
||||
if (formData.value.stockDate === item.stockDate) {
|
||||
arrList = item;
|
||||
}
|
||||
if (formData.value.billserial === "" && formData.value.billType === "" && formData.value.stockDate === "") {
|
||||
arrList = item;
|
||||
}
|
||||
return arrList;
|
||||
});
|
||||
tableData.value = list;
|
||||
pagination.value.total = list.length;
|
||||
}
|
||||
};
|
||||
|
||||
// 判断menuManagement里面是否存在数据
|
||||
const getNewTable = () => {
|
||||
let arr = JSON.parse(localStorage.getItem("menuManagement"));
|
||||
if (arr) {
|
||||
tableData.value = arr.stockList;
|
||||
data.value = arr.stockList;
|
||||
pagination.value.total = tableData.value.length;
|
||||
} else {
|
||||
tableList();
|
||||
}
|
||||
};
|
||||
|
||||
// 导出pdf
|
||||
const exportPdf = (slotProps) => {
|
||||
// const content = slotProps.row;
|
||||
const content = [
|
||||
// 标题
|
||||
{
|
||||
text: "票据标题",
|
||||
style: "header",
|
||||
alignment: "center",
|
||||
margin: [0, 0, 0, 0],
|
||||
},
|
||||
|
||||
// 基础信息
|
||||
{
|
||||
columns: [
|
||||
{ text: "发票编号:", style: "label", alignment: "right" },
|
||||
{ text: "1234567890", style: "value" },
|
||||
{ text: "日期:", style: "label", alignment: "right" },
|
||||
{ text: "2023-04-05", style: "value" },
|
||||
],
|
||||
margin: [0, 20, 0, 0],
|
||||
},
|
||||
|
||||
// 表格
|
||||
{
|
||||
table: {
|
||||
widths: ["*", "auto", "*"],
|
||||
body: [
|
||||
[
|
||||
{ text: "商品名称", style: "tableHeader" },
|
||||
{ text: "数量", style: "tableHeader" },
|
||||
{ text: "单价", style: "tableHeader" },
|
||||
],
|
||||
["商品A", "10件", "$10.00"],
|
||||
["商品B", "5件", "$20.00"],
|
||||
// [{ text: "合计", colSpan: 2, alignment: "right" }, "$150.00"],
|
||||
],
|
||||
},
|
||||
layout: "noBorders",
|
||||
margin: [0, 20, 0, 0],
|
||||
},
|
||||
|
||||
// 底部注释
|
||||
{
|
||||
text: "本票据一式两份,甲乙双方各执一份,具有同等法律效力。",
|
||||
style: "footer",
|
||||
alignment: "center",
|
||||
margin: [0, 0, 0, 30],
|
||||
},
|
||||
];
|
||||
exportToPDF(content);
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getNewTable();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.scarch-box {
|
||||
width: 100%;
|
||||
background-color: @base-white-color;
|
||||
margin-bottom: 2rem;
|
||||
.scarch-from {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.table-box {
|
||||
height: 42rem;
|
||||
background-color: @base-white-color;
|
||||
padding: 1rem;
|
||||
padding-top: 0;
|
||||
.table-header {
|
||||
height: 3rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
:deep(.t-form__controls-content) {
|
||||
justify-content: space-between;
|
||||
}
|
||||
</style>
|
|
@ -1,310 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color" style="overflow-y: hidden">
|
||||
<t-layout style="height: 100%; background-color: #f5f7fb">
|
||||
<t-aside class="asideTree">
|
||||
<t-space direction="vertical">
|
||||
<t-tree
|
||||
:data="personName"
|
||||
hover
|
||||
transition
|
||||
activable
|
||||
expandAll
|
||||
:expand-mutex="mutex"
|
||||
expand-on-click-node="true"
|
||||
@click="onClick"
|
||||
/>
|
||||
</t-space>
|
||||
</t-aside>
|
||||
<t-content>
|
||||
<t-layout style="height: 100%; background-color: #f5f7fb" v-if="pageJudge">
|
||||
<t-header class="scarch-box">
|
||||
<t-form
|
||||
ref="form"
|
||||
:data="scarchData"
|
||||
label-width="calc(2em + 40px)"
|
||||
layout="inline"
|
||||
scroll-to-first-error="smooth"
|
||||
class="scarch-from"
|
||||
@reset="resetting"
|
||||
@submit="headerQuery"
|
||||
>
|
||||
<scarch-box :btnNum="2" :colNum="10">
|
||||
<template #scarchName>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="票据编号:" name="billserial">
|
||||
<t-input class="form-item-content" v-model="scarchData.billserial" maxlength="10"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="领用时间:" name="quitneckDate">
|
||||
<t-date-picker class="form-item-content" v-model="scarchData.quitneckDate" clearable />
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="票据类型:" name="billType" style="margin-bottom: 0.3rem">
|
||||
<t-select class="form-item-content" v-model="scarchData.billType" placeholder="请选择票据类型" clearable>
|
||||
<t-option v-for="item in billType" :key="item.value" :value="item.value" :label="item.label"></t-option>
|
||||
</t-select>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
</template>
|
||||
<template #scarchBtn>
|
||||
<t-button theme="primary" type="submit">查询</t-button>
|
||||
<t-button theme="default" type="reset">重置</t-button>
|
||||
</template>
|
||||
</scarch-box>
|
||||
</t-form>
|
||||
</t-header>
|
||||
<t-content class="table-box">
|
||||
<div class="table-header">
|
||||
<div>
|
||||
<h4 style="font-size: 110%">票据退领列表</h4>
|
||||
</div>
|
||||
<div>
|
||||
<t-button shape="circle" theme="primary" @click="refresh" style="margin-left: 0.8rem">
|
||||
<template #icon><load-icon /></template>
|
||||
</t-button>
|
||||
</div>
|
||||
</div>
|
||||
<t-base-table
|
||||
hover
|
||||
row-key="index"
|
||||
:loading="loading"
|
||||
:data="tableData"
|
||||
:columns="columns"
|
||||
:pagination="pagination"
|
||||
class="table"
|
||||
:max-height="550"
|
||||
/>
|
||||
</t-content>
|
||||
</t-layout>
|
||||
<t-layout class="layoutPage" v-else>
|
||||
<span> 请点击左侧员工名单 </span>
|
||||
</t-layout>
|
||||
</t-content>
|
||||
</t-layout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import scarchBox from "@/components/scarchBox.vue";
|
||||
import { billType } from "./codeValue/index.js";
|
||||
import { ref, onMounted, nextTick } from "vue";
|
||||
import { MessagePlugin } from "tdesign-vue-next";
|
||||
import { LoadIcon } from "tdesign-icons-vue-next";
|
||||
import { useQuitneckList } from "@/stores/billQuitneck";
|
||||
import { useReceiptList } from "@/stores/billReceipt";
|
||||
|
||||
const quitneckList = useQuitneckList();
|
||||
const receiptList = useReceiptList();
|
||||
const personName = ref([]);
|
||||
const tableData = ref([]);
|
||||
const data = ref([]);
|
||||
const rowItem = ref({});
|
||||
const loading = ref(false);
|
||||
const pageJudge = ref(false);
|
||||
const columns = ref([
|
||||
{
|
||||
colKey: "serial-number",
|
||||
title: "序号",
|
||||
width: 50,
|
||||
},
|
||||
{
|
||||
colKey: "billserial",
|
||||
title: "票据编号",
|
||||
align: "center",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
colKey: "proposer",
|
||||
title: "申请人",
|
||||
align: "center",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
colKey: "billType",
|
||||
title: "票据类型",
|
||||
align: "center",
|
||||
width: 100,
|
||||
cell: (h, { row }) => {
|
||||
const type = billType.find((type) => type.value === row.billType);
|
||||
return type ? type.label : "未知";
|
||||
},
|
||||
},
|
||||
{
|
||||
colKey: "quitneckNum",
|
||||
title: "退领数量",
|
||||
align: "center",
|
||||
width: 100,
|
||||
cell: (h, { row }) => {
|
||||
return `${row.quitneckNum}张`;
|
||||
},
|
||||
},
|
||||
{
|
||||
colKey: "quitneckDate",
|
||||
title: "退领时间",
|
||||
align: "center",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
colKey: "quitneckReason",
|
||||
title: "退领原因",
|
||||
ellipsis: true,
|
||||
align: "center",
|
||||
width: 200,
|
||||
},
|
||||
]);
|
||||
|
||||
// 查询表单
|
||||
const scarchData = ref({});
|
||||
|
||||
// 分页
|
||||
const pagination = ref({
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 50,
|
||||
});
|
||||
|
||||
// 获取票据列表
|
||||
const personList = async () => {
|
||||
personName.value = await receiptList.getPersonNameList();
|
||||
};
|
||||
|
||||
// 查询
|
||||
const headerQuery = () => {
|
||||
tableData.value = data.value;
|
||||
console.log(scarchData.value.billserial, scarchData.value.billType, scarchData.value.quitneckDate);
|
||||
if (
|
||||
scarchData.value.billserial === "" &&
|
||||
(scarchData.value.billType === undefined || scarchData.value.billType === "") &&
|
||||
(scarchData.value.quitneckDate === undefined || scarchData.value.quitneckDate === "")
|
||||
) {
|
||||
tableData.value = data.value;
|
||||
pagination.value.total = tableData.value.length;
|
||||
} else {
|
||||
const list = tableData.value.filter((item) => {
|
||||
let arrList;
|
||||
if (scarchData.value.billserial === item.billserial) {
|
||||
arrList = item;
|
||||
}
|
||||
if (scarchData.value.billType === item.billType) {
|
||||
arrList = item;
|
||||
}
|
||||
if (scarchData.value.quitneckDate === item.quitneckDate) {
|
||||
arrList = item;
|
||||
}
|
||||
if (scarchData.value.billserial === "" && scarchData.value.billType === "" && scarchData.value.quitneckDate === "") {
|
||||
arrList = item;
|
||||
}
|
||||
console.log(arrList);
|
||||
return arrList;
|
||||
});
|
||||
tableData.value = list;
|
||||
pagination.value.total = list.length;
|
||||
}
|
||||
};
|
||||
// 查询表单重置
|
||||
const resetting = () => {
|
||||
scarchData.value = {
|
||||
billserial: "",
|
||||
billType: "",
|
||||
quitneckDate: "",
|
||||
};
|
||||
tableData.value = data.value;
|
||||
pagination.value.total = tableData.value.length;
|
||||
};
|
||||
|
||||
// 表单重置
|
||||
const Quitneck = (value) => {
|
||||
dialogData.value = {
|
||||
quitneckDate: "",
|
||||
quitneckReason: "",
|
||||
quitneckNum: "",
|
||||
};
|
||||
visiblePost.value = true;
|
||||
rowItem.value = value;
|
||||
};
|
||||
const onClick = async (context) => {
|
||||
// 判断是否为顶层节点(无父节点)
|
||||
if (context.node.value === "t1") {
|
||||
return;
|
||||
}
|
||||
pageJudge.value = true;
|
||||
loading.value = true;
|
||||
// 获取票据列表
|
||||
tableData.value = await quitneckList.getQuitneckList(context.node.label);
|
||||
data.value = await quitneckList.getQuitneckList(context.node.label);
|
||||
pagination.value.total = tableData.value.length;
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false;
|
||||
clearInterval(timerId);
|
||||
}, 300);
|
||||
};
|
||||
// // 刷新列表
|
||||
// const refresh = () => {
|
||||
// getTableData();
|
||||
// pagination.value.total = tableData.value.length;
|
||||
// };
|
||||
// 判断ReceiptList里面是否存在数据
|
||||
const getPersonName = () => {
|
||||
let arr = JSON.parse(localStorage.getItem("ReceiptList"));
|
||||
if (arr) {
|
||||
personName.value = arr.personName;
|
||||
} else {
|
||||
personList();
|
||||
}
|
||||
};
|
||||
onMounted(async () => {
|
||||
getPersonName();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.asideTree {
|
||||
margin-right: 2rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 1rem;
|
||||
}
|
||||
.scarch-box {
|
||||
width: 100%;
|
||||
background-color: @base-white-color;
|
||||
margin-bottom: 2rem;
|
||||
.scarch-from {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.table-box {
|
||||
height: 41rem;
|
||||
background-color: @base-white-color;
|
||||
padding: 1rem;
|
||||
padding-top: 0;
|
||||
.table-header {
|
||||
height: 3rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.layoutPage {
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
span {
|
||||
font-size: 20px;
|
||||
font-weight: 800;
|
||||
color: #191919;
|
||||
}
|
||||
}
|
||||
:deep(.t-tree--transition .t-tree__label) {
|
||||
width: 10rem;
|
||||
}
|
||||
:deep(.t-form__controls-content) {
|
||||
justify-content: space-between;
|
||||
}
|
||||
</style>
|
|
@ -1,364 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color" style="overflow-y: hidden">
|
||||
<t-layout style="height: 100%; background-color: #f5f7fb">
|
||||
<t-aside class="asideTree">
|
||||
<t-space direction="vertical">
|
||||
<t-tree
|
||||
:data="personName"
|
||||
hover
|
||||
transition
|
||||
activable
|
||||
expandAll
|
||||
:expand-mutex="mutex"
|
||||
expand-on-click-node="true"
|
||||
@click="onClick"
|
||||
/>
|
||||
</t-space>
|
||||
</t-aside>
|
||||
<t-content>
|
||||
<t-layout style="height: 100%; background-color: #f5f7fb">
|
||||
<t-header class="scarch-box">
|
||||
<t-form
|
||||
ref="form"
|
||||
:data="scarchData"
|
||||
label-width="calc(2em + 40px)"
|
||||
layout="inline"
|
||||
scroll-to-first-error="smooth"
|
||||
class="scarch-from"
|
||||
@reset="resetting"
|
||||
@submit="headerQuery"
|
||||
>
|
||||
<scarch-box :btnNum="2" :colNum="10">
|
||||
<template #scarchName>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="票据编号:" name="billserial">
|
||||
<t-input class="form-item-content" v-model="scarchData.billserial" maxlength="10"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="领用时间:" name="receiptDate">
|
||||
<t-date-picker class="form-item-content" v-model="scarchData.receiptDate" clearable />
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="票据类型:" name="billType" style="margin-bottom: 0.3rem">
|
||||
<t-select class="form-item-content" v-model="scarchData.billType" placeholder="请选择票据类型" clearable>
|
||||
<t-option v-for="item in billType" :key="item.value" :value="item.value" :label="item.label"></t-option>
|
||||
</t-select>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
</template>
|
||||
<template #scarchBtn>
|
||||
<t-button theme="primary" type="submit">查询</t-button>
|
||||
<t-button theme="default" type="reset">重置</t-button>
|
||||
</template>
|
||||
</scarch-box>
|
||||
</t-form>
|
||||
</t-header>
|
||||
<t-content class="table-box">
|
||||
<div class="table-header">
|
||||
<div>
|
||||
<h4 style="font-size: 110%">票据领用列表</h4>
|
||||
</div>
|
||||
<div>
|
||||
<t-button shape="circle" theme="primary" @click="refresh" style="margin-left: 0.8rem">
|
||||
<template #icon><load-icon /></template>
|
||||
</t-button>
|
||||
</div>
|
||||
</div>
|
||||
<t-base-table
|
||||
hover
|
||||
row-key="index"
|
||||
:loading="loading"
|
||||
:data="tableData"
|
||||
:columns="columns"
|
||||
:pagination="pagination"
|
||||
class="table"
|
||||
:max-height="550"
|
||||
>
|
||||
<template #status="slotProps">
|
||||
<t-button
|
||||
theme="default"
|
||||
variant="text"
|
||||
size="small"
|
||||
@click="Quitneck(slotProps)"
|
||||
:disabled="slotProps.row.receiptNum === 0"
|
||||
>退领</t-button
|
||||
>
|
||||
</template>
|
||||
</t-base-table>
|
||||
</t-content>
|
||||
</t-layout>
|
||||
</t-content>
|
||||
</t-layout>
|
||||
<t-space>
|
||||
<t-dialog
|
||||
ref="postForm"
|
||||
v-model:visible="visiblePost"
|
||||
header="退领"
|
||||
width="40%"
|
||||
:confirm-on-enter="true"
|
||||
:on-close="closePost"
|
||||
:confirm-btn="null"
|
||||
:cancel-btn="null"
|
||||
>
|
||||
<list-form :activeForm="'receipt'" @childForm="receiptromEvent" />
|
||||
</t-dialog>
|
||||
</t-space>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import scarchBox from "@/components/scarchBox.vue";
|
||||
import listForm from "./form/index.vue";
|
||||
import { billType } from "./codeValue/index";
|
||||
import { ref, onMounted, nextTick } from "vue";
|
||||
import { MessagePlugin } from "tdesign-vue-next";
|
||||
import { LoadIcon } from "tdesign-icons-vue-next";
|
||||
import { useReceiptList } from "@/stores/billReceipt";
|
||||
|
||||
const receiptList = useReceiptList();
|
||||
const personName = ref([]);
|
||||
const tableData = ref([]);
|
||||
const data = ref([]);
|
||||
const loading = ref(false);
|
||||
const visiblePost = ref(false);
|
||||
const rowItem = ref({});
|
||||
|
||||
const columns = ref([
|
||||
{
|
||||
colKey: "serial-number",
|
||||
title: "序号",
|
||||
width: 50,
|
||||
},
|
||||
{
|
||||
colKey: "billserial",
|
||||
title: "票据编号",
|
||||
align: "center",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
colKey: "proposer",
|
||||
title: "申请人",
|
||||
align: "center",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
colKey: "billType",
|
||||
title: "票据类型",
|
||||
align: "center",
|
||||
width: 100,
|
||||
cell: (h, { row }) => {
|
||||
const type = billType.find((type) => type.value === row.billType);
|
||||
return type ? type.label : "未知";
|
||||
},
|
||||
},
|
||||
{
|
||||
colKey: "receiptNum",
|
||||
title: "领用数量",
|
||||
align: "center",
|
||||
width: 100,
|
||||
cell: (h, { row }) => {
|
||||
return `${row.receiptNum}张`;
|
||||
},
|
||||
},
|
||||
{
|
||||
colKey: "receiptDate",
|
||||
title: "领用时间",
|
||||
align: "center",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
colKey: "useInfo",
|
||||
title: "用途",
|
||||
ellipsis: true,
|
||||
align: "center",
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
colKey: "status",
|
||||
title: "操作",
|
||||
width: 120,
|
||||
align: "center",
|
||||
fixed: "right",
|
||||
},
|
||||
]);
|
||||
|
||||
// 查询表单
|
||||
const scarchData = ref({
|
||||
billserial: "",
|
||||
});
|
||||
|
||||
// 分页
|
||||
const pagination = ref({
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 50,
|
||||
});
|
||||
|
||||
// 获取票据列表
|
||||
const personList = async () => {
|
||||
personName.value = await receiptList.getPersonNameList();
|
||||
};
|
||||
|
||||
// 查询
|
||||
const headerQuery = () => {
|
||||
tableData.value = data.value;
|
||||
if (
|
||||
scarchData.value.billserial === "" &&
|
||||
(scarchData.value.billType === undefined || scarchData.value.billType === "") &&
|
||||
(scarchData.value.receiptDate === undefined || scarchData.value.receiptDate === "")
|
||||
) {
|
||||
getNewTable();
|
||||
} else {
|
||||
const list = tableData.value.filter((item) => {
|
||||
let arrList;
|
||||
if (scarchData.value.billserial === item.billserial) {
|
||||
arrList = item;
|
||||
}
|
||||
if (scarchData.value.billType === item.billType) {
|
||||
arrList = item;
|
||||
}
|
||||
if (scarchData.value.receiptDate === item.receiptDate) {
|
||||
arrList = item;
|
||||
}
|
||||
if (scarchData.value.billserial === "" && scarchData.value.billType === "" && scarchData.value.receiptDate === "") {
|
||||
arrList = item;
|
||||
}
|
||||
return arrList;
|
||||
});
|
||||
tableData.value = list;
|
||||
pagination.value.total = list.length;
|
||||
}
|
||||
};
|
||||
// 查询表单重置
|
||||
const resetting = () => {
|
||||
scarchData.value = {
|
||||
billserial: "",
|
||||
billType: "",
|
||||
receiptDate: "",
|
||||
};
|
||||
getNewTable();
|
||||
};
|
||||
|
||||
// 退领按钮弹窗
|
||||
const Quitneck = (value) => {
|
||||
visiblePost.value = true;
|
||||
rowItem.value = value;
|
||||
};
|
||||
|
||||
const receiptromEvent = async (data) => {
|
||||
if (rowItem.value.row.receiptNum - data.quitneckNum < 0) {
|
||||
return MessagePlugin.error("退领数量不能大于领用数量");
|
||||
}
|
||||
data.id = rowItem.value.row.id;
|
||||
data.billserial = rowItem.value.row.billserial;
|
||||
data.billType = rowItem.value.row.billType;
|
||||
data.proposer = rowItem.value.row.proposer;
|
||||
await receiptList.getquitneckNum(data);
|
||||
getTableData();
|
||||
MessagePlugin.success("提交成功");
|
||||
visiblePost.value = false;
|
||||
};
|
||||
const onClick = async (context) => {
|
||||
// 判断是否为顶层节点(无父节点)
|
||||
if (context.node.value === "t1") {
|
||||
return;
|
||||
}
|
||||
loading.value = true;
|
||||
// 获取票据列表
|
||||
tableData.value = await receiptList.getReceiptList({
|
||||
name: context.node.label,
|
||||
});
|
||||
data.value = await receiptList.getReceiptList({
|
||||
name: context.node.label,
|
||||
});
|
||||
pagination.value.total = tableData.value.length;
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false;
|
||||
clearInterval(timerId);
|
||||
}, 300);
|
||||
};
|
||||
// 刷新列表
|
||||
const refresh = () => {
|
||||
getTableData();
|
||||
};
|
||||
// 判断menuManagement里面是否存在数据
|
||||
const getPersonName = async () => {
|
||||
let arr = JSON.parse(localStorage.getItem("ReceiptList"));
|
||||
if (arr) {
|
||||
personName.value = arr.personName;
|
||||
} else {
|
||||
await personList();
|
||||
getTableData();
|
||||
}
|
||||
};
|
||||
// 判断menuManagement里面是否存在数据
|
||||
const getTableData = async () => {
|
||||
let arr = JSON.parse(localStorage.getItem("ReceiptList"));
|
||||
if (arr.receiptList.length > 0) {
|
||||
loading.value = true;
|
||||
tableData.value = arr.receiptList;
|
||||
pagination.value.total = tableData.value.length;
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false;
|
||||
clearInterval(timerId);
|
||||
}, 300);
|
||||
} else {
|
||||
await nextTick();
|
||||
// 找到第一个具有子节点的节点并模拟点击
|
||||
const firstNodeWithChildren = personName.value.find((node) => Array.isArray(node.children) && node.children.length > 0);
|
||||
if (firstNodeWithChildren) {
|
||||
const simulatedContext = {
|
||||
node: {
|
||||
label: "孙东宇",
|
||||
},
|
||||
};
|
||||
onClick(simulatedContext);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
await getPersonName();
|
||||
await getTableData();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.asideTree {
|
||||
margin-right: 2rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 1rem;
|
||||
}
|
||||
.scarch-box {
|
||||
width: 100%;
|
||||
background-color: @base-white-color;
|
||||
margin-bottom: 2rem;
|
||||
.scarch-from {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.table-box {
|
||||
height: 41rem;
|
||||
background-color: @base-white-color;
|
||||
padding: 1rem;
|
||||
padding-top: 0;
|
||||
.table-header {
|
||||
height: 3rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
:deep(.t-tree--transition .t-tree__label) {
|
||||
width: 10rem;
|
||||
}
|
||||
:deep(.t-form__controls-content) {
|
||||
justify-content: space-between;
|
||||
}
|
||||
</style>
|
|
@ -1,318 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<t-layout style="height: 90%; background-color: #f5f7fb">
|
||||
<t-header class="scarch-box">
|
||||
<t-form
|
||||
ref="form"
|
||||
:data="formData"
|
||||
label-width="calc(2em + 40px)"
|
||||
layout="inline"
|
||||
scroll-to-first-error="smooth"
|
||||
class="scarch-from"
|
||||
@reset="resetting"
|
||||
@submit="headerQuery"
|
||||
>
|
||||
<scarch-box :btnNum="4" :colNum="8">
|
||||
<template #scarchName>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="票据编号:" name="billserial">
|
||||
<t-input v-model="formData.billserial" class="form-item-content" maxlength="10"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="入库日期:" name="stockDate">
|
||||
<t-date-picker v-model="formData.stockDate" class="form-item-content" clearable />
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="票据类型:" name="billType">
|
||||
<t-select v-model="formData.billType" placeholder="请选择票据类型" class="form-item-content" clearable>
|
||||
<t-option v-for="item in billType" :key="item.value" :value="item.value" :label="item.label"></t-option>
|
||||
</t-select>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
</template>
|
||||
<template #scarchBtn>
|
||||
<t-button theme="primary" type="submit">查询</t-button>
|
||||
<t-button theme="default" type="reset">重置</t-button>
|
||||
</template>
|
||||
</scarch-box>
|
||||
</t-form>
|
||||
</t-header>
|
||||
<t-content class="table-box">
|
||||
<div class="table-header">
|
||||
<div>
|
||||
<h4 style="font-size: 110%">票据入库列表</h4>
|
||||
</div>
|
||||
<div>
|
||||
<t-button theme="primary" size="small" @click="addStock">
|
||||
<template #icon><add-icon /></template>
|
||||
新增票据
|
||||
</t-button>
|
||||
<t-button shape="circle" theme="primary" @click="refresh" style="margin-left: 0.8rem">
|
||||
<template #icon><load-icon /></template>
|
||||
</t-button>
|
||||
</div>
|
||||
</div>
|
||||
<t-base-table
|
||||
hover
|
||||
row-key="index"
|
||||
:loading="loading"
|
||||
:data="tableData"
|
||||
:columns="columns"
|
||||
:pagination="pagination"
|
||||
class="table"
|
||||
:max-height="550"
|
||||
>
|
||||
<template #status="slotProps">
|
||||
<t-button theme="default" variant="text" size="small" @click="stockEdit(slotProps)">修改</t-button>
|
||||
<t-popconfirm content="确认删除吗" @confirm="stockDelete(slotProps)">
|
||||
<t-button theme="default" variant="text" size="small">删除</t-button>
|
||||
</t-popconfirm>
|
||||
</template>
|
||||
</t-base-table>
|
||||
</t-content>
|
||||
</t-layout>
|
||||
<t-space>
|
||||
<t-dialog
|
||||
ref="postForm"
|
||||
v-model:visible="visiblePost"
|
||||
header="新增票据"
|
||||
width="40%"
|
||||
:confirm-on-enter="true"
|
||||
:on-close="closePost"
|
||||
:confirm-btn="null"
|
||||
:cancel-btn="null"
|
||||
>
|
||||
<list-form :activeForm="'stock'" @childForm="stockromEvent" :editFrom="editFrom" />
|
||||
</t-dialog>
|
||||
</t-space>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import scarchBox from "@/components/scarchBox.vue";
|
||||
import listForm from "./form/index.vue";
|
||||
import { ref, onMounted } from "vue";
|
||||
import { MessagePlugin } from "tdesign-vue-next";
|
||||
import { AddIcon, LoadIcon } from "tdesign-icons-vue-next";
|
||||
import { useStock } from "@/stores/billStock";
|
||||
import { billType } from "./codeValue/index";
|
||||
|
||||
// 数据
|
||||
const loading = ref(false);
|
||||
const visiblePost = ref(false);
|
||||
const stockList = useStock();
|
||||
const tableData = ref();
|
||||
const editFrom = ref();
|
||||
const data = ref();
|
||||
// 表格表头
|
||||
const columns = ref([
|
||||
{
|
||||
colKey: "serial-number",
|
||||
title: "序号",
|
||||
width: 50,
|
||||
},
|
||||
{
|
||||
colKey: "billserial",
|
||||
title: "票据编号",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "billType",
|
||||
title: "票据类型",
|
||||
align: "center",
|
||||
width: "100",
|
||||
cell: (h, { row }) => {
|
||||
const type = billType.find((type) => type.value === row.billType);
|
||||
return type ? type.label : "未知";
|
||||
},
|
||||
},
|
||||
{
|
||||
colKey: "stockNum",
|
||||
title: "入库数量",
|
||||
align: "center",
|
||||
width: "100",
|
||||
cell: (h, { row }) => {
|
||||
return `${row.stockNum}张`;
|
||||
},
|
||||
},
|
||||
{
|
||||
colKey: "stockDate",
|
||||
title: "入库日期",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "operator",
|
||||
title: "操作员",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "remark",
|
||||
title: "备注",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "status",
|
||||
title: "操作",
|
||||
width: 120,
|
||||
align: "center",
|
||||
fixed: "right",
|
||||
},
|
||||
]);
|
||||
|
||||
// 获取票据列表
|
||||
const tableList = async () => {
|
||||
loading.value = true;
|
||||
tableData.value = await stockList.getStockList();
|
||||
data.value = await stockList.getStockList();
|
||||
pagination.value.total = tableData.value.length;
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false;
|
||||
clearInterval(timerId);
|
||||
}, 300);
|
||||
};
|
||||
|
||||
// 刷新列表
|
||||
const refresh = () => {
|
||||
tableList();
|
||||
};
|
||||
|
||||
// 查询表单
|
||||
const formData = ref({
|
||||
billserial: "",
|
||||
billType: "",
|
||||
stockDate: "",
|
||||
});
|
||||
|
||||
// 分页
|
||||
const pagination = ref({
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 50,
|
||||
});
|
||||
|
||||
// 查询表单重置
|
||||
const resetting = () => {
|
||||
formData.value = {
|
||||
billserial: "",
|
||||
billType: "",
|
||||
stockDate: "",
|
||||
};
|
||||
getNewTable();
|
||||
};
|
||||
|
||||
// 查询
|
||||
const headerQuery = () => {
|
||||
tableData.value = data.value;
|
||||
if (
|
||||
formData.value.billserial === "" &&
|
||||
(formData.value.billType === undefined || formData.value.billType === "") &&
|
||||
formData.value.stockDate === ""
|
||||
) {
|
||||
getNewTable();
|
||||
} else {
|
||||
const list = tableData.value.filter((item) => {
|
||||
let arrList;
|
||||
if (formData.value.billserial === item.billserial) {
|
||||
arrList = item;
|
||||
}
|
||||
if (formData.value.billType === item.billType) {
|
||||
arrList = item;
|
||||
}
|
||||
if (formData.value.stockDate === item.stockDate) {
|
||||
arrList = item;
|
||||
}
|
||||
if (formData.value.billserial === "" && formData.value.billType === "" && formData.value.stockDate === "") {
|
||||
arrList = item;
|
||||
}
|
||||
return arrList;
|
||||
});
|
||||
tableData.value = list;
|
||||
// @ts-expect-error
|
||||
pagination.value.total = list.length;
|
||||
}
|
||||
};
|
||||
// 打开窗口
|
||||
const addStock = () => {
|
||||
visiblePost.value = true;
|
||||
};
|
||||
|
||||
const stockromEvent = async (data) => {
|
||||
await stockList.addStockList(data);
|
||||
getNewTable();
|
||||
MessagePlugin.success("提交成功");
|
||||
visiblePost.value = false;
|
||||
};
|
||||
|
||||
// 关闭窗口
|
||||
const closePost = () => {
|
||||
visiblePost.value = false;
|
||||
};
|
||||
|
||||
// 修改
|
||||
const stockEdit = (item) => {
|
||||
visiblePost.value = true;
|
||||
tableData.value.forEach((itemTable) => {
|
||||
if (itemTable.id === item.row.id) {
|
||||
editFrom.value = itemTable;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 删除
|
||||
const stockDelete = async (itme) => {
|
||||
await stockList.deleteStockList(itme.row);
|
||||
getNewTable();
|
||||
};
|
||||
|
||||
// 判断menuManagement里面是否存在数据
|
||||
const getNewTable = () => {
|
||||
let arr = JSON.parse(localStorage.getItem("menuManagement"));
|
||||
if (arr) {
|
||||
tableData.value = arr.stockList;
|
||||
data.value = arr.stockList;
|
||||
pagination.value.total = tableData.value.length;
|
||||
} else {
|
||||
tableList();
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getNewTable();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.scarch-box {
|
||||
width: 100%;
|
||||
background-color: @base-white-color;
|
||||
margin-bottom: 2rem;
|
||||
.scarch-from {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.table-box {
|
||||
height: 42rem;
|
||||
background-color: @base-white-color;
|
||||
padding: 1rem;
|
||||
padding-top: 0;
|
||||
.table-header {
|
||||
height: 3rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.t-form__controls-content) {
|
||||
justify-content: space-between;
|
||||
}
|
||||
</style>
|
|
@ -1,22 +0,0 @@
|
|||
// 票据类型
|
||||
export const billType = [
|
||||
{ label: "票据类型1", value: 0 },
|
||||
{ label: "票据类型2", value: 1 },
|
||||
{ label: "票据类型3", value: 2 },
|
||||
{ label: "票据类型4", value: 3 },
|
||||
{ label: "票据类型5", value: 4 },
|
||||
];
|
||||
|
||||
// 状态
|
||||
export const billStatus = [
|
||||
{ label: "审核中", value: 0 },
|
||||
{ label: "审核通过", value: 1 },
|
||||
{ label: "审核拒绝", value: 2 },
|
||||
];
|
||||
// 审批状态
|
||||
export const exaStatus = [
|
||||
{ label: "待审批", value: 0 },
|
||||
{ label: "审核中", value: 1 },
|
||||
{ label: "审核通过", value: 2 },
|
||||
{ label: "审核拒绝", value: 3 },
|
||||
];
|
|
@ -1,13 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="double-box">double-box</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="less">
|
||||
.double-box {
|
||||
width: 186px;
|
||||
height: 180px;
|
||||
background-color: rgb(8, 48, 139);
|
||||
}
|
||||
</style>
|
|
@ -1,13 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="little-box">little-box</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="less">
|
||||
.little-box {
|
||||
width: 75px;
|
||||
height: 75px;
|
||||
background-color: greenyellow;
|
||||
}
|
||||
</style>
|
|
@ -1,233 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<t-layout style="height: 90%; background-color: #f5f7fb">
|
||||
<t-header class="scarch-box">
|
||||
<t-form
|
||||
ref="form"
|
||||
:data="scarchData"
|
||||
label-width="calc(2em + 40px)"
|
||||
layout="inline"
|
||||
scroll-to-first-error="smooth"
|
||||
class="scarch-from"
|
||||
@reset="resetting"
|
||||
@submit="headerQuery"
|
||||
>
|
||||
<scarch-box :btnNum="4" :colNum="8">
|
||||
<template #scarchName>
|
||||
<t-col :span="3" style="padding-left: 0">
|
||||
<t-form-item label="部门:" name="branch">
|
||||
<t-input v-model="scarchData.branch" class="form-item-content"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
</template>
|
||||
<template #scarchBtn>
|
||||
<t-button theme="primary" type="submit">查询</t-button>
|
||||
<t-button theme="default" type="reset">重置</t-button>
|
||||
</template>
|
||||
</scarch-box>
|
||||
</t-form>
|
||||
</t-header>
|
||||
<t-content class="table-box">
|
||||
<div class="table-header">
|
||||
<div>
|
||||
<h4 style="font-size: 110%">报表明细</h4>
|
||||
</div>
|
||||
<div>
|
||||
<t-button theme="primary" size="small" @click="exportExcel"> 导出报表明细 </t-button>
|
||||
<t-button shape="circle" theme="primary" @click="refresh" style="margin-left: 0.8rem">
|
||||
<template #icon><load-icon /></template>
|
||||
</t-button>
|
||||
</div>
|
||||
</div>
|
||||
<t-base-table
|
||||
hover
|
||||
row-key="index"
|
||||
:loading="loading"
|
||||
:data="tableData"
|
||||
:columns="columns"
|
||||
:pagination="pagination"
|
||||
class="table"
|
||||
:max-height="550"
|
||||
>
|
||||
</t-base-table>
|
||||
</t-content>
|
||||
</t-layout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import scarchBox from "@/components/scarchBox.vue";
|
||||
import { ref, onMounted } from "vue";
|
||||
import { MessagePlugin } from "tdesign-vue-next";
|
||||
import { LoadIcon } from "tdesign-icons-vue-next";
|
||||
import { reqDetailReportList } from "@/api/finance-bill-manage/detailReportList";
|
||||
import { ExcelUtils } from "@/utils/excel";
|
||||
|
||||
const tableData = ref([]);
|
||||
const dataList = ref([]);
|
||||
const loading = ref(false);
|
||||
const columns = ref([
|
||||
{
|
||||
colKey: "serial-number",
|
||||
title: "序号",
|
||||
width: 50,
|
||||
},
|
||||
{
|
||||
colKey: "branch",
|
||||
title: "部门",
|
||||
align: "center",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
colKey: "stockNum",
|
||||
title: "入库量",
|
||||
align: "center",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
colKey: "cancelNum",
|
||||
title: "退库量",
|
||||
align: "center",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
colKey: "receiveNum",
|
||||
title: "领用量",
|
||||
align: "center",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
colKey: "breakNum",
|
||||
title: "报损量",
|
||||
align: "center",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
colKey: "destoryNum",
|
||||
title: "核销量",
|
||||
align: "center",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
colKey: "grossBillRatio",
|
||||
title: "总票据比例",
|
||||
ellipsis: true,
|
||||
align: "center",
|
||||
width: 100,
|
||||
},
|
||||
]);
|
||||
|
||||
// 查询表单
|
||||
const scarchData = ref({});
|
||||
|
||||
// 分页
|
||||
const pagination = ref({
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 50,
|
||||
});
|
||||
|
||||
// 获取票据列表
|
||||
const tableList = async () => {
|
||||
loading.value = true;
|
||||
const { data } = await reqDetailReportList();
|
||||
tableData.value = data.list;
|
||||
dataList.value = data.list;
|
||||
pagination.value.total = tableData.value.length;
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false;
|
||||
clearInterval(timerId);
|
||||
}, 300);
|
||||
};
|
||||
|
||||
// 查询
|
||||
const headerQuery = () => {
|
||||
tableData.value = dataList.value;
|
||||
if (scarchData.value.branch === "") {
|
||||
tableData.value = data.value;
|
||||
pagination.value.total = tableData.value.length;
|
||||
} else {
|
||||
const list = tableData.value.filter((item) => {
|
||||
let arrList;
|
||||
if (scarchData.value.branch === item.branch) {
|
||||
arrList = item;
|
||||
}
|
||||
return arrList;
|
||||
});
|
||||
tableData.value = list;
|
||||
pagination.value.total = list.length;
|
||||
}
|
||||
};
|
||||
// 查询表单重置
|
||||
const resetting = () => {
|
||||
scarchData.value = {
|
||||
branch: "",
|
||||
};
|
||||
tableData.value = dataList.value;
|
||||
pagination.value.total = tableData.value.length;
|
||||
};
|
||||
// 刷新列表
|
||||
const refresh = () => {
|
||||
tableList();
|
||||
};
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
const title = "报表明细excel";
|
||||
const titleFile = "报表明细";
|
||||
const columns = [
|
||||
{ header: "部门", key: "1", width: 20 },
|
||||
{ header: "入库量", key: "2", width: 20 },
|
||||
{ header: "退库量", key: "3", width: 20 },
|
||||
{ header: "领用量", key: "4", width: 20 },
|
||||
{ header: "报损量", key: "5", width: 20 },
|
||||
{ header: "核销量", key: "6", width: 20 },
|
||||
{ header: "总票据比例", key: "7", width: 20 },
|
||||
];
|
||||
const addRow = [];
|
||||
tableData.value.forEach((item) => {
|
||||
addRow.push({
|
||||
1: item.branch,
|
||||
2: item.stockNum,
|
||||
3: item.cancelNum,
|
||||
4: item.receiveNum,
|
||||
5: item.breakNum,
|
||||
6: item.destoryNum,
|
||||
7: item.grossBillRatio,
|
||||
});
|
||||
});
|
||||
ExcelUtils(title, titleFile, columns, addRow);
|
||||
};
|
||||
onMounted(() => {
|
||||
tableList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.scarch-box {
|
||||
width: 100%;
|
||||
background-color: @base-white-color;
|
||||
margin-bottom: 2rem;
|
||||
.scarch-from {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.table-box {
|
||||
height: 41rem;
|
||||
background-color: @base-white-color;
|
||||
padding: 1rem;
|
||||
padding-top: 0;
|
||||
.table-header {
|
||||
height: 3rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
:deep(.t-form__controls-content) {
|
||||
justify-content: space-between;
|
||||
}
|
||||
</style>
|
|
@ -1,81 +0,0 @@
|
|||
<template>
|
||||
<div class="grid">
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<TextVue class="grid-div grid-item-lm" />
|
||||
<DoubleBox class="grid-double grid-item-lm" />
|
||||
<DoubleBox class="grid-double grid-item-lm" />
|
||||
<DoubleBox class="grid-double grid-item-lm" />
|
||||
<DoubleBox class="grid-double grid-item-lm" />
|
||||
<DoubleBox class="grid-double grid-item-lm" />
|
||||
<DoubleBox class="grid-double grid-item-lm" />
|
||||
<!-- <DoubleBox class="grid-double grid-item-lm" /> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onMounted } from "vue";
|
||||
import Sortable from "sortablejs";
|
||||
import TextVue from "./components/TextVue.vue";
|
||||
import DoubleBox from "./components/DoubleBox.vue";
|
||||
|
||||
//使用onMounted是因为要等到标签渲染完成后在querySelector才能获取到带有grid类名的div盒子,否则grid常量为null,报错。
|
||||
onMounted(() => {
|
||||
const grid = document.querySelector(".grid");
|
||||
|
||||
//sortable对象
|
||||
new Sortable(grid, {
|
||||
animation: 150,
|
||||
handle: ".grid-item-lm", //对grid的子对象中,带有.grid-item启动拖拽效果
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.grid {
|
||||
padding: 20px 10%;
|
||||
display: grid;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
/* 声明列的高度 */
|
||||
grid-template-columns: repeat(auto-fill, 75px);
|
||||
/* 声明行的高度 */
|
||||
grid-template-rows: repeat(auto-fill, 75px);
|
||||
/* 声明行间距和列间距 */
|
||||
grid-gap: 36px;
|
||||
}
|
||||
|
||||
.grid-div {
|
||||
/* 声明宽占4个小盒子 */
|
||||
grid-column: span 1;
|
||||
/* 声明高占2个小盒子 */
|
||||
grid-row: span 1;
|
||||
}
|
||||
|
||||
.grid-double {
|
||||
grid-column: span 2;
|
||||
grid-row: span 2;
|
||||
}
|
||||
</style>
|
|
@ -1,344 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
<t-space direction="vertical" style="width: 100%" v-if="props.activeForm === 'stock'">
|
||||
<div>
|
||||
<t-form
|
||||
ref="formDialog"
|
||||
scroll-to-first-error="smooth"
|
||||
label-align="left"
|
||||
:rules="FORM_RULES_STOCK"
|
||||
:data="stockData"
|
||||
:colon="true"
|
||||
@submit="stockAdd"
|
||||
label-width="calc(2em + 55px)"
|
||||
layout="inline"
|
||||
@reset="onReset"
|
||||
>
|
||||
<t-form-item label="票据编号" name="billserial" :span="10" style="margin-bottom: 0.5rem">
|
||||
<t-input v-model="stockData.billserial" placeholder="请输入票据编号" maxlength="10"></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="票据类型" name="billType" :span="12" style="width: 16rem; margin-bottom: 0.5rem">
|
||||
<t-select v-model="stockData.billType" clearable placeholder="请选择票据类型">
|
||||
<t-option v-for="item in billType" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</t-select>
|
||||
</t-form-item>
|
||||
<t-form-item label="入库数量" name="stockNum" :span="12" style="margin-bottom: 0.5rem">
|
||||
<t-input type="number" v-model="stockData.stockNum" placeholder="请输入入库数量"></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="入库时间" name="stockDate" :span="10" style="width: 16rem; margin-bottom: 0.5rem">
|
||||
<t-date-picker v-model="stockData.stockDate" placeholder="请选择入库时间" clearable />
|
||||
</t-form-item>
|
||||
<t-form-item label="操作员" name="operator" :span="10" style="margin-bottom: 0.5rem">
|
||||
<t-input v-model="stockData.operator" placeholder="请输入操作员"></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="备注" name="remark" style="width: 33.6rem">
|
||||
<t-textarea v-model="stockData.remark" placeholder="请输入备注"></t-textarea>
|
||||
</t-form-item>
|
||||
<t-form-item>
|
||||
<t-space size="small">
|
||||
<t-button theme="primary" type="submit">提交</t-button>
|
||||
<t-button theme="default" variant="base" type="reset">重置</t-button>
|
||||
</t-space>
|
||||
</t-form-item>
|
||||
</t-form>
|
||||
</div>
|
||||
</t-space>
|
||||
<t-space direction="vertical" v-if="props.activeForm === 'cancel'">
|
||||
<div>
|
||||
<t-form
|
||||
ref="formDialog"
|
||||
scroll-to-first-error="smooth"
|
||||
label-align="left"
|
||||
:rules="FORM_RULES_CANCEL"
|
||||
:data="cancelData"
|
||||
:colon="true"
|
||||
@submit="cancelAdd"
|
||||
label-width="calc(2em + 55px)"
|
||||
@reset="onReset"
|
||||
>
|
||||
<t-form-item label="审批人" name="approver" style="margin-bottom: 1.5rem; width: 35rem">
|
||||
<t-input v-model="cancelData.approver" placeholder="请输入审批人"></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="审批时间" name="approvalDate" style="margin-bottom: 1.5rem; width: 35rem">
|
||||
<t-date-picker v-model="cancelData.approvalDate" placeholder="请选择审批时间" clearable style="width: 35rem" />
|
||||
</t-form-item>
|
||||
<t-form-item label="审批原因" name="approvalReason">
|
||||
<t-textarea v-model="cancelData.approvalReason" placeholder="请输入审批原因"></t-textarea>
|
||||
</t-form-item>
|
||||
<t-form-item>
|
||||
<t-space size="small">
|
||||
<t-button theme="primary" type="submit">提交</t-button>
|
||||
<t-button theme="default" variant="base" type="reset">重置</t-button>
|
||||
</t-space>
|
||||
</t-form-item>
|
||||
</t-form>
|
||||
</div>
|
||||
</t-space>
|
||||
<t-space direction="vertical" v-if="props.activeForm === 'receipt'">
|
||||
<div>
|
||||
<t-form
|
||||
ref="formDialog"
|
||||
scroll-to-first-error="smooth"
|
||||
label-align="left"
|
||||
:rules="FORM_RULES_RECEIPT"
|
||||
:data="receiptData"
|
||||
:colon="true"
|
||||
@submit="quitneckAdd"
|
||||
label-width="calc(2em + 55px)"
|
||||
@reset="onReset"
|
||||
>
|
||||
<t-form-item label="退领张数" name="quitneckNum" style="margin-bottom: 1.5rem; width: 35rem">
|
||||
<t-input v-model="receiptData.quitneckNum" type="number" placeholder="请输入退领张数"></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="退领时间" name="quitneckDate" style="margin-bottom: 1.5rem; width: 35rem">
|
||||
<t-date-picker v-model="receiptData.quitneckDate" placeholder="请选择退领时间" clearable style="width: 35rem" />
|
||||
</t-form-item>
|
||||
<t-form-item label="退领原因" name="quitneckReason">
|
||||
<t-textarea v-model="receiptData.quitneckReason" placeholder="请输入退领原因"></t-textarea>
|
||||
</t-form-item>
|
||||
<t-form-item>
|
||||
<t-space size="small">
|
||||
<t-button theme="primary" type="submit">提交</t-button>
|
||||
<t-button theme="default" variant="base" type="reset">重置</t-button>
|
||||
</t-space>
|
||||
</t-form-item>
|
||||
</t-form>
|
||||
</div>
|
||||
</t-space>
|
||||
<t-space direction="vertical" v-if="props.activeForm === 'break'" style="width: 100%">
|
||||
<div>
|
||||
<t-form
|
||||
ref="formDialog"
|
||||
scroll-to-first-error="smooth"
|
||||
label-align="left"
|
||||
:rules="FORM_RULES_BREAK"
|
||||
:data="breakData"
|
||||
:colon="true"
|
||||
@submit="breakSub"
|
||||
label-width="calc(2em + 55px)"
|
||||
layout="inline"
|
||||
@reset="onReset"
|
||||
>
|
||||
<t-form-item label="票据编号" name="billserial" :span="10" style="margin-bottom: 0.5rem">
|
||||
<t-input v-model="breakData.billserial" placeholder="请输入票据编号" maxlength="10"></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="操作员" name="operator" :span="10" style="margin-bottom: 0.5rem">
|
||||
<t-input v-model="breakData.operator" placeholder="请输入操作员"></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="票据类型" name="billType" :span="12" style="width: 16rem; margin-bottom: 0.5rem">
|
||||
<t-select v-model="breakData.billType" clearable placeholder="请选择票据类型">
|
||||
<t-option v-for="item in billType" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</t-select>
|
||||
</t-form-item>
|
||||
<t-form-item label="报损数量" name="breakNum" :span="12" style="margin-bottom: 0.5rem">
|
||||
<t-input type="number" v-model="breakData.breakNum" placeholder="请输入报损数量"></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="报损时间" name="breakDate" :span="10" style="width: 16rem; margin-bottom: 0.5rem">
|
||||
<t-date-picker v-model="breakData.breakDate" placeholder="请选择报损时间" clearable />
|
||||
</t-form-item>
|
||||
<t-form-item label="报损原因" name="breakInfo" style="width: 33.6rem">
|
||||
<t-textarea v-model="breakData.breakInfo" placeholder="请输入备注"></t-textarea>
|
||||
</t-form-item>
|
||||
<t-form-item />
|
||||
<t-form-item>
|
||||
<t-space size="small">
|
||||
<t-button theme="primary" type="submit">提交</t-button>
|
||||
<t-button theme="default" variant="base" type="reset">重置</t-button>
|
||||
</t-space>
|
||||
</t-form-item>
|
||||
</t-form>
|
||||
</div>
|
||||
</t-space>
|
||||
<t-space direction="vertical" v-if="props.activeForm === 'destroy'" style="width: 100%">
|
||||
<div>
|
||||
<t-form
|
||||
ref="formDialog"
|
||||
scroll-to-first-error="smooth"
|
||||
label-align="left"
|
||||
:rules="FORM_RULES_DESTROY"
|
||||
:data="destroyData"
|
||||
:colon="true"
|
||||
@submit="destroySub"
|
||||
label-width="calc(2em + 55px)"
|
||||
layout="inline"
|
||||
@reset="onReset"
|
||||
>
|
||||
<t-form-item label="审核状态" name="Status" style="margin-bottom: 0.5rem">
|
||||
<t-radio-group v-model="destroyData.Status">
|
||||
<t-radio value="1" @click="refuse = false">审核通过</t-radio>
|
||||
<t-radio value="2" @click="refuse = true">审核拒绝</t-radio>
|
||||
</t-radio-group>
|
||||
</t-form-item>
|
||||
<t-form-item />
|
||||
<t-form-item label="拒绝原因" name="refuseInfo" v-if="refuse" style="width: 33.6rem; margin-bottom: 0.5rem">
|
||||
<t-textarea v-model="destroyData.refuseInfo" placeholder="请输入备注"></t-textarea>
|
||||
</t-form-item>
|
||||
<t-form-item>
|
||||
<t-space size="small">
|
||||
<t-button theme="primary" type="submit">提交</t-button>
|
||||
<t-button theme="default" variant="base" type="reset">重置</t-button>
|
||||
</t-space>
|
||||
</t-form-item>
|
||||
</t-form>
|
||||
</div>
|
||||
</t-space>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { billType } from "../codeValue/index";
|
||||
import { ref, onMounted, onUpdated, watchEffect } from "vue";
|
||||
|
||||
const props = defineProps({
|
||||
activeForm: {
|
||||
type: String,
|
||||
default: "",
|
||||
},
|
||||
editFrom: {
|
||||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
});
|
||||
|
||||
const refuse = ref(false);
|
||||
const emit = defineEmits();
|
||||
|
||||
// 票据入库表单
|
||||
const stockData = ref({
|
||||
billserial: "",
|
||||
stockNum: Number,
|
||||
unit: "",
|
||||
operator: "",
|
||||
remark: "",
|
||||
stockDate: "",
|
||||
});
|
||||
|
||||
// 票据入库表单校验
|
||||
const FORM_RULES_STOCK = {
|
||||
billserial: [{ required: true, message: "请输入票据编号", trigger: "blur" }],
|
||||
billType: [{ required: true, message: "请选择票据类型", trigger: "change" }],
|
||||
stockNum: [{ required: true, message: "请输入库存数量", trigger: "blur" }],
|
||||
unit: [{ required: true, message: "请输入单位", trigger: "blur" }],
|
||||
stockDate: [{ required: true, message: "请选择入库日期", trigger: "change" }],
|
||||
operator: [{ required: true, message: "请输入操作员", trigger: "blur" }],
|
||||
};
|
||||
// 票据入库提交
|
||||
const stockAdd = async ({ validateResult, firstError }) => {
|
||||
if (validateResult === true) {
|
||||
await emit("childForm", stockData.value);
|
||||
} else {
|
||||
console.log("Validate Errors: ", firstError, validateResult);
|
||||
}
|
||||
};
|
||||
|
||||
// 票据退库表单
|
||||
const cancelData = ref({
|
||||
approver: "",
|
||||
approvalDate: "",
|
||||
approvalReason: "",
|
||||
});
|
||||
|
||||
// 票据出库效验规则
|
||||
const FORM_RULES_CANCEL = {
|
||||
approver: [{ required: true, message: "请输入审批人", trigger: "blur" }],
|
||||
approvalDate: [{ required: true, message: "请选择入库日期", trigger: "change" }],
|
||||
approvalReason: [{ required: true, message: "请输入审批原因", trigger: "blur" }],
|
||||
};
|
||||
|
||||
// 票据出库提交
|
||||
const cancelAdd = async ({ validateResult, firstError }) => {
|
||||
if (validateResult === true) {
|
||||
await emit("childForm");
|
||||
} else {
|
||||
console.log("Validate Errors: ", firstError, validateResult);
|
||||
}
|
||||
};
|
||||
|
||||
// 票据领用表单数据
|
||||
const receiptData = ref({
|
||||
quitneckDate: "",
|
||||
quitneckReason: "",
|
||||
quitneckNum: "",
|
||||
});
|
||||
|
||||
// 票据领用效验规则
|
||||
const FORM_RULES_RECEIPT = {
|
||||
quitneckNum: [{ required: true, message: "请输入退领张数", trigger: "blur" }],
|
||||
quitneckDate: [{ required: true, message: "请选择退领日期", trigger: "change" }],
|
||||
quitneckReason: [{ required: true, message: "请输入退领原因", trigger: "blur" }],
|
||||
};
|
||||
|
||||
// 票据领用表单提交
|
||||
const quitneckAdd = async ({ validateResult, firstError }) => {
|
||||
if (validateResult === true) {
|
||||
await emit("childForm", receiptData.value);
|
||||
} else {
|
||||
console.log("Validate Errors: ", firstError, validateResult);
|
||||
}
|
||||
};
|
||||
|
||||
// 票据破损表单
|
||||
const breakData = ref({
|
||||
billserial: "",
|
||||
operator: "",
|
||||
billType: "",
|
||||
breakNum: Number,
|
||||
breakDate: "",
|
||||
breakInfo: "",
|
||||
});
|
||||
|
||||
// 票据破损表单校验
|
||||
const FORM_RULES_BREAK = {
|
||||
billserial: [{ required: true, message: "请输入票据编号", trigger: "blur" }],
|
||||
billType: [{ required: true, message: "请选择票据类型", trigger: "change" }],
|
||||
breakNum: [{ required: true, message: "请输入报损数量", trigger: "blur" }],
|
||||
breakDate: [{ required: true, message: "请选择报损日期", trigger: "change" }],
|
||||
operator: [{ required: true, message: "请输入操作员", trigger: "blur" }],
|
||||
breakInfo: [{ required: true, message: "请输入报损原因", trigger: "blur" }],
|
||||
};
|
||||
|
||||
// 票据破损表单提交
|
||||
const breakSub = async ({ validateResult, firstError }) => {
|
||||
if (validateResult === true) {
|
||||
await emit("childForm", breakData.value);
|
||||
} else {
|
||||
console.log("Validate Errors: ", firstError, validateResult);
|
||||
}
|
||||
};
|
||||
|
||||
// 票据核销表单
|
||||
const destroyData = ref({
|
||||
refuseInfo: "",
|
||||
Status: "",
|
||||
});
|
||||
|
||||
// 票据核销表单校验
|
||||
const FORM_RULES_DESTROY = {
|
||||
Status: [{ required: true, message: "请选择审批状态", trigger: "change" }],
|
||||
refuseInfo: [{ required: true, message: "请输入拒绝原因", trigger: "blur" }],
|
||||
};
|
||||
// 票据核销表单提交
|
||||
const destroySub = async ({ validateResult, firstError }) => {
|
||||
if (validateResult === true) {
|
||||
await emit("childForm", destroyData.value);
|
||||
} else {
|
||||
console.log("Validate Errors: ", firstError, validateResult);
|
||||
}
|
||||
};
|
||||
|
||||
// 弹出框表单重置
|
||||
const onReset = () => {};
|
||||
|
||||
onUpdated(() => {
|
||||
// 票据入库修改
|
||||
if (props.activeForm === "stock") {
|
||||
stockData.value = props.editFrom;
|
||||
}
|
||||
// 票据破损修改
|
||||
if (props.activeForm === "break") {
|
||||
breakData.value = props.editFrom;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
|
@ -1,91 +0,0 @@
|
|||
<template>
|
||||
<div class="centerC">
|
||||
<div class="center-pie">
|
||||
<pie :titleP="title" :dataP="data" :height="'15rem'" :width="'40rem'" />
|
||||
</div>
|
||||
<div class="center-bar">
|
||||
<bar
|
||||
:categories="categories"
|
||||
:seriesData="seriesData"
|
||||
:title="titlebar"
|
||||
:legendList="legendList"
|
||||
:height="'100%'"
|
||||
:width="'52rem'"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from "vue";
|
||||
import pie from "@/components/echarts/pie.vue";
|
||||
import bar from "@/components/echarts/bar.vue";
|
||||
|
||||
const title = ref("一天的开心程度");
|
||||
const titlebar = ref("销售额");
|
||||
const data = ref([
|
||||
{ value: 50, name: "上午" },
|
||||
{ value: 50, name: "下午" },
|
||||
{ value: 100, name: "晚上" },
|
||||
{ value: 200, name: "睡觉" },
|
||||
]);
|
||||
|
||||
const categories = ref([
|
||||
"一月",
|
||||
"二月",
|
||||
"三月",
|
||||
"四月",
|
||||
"五月",
|
||||
"六月",
|
||||
"七月",
|
||||
"八月",
|
||||
"九月",
|
||||
"十月",
|
||||
"十一月",
|
||||
"十二月",
|
||||
]);
|
||||
const legendList = ["类别A", "类别B", "类别C"];
|
||||
const seriesData = ref([
|
||||
{
|
||||
name: "类别A",
|
||||
type: "bar",
|
||||
data: [
|
||||
1000, 1200, 1400, 1500, 1600, 1800, 1700, 1900, 2000, 2200, 2300, 2500,
|
||||
],
|
||||
},
|
||||
{
|
||||
name: "类别B",
|
||||
type: "bar",
|
||||
data: [200, 400, 1000, 500, 700, 800, 1000, 1100, 1150, 1200, 1300, 1400],
|
||||
},
|
||||
{
|
||||
name: "类别C",
|
||||
type: "bar",
|
||||
data: [
|
||||
800, 900, 1000, 1100, 1200, 1300, 1400, 1500, 1600, 1700, 1800, 1900,
|
||||
],
|
||||
},
|
||||
]);
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.centerC {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.center-pie {
|
||||
width: 49%;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.center-bar {
|
||||
width: 49%;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,53 +0,0 @@
|
|||
<template>
|
||||
<div class="linebox">
|
||||
<line-chart
|
||||
:categories="categories"
|
||||
:seriesData="seriesData"
|
||||
:titleP="title"
|
||||
:legendList="legendList"
|
||||
:height="'100%'"
|
||||
:width="'100rem'"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import lineChart from "@/components/echarts/line.vue";
|
||||
import { ref } from "vue";
|
||||
|
||||
const title = ref("折线图");
|
||||
const categories = ref([
|
||||
"一月",
|
||||
"二月",
|
||||
"三月",
|
||||
"四月",
|
||||
"五月",
|
||||
"六月",
|
||||
"七月",
|
||||
"八月",
|
||||
"九月",
|
||||
"十月",
|
||||
"十一月",
|
||||
"十二月",
|
||||
]);
|
||||
const legendList = ref(["服务一", "服务二"]);
|
||||
const seriesData = ref([
|
||||
{
|
||||
name: "服务一",
|
||||
data: [10, 20, 15, 20, 25, 30, 15, 22, 18, 28, 25, 32],
|
||||
type: "line",
|
||||
}, // 第一个系列的数据
|
||||
{
|
||||
name: "服务二",
|
||||
data: [15, 22, 18, 28, 25, 32, 10, 20, 15, 20, 25, 30],
|
||||
type: "line",
|
||||
}, // 第二个系列的数据
|
||||
]);
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.linebox {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
|
@ -1,90 +0,0 @@
|
|||
<template>
|
||||
<div class="headerC">
|
||||
<div class="header_box" v-for="(item, index) in homeTitle" :key="index">
|
||||
<div class="header_box">
|
||||
<div class="header_icon">
|
||||
<t-icon :name="item.icon" class="icon" />
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="title">{{ item.title }}</div>
|
||||
<div class="num">{{ item.num }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from "vue";
|
||||
const homeTitle = ref([
|
||||
{
|
||||
title: "今日发票数",
|
||||
num: "23张",
|
||||
icon: "face-retouching",
|
||||
},
|
||||
{
|
||||
title: "今日学生投诉数",
|
||||
num: "555555",
|
||||
icon: "crooked-smile",
|
||||
},
|
||||
{
|
||||
title: "今日教的学费",
|
||||
num: "0",
|
||||
icon: "despise",
|
||||
},
|
||||
{
|
||||
title: "今日赔偿费",
|
||||
num: "5000,0000,0000",
|
||||
icon: "flip-smiling-face",
|
||||
},
|
||||
{
|
||||
title: "今日彩票中奖数",
|
||||
num: "0",
|
||||
icon: "cat",
|
||||
},
|
||||
]);
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.headerC {
|
||||
height: 100%;
|
||||
justify-content: space-between;
|
||||
display: flex;
|
||||
}
|
||||
.header_box {
|
||||
height: 100%;
|
||||
width: 20rem;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
}
|
||||
.header_icon {
|
||||
width: 30%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
margin-right: 1rem;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
.icon {
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
color: #366ef4;
|
||||
}
|
||||
}
|
||||
.content {
|
||||
width: 70%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
.title {
|
||||
font-size: 1.2rem;
|
||||
color: #666;
|
||||
margin-bottom: 0.5rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
.num {
|
||||
color: #85d3ff;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,41 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<t-layout style="height: 100%; background-color: #f5f7fb">
|
||||
<t-header class="header">
|
||||
<home-header />
|
||||
</t-header>
|
||||
<t-content class="content">
|
||||
<home-center />
|
||||
</t-content>
|
||||
<t-content class="footer">
|
||||
<home-footer />
|
||||
</t-content>
|
||||
</t-layout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import homeHeader from "./components/homeHeader.vue";
|
||||
import homeCenter from "./components/homeCenter.vue";
|
||||
import homeFooter from "./components/homeFooter.vue";
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.header {
|
||||
height: 15%;
|
||||
width: 100%;
|
||||
margin-bottom: 1rem;
|
||||
background-color: #f5f7fb;
|
||||
}
|
||||
.content {
|
||||
height: 15%;
|
||||
width: 100%;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.footer {
|
||||
height: 15%;
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
</style>
|
|
@ -1,188 +0,0 @@
|
|||
<template>
|
||||
<div class="login-container">
|
||||
<div style="width: 100%" class="login-right">
|
||||
<div class="login-form">
|
||||
<div class="login-box">
|
||||
<t-form
|
||||
:data="formData"
|
||||
:rules="rules"
|
||||
ref="form"
|
||||
@reset="onReset"
|
||||
@submit="onSubmit"
|
||||
:colon="true"
|
||||
:labelWidth="0"
|
||||
>
|
||||
<h2 class="login-title">登录</h2>
|
||||
|
||||
<t-form-item label="账号" name="account">
|
||||
<t-input
|
||||
clearable
|
||||
v-model="formData.account"
|
||||
placeholder="请输入工号或学号"
|
||||
>
|
||||
<desktop-icon slot:string="prefix-icon"></desktop-icon>
|
||||
</t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="密码" name="password">
|
||||
<t-input
|
||||
type="password"
|
||||
clearable
|
||||
v-model="formData.password"
|
||||
placeholder="请输入密码"
|
||||
>
|
||||
<lock-on-icon slot:string="prefix-icon"></lock-on-icon>
|
||||
</t-input>
|
||||
</t-form-item>
|
||||
<t-form-item class="form-actions">
|
||||
<t-button theme="primary" type="submit" block>登录</t-button>
|
||||
<div class="forgot-password-spacer"></div>
|
||||
<t-button
|
||||
type="text"
|
||||
@click="handleForgotPasswordClick"
|
||||
class="text"
|
||||
>修改密码</t-button
|
||||
>
|
||||
</t-form-item>
|
||||
</t-form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { MessagePlugin } from "tdesign-vue-next";
|
||||
import { reactive, ref, onMounted } from "vue";
|
||||
import { reqUser } from "@/api/login";
|
||||
import { useRouter } from "vue-router";
|
||||
// import axios from 'axios';
|
||||
// import { TForm, TFormItem, TInput, TButton } from "tdesign-vue-next";
|
||||
// import { DesktopIcon, LockOnIcon } from "tdesign-icons-vue";
|
||||
|
||||
const INITIAL_DATA = {
|
||||
account: "",
|
||||
password: "",
|
||||
};
|
||||
|
||||
const from = ref(null);
|
||||
const router = useRouter();
|
||||
const formData = reactive({
|
||||
...INITIAL_DATA,
|
||||
});
|
||||
|
||||
const rules = reactive({
|
||||
account: [
|
||||
{
|
||||
required: true,
|
||||
message: "必须填写",
|
||||
},
|
||||
{
|
||||
pattern: /^\d{10}$/, // 正则表达式只允许10位数字
|
||||
message: "学号必须是10位数字",
|
||||
},
|
||||
],
|
||||
password: [
|
||||
// {
|
||||
// required: false,
|
||||
// message: "密码必填",
|
||||
// },
|
||||
// {
|
||||
// len: 8,
|
||||
// message: "请输入 8 位密码",
|
||||
// },
|
||||
// {
|
||||
// message: "密码必须包含至少一个大写字母,并由字母和数字组成",
|
||||
// },
|
||||
],
|
||||
});
|
||||
|
||||
const onSubmit = async () => {
|
||||
const data1 = {
|
||||
username: formData.account,
|
||||
password: formData.password,
|
||||
};
|
||||
const { data } = await reqUser(data1);
|
||||
|
||||
if (data === true) {
|
||||
MessagePlugin.success("登录成功");
|
||||
router.push("/");
|
||||
} else {
|
||||
MessagePlugin.error("登录失败");
|
||||
}
|
||||
|
||||
// try {
|
||||
// if (!form || !form.value) {
|
||||
// console.warn("form 或 form.value 不存在,无法进行表单验证");
|
||||
// return;
|
||||
// }
|
||||
// const validateResult = await form.value?.validate();
|
||||
// if (validateResult?.result) {
|
||||
|
||||
// MessagePlugin.success("提交成功");
|
||||
// await router.push("/");
|
||||
// } else {
|
||||
// const firstError = validateResult?.errors[0]?.message || "未知错误";
|
||||
// console.log("Errors: ", validateResult.errors);
|
||||
// MessagePlugin.warning(firstError);
|
||||
// }
|
||||
// } catch (error) {
|
||||
// console.error("请求失败:", error);
|
||||
// MessagePlugin.error("提交失败");
|
||||
// }
|
||||
};
|
||||
|
||||
function handleForgotPasswordClick() {
|
||||
router.push("/password-reset");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.login-container {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: url(../../assets/bg.jpg);
|
||||
background-size: cover;
|
||||
overflow: hidden;
|
||||
}
|
||||
.login-form {
|
||||
width: 26%;
|
||||
height: 40%;
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
border-radius: 1.25rem;
|
||||
}
|
||||
.login-title {
|
||||
text-align: center;
|
||||
font-size: 1.5rem;
|
||||
margin-bottom: 4rem;
|
||||
color: #333;
|
||||
}
|
||||
.login-box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.login-right {
|
||||
width: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.form-actions {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.forgot-password-spacer {
|
||||
flex-grow: 1;
|
||||
width: 0;
|
||||
height: 0;
|
||||
margin-left: 3rem;
|
||||
}
|
||||
.text {
|
||||
padding-left: 1.8rem;
|
||||
padding-right: 1.8rem;
|
||||
}
|
||||
</style>
|
|
@ -1,170 +0,0 @@
|
|||
<template>
|
||||
<div class="password-container">
|
||||
<div class="password-form">
|
||||
<t-form
|
||||
:data="formData"
|
||||
:rules="rules"
|
||||
ref="form"
|
||||
@reset="onReset"
|
||||
@submit="onSubmit"
|
||||
@validate="onValidate"
|
||||
>
|
||||
<t-form-item label="学号" name="account">
|
||||
<t-input
|
||||
v-model="formData.account"
|
||||
placeholder="请输入学号"
|
||||
></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="密码" name="password">
|
||||
<t-input
|
||||
type="password"
|
||||
v-model="formData.password"
|
||||
placeholder="请输入密码"
|
||||
></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="确认密码" name="rePassword">
|
||||
<t-input
|
||||
type="password"
|
||||
v-model="formData.rePassword"
|
||||
placeholder="请再次输入密码"
|
||||
></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item style="margin-left: 6rem">
|
||||
<t-space size="10px">
|
||||
<t-button theme="primary" type="submit">提交</t-button>
|
||||
<t-button theme="default" variant="base" type="reset"
|
||||
>重置</t-button
|
||||
>
|
||||
</t-space>
|
||||
</t-form-item>
|
||||
</t-form>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { MessagePlugin } from "tdesign-vue-next";
|
||||
import { reactive } from "vue";
|
||||
import router from "@/router";
|
||||
import {reqPassword} from "@/api/password"
|
||||
|
||||
const INITIAL_DATA = {
|
||||
account: "",
|
||||
password: "",
|
||||
rePassword: "",
|
||||
};
|
||||
|
||||
const formData = reactive({
|
||||
...INITIAL_DATA,
|
||||
});
|
||||
|
||||
const rePassword = (val) =>
|
||||
new Promise((resolve) => {
|
||||
const timer = setTimeout(() => {
|
||||
resolve(formData.password === val);
|
||||
clearTimeout(timer);
|
||||
});
|
||||
});
|
||||
|
||||
const rules = reactive({
|
||||
account: [
|
||||
{
|
||||
required: true,
|
||||
message: "学号必填",
|
||||
type: "error",
|
||||
},
|
||||
{
|
||||
pattern: /^\d{10}$/, // 正则表达式只允许10位数字
|
||||
message: "学号必须是10位数字",
|
||||
},
|
||||
],
|
||||
password: [
|
||||
{
|
||||
required: true,
|
||||
message: "密码必填",
|
||||
type: "error",
|
||||
},
|
||||
{
|
||||
len: 8,
|
||||
message: "请输入 8 位密码",
|
||||
},
|
||||
{
|
||||
pattern: /^(?=.*[A-Z])(?=.*\d)[A-Za-z\d]{8,}$/u,
|
||||
message: "密码必须包含至少一个大写字母,并由字母和数字组成",
|
||||
},
|
||||
],
|
||||
rePassword: [
|
||||
{
|
||||
required: true,
|
||||
message: "密码必填",
|
||||
type: "error",
|
||||
},
|
||||
{
|
||||
len: 8,
|
||||
message: "请输入 8 位密码",
|
||||
},
|
||||
{
|
||||
pattern: /[A-Z]+/,
|
||||
message: "密码必须包含大写字母",
|
||||
},
|
||||
{
|
||||
validator: rePassword,
|
||||
trigger: ["blur", "change"],
|
||||
message: "两次密码不一致",
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
const onReset = () => {
|
||||
MessagePlugin.success("重置成功");
|
||||
};
|
||||
|
||||
const onSubmit = async () => {
|
||||
try {
|
||||
const validateResult = await from.value?.validate();
|
||||
if (validateResult?.result) {
|
||||
await reqPassword(formData.account, formData.password, formData.rePassword);
|
||||
MessagePlugin.success("提交成功");
|
||||
await router.push("/");
|
||||
} else {
|
||||
const firstError = validateResult?.errors[0]?.message || "未知错误";
|
||||
console.log("Errors: ", validateResult.errors);
|
||||
MessagePlugin.warning(firstError);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("请求失败:", error);
|
||||
MessagePlugin.error("提交失败");
|
||||
}
|
||||
};
|
||||
|
||||
const onValidate = ({ validateResult, firstError }) => {
|
||||
if (validateResult === true) {
|
||||
onSubmit();
|
||||
console.log("Validate Success");
|
||||
} else {
|
||||
console.log("Validate Errors: ", firstError, validateResult);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.password-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100vh;
|
||||
background-image: url(../../assets/bg.jpg);
|
||||
background-size: cover;
|
||||
padding: 2rem;
|
||||
}
|
||||
.password-form {
|
||||
width: 26%;
|
||||
height: 35%;
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
border-radius: 1.25rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
|
@ -1,142 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<div class="form">
|
||||
<t-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 :span="3">
|
||||
<t-form-item label="学生学院" name="college">
|
||||
<t-input v-model="formData.college"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="导员姓名" name="tutor">
|
||||
<t-input v-model="formData.tutor"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
</t-row>
|
||||
<t-row style="margin-top: 0.5rem">
|
||||
<t-col :push="10" :span="2" style="margin-top: 0.2rem">
|
||||
<t-row :gutter="75">
|
||||
<t-col :offset="3" :span="3">
|
||||
<t-button type="submit">搜索</t-button>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-button type="reset">重置</t-button>
|
||||
</t-col>
|
||||
</t-row>
|
||||
</t-col>
|
||||
</t-row>
|
||||
</t-form>
|
||||
</div>
|
||||
<div class="table">
|
||||
<t-table
|
||||
row-key="id"
|
||||
:data="tableData"
|
||||
:columns="columns"
|
||||
:hover="true"
|
||||
table-layout="auto"
|
||||
:pagination="pagination"
|
||||
:show-header="true"
|
||||
cell-empty-content="-"
|
||||
max-height="550"
|
||||
lazy-load
|
||||
@page-change="onPageChange"
|
||||
:loading="loading"
|
||||
>
|
||||
</t-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted, reactive } from 'vue'
|
||||
import {
|
||||
APIPremiumList,
|
||||
APIPremiumFind
|
||||
} from '@/api/receivables-management/management'
|
||||
// 表格数据
|
||||
const tableData = ref([])
|
||||
//表单数据
|
||||
const formData = reactive({
|
||||
name: '',
|
||||
studentnumber: '',
|
||||
college: '',
|
||||
tutor: ''
|
||||
})
|
||||
// 表头
|
||||
const columns = ref([
|
||||
{ colKey: 'serial-number', title: '学生序号', align: 'center' },
|
||||
{ colKey: 'name', title: '学生姓名', align: 'center' },
|
||||
{ colKey: 'studentNumber', title: '学号', align: 'center' },
|
||||
{ colKey: 'gender', title: '性别', align: 'center' },
|
||||
{ colKey: 'age', title: '年龄', align: 'center' },
|
||||
{ colKey: 'tuition', title: '欠费金额', align: 'center' },
|
||||
{ colKey: 'enrollmentyear', title: '入学年份', align: 'center' },
|
||||
{ colKey: 'college', title: '所在学院', align: 'center' },
|
||||
{ colKey: 'major', title: '所在专业', align: 'center' },
|
||||
{ colKey: 'grade', title: '所在班级', align: 'center' },
|
||||
{ colKey: 'tutor', title: '导员姓名', align: 'center' }
|
||||
])
|
||||
// 表格分页数据
|
||||
let pagination = {
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 50
|
||||
}
|
||||
// 表格加载状态
|
||||
const loading = ref(false)
|
||||
//发送请求
|
||||
const PremiumList = async () => {
|
||||
const res = await APIPremiumList()
|
||||
tableData.value = res.data.list
|
||||
pagination.total = res.data.list.length
|
||||
}
|
||||
// 监听分页变化事件
|
||||
const onPageChange = (Newpage, PreviousPagePrev) => {
|
||||
loading.value = true
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false
|
||||
clearInterval(timerId)
|
||||
}, 300)
|
||||
}
|
||||
//表单重置
|
||||
const onReset = () => {
|
||||
loading.value = true
|
||||
const timerId = setTimeout(() => {
|
||||
PremiumList()
|
||||
loading.value = false
|
||||
clearInterval(timerId)
|
||||
}, 300)
|
||||
}
|
||||
//表单提交
|
||||
const onSubmit = async () => {
|
||||
const data = await APIPremiumFind(formData)
|
||||
tableData.value = data
|
||||
pagination.total = data.length
|
||||
}
|
||||
onMounted(() => {
|
||||
PremiumList()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.table {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
</style>
|
|
@ -1,362 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<div>
|
||||
<t-button @click="backToHome">返回</t-button>
|
||||
</div>
|
||||
<div>
|
||||
<div class="invoiceContainer">
|
||||
<div class="invoiceHeade">
|
||||
<div class="headeLeft"></div>
|
||||
<div class="headeMiddle">
|
||||
<span class="title">xxx增值税电子普通发票</span>
|
||||
<hr />
|
||||
<hr />
|
||||
</div>
|
||||
<div class="headeRight">
|
||||
<ul>
|
||||
<li><label> 发票代码: </label><span>1234</span></li>
|
||||
<li><label> 发票号码: </label><span>223</span></li>
|
||||
<li>
|
||||
<label> 开票日期: </label><span>{{ InvoiceData.xdate }}</span>
|
||||
</li>
|
||||
<li><label> 校验码: </label><span>111111</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="invoiceBody">
|
||||
<div class="userInfo">
|
||||
<div class="buy">缴费方</div>
|
||||
<div class="buyInfo">
|
||||
<ul>
|
||||
<li>
|
||||
<label>学生姓名:</label><span>{{ InvoiceData.xname }}</span>
|
||||
</li>
|
||||
<li>
|
||||
<label>学号:</label><span>{{ InvoiceData.xstudent }}</span>
|
||||
</li>
|
||||
<li style="display: flex">
|
||||
<label>电话:</label
|
||||
><t-input
|
||||
size="small"
|
||||
style="width: 300px"
|
||||
v-model="InvoiceData.xphone"
|
||||
/>
|
||||
</li>
|
||||
<li style="display: flex">
|
||||
<label>缴费方式:</label
|
||||
><t-input
|
||||
size="small"
|
||||
style="width: 300px"
|
||||
v-model="InvoiceData.xpayment"
|
||||
/>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="password">缴费方</div>
|
||||
<div class="department">
|
||||
<ul>
|
||||
<li>
|
||||
<label>学生部门:</label
|
||||
><span>{{ InvoiceData.xdepartment }}</span>
|
||||
</li>
|
||||
<li>
|
||||
<label>学生班级:</label><span>{{ InvoiceData.xgrade }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="Table">
|
||||
备入
|
||||
<div>
|
||||
<t-textarea
|
||||
placeholder="请输入内容"
|
||||
v-model="InvoiceData.xremark"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="saleInfo">
|
||||
<div class="total">价税合计(大写)</div>
|
||||
|
||||
<span class="max"
|
||||
><t-input
|
||||
size="small"
|
||||
style="width: 150px; padding-top: 0.2rem"
|
||||
v-model="InvoiceData.xchargebig"
|
||||
/></span>
|
||||
<div class="total2" style="display: flex">
|
||||
(小写)
|
||||
<span style="display: flex"
|
||||
>¥<t-input
|
||||
size="small"
|
||||
style="width: 150px; padding-top: 0.2rem"
|
||||
v-model="InvoiceData.xcharge"
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="userInfo2">
|
||||
<div class="buy">收费方</div>
|
||||
<div class="buyInfo">
|
||||
<ul>
|
||||
<li><label>名称:</label><span>xxxxxxx学院</span></li>
|
||||
<li>
|
||||
<label>纳税人识别号:</label><span>12443536377484848</span>
|
||||
</li>
|
||||
<li>
|
||||
<label>地址、 电话:</label
|
||||
><span>11223443532</span>
|
||||
</li>
|
||||
<li><label>开户行及账号:</label><span>中国农业银行</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="remark">备注</div>
|
||||
</div>
|
||||
<div class="userInfo3">
|
||||
<ul class="invoicetFooter" style="display: flex">
|
||||
<li style="display: flex">
|
||||
<label>收款人:</label
|
||||
><t-input
|
||||
size="small"
|
||||
style="width: 100px"
|
||||
v-model="InvoiceData.xpayee"
|
||||
/>
|
||||
</li>
|
||||
<li style="display: flex">
|
||||
<label>复核:</label
|
||||
><t-input
|
||||
size="small"
|
||||
style="width: 100px"
|
||||
v-model="InvoiceData.xreviewer"
|
||||
/>
|
||||
</li>
|
||||
<li style="display: flex">
|
||||
<label>开票人:</label
|
||||
><t-input
|
||||
size="small"
|
||||
style="width: 100px"
|
||||
v-model="InvoiceData.xdrawer"
|
||||
/>
|
||||
</li>
|
||||
<li><label>销售方:(章)</label></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { useRouter } from 'vue-router'
|
||||
import dayjs from 'dayjs'
|
||||
|
||||
const Route = useRoute()
|
||||
const Router = useRouter()
|
||||
//后端会返回发票的数据
|
||||
const InvoiceData = ref({
|
||||
//发票日期
|
||||
xdate: dayjs().format('YYYY-MM-DD'),
|
||||
//学生姓名
|
||||
xname: Route.query.firstName,
|
||||
//学号
|
||||
xstudent: 12346,
|
||||
//电话
|
||||
xphone: '',
|
||||
//缴费方式
|
||||
xpayment: '',
|
||||
// 学生部门
|
||||
xdepartment: Route.query.status,
|
||||
//学生班级
|
||||
xgrade: Route.query.classname,
|
||||
//备注
|
||||
xremark: '',
|
||||
// 应收费(小写)
|
||||
xcharge: Route.query.letters ? Route.query.letters[0] : 0,
|
||||
// 应收费(大写)
|
||||
xchargebig: '',
|
||||
//收款人
|
||||
xpayee: '',
|
||||
//复核人
|
||||
xreviewer: '',
|
||||
//开票人
|
||||
xdrawer: ''
|
||||
})
|
||||
const backToHome = () => {
|
||||
Router.go(-1)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.headeRight {
|
||||
width: 240px;
|
||||
height: 100%;
|
||||
font-size: 16px;
|
||||
line-height: 30px;
|
||||
text-align: left;
|
||||
float: left;
|
||||
}
|
||||
.headeRight > ul {
|
||||
display: inline-block;
|
||||
margin-left: 16px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.invoicetFooter > li {
|
||||
margin-top: 16px;
|
||||
margin-right: 100px;
|
||||
margin-left: 11px;
|
||||
display: inline-block;
|
||||
}
|
||||
.max {
|
||||
display: inline-block;
|
||||
margin-top: 5px;
|
||||
margin-left: 4px;
|
||||
}
|
||||
.total {
|
||||
width: 270px;
|
||||
height: 100%;
|
||||
font-size: 17px;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
border-right: 1px solid black;
|
||||
float: left;
|
||||
padding-top: 0.25rem;
|
||||
}
|
||||
.total2 {
|
||||
width: 270px;
|
||||
height: 100%;
|
||||
font-size: 17px;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
margin-right: 130px;
|
||||
float: right;
|
||||
margin-top: 0.25rem;
|
||||
}
|
||||
.buyer {
|
||||
width: 30px;
|
||||
height: 100%;
|
||||
font-size: 17px;
|
||||
text-align: center;
|
||||
border-right: 1px solid black;
|
||||
float: left;
|
||||
}
|
||||
.title {
|
||||
font-size: 33px;
|
||||
display: inline-block;
|
||||
margin-top: 50px;
|
||||
font-family: '仿宋';
|
||||
}
|
||||
.headeMiddle {
|
||||
width: 400px;
|
||||
height: 100%;
|
||||
font-size: 17px;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
float: left;
|
||||
}
|
||||
.headeLeft {
|
||||
width: 300px;
|
||||
height: 100%;
|
||||
font-size: 17px;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
float: left;
|
||||
}
|
||||
.buy {
|
||||
width: 30px;
|
||||
height: 100%;
|
||||
font-size: 17px;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
border-right: 1px solid black;
|
||||
border-left: 1px solid black;
|
||||
float: left;
|
||||
}
|
||||
.buyInfo {
|
||||
width: 510px;
|
||||
height: 100%;
|
||||
font-size: 16px;
|
||||
line-height: 25px;
|
||||
text-align: left;
|
||||
border-right: 1px solid black;
|
||||
float: left;
|
||||
}
|
||||
.department {
|
||||
height: 100%;
|
||||
font-size: 16px;
|
||||
line-height: 25px;
|
||||
text-align: left;
|
||||
float: left;
|
||||
}
|
||||
.password {
|
||||
width: 30px;
|
||||
height: 100%;
|
||||
font-size: 17px;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
border-right: 1px solid black;
|
||||
float: left;
|
||||
}
|
||||
.remark {
|
||||
width: 30px;
|
||||
height: 100%;
|
||||
font-size: 17px;
|
||||
line-height: 50px;
|
||||
text-align: center;
|
||||
border-right: 1px solid black;
|
||||
float: left;
|
||||
}
|
||||
ul {
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
padding-left: 5px;
|
||||
}
|
||||
.invoiceContainer {
|
||||
width: 1000px;
|
||||
margin: 0 auto;
|
||||
border-top: 1px solid black;
|
||||
}
|
||||
.invoiceHeade {
|
||||
width: 1000px;
|
||||
height: 140px;
|
||||
border-bottom: 1px solid black;
|
||||
border-left: 1px solid black;
|
||||
border-right: 1px solid black;
|
||||
}
|
||||
.userInfo {
|
||||
width: 1000px;
|
||||
height: 100px;
|
||||
border-bottom: 1px solid black;
|
||||
border-right: 1px solid black;
|
||||
}
|
||||
.userInfo2 {
|
||||
width: 1000px;
|
||||
height: 100px;
|
||||
border-right: 1px solid black;
|
||||
}
|
||||
.userInfo3 {
|
||||
width: 1000px;
|
||||
height: 100px;
|
||||
border-top: 1px solid black;
|
||||
}
|
||||
.Table {
|
||||
width: 999px;
|
||||
height: 400px;
|
||||
border-bottom: 1px solid black;
|
||||
border-left: 1px solid black;
|
||||
border-right: 1px solid black;
|
||||
}
|
||||
.sum {
|
||||
width: 1000px;
|
||||
height: 50px;
|
||||
border-bottom: 1px solid black;
|
||||
}
|
||||
.saleInfo {
|
||||
width: 999px;
|
||||
height: 40px;
|
||||
border-bottom: 1px solid black;
|
||||
border-right: 1px solid black;
|
||||
border-left: 1px solid black;
|
||||
}
|
||||
</style>
|
|
@ -1,146 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<div class="form">
|
||||
<t-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 :span="3">
|
||||
<t-form-item label="学生学院" name="college">
|
||||
<t-input v-model="formData.college"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="导员姓名" name="tutor">
|
||||
<t-input v-model="formData.tutor"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
</t-row>
|
||||
<t-row style="margin-top: 0.5rem">
|
||||
<t-col :push="10" :span="2" style="margin-top: 0.2rem">
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 8vw;
|
||||
margin-left: 4.5vw;
|
||||
"
|
||||
>
|
||||
<t-button type="submit">搜索</t-button>
|
||||
<t-button type="reset">重置</t-button>
|
||||
</div>
|
||||
</t-col>
|
||||
</t-row>
|
||||
</t-form>
|
||||
</div>
|
||||
<div class="table">
|
||||
<t-table
|
||||
row-key="id"
|
||||
:data="tableData"
|
||||
:columns="columns"
|
||||
:hover="true"
|
||||
table-layout="auto"
|
||||
:pagination="pagination"
|
||||
:show-header="true"
|
||||
cell-empty-content="-"
|
||||
max-height="550"
|
||||
lazy-load
|
||||
@page-change="onPageChange"
|
||||
:loading="loading"
|
||||
>
|
||||
</t-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted, reactive } from 'vue'
|
||||
import {
|
||||
APIMitigateList,
|
||||
APIMitigateFind
|
||||
} from '@/api/receivables-management/management'
|
||||
// 表格数据
|
||||
const tableData = ref([])
|
||||
//表单数据
|
||||
const formData = reactive({
|
||||
name: '',
|
||||
studentnumber: '',
|
||||
college: '',
|
||||
tutor: ''
|
||||
})
|
||||
// 表头
|
||||
const columns = ref([
|
||||
{ colKey: 'serial-number', title: '学生序号', align: 'center' },
|
||||
{ colKey: 'name', title: '学生姓名', align: 'center' },
|
||||
{ colKey: 'studentNumber', title: '学号', align: 'center' },
|
||||
{ colKey: 'gender', title: '性别', align: 'center' },
|
||||
{ colKey: 'age', title: '年龄', align: 'center' },
|
||||
{ colKey: 'tuition', title: '学费金额', align: 'center' },
|
||||
{ colKey: 'mitigate', title: '减免金额', align: 'center' },
|
||||
{ colKey: 'enrollmentyear', title: '入学年份', align: 'center' },
|
||||
{ colKey: 'college', title: '所在学院', align: 'center' },
|
||||
{ colKey: 'major', title: '所在专业', align: 'center' },
|
||||
{ colKey: 'grade', title: '所在班级', align: 'center' },
|
||||
{ colKey: 'tutor', title: '导员姓名', align: 'center' }
|
||||
])
|
||||
// 表格分页数据
|
||||
let pagination = {
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 50
|
||||
}
|
||||
// 表格加载状态
|
||||
const loading = ref(false)
|
||||
//发送请求
|
||||
const MitigateList = async () => {
|
||||
const res = await APIMitigateList()
|
||||
tableData.value = res.data.list
|
||||
pagination.total = res.data.list.length
|
||||
}
|
||||
// 监听分页变化事件
|
||||
const onPageChange = (Newpage, PreviousPagePrev) => {
|
||||
loading.value = true
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false
|
||||
clearInterval(timerId)
|
||||
}, 300)
|
||||
}
|
||||
//表单重置
|
||||
const onReset = () => {
|
||||
loading.value = true
|
||||
const timerId = setTimeout(() => {
|
||||
MitigateList()
|
||||
loading.value = false
|
||||
clearInterval(timerId)
|
||||
}, 300)
|
||||
}
|
||||
//表单提交
|
||||
const onSubmit = async () => {
|
||||
const res = await APIMitigateFind(formData)
|
||||
tableData.value = res
|
||||
pagination.total = res.length
|
||||
}
|
||||
onMounted(() => {
|
||||
MitigateList()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.table {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
</style>
|
|
@ -1,74 +0,0 @@
|
|||
<template>
|
||||
<button @click="start">start</button>
|
||||
<button @click="pause">pause</button>
|
||||
<button @click="disabled = true">disabled</button>
|
||||
<div class="flex">
|
||||
<VueDraggable
|
||||
ref="el"
|
||||
v-model="list"
|
||||
:disabled="disabled"
|
||||
:animation="150"
|
||||
ghostClass="ghost"
|
||||
class="flex flex-col gap-2 p-4 w-300px h-300px m-auto bg-gray-500/5 rounded"
|
||||
@start="onStart"
|
||||
@update="onUpdate"
|
||||
>
|
||||
<div
|
||||
v-for="item in list"
|
||||
:key="item.id"
|
||||
class="cursor-move h-30 bg-gray-500/5 rounded p-3 cursor-move"
|
||||
>
|
||||
{{ item.name }}
|
||||
</div>
|
||||
</VueDraggable>
|
||||
<preview-list :list="list" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
import { type UseDraggableReturn, VueDraggable } from 'vue-draggable-plus'
|
||||
const list = ref([
|
||||
{
|
||||
name: 'Joao',
|
||||
id: 1
|
||||
},
|
||||
{
|
||||
name: 'Jean',
|
||||
id: 2
|
||||
},
|
||||
{
|
||||
name: 'Johanna',
|
||||
id: 3
|
||||
},
|
||||
{
|
||||
name: 'Juan',
|
||||
id: 4
|
||||
}
|
||||
])
|
||||
|
||||
const el = ref<UseDraggableReturn>()
|
||||
const disabled = ref(false)
|
||||
function pause() {
|
||||
el.value?.pause()
|
||||
}
|
||||
|
||||
function start() {
|
||||
el.value?.start()
|
||||
}
|
||||
|
||||
const onStart = () => {
|
||||
console.log('start')
|
||||
}
|
||||
|
||||
const onUpdate = () => {
|
||||
console.log('update')
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.ghost {
|
||||
opacity: 0.5;
|
||||
background: #c8ebfb;
|
||||
}
|
||||
</style>
|
|
@ -1,333 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<div class="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 :span="3">
|
||||
<t-form-item label="部门" name="studentnumber">
|
||||
<t-tree-select
|
||||
v-model="formData.department"
|
||||
:data="DEPARTMENT"
|
||||
clearable
|
||||
/>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="专业" name="major">
|
||||
<t-tree-select v-model="formData.major" :data="MAJOR" clearable />
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
</t-row>
|
||||
<t-row style="margin-top: 0.5rem">
|
||||
<t-col :span="3">
|
||||
<t-form-item label="班级" name="grade">
|
||||
<t-tree-select v-model="formData.grade" :data="GRADE" clearable />
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="其他条件" name="tuition">
|
||||
<t-tree-select
|
||||
v-model="formData.tuition"
|
||||
:data="CONDITION"
|
||||
clearable
|
||||
/>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
|
||||
<t-col :span="6" style="margin-top: 0.2rem">
|
||||
<t-row>
|
||||
<t-col :offset="9" :span="1">
|
||||
<t-button type="submit">搜索</t-button>
|
||||
</t-col>
|
||||
<t-col :span="1"> </t-col>
|
||||
<t-col :span="1">
|
||||
<t-button type="reset">重置</t-button>
|
||||
</t-col>
|
||||
</t-row>
|
||||
</t-col>
|
||||
</t-row>
|
||||
</t-form>
|
||||
</div>
|
||||
<div class="table">
|
||||
<t-table
|
||||
row-key="id"
|
||||
:data="tableData"
|
||||
:columns="columns"
|
||||
:hover="true"
|
||||
table-layout="auto"
|
||||
:pagination="pagination"
|
||||
:show-header="true"
|
||||
cell-empty-content="-"
|
||||
max-height="500"
|
||||
lazy-load
|
||||
@row-click="handleRowClick"
|
||||
@page-change="onPageChange"
|
||||
:loading="loading"
|
||||
>
|
||||
<template #action="{ 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>
|
||||
<div>
|
||||
<t-button style="margin-top: 1rem" type="primary" @click="handleExport"
|
||||
>导出excel表格</t-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="jsx">
|
||||
import { ref, reactive, onMounted } from 'vue'
|
||||
import {
|
||||
APIReceivablesList,
|
||||
APIReceivablesAdd
|
||||
} from '@/api/receivables-management/management'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { ExcelUtils } from '@/utils/excel'
|
||||
const router = useRouter()
|
||||
//表单数据
|
||||
const formData = reactive({
|
||||
name: '',
|
||||
studentnumber: '',
|
||||
department: '',
|
||||
major: '',
|
||||
grade: '',
|
||||
tuition: ''
|
||||
})
|
||||
//部门数据
|
||||
const DEPARTMENT = [
|
||||
{
|
||||
label: '机电工程系',
|
||||
value: '机电工程系'
|
||||
},
|
||||
{
|
||||
label: '护理分院',
|
||||
value: '护理分院'
|
||||
},
|
||||
{
|
||||
label: '建筑系',
|
||||
value: '建筑系'
|
||||
},
|
||||
{
|
||||
label: '材料科学与工程系',
|
||||
value: '材料科学与工程系'
|
||||
},
|
||||
{
|
||||
label: '环境科学与工程系',
|
||||
value: '环境科学与工程系'
|
||||
}
|
||||
]
|
||||
//专业数据
|
||||
const MAJOR = [
|
||||
{
|
||||
label: '机械制造与自动化',
|
||||
value: '机械制造与自动化'
|
||||
},
|
||||
{
|
||||
label: '材料科学与工程',
|
||||
value: '材料科学与工程'
|
||||
},
|
||||
{
|
||||
label: '环境科学与工程',
|
||||
value: '环境科学与工程'
|
||||
},
|
||||
{
|
||||
label: '建筑工程',
|
||||
value: '建筑工程'
|
||||
},
|
||||
{
|
||||
label: '护理学',
|
||||
value: '护理学'
|
||||
}
|
||||
]
|
||||
//班级数据
|
||||
const GRADE = [
|
||||
{
|
||||
label: '机制1班',
|
||||
value: '机制1班'
|
||||
},
|
||||
{
|
||||
label: '材料1班',
|
||||
value: '材料1班'
|
||||
},
|
||||
{
|
||||
label: '环境1班',
|
||||
value: '环境1班'
|
||||
},
|
||||
{
|
||||
label: '建筑1班',
|
||||
value: '建筑1班'
|
||||
},
|
||||
{
|
||||
label: '护理1班',
|
||||
value: '护理1班'
|
||||
}
|
||||
]
|
||||
//其他条件数据
|
||||
const CONDITION = [
|
||||
{
|
||||
label: '已付学费',
|
||||
value: '已付学费'
|
||||
},
|
||||
{
|
||||
label: '未缴学费',
|
||||
value: '未缴学费'
|
||||
}
|
||||
]
|
||||
// 表格数据
|
||||
const tableData = ref([])
|
||||
// 表格头数据
|
||||
const columns = ref([
|
||||
{ colKey: 'serial-number' },
|
||||
{ colKey: 'name', title: '姓名' },
|
||||
{ colKey: 'studentnumber', title: '学号' },
|
||||
{ colKey: 'department', title: '部门' },
|
||||
{ colKey: 'major', title: '专业' },
|
||||
{ colKey: 'grade', title: '班级' },
|
||||
{
|
||||
colKey: 'tuition',
|
||||
title: '是否缴费',
|
||||
cell: (h, { row }) => {
|
||||
return (
|
||||
<div>
|
||||
{row.tuition === '未缴学费' ? (
|
||||
<t-tag theme='danger'>{row.tuition}</t-tag>
|
||||
) : (
|
||||
<t-tag theme='success'>{row.tuition}</t-tag>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
},
|
||||
{
|
||||
colKey: 'action',
|
||||
title: '操作',
|
||||
align: 'center'
|
||||
}
|
||||
])
|
||||
// 表格分页数据
|
||||
let pagination = {
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 50
|
||||
}
|
||||
//表单提交
|
||||
const onSubmit = async () => {
|
||||
if (
|
||||
formData.name ||
|
||||
formData.studentnumber ||
|
||||
formData.department ||
|
||||
formData.major ||
|
||||
formData.grade ||
|
||||
formData.tuition
|
||||
) {
|
||||
const res = await APIReceivablesAdd(formData)
|
||||
console.log(res)
|
||||
tableData.value = Array.from(res)
|
||||
pagination.total = res.length
|
||||
} else {
|
||||
alert('请填写完整信息')
|
||||
}
|
||||
}
|
||||
// 表格加载状态
|
||||
const loading = ref(false)
|
||||
//表单重置
|
||||
const onReset = () => {
|
||||
ReceivablesList()
|
||||
}
|
||||
// 表格点击事件
|
||||
const handleRowClick = e => {
|
||||
console.log(e)
|
||||
}
|
||||
//获取表格数据
|
||||
const ReceivablesList = async () => {
|
||||
loading.value = true
|
||||
const res = await APIReceivablesList()
|
||||
tableData.value = res.data.list
|
||||
pagination.total = res.data.list.length
|
||||
loading.value = false
|
||||
}
|
||||
// 监听分页变化事件
|
||||
const onPageChange = (Newpage, PreviousPagePrev) => {
|
||||
loading.value = true
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false
|
||||
clearInterval(timerId)
|
||||
}, 300)
|
||||
}
|
||||
//跳转票据页面
|
||||
const handleTicket = row => {
|
||||
router.push({
|
||||
path: '/billCollected',
|
||||
query: row
|
||||
})
|
||||
}
|
||||
//退还学费
|
||||
const hreturn = row => {
|
||||
router.push({
|
||||
path: 'bill-bill'
|
||||
})
|
||||
}
|
||||
//导出excel表格
|
||||
const handleExport = () => {
|
||||
const title = '报表明细excel'
|
||||
const titleFile = '报表明细'
|
||||
const columns = [
|
||||
{ header: '姓名', key: '1', width: 20 },
|
||||
{ header: '学号', key: '2', width: 20 },
|
||||
{ header: '部门', key: '3', width: 20 },
|
||||
{ header: '专业', key: '4', width: 20 },
|
||||
{ header: '班级', key: '5', width: 20 },
|
||||
{ header: '是否缴费', key: '6', width: 20 }
|
||||
]
|
||||
const addRow = []
|
||||
tableData.value.forEach(item => {
|
||||
addRow.push({
|
||||
1: item.name,
|
||||
2: item.studentnumber,
|
||||
3: item.department,
|
||||
4: item.major,
|
||||
5: item.grade,
|
||||
6: item.tuition
|
||||
})
|
||||
})
|
||||
// 导出excel表格
|
||||
ExcelUtils(title, titleFile, columns, addRow)
|
||||
}
|
||||
onMounted(() => {
|
||||
ReceivablesList()
|
||||
})
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.form {
|
||||
background-color: #fff;
|
||||
height: 6rem;
|
||||
padding-top: 0.5rem;
|
||||
}
|
||||
.table {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
</style>
|
|
@ -1,365 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<div>
|
||||
<t-table
|
||||
ref="tableRef"
|
||||
row-key="key"
|
||||
:columns="columns"
|
||||
:data="data"
|
||||
:editable-cell-state="editableCellState"
|
||||
bordered
|
||||
lazy-load
|
||||
>
|
||||
<template #operation="{ row }">
|
||||
<t-button theme="default" variant="text" @click="handleEdit(row)"
|
||||
>填写电子票据</t-button
|
||||
>
|
||||
<t-button theme="default" variant="text" @click="waivarForm(row)"
|
||||
>申请为减免学生</t-button
|
||||
>
|
||||
</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"
|
||||
max-height="500"
|
||||
>
|
||||
<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, reactive, watchEffect } from 'vue'
|
||||
import { Input, Select } from 'tdesign-vue-next'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { useRouter } from 'vue-router'
|
||||
import dayjs from 'dayjs'
|
||||
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const initData = reactive(
|
||||
new Array(1).fill(null).map((_, i) => ({
|
||||
key: String(i + 1),
|
||||
//学生姓名
|
||||
firstName: route.query.name,
|
||||
//学生部门
|
||||
status: route.query.department,
|
||||
//学生班级
|
||||
classname: route.query.grade,
|
||||
letters: [],
|
||||
createTime: dayjs().format('YYYY-MM-DD')
|
||||
}))
|
||||
)
|
||||
//学生部门
|
||||
const STATUS_OPTIONS = [
|
||||
{ label: '机电工程系', value: '机电工程系' },
|
||||
{ label: '护理分院', value: '护理分院' },
|
||||
{ label: '建筑系', value: '建筑系' },
|
||||
{ label: '材料科学与工程系', value: '材料科学与工程系' },
|
||||
{ label: '审批环境科学与工程系过期', value: '审批环境科学与工程系过期' }
|
||||
]
|
||||
//学生班级
|
||||
const CLASS_NAME = [
|
||||
{ label: '机制1班', value: '机制1班' },
|
||||
{ label: '材料1班', value: '材料1班' },
|
||||
{ label: '环境1班', value: '环境1班' },
|
||||
{ label: '建筑1班', value: '建筑1班' },
|
||||
{ label: '护理1班', value: '护理1班' }
|
||||
]
|
||||
//学生收费标准
|
||||
let RATES_OPTIONS = reactive([
|
||||
{ label: '机电工程系', value: '16800元' },
|
||||
{ label: '护理分院', value: '19800元' },
|
||||
{ label: '建筑系', value: '9800元' },
|
||||
{ label: '材料科学与工程系', value: '20000元' }
|
||||
])
|
||||
//学生收费标准表头
|
||||
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: RATES_OPTIONS.length,
|
||||
defaultCurrent: 1
|
||||
})
|
||||
const visible = ref(false)
|
||||
const align = ref('left')
|
||||
const data = ref([...initData])
|
||||
const editableCellState = cellParams => {
|
||||
const { row } = cellParams
|
||||
return row.status !== 2
|
||||
}
|
||||
const tableRef = ref()
|
||||
//收费表格
|
||||
const columns = computed(() => [
|
||||
{
|
||||
title: '学生姓名',
|
||||
colKey: 'firstName',
|
||||
align: align.value,
|
||||
edit: {
|
||||
component: Input,
|
||||
props: {
|
||||
clearable: true,
|
||||
autofocus: true
|
||||
},
|
||||
validateTrigger: 'change',
|
||||
on: editContext => ({
|
||||
onBlur: () => {
|
||||
console.log('失去焦点', editContext)
|
||||
},
|
||||
onEnter: ctx => {
|
||||
ctx?.e?.preventDefault()
|
||||
console.log('onEnter', ctx)
|
||||
}
|
||||
}),
|
||||
abortEditOnEvent: ['onEnter'],
|
||||
onEdited: context => {
|
||||
console.log(context)
|
||||
const newData = [...data.value]
|
||||
newData.splice(context.rowIndex, 1, context.newRowData)
|
||||
data.value = newData
|
||||
console.log('Edit firstName:', context)
|
||||
},
|
||||
defaultEditable: true
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '学生部门',
|
||||
colKey: 'status',
|
||||
cell: (h, { row }) =>
|
||||
STATUS_OPTIONS.find(t => t.value === row.status)?.label,
|
||||
edit: {
|
||||
component: Select,
|
||||
props: {
|
||||
clearable: true,
|
||||
options: STATUS_OPTIONS
|
||||
},
|
||||
on: editContext => ({
|
||||
onChange: params => {
|
||||
console.log('status changed', editContext, params)
|
||||
}
|
||||
}),
|
||||
onEdited: context => {
|
||||
data.value.splice(context.rowIndex, 1, context.newRowData)
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '学生班级',
|
||||
colKey: 'classname',
|
||||
cell: (h, { row }) =>
|
||||
CLASS_NAME.find(t => t.value === row.classname)?.label,
|
||||
edit: {
|
||||
component: Select,
|
||||
props: {
|
||||
clearable: true,
|
||||
options: CLASS_NAME
|
||||
},
|
||||
on: editContext => ({
|
||||
onChange: params => {
|
||||
console.log('status changed', editContext, params)
|
||||
}
|
||||
}),
|
||||
onEdited: context => {
|
||||
data.value.splice(context.rowIndex, 1, context.newRowData)
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '学生状态',
|
||||
colKey: 'letters',
|
||||
cell: (h, { row }) => row.letters.join('、'),
|
||||
edit: {
|
||||
keepEditMode: true,
|
||||
component: Select,
|
||||
props: () => {
|
||||
return {
|
||||
multiple: true,
|
||||
minCollapsedNum: 1,
|
||||
options: RATES_OPTIONS.filter(t =>
|
||||
t.show === undefined ? true : t.show()
|
||||
)
|
||||
}
|
||||
},
|
||||
onEdited: context => {
|
||||
data.value.splice(context.rowIndex, 1, context.newRowData)
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '应缴金额',
|
||||
colKey: 'letters',
|
||||
cell: (h, { row }) => row.letters.join('、'),
|
||||
edit: {
|
||||
keepEditMode: true,
|
||||
component: Select,
|
||||
props: () => {
|
||||
return {
|
||||
multiple: true,
|
||||
minCollapsedNum: 1
|
||||
}
|
||||
},
|
||||
onEdited: context => {
|
||||
data.value.splice(context.rowIndex, 1, context.newRowData)
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '创建日期',
|
||||
colKey: 'createTime'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
width: 300,
|
||||
colKey: 'operation',
|
||||
align: 'center'
|
||||
}
|
||||
])
|
||||
// 发票
|
||||
const handleEdit = row => {
|
||||
router.push({
|
||||
path: '/bill-bill',
|
||||
query: row
|
||||
})
|
||||
}
|
||||
// 申请为减免学生
|
||||
const waivarForm = row => {
|
||||
router.push({
|
||||
path: '/waivar-form',
|
||||
query: 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>
|
|
@ -1,210 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<div class="form">
|
||||
<t-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 :span="3">
|
||||
<t-form-item label="学生导员" name="counselor">
|
||||
<t-input v-model="formData.counselor"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="学生班级" name="grade">
|
||||
<t-input v-model="formData.grade"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
</t-row>
|
||||
<t-row style="margin-top: 0.5rem">
|
||||
<t-col :push="10" :span="2" style="margin-top: 0.2rem">
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 8vw;
|
||||
margin-left: 4.5vw;
|
||||
"
|
||||
>
|
||||
<t-button type="submit">搜索</t-button>
|
||||
<t-button type="reset">重置</t-button>
|
||||
</div>
|
||||
</t-col>
|
||||
</t-row>
|
||||
</t-form>
|
||||
</div>
|
||||
<div class="table">
|
||||
<t-table
|
||||
row-key="id"
|
||||
:data="tableData"
|
||||
:columns="columns"
|
||||
:hover="true"
|
||||
table-layout="auto"
|
||||
:pagination="pagination"
|
||||
:show-header="true"
|
||||
cell-empty-content="-"
|
||||
max-height="550"
|
||||
lazy-load
|
||||
@row-click="handleRowClick"
|
||||
@page-change="onPageChange"
|
||||
:loading="loading"
|
||||
>
|
||||
<template #operation="{ row }">
|
||||
<t-button size="small" @click="onClick(row)">联系该学生导员</t-button>
|
||||
</template>
|
||||
</t-table>
|
||||
</div>
|
||||
<div class="dialog">
|
||||
<t-space>
|
||||
<t-dialog
|
||||
v-model:visible="visible"
|
||||
header="联系该学生导员"
|
||||
width="40%"
|
||||
:close-on-overlay-click="false"
|
||||
:on-cancel="onCancel"
|
||||
:on-close-btn-click="onCloseBtnClick"
|
||||
:on-confirm="onConfirmAnother"
|
||||
confirm-btn="联系该导员"
|
||||
>
|
||||
<t-space direction="vertical" style="width: 100%">
|
||||
<t-form :data="formData" reset-type="initial" colon disabled>
|
||||
<t-form-item label="导员姓名" name="name">
|
||||
<t-input v-model="dialogData.name"></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="导员手机号" name="number">
|
||||
<t-input v-model="dialogData.number"></t-input>
|
||||
</t-form-item>
|
||||
</t-form>
|
||||
</t-space>
|
||||
</t-dialog>
|
||||
</t-space>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
import { ref, reactive, onMounted } from 'vue'
|
||||
import {
|
||||
APIParagraphList,
|
||||
APIParagraphFind
|
||||
} from '@/api/receivables-management/management'
|
||||
//表单数据
|
||||
const formData = reactive({
|
||||
name: '',
|
||||
studentnumber: '',
|
||||
counselor: '',
|
||||
grade: ''
|
||||
})
|
||||
//学生催款单
|
||||
const tableData = ref([])
|
||||
//表头
|
||||
const columns = [
|
||||
{ colKey: 'name', title: '学生姓名' },
|
||||
{ colKey: 'department', title: '学生院系' },
|
||||
{ colKey: 'grade', title: '学生班级' },
|
||||
{ colKey: 'counselor', title: '学生导员' },
|
||||
{ colKey: 'cellPhone', title: '导员手机号' },
|
||||
{ colKey: 'money', title: '催款金额' },
|
||||
{
|
||||
colKey: 'condition',
|
||||
title: '还款情况',
|
||||
cell: (h, { row }) => {
|
||||
return (
|
||||
<div>
|
||||
<t-tag theme='success'>{row.condition}</t-tag>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
},
|
||||
{ colKey: 'operation', title: '操作', align: 'center' }
|
||||
]
|
||||
//分页
|
||||
let pagination = {
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 50
|
||||
}
|
||||
//对话框数据
|
||||
const dialogData = reactive({
|
||||
name: '',
|
||||
number: ''
|
||||
})
|
||||
// 监听分页变化事件
|
||||
const onPageChange = (Newpage, PreviousPagePrev) => {
|
||||
loading.value = true
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false
|
||||
clearInterval(timerId)
|
||||
}, 300)
|
||||
}
|
||||
// 加载状态
|
||||
const loading = ref(false)
|
||||
// 点击表格
|
||||
const handleRowClick = e => {
|
||||
console.log(e)
|
||||
}
|
||||
//表单重置
|
||||
const onReset = () => {
|
||||
loading.value = true
|
||||
ParagraphList()
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false
|
||||
clearInterval(timerId)
|
||||
}, 300)
|
||||
}
|
||||
//表单提交
|
||||
const onSubmit = async () => {
|
||||
const res = await APIParagraphFind(formData)
|
||||
tableData.value = res
|
||||
pagination.total = res.length
|
||||
}
|
||||
// 获取学生催款单列表
|
||||
const ParagraphList = async () => {
|
||||
const res = await APIParagraphList()
|
||||
tableData.value = res.data.list
|
||||
pagination.total = res.data.list.length
|
||||
}
|
||||
//对话框
|
||||
const visible = ref(false)
|
||||
const onClick = row => {
|
||||
dialogData.name = row.counselor
|
||||
dialogData.number = row.cellPhone
|
||||
visible.value = true
|
||||
}
|
||||
// 点击了确定按钮
|
||||
const onConfirmAnother = () => {
|
||||
visible.value = false
|
||||
}
|
||||
// 点击了取消按钮
|
||||
const onCancel = () => {}
|
||||
// 点击了关闭按钮
|
||||
const onCloseBtnClick = () => {}
|
||||
onMounted(() => {
|
||||
ParagraphList()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.form {
|
||||
background-color: #fff;
|
||||
height: 6rem;
|
||||
padding-top: 0.5rem;
|
||||
}
|
||||
.table {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
</style>
|
|
@ -1,113 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<div class="linebox">
|
||||
<lineChart
|
||||
:categories="categories"
|
||||
:seriesData="seriesData"
|
||||
:titleP="title"
|
||||
:legendList="legendList"
|
||||
:height="'100%'"
|
||||
:width="'60rem'"
|
||||
/>
|
||||
</div>
|
||||
<div class="table">
|
||||
<div>收费日报表</div>
|
||||
<t-table
|
||||
:data="tableData"
|
||||
:columns="columns"
|
||||
:hover="true"
|
||||
table-layout="auto"
|
||||
:pagination="pagination"
|
||||
:show-header="true"
|
||||
cell-empty-content="-"
|
||||
max-height="550"
|
||||
lazy-load
|
||||
@row-click="handleRowClick"
|
||||
@page-change="onPageChange"
|
||||
:loading="loading"
|
||||
>
|
||||
</t-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { APIDailyList } from '@/api/receivables-management/management'
|
||||
import lineChart from '@/components/echarts/line.vue'
|
||||
import dayjs from 'dayjs'
|
||||
// 日常收费明细表数据
|
||||
const tableData = ref([])
|
||||
// 日常收费明细表格头数据
|
||||
const columns = ref([
|
||||
{ colKey: 'date', title: '日期' },
|
||||
{ colKey: 'tuiti', title: '学费' },
|
||||
{ colKey: 'incidentals', title: '杂费' },
|
||||
{ colKey: 'materials', title: '书本资料费' },
|
||||
{ colKey: 'major', title: '校服费' },
|
||||
{ colKey: 'grade', title: '餐饮费' },
|
||||
{ colKey: 'tuit', title: '住宿费' },
|
||||
{ colKey: 'cost', title: '其他费用' },
|
||||
{ colKey: 'tuition', title: '总计' }
|
||||
])
|
||||
// 日常收费明细表格分页数据
|
||||
let pagination = {
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 50
|
||||
}
|
||||
// 日常收费明细表格加载状态
|
||||
const loading = ref(false)
|
||||
// 日常收费明细表格点击事件
|
||||
const handleRowClick = e => {
|
||||
console.log(e)
|
||||
}
|
||||
// 日常收费明细监听分页变化事件
|
||||
const onPageChange = (Newpage, PreviousPagePrev) => {
|
||||
loading.value = true
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false
|
||||
clearInterval(timerId)
|
||||
}, 300)
|
||||
}
|
||||
//折线图数据
|
||||
const title = ref('收费日报表')
|
||||
const categories = ref([
|
||||
'学费',
|
||||
'杂费',
|
||||
'书本资料费',
|
||||
'住宿费',
|
||||
'其他费用',
|
||||
'总计'
|
||||
])
|
||||
const legendList = ref(['今日费用'])
|
||||
const seriesData = ref([
|
||||
{
|
||||
name: '今日费用',
|
||||
data: [10, 20, 15, 20, 25, 105],
|
||||
type: 'line'
|
||||
}
|
||||
])
|
||||
// 获取日常收费明细表数据
|
||||
const DailyList = async () => {
|
||||
const res = await APIDailyList()
|
||||
tableData.value = res.data.list
|
||||
pagination.total = res.data.list.length
|
||||
}
|
||||
onMounted(() => {
|
||||
DailyList()
|
||||
})
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.linebox {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.button {
|
||||
margin-right: 1rem;
|
||||
margin-left: 3rem;
|
||||
}
|
||||
.table {
|
||||
margin-top: 1rem;
|
||||
background-color: #fff;
|
||||
}
|
||||
</style>
|
|
@ -1,582 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<div class="table">
|
||||
<t-table
|
||||
row-key="id"
|
||||
:data="tableData"
|
||||
:columns="columns"
|
||||
:hover="true"
|
||||
table-layout="auto"
|
||||
:pagination="pagination"
|
||||
:show-header="true"
|
||||
cell-empty-content="-"
|
||||
max-height="550"
|
||||
lazy-load
|
||||
@page-change="onPageChange"
|
||||
:loading="loading"
|
||||
>
|
||||
</t-table>
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
<t-select
|
||||
v-model="value"
|
||||
placeholder="请选择"
|
||||
:options="options"
|
||||
size="medium"
|
||||
@change="handleChange"
|
||||
style="
|
||||
width: 200px;
|
||||
display: inline-block;
|
||||
margin-right: 20px;
|
||||
margin-top: 3rem;
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
<div style="background-color: #fff; display: flex">
|
||||
<div ref="chartContainer" style="width: 38rem; height: 30rem"></div>
|
||||
<div ref="Container" style="width: 38rem; height: 30rem"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted } from 'vue'
|
||||
import { APIAnalysisList } from '@/api/receivables-management/management'
|
||||
import * as echarts from 'echarts'
|
||||
//表格数据
|
||||
const tableData = ref([])
|
||||
// 表格loading
|
||||
const loading = ref(false)
|
||||
// 表格列数据
|
||||
const columns = ref([
|
||||
{ colKey: 'serial-number', title: '序号' },
|
||||
{ colKey: 'name', title: '学院名称' },
|
||||
{ colKey: 'studentnumber', title: '学生总数' },
|
||||
{ colKey: 'department', title: '应缴费人数' },
|
||||
{ colKey: 'major', title: '实际缴费人数' },
|
||||
{ colKey: 'grade', title: '应缴总金额' },
|
||||
{ colKey: 'tuition', title: '未缴费人数' },
|
||||
{ colKey: 'weigrade', title: '未缴总金额' },
|
||||
{ colKey: 'shition', title: '实收总金额' },
|
||||
{ colKey: 'action', title: '操作', align: 'center' }
|
||||
])
|
||||
// 表格分页数据
|
||||
let pagination = {
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 50
|
||||
}
|
||||
// 监听分页变化事件
|
||||
const onPageChange = (Newpage, PreviousPagePrev) => {
|
||||
loading.value = true
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false
|
||||
clearInterval(timerId)
|
||||
}, 300)
|
||||
}
|
||||
// 获取表格数据
|
||||
const AnalysisList = async () => {
|
||||
const res = await APIAnalysisList()
|
||||
tableData.value = res.data.list
|
||||
pagination.total = res.data.list.length
|
||||
}
|
||||
// 图表
|
||||
const chartContainer = ref(null)
|
||||
const Container = 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: ['机电工程系', '护理系', '建筑系']
|
||||
},
|
||||
grid: {
|
||||
left: '0%',
|
||||
right: '0%',
|
||||
bottom: '0%',
|
||||
containLabel: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'log',
|
||||
name: 'y',
|
||||
minorSplitLine: {
|
||||
show: true
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '应缴费人数',
|
||||
type: 'line',
|
||||
data: ['120', '200', '300']
|
||||
},
|
||||
{
|
||||
name: '未缴费人数',
|
||||
type: 'line',
|
||||
data: ['80', '120', '200']
|
||||
}
|
||||
]
|
||||
}
|
||||
let moneypOption = {
|
||||
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: ['1344000', '2016000', '2016000', '5376000']
|
||||
},
|
||||
{
|
||||
name: '未缴费',
|
||||
type: 'line',
|
||||
data: ['672000', '1344000', '168000', '974000']
|
||||
}
|
||||
]
|
||||
}
|
||||
const eoption = option => {
|
||||
const chart = echarts.init(chartContainer.value)
|
||||
chart.setOption(option)
|
||||
}
|
||||
const moneyption = option => {
|
||||
const chart = echarts.init(Container.value)
|
||||
chart.setOption(option)
|
||||
}
|
||||
// 选择框
|
||||
const value = ref('部门')
|
||||
const options = [
|
||||
{ label: '部门', value: '部门' },
|
||||
{ label: '机电工程系', value: '机电工程系' },
|
||||
{ label: '护理分院', value: '护理分院' },
|
||||
{ label: '建筑系', value: '建筑系' }
|
||||
]
|
||||
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: ['机电工程系', '护理系', '建筑系']
|
||||
},
|
||||
grid: {
|
||||
left: '0%',
|
||||
right: '0%',
|
||||
bottom: '0%',
|
||||
containLabel: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'log',
|
||||
name: 'y',
|
||||
minorSplitLine: {
|
||||
show: true
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '应缴费人数',
|
||||
type: 'line',
|
||||
data: ['120', '200', '300']
|
||||
},
|
||||
{
|
||||
name: '未缴费人数',
|
||||
type: 'line',
|
||||
data: ['80', '120', '200']
|
||||
}
|
||||
]
|
||||
}
|
||||
let moneypOption = {
|
||||
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: ['1344000', '2016000', '2016000', '5376000']
|
||||
},
|
||||
{
|
||||
name: '未缴费',
|
||||
type: 'line',
|
||||
data: ['672000', '1344000', '168000', '974000']
|
||||
}
|
||||
]
|
||||
}
|
||||
eoption(option)
|
||||
moneyption(moneypOption)
|
||||
} else 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: ['机电一班', '机电二班', '机电三班', '机电四班', '总计']
|
||||
},
|
||||
grid: {
|
||||
left: '0%',
|
||||
right: '0%',
|
||||
bottom: '0%',
|
||||
containLabel: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'log',
|
||||
name: 'y',
|
||||
minorSplitLine: {
|
||||
show: true
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '应缴费人数',
|
||||
type: 'line',
|
||||
data: [15, 23, 18, 13, 74]
|
||||
},
|
||||
{
|
||||
name: '未缴费人数',
|
||||
type: 'line',
|
||||
data: [15, 7, 12, 17, 64]
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
let moneypOption = {
|
||||
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: ['1344000', '2016000', '2016000', '5376000']
|
||||
},
|
||||
{
|
||||
name: '未缴费',
|
||||
type: 'line',
|
||||
data: ['672000', '1344000', '168000', '974000']
|
||||
}
|
||||
]
|
||||
}
|
||||
eoption(option)
|
||||
moneyption(moneypOption)
|
||||
} else 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: [
|
||||
'护理一班',
|
||||
'护理二班',
|
||||
'护理三班',
|
||||
'护理四班',
|
||||
'护理五班',
|
||||
'总计'
|
||||
]
|
||||
},
|
||||
grid: {
|
||||
left: '0%',
|
||||
right: '0%',
|
||||
bottom: '0%',
|
||||
containLabel: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'log',
|
||||
name: 'y',
|
||||
minorSplitLine: {
|
||||
show: true
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '应缴费人数',
|
||||
type: 'line',
|
||||
data: [25, 23, 28, 13, 20, 109]
|
||||
},
|
||||
{
|
||||
name: '未缴费人数',
|
||||
type: 'line',
|
||||
data: [15, 17, 12, 27, 20, 91]
|
||||
}
|
||||
]
|
||||
}
|
||||
let moneypOption = {
|
||||
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: ['420000', '386400', '470400', '336000', '403200', '1831200']
|
||||
},
|
||||
{
|
||||
name: '未缴费',
|
||||
type: 'line',
|
||||
data: ['252000', '285600', '201600', '285600', '403200', '1528800']
|
||||
}
|
||||
]
|
||||
}
|
||||
eoption(option)
|
||||
moneyption(moneypOption)
|
||||
} else 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: ['建筑一班', '建筑二班', '建筑三班', '总计']
|
||||
},
|
||||
grid: {
|
||||
left: '0%',
|
||||
right: '0%',
|
||||
bottom: '0%',
|
||||
containLabel: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'log',
|
||||
name: 'y',
|
||||
minorSplitLine: {
|
||||
show: true
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '应缴费人数',
|
||||
type: 'line',
|
||||
data: [95, 74, 74, 243]
|
||||
},
|
||||
{
|
||||
name: '未缴费人数',
|
||||
type: 'line',
|
||||
data: [25, 6, 26, 63]
|
||||
}
|
||||
]
|
||||
}
|
||||
let moneypOption = {
|
||||
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: ['1596000', '1246200', '1246200', '4082400']
|
||||
},
|
||||
{
|
||||
name: '未缴费',
|
||||
type: 'line',
|
||||
data: ['420000', '100800', '436800', '1058400']
|
||||
}
|
||||
]
|
||||
}
|
||||
eoption(option)
|
||||
moneyption(moneypOption)
|
||||
}
|
||||
}
|
||||
onMounted(() => {
|
||||
AnalysisList()
|
||||
eoption(option)
|
||||
moneyption(moneypOption)
|
||||
console.log(option.series[0].data)
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
|
@ -1,145 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<div class="form">
|
||||
<t-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 :span="3">
|
||||
<t-form-item label="学生学院" name="college">
|
||||
<t-input v-model="formData.college"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="导员姓名" name="tutor">
|
||||
<t-input v-model="formData.tutor"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
</t-row>
|
||||
<t-row style="margin-top: 0.5rem">
|
||||
<t-col :push="10" :span="2" style="margin-top: 0.2rem">
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 8vw;
|
||||
margin-left: 4.5vw;
|
||||
"
|
||||
>
|
||||
<t-button type="submit">搜索</t-button>
|
||||
<t-button type="reset">重置</t-button>
|
||||
</div>
|
||||
</t-col>
|
||||
</t-row>
|
||||
</t-form>
|
||||
</div>
|
||||
<div class="table">
|
||||
<t-table
|
||||
row-key="id"
|
||||
:data="tableData"
|
||||
:columns="columns"
|
||||
:hover="true"
|
||||
table-layout="auto"
|
||||
:pagination="pagination"
|
||||
:show-header="true"
|
||||
cell-empty-content="-"
|
||||
max-height="550"
|
||||
lazy-load
|
||||
@page-change="onPageChange"
|
||||
:loading="loading"
|
||||
>
|
||||
</t-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted, reactive } from 'vue'
|
||||
import {
|
||||
APIPremiumList,
|
||||
APIPremiumFind
|
||||
} from '@/api/receivables-management/management'
|
||||
// 表格数据
|
||||
const tableData = ref([])
|
||||
//表单数据
|
||||
const formData = reactive({
|
||||
name: '',
|
||||
studentnumber: '',
|
||||
college: '',
|
||||
tutor: ''
|
||||
})
|
||||
// 表头
|
||||
const columns = ref([
|
||||
{ colKey: 'serial-number', title: '学生序号', align: 'center' },
|
||||
{ colKey: 'name', title: '学生姓名', align: 'center' },
|
||||
{ colKey: 'studentNumber', title: '学号', align: 'center' },
|
||||
{ colKey: 'gender', title: '性别', align: 'center' },
|
||||
{ colKey: 'age', title: '年龄', align: 'center' },
|
||||
{ colKey: 'tuition', title: '退费金额', align: 'center' },
|
||||
{ colKey: 'enrollmentyear', title: '入学年份', align: 'center' },
|
||||
{ colKey: 'college', title: '所在学院', align: 'center' },
|
||||
{ colKey: 'major', title: '所在专业', align: 'center' },
|
||||
{ colKey: 'grade', title: '所在班级', align: 'center' },
|
||||
{ colKey: 'tutor', title: '导员姓名', align: 'center' }
|
||||
])
|
||||
// 表格分页数据
|
||||
let pagination = {
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 50
|
||||
}
|
||||
// 表格加载状态
|
||||
const loading = ref(false)
|
||||
//发送请求
|
||||
const PremiumList = async () => {
|
||||
const res = await APIPremiumList()
|
||||
tableData.value = res.data.list
|
||||
pagination.total = res.data.list.length
|
||||
}
|
||||
// 监听分页变化事件
|
||||
const onPageChange = (Newpage, PreviousPagePrev) => {
|
||||
loading.value = true
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false
|
||||
clearInterval(timerId)
|
||||
}, 300)
|
||||
}
|
||||
//表单重置
|
||||
const onReset = () => {
|
||||
loading.value = true
|
||||
const timerId = setTimeout(() => {
|
||||
PremiumList()
|
||||
loading.value = false
|
||||
clearInterval(timerId)
|
||||
}, 300)
|
||||
}
|
||||
//表单提交
|
||||
const onSubmit = async () => {
|
||||
const data = await APIPremiumFind(formData)
|
||||
tableData.value = data
|
||||
pagination.total = data.length
|
||||
}
|
||||
onMounted(() => {
|
||||
PremiumList()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.table {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
</style>
|
|
@ -1,152 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<div class="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 :span="3">
|
||||
<t-form-item label="所在部门" name="college">
|
||||
<t-input v-model="formData.college"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
<t-col :span="3">
|
||||
<t-form-item label="学生班级" name="grade">
|
||||
<t-input v-model="formData.grade"></t-input>
|
||||
</t-form-item>
|
||||
</t-col>
|
||||
</t-row>
|
||||
<t-row style="margin-top: 0.5rem">
|
||||
<t-col :span="3"> </t-col>
|
||||
<t-col :span="3"> </t-col>
|
||||
<t-col :push="4" :span="2" style="margin-top: 0.2rem">
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 8vw;
|
||||
margin-left: 5vw;
|
||||
"
|
||||
>
|
||||
<t-button type="submit" class="button">搜索</t-button>
|
||||
<t-button type="reset">重置</t-button>
|
||||
</div>
|
||||
</t-col>
|
||||
</t-row>
|
||||
</t-form>
|
||||
</div>
|
||||
<div class="table">
|
||||
<t-table
|
||||
row-key="id"
|
||||
:data="tableData"
|
||||
:columns="columns"
|
||||
:hover="true"
|
||||
table-layout="auto"
|
||||
:pagination="pagination"
|
||||
:show-header="true"
|
||||
cell-empty-content="-"
|
||||
max-height="550"
|
||||
lazy-load
|
||||
@page-change="onPageChange"
|
||||
:loading="loading"
|
||||
>
|
||||
</t-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted, reactive } from 'vue'
|
||||
import {
|
||||
APIMessageList,
|
||||
APIMessageFind
|
||||
} from '@/api/receivables-management/management'
|
||||
// 表格数据
|
||||
const tableData = ref([])
|
||||
//表单数据
|
||||
const formData = reactive({
|
||||
name: '',
|
||||
studentnumber: '',
|
||||
college: '',
|
||||
grade: ''
|
||||
})
|
||||
// 表头
|
||||
const columns = ref([
|
||||
{ colKey: 'serial-number', title: '学生序号', align: 'center' },
|
||||
{ colKey: 'name', title: '学生姓名', align: 'center' },
|
||||
{ colKey: 'studentNumber', title: '学号', align: 'center' },
|
||||
{ colKey: 'gender', title: '性别', align: 'center' },
|
||||
{ colKey: 'age', title: '年龄', align: 'center' },
|
||||
{ colKey: 'nativePlace', title: '籍贯', align: 'center' },
|
||||
{ colKey: 'nation', title: '民族' },
|
||||
{ colKey: 'enrollmentyear', title: '入学年份', align: 'center' },
|
||||
{ colKey: 'college', title: '所在学院', align: 'center' },
|
||||
{ colKey: 'major', title: '所在专业', align: 'center' },
|
||||
{ colKey: 'grade', title: '所在班级', align: 'center' },
|
||||
{ colKey: 'tutor', title: '导员姓名', align: 'center' },
|
||||
{ colKey: 'phone', title: '联系人电话', align: 'center' }
|
||||
])
|
||||
// 表格分页数据
|
||||
let pagination = {
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 50
|
||||
}
|
||||
// 表格加载状态
|
||||
const loading = ref(false)
|
||||
//发送请求
|
||||
const MessageList = async () => {
|
||||
const res = await APIMessageList()
|
||||
tableData.value = res.data.list
|
||||
pagination.total = res.data.list.length
|
||||
}
|
||||
// 监听分页变化事件
|
||||
const onPageChange = (Newpage, PreviousPagePrev) => {
|
||||
loading.value = true
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false
|
||||
clearInterval(timerId)
|
||||
}, 300)
|
||||
}
|
||||
//表单提交
|
||||
const onSubmit = async () => {
|
||||
const res = await APIMessageFind(formData)
|
||||
tableData.value = Array.from(res)
|
||||
pagination.total = res.length
|
||||
}
|
||||
//表单重置
|
||||
const onReset = () => {
|
||||
loading.value = true
|
||||
MessageList()
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false
|
||||
clearInterval(timerId)
|
||||
}, 300)
|
||||
}
|
||||
onMounted(() => {
|
||||
MessageList()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.form {
|
||||
background-color: #fff;
|
||||
height: 6rem;
|
||||
padding-top: 0.5rem;
|
||||
}
|
||||
</style>
|
|
@ -1,432 +0,0 @@
|
|||
<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">
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 8vw;
|
||||
margin-left: 5vw;
|
||||
"
|
||||
>
|
||||
<t-button type="submit">搜索</t-button>
|
||||
<t-button type="reset">重置</t-button>
|
||||
</div>
|
||||
</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="-"
|
||||
max-height="550"
|
||||
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,
|
||||
APILoansFind
|
||||
} 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,
|
||||
current: 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 = pageInfo => {
|
||||
pagination.value.current = pageInfo.current
|
||||
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
|
||||
pagination.value.current = 1
|
||||
}
|
||||
//表单重置
|
||||
const onReset = () => {
|
||||
loading.value = true
|
||||
LoansList()
|
||||
const timerId = setTimeout(() => {
|
||||
loading.value = false
|
||||
clearInterval(timerId)
|
||||
}, 300)
|
||||
}
|
||||
//表单提交
|
||||
const onSubmit = async () => {
|
||||
console.log('表单提交', formData.value)
|
||||
if (formData.value.name !== '') {
|
||||
const res = await APILoansFind(formData.value)
|
||||
data.value = res
|
||||
pagination.value.total = res.data.length
|
||||
pagination.value.current = 1
|
||||
}
|
||||
if (formData.value.studentnumber !== '') {
|
||||
const res = await APILoansFind(formData.value)
|
||||
data.value = res
|
||||
pagination.value.total = res.data.length
|
||||
pagination.value.current = 1
|
||||
}
|
||||
}
|
||||
//弹出框
|
||||
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>
|
|
@ -1,257 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<div style="border: 2px solid; width: 640px">
|
||||
<div class="proposer">
|
||||
<div class="left">申请人情况</div>
|
||||
<div class="right">
|
||||
<div class="up">
|
||||
<div class="up">
|
||||
<div>
|
||||
学号<span
|
||||
><input v-model="data.studentId" class="span" type="text"
|
||||
/></span>
|
||||
</div>
|
||||
<div>
|
||||
姓名<span
|
||||
><input v-model="data.studentName" class="span" type="text"
|
||||
/></span>
|
||||
</div>
|
||||
<div>
|
||||
性别<span
|
||||
><input v-model="data.studentSex" class="span" type="text"
|
||||
/></span>
|
||||
</div>
|
||||
<div>
|
||||
出身年月<span
|
||||
><input
|
||||
v-model="data.studentBirthday"
|
||||
class="span"
|
||||
type="text"
|
||||
/></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="down">
|
||||
<div>
|
||||
专业<span
|
||||
><input v-model="data.studentMajor" class="span" type="text"
|
||||
/></span>
|
||||
</div>
|
||||
<div>
|
||||
班级<span
|
||||
><input v-model="data.studentClass" class="span" type="text"
|
||||
/></span>
|
||||
</div>
|
||||
<div>
|
||||
证号<span
|
||||
><input v-model="data.studentCard" class="span" type="text"
|
||||
/></span>
|
||||
</div>
|
||||
<div>
|
||||
身份证号<span
|
||||
><input v-model="data.studentIdCard" class="span" type="text"
|
||||
/></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="below">
|
||||
<div>
|
||||
家庭住址
|
||||
<span
|
||||
><input v-model="data.studentAddress" class="span1" type="text"
|
||||
/></span>
|
||||
</div>
|
||||
<div>
|
||||
邮政编码
|
||||
<span
|
||||
><input v-model="data.studentZip" class="span1" type="text"
|
||||
/></span>
|
||||
</div>
|
||||
<div>
|
||||
联系电话
|
||||
<span
|
||||
><input v-model="data.studentPhone" class="span1" type="text"
|
||||
/></span>
|
||||
</div>
|
||||
<div>
|
||||
年缴学费
|
||||
<span
|
||||
><input v-model="data.studentFee" class="span1" type="text"
|
||||
/></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="family">
|
||||
<div>
|
||||
<div class="family" style="border: 0.5px solid">家庭情况</div>
|
||||
</div>
|
||||
<div>
|
||||
<div style="border: 0.5px solid">1</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="allowance">
|
||||
<div>
|
||||
<div class="allowance" style="border: 0.5px solid">减免申请</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>2</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="counselor">
|
||||
<div>
|
||||
<div class="counselor" style="border: 0.5px solid">辅导员意见</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>3</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="production">
|
||||
<div>
|
||||
<div class="production" style="border: 0.5px solid">学工部意见</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>1</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="competent">
|
||||
<div>
|
||||
<div class="competent" style="border: 0.5px solid">
|
||||
主管院长审批意见
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>4</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="standby">
|
||||
<div style="border: 0.5px solid">备注</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex; justify-content: flex-end; margin-top: 1rem">
|
||||
<t-button theme="default" variant="text" @click="handleClick"
|
||||
>填写完毕立刻生低档</t-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
const Router = useRouter()
|
||||
const data = ref({
|
||||
// 申请人学号
|
||||
studentId: '',
|
||||
// 申请人姓名
|
||||
studentName: '',
|
||||
// 申请人性别
|
||||
studentSex: '',
|
||||
// 申请人出身年月
|
||||
studentBirthday: '',
|
||||
// 申请人专业
|
||||
studentMajor: '',
|
||||
// 申请人班级
|
||||
studentClass: '',
|
||||
// 申请人证号
|
||||
studentCard: '',
|
||||
// 申请人身份证号
|
||||
studentIdCard: '',
|
||||
// 申请人家庭住址
|
||||
studentAddress: '',
|
||||
// 申请人邮政编码
|
||||
studentZip: '',
|
||||
// 申请人联系电话
|
||||
studentPhone: '',
|
||||
// 申请人年缴学费
|
||||
studentFee: '',
|
||||
// 判断标识
|
||||
routers: '1'
|
||||
})
|
||||
const handleClick = () => {
|
||||
Router.push({
|
||||
path: '/billCollected'
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.proposer {
|
||||
display: flex;
|
||||
height: 4.5rem;
|
||||
width: 100%;
|
||||
.left {
|
||||
border: 0.5px solid;
|
||||
width: 3rem;
|
||||
height: 4.5rem;
|
||||
padding-top: 1rem;
|
||||
}
|
||||
.right {
|
||||
.up {
|
||||
.up {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.down {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
.below {
|
||||
display: flex;
|
||||
.jia {
|
||||
width: 8rem;
|
||||
height: 2rem;
|
||||
}
|
||||
.bian {
|
||||
width: 3rem;
|
||||
height: 1.5srem;
|
||||
}
|
||||
.hua {
|
||||
width: 2rem;
|
||||
height: 1.5rem;
|
||||
}
|
||||
.nian {
|
||||
width: 2rem;
|
||||
height: 1.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.family {
|
||||
height: 10rem;
|
||||
display: flex;
|
||||
width: 3rem;
|
||||
}
|
||||
.allowance {
|
||||
height: 10rem;
|
||||
display: flex;
|
||||
width: 3rem;
|
||||
}
|
||||
.counselor {
|
||||
height: 10rem;
|
||||
display: flex;
|
||||
width: 3rem;
|
||||
}
|
||||
.production {
|
||||
height: 10rem;
|
||||
display: flex;
|
||||
width: 3rem;
|
||||
}
|
||||
.competent {
|
||||
height: 10rem;
|
||||
display: flex;
|
||||
width: 3rem;
|
||||
}
|
||||
.span {
|
||||
width: 7rem;
|
||||
height: 1.5rem;
|
||||
}
|
||||
.span1 {
|
||||
width: 5rem;
|
||||
height: 1.5rem;
|
||||
}
|
||||
input {
|
||||
border-style: none;
|
||||
background-color: #f5f7fb;
|
||||
}
|
||||
</style>
|
|
@ -1,438 +0,0 @@
|
|||
<template>
|
||||
<div class="back-color">
|
||||
<t-layout style="height: 90%; background-color: #f5f7fb">
|
||||
<t-header class="scarch-box">
|
||||
<t-form
|
||||
ref="form"
|
||||
:data="studentData"
|
||||
label-width="calc(2em + 40px)"
|
||||
layout="inline"
|
||||
class="scarch-from"
|
||||
colon
|
||||
@reset="onReset"
|
||||
@submit="onSubmit"
|
||||
>
|
||||
<div style="margin-left: 0.5rem">
|
||||
|
||||
<t-form-item label="姓名" name="name">
|
||||
<t-input v-model="studentData.name"></t-input>
|
||||
</t-form-item>
|
||||
|
||||
<t-form-item label="学号" name="studentId">
|
||||
<t-input v-model="studentData.studentId"></t-input>
|
||||
</t-form-item>
|
||||
</div>
|
||||
<t-form-item style="margin-right: 1rem">
|
||||
|
||||
<t-button theme="primary" type="submit">查询</t-button>
|
||||
<t-button
|
||||
theme="default"
|
||||
variant="base"
|
||||
type="reset"
|
||||
style="margin-left: 1rem"
|
||||
>重置</t-button
|
||||
>
|
||||
</t-form-item>
|
||||
</t-form>
|
||||
</t-header>
|
||||
<t-content class="table-box">
|
||||
<div class="table-header">
|
||||
<div>
|
||||
<h4 style="font-size: 110%">学生列表</h4>
|
||||
</div>
|
||||
<div>
|
||||
<t-button theme="primary" size="small" style="margin-right:0rem" @click="onAddSubmit">
|
||||
<template #icon><add-icon /></template>
|
||||
增加学员信息
|
||||
</t-button>
|
||||
<t-button
|
||||
shape="circle"
|
||||
theme="primary"
|
||||
@click="refresh"
|
||||
style="margin-left: 0.8rem"
|
||||
>
|
||||
<template #icon><load-icon /></template>
|
||||
</t-button>
|
||||
</div>
|
||||
</div>
|
||||
<t-base-table
|
||||
rowKey="Id"
|
||||
:data="studentList"
|
||||
:columns="studentColumns"
|
||||
:hover="true"
|
||||
:pagination="pagination"
|
||||
cellEmptyContent="-"
|
||||
lazy-load
|
||||
@row-click="handleRowClick"
|
||||
@page-change="onPageChange"
|
||||
:loading="loading"
|
||||
max-height="550"
|
||||
>
|
||||
<template #operation="{ row }">
|
||||
<t-button
|
||||
theme="default"
|
||||
variant="text"
|
||||
size="small"
|
||||
@click="Modify(row)"
|
||||
>修改</t-button
|
||||
>
|
||||
<t-popconfirm content="确认删除吗" @confirm="Delete(row)">
|
||||
<t-button theme="default" variant="text" size="small"
|
||||
>删除</t-button
|
||||
>
|
||||
</t-popconfirm>
|
||||
</template>
|
||||
</t-base-table>
|
||||
</t-content>
|
||||
</t-layout>
|
||||
|
||||
<t-space>
|
||||
<t-dialog
|
||||
v-model:visible="visible"
|
||||
header="学生变动处理"
|
||||
width="40%"
|
||||
:confirm-on-enter="true"
|
||||
:on-cancel="onCancel"
|
||||
:on-esc-keydown="onEscKeydown"
|
||||
:on-close-btn-click="onCloseBtnClick"
|
||||
:on-overlay-click="onOverlayClick"
|
||||
:on-close="close"
|
||||
:on-confirm="onConfirmAnother"
|
||||
ref="postForm"
|
||||
>
|
||||
<t-space direction="vertical" style="width: 100%">
|
||||
<div>
|
||||
<t-form
|
||||
ref="form"
|
||||
:data="dialogData"
|
||||
reset-type="initial"
|
||||
colon
|
||||
@reset="onReset"
|
||||
>
|
||||
<t-form-item label="姓名" name="name">
|
||||
<t-input v-model="dialogData.name"></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="性别" name="gender">
|
||||
<t-input v-model="dialogData.gender"></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="学号" name="studentId">
|
||||
<t-input v-model="dialogData.studentId"></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="系院" name="department">
|
||||
<t-input v-model="dialogData.department"></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="专业" name="major">
|
||||
<t-input v-model="dialogData.major"></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item label="班级" name="classes">
|
||||
<t-input v-model="dialogData.classes"></t-input>
|
||||
</t-form-item>
|
||||
<t-form-item
|
||||
label="状态"
|
||||
name="status"
|
||||
:span="12"
|
||||
style="width: 16rem; margin-bottom: 0.5rem"
|
||||
>
|
||||
<t-select
|
||||
v-model="dialogData.status"
|
||||
clearable
|
||||
placeholder="请选择状态"
|
||||
>
|
||||
<t-option
|
||||
v-for="item in status"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</t-select>
|
||||
</t-form-item>
|
||||
</t-form>
|
||||
</div>
|
||||
</t-space>
|
||||
</t-dialog>
|
||||
</t-space>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, onMounted } from "vue";
|
||||
import { getList, getStudents, updateStudent } from "@/api/students";
|
||||
// import {reqStudent} from "@/api/students";
|
||||
import { MessagePlugin } from "tdesign-vue-next";
|
||||
import { useRouter } from "vue-router";
|
||||
import { AddIcon, LoadIcon } from "tdesign-icons-vue-next";
|
||||
// import { reqStudent } from "@/api/students";
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const studentData = ref({
|
||||
Id: "",
|
||||
name: "",
|
||||
gender: "",
|
||||
studentId: "",
|
||||
department: "",
|
||||
major: "",
|
||||
classes: "",
|
||||
status: "",
|
||||
});
|
||||
|
||||
// 弹出框表单
|
||||
const dialogData = ref({
|
||||
name: "",
|
||||
gender: "",
|
||||
studentId: "",
|
||||
department: "",
|
||||
major: "",
|
||||
classes: "",
|
||||
status: "",
|
||||
});
|
||||
|
||||
const visible = ref(false);
|
||||
const studentList = ref([]);
|
||||
|
||||
const studentColumns = ref([
|
||||
{
|
||||
colKey: "Id",
|
||||
title: "序号",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "name",
|
||||
title: "姓名",
|
||||
align: "center",
|
||||
width: "100",
|
||||
|
||||
},
|
||||
{
|
||||
colKey: "gender",
|
||||
title: "性别",
|
||||
align: "center",
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
colKey: "studentId",
|
||||
title: "学号",
|
||||
align: "center",
|
||||
width: "150",
|
||||
},
|
||||
{
|
||||
colKey: "department",
|
||||
title: "系院",
|
||||
align: "center",
|
||||
width: "150",
|
||||
},
|
||||
{
|
||||
colKey: "major",
|
||||
title: "专业",
|
||||
align: "center",
|
||||
width: "150",
|
||||
},
|
||||
{
|
||||
colKey: "classes",
|
||||
title: "班级",
|
||||
align: "center",
|
||||
width: "150",
|
||||
},
|
||||
{
|
||||
colKey: "status",
|
||||
title: "状态",
|
||||
align: "center",
|
||||
width: "150",
|
||||
},
|
||||
{
|
||||
colKey: "operation",
|
||||
title: "操作",
|
||||
align: "center",
|
||||
width: "150",
|
||||
},
|
||||
]);
|
||||
|
||||
const pagination = ref({
|
||||
defaultCurrent: 1,
|
||||
defaultPageSize: 10,
|
||||
total: 0,
|
||||
});
|
||||
|
||||
//表单提交
|
||||
const onSubmit = async () => {
|
||||
if (
|
||||
studentData.Id ||
|
||||
studentData.name ||
|
||||
studentData.gender ||
|
||||
studentData.studentId ||
|
||||
studentData.department ||
|
||||
studentData.major ||
|
||||
studentData.classes ||
|
||||
studentData.status
|
||||
) {
|
||||
const res = await getStudents(studentData);
|
||||
// console.log(res);
|
||||
studentList.value = Array.from(res);
|
||||
pagination.total = res.length;
|
||||
} else {
|
||||
alert("请填写完整信息");
|
||||
}
|
||||
};
|
||||
|
||||
//表单重置
|
||||
const onReset = () => {
|
||||
TableData();
|
||||
};
|
||||
|
||||
const status = ref([
|
||||
{ label: "休学", value: 0 },
|
||||
{ label: "退学", value: 1 },
|
||||
{ label: "复学", value: 2 },
|
||||
]);
|
||||
|
||||
//获取表格数据
|
||||
const TableData = async () => {
|
||||
const res = await getList();
|
||||
// console.log(res);
|
||||
studentList.value = res.data.list;
|
||||
pagination.value.total = res.data.list.length;
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
TableData();
|
||||
});
|
||||
|
||||
// 修改学生状态
|
||||
const Modify = (row) => {
|
||||
console.log("点击了确认按钮,弹出弹窗", row);
|
||||
visible.value = true;
|
||||
dialogData.value = {
|
||||
...row
|
||||
};
|
||||
};
|
||||
|
||||
const onAddSubmit = async ({ validateResult, firstError }) => {
|
||||
if (validateResult === true) {
|
||||
await TableData.addStockList(dialogData.value);
|
||||
getNewTable();
|
||||
MessagePlugin.success("提交成功");
|
||||
visible.value = false;
|
||||
} else {
|
||||
console.log("Validate Errors: ", firstError, validateResult);
|
||||
}
|
||||
};
|
||||
// const onConfirmAnother = async () => {
|
||||
// console.log("点击了确认按钮", );
|
||||
// visible.value = false;
|
||||
// await updateStudent(dialogData.value)
|
||||
// };
|
||||
|
||||
const onConfirmAnother = async () => {
|
||||
// const index = studentList.value.findIndex((item)=> item.Id === .Id)
|
||||
// await aaa(dialogData.value)
|
||||
// TableData()
|
||||
// if (index !== -1) {
|
||||
// studentList.value.splice(index,dialogData.value)
|
||||
|
||||
// }else{
|
||||
// console.log(11111);
|
||||
// }
|
||||
|
||||
|
||||
|
||||
|
||||
// console.log("点击了确认按钮" ,studentId);
|
||||
// // 准备要更新的数据
|
||||
// const studentId = dialogData.value.studentId;
|
||||
// // 调用更新学生信息的接口
|
||||
// try {
|
||||
// const response = await updateStudent({ ...dialogData.value, studentId });
|
||||
// // 检查接口返回结果是否成功
|
||||
// if (response) {
|
||||
// // 同步更新表格数据(这部分逻辑已在之前的解答中给出)
|
||||
// const index = studentList.value.findIndex(
|
||||
// (stu) => stu.studentId === studentId
|
||||
// );
|
||||
// if (index !== -1) {
|
||||
// studentList.value.splice(index, 1, dialogData.value);
|
||||
// }
|
||||
|
||||
// MessagePlugin.success("学生信息更新成功");
|
||||
// } else {
|
||||
// MessagePlugin.error(response.message || "学生信息更新失败");
|
||||
// }
|
||||
// } catch (error) {
|
||||
// console.error("更新学生信息时发生错误", error);
|
||||
// MessagePlugin.error("学生信息更新失败");
|
||||
// }
|
||||
// 关闭对话框
|
||||
visible.value = false;
|
||||
};
|
||||
|
||||
const Delete = async (row) => {
|
||||
try {
|
||||
// 调用删除学生的API,这里假设后端接口名为deleteStudent,且需要学生ID作为参数
|
||||
const response = await deleteStudent(row.studentId);
|
||||
|
||||
if (response.success) {
|
||||
// 删除表格数据中对应的学生记录
|
||||
const index = studentList.value.findIndex((stu) => stu.studentId === row.studentId);
|
||||
if (index !== -1) {
|
||||
studentList.value.splice(index, 1);
|
||||
}
|
||||
|
||||
pagination.total -= 1;
|
||||
|
||||
// 提示删除成功
|
||||
MessagePlugin.success('学生信息删除成功');
|
||||
} else {
|
||||
// 提示删除失败
|
||||
MessagePlugin.error(response.message || '学生信息删除失败');
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('删除学生信息时发生错误', error);
|
||||
MessagePlugin.error('学生信息删除失败');
|
||||
}
|
||||
};
|
||||
|
||||
const close = (context) => {
|
||||
console.log("关闭弹窗,点击关闭按钮、按下ESC、点击蒙层等触发", context);
|
||||
};
|
||||
const onCancel = (context) => {
|
||||
console.log("点击了取消按钮", context);
|
||||
};
|
||||
const onEscKeydown = (context) => {
|
||||
console.log("按下了ESC", context);
|
||||
};
|
||||
const onCloseBtnClick = (context) => {
|
||||
console.log("点击了关闭按钮", context);
|
||||
};
|
||||
const onOverlayClick = (context) => {
|
||||
console.log("点击了蒙层", context);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.scarch-box {
|
||||
width: 100%;
|
||||
background-color: @base-white-color;
|
||||
margin-bottom: 2rem;
|
||||
.scarch-from {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.table-box {
|
||||
height: 42rem;
|
||||
background-color: @base-white-color;
|
||||
padding: 1rem;
|
||||
padding-top: 0;
|
||||
.table-header {
|
||||
height: 3rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
:deep(.t-form__controls-content) {
|
||||
justify-content: space-between;
|
||||
}
|
||||
</style>
|
|
@ -1,44 +1,23 @@
|
|||
import { createRouter, createWebHistory } from "vue-router";
|
||||
import FinanceBillManage from "./modules/financeBillManage";
|
||||
import ReceivablesManagement from "./modules/receivablesManagement";
|
||||
import StudentManage from "./modules/studentManage";
|
||||
import Login from "@/pages/login/index.vue";
|
||||
import Password from "@/pages/password/index.vue";
|
||||
import { createRouter, createWebHistory } from 'vue-router'
|
||||
import HomeView from '../views/HomeView.vue'
|
||||
|
||||
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: '/',
|
||||
name: 'home',
|
||||
component: HomeView
|
||||
},
|
||||
{
|
||||
path: "/login",
|
||||
name: "login",
|
||||
component: Login,
|
||||
},
|
||||
{
|
||||
path: "/password-reset",
|
||||
name: "password",
|
||||
component: Password,
|
||||
},
|
||||
...FinanceBillManage,
|
||||
...ReceivablesManagement,
|
||||
...StudentManage,
|
||||
],
|
||||
});
|
||||
path: '/about',
|
||||
name: 'about',
|
||||
// route level code-splitting
|
||||
// this generates a separate chunk (About.[hash].js) for this route
|
||||
// which is lazy-loaded when the route is visited.
|
||||
component: () => import('../views/AboutView.vue')
|
||||
}
|
||||
]
|
||||
})
|
||||
|
||||
export default router;
|
||||
export default router
|
||||
|
|
|
@ -1,95 +0,0 @@
|
|||
import Layout from "@/layout/index.vue";
|
||||
import BillStockURL from "@/pages/finance-bill-manage/billStock.vue";
|
||||
import BillCancelURL from "@/pages/finance-bill-manage/billCancel.vue";
|
||||
import BillReceiptURL from "@/pages/finance-bill-manage/billReceipt.vue";
|
||||
import BillQuitneckURL from "@/pages/finance-bill-manage/billQuitneck.vue";
|
||||
import BillBreakagekURL from "@/pages/finance-bill-manage/billBreakage.vue";
|
||||
import BillDestroyURL from "@/pages/finance-bill-manage/billDestroy.vue";
|
||||
import DetailReportURL from "@/pages/finance-bill-manage/detailReport.vue";
|
||||
import BillDrawURL from "@/pages/finance-bill-manage/billDraw.vue";
|
||||
import dragUrl from "@/pages/finance-bill-manage/drag.vue";
|
||||
|
||||
const financeBillManage = [
|
||||
{
|
||||
path: "/Bill",
|
||||
name: "bill",
|
||||
component: Layout,
|
||||
meta: { title: "票据管理", name: "resource" },
|
||||
children: [
|
||||
{
|
||||
path: "BillStock",
|
||||
name: "billStock",
|
||||
component: BillStockURL,
|
||||
meta: {
|
||||
title: "票据上传",
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "BillCancel",
|
||||
name: "billCancel",
|
||||
component: BillCancelURL,
|
||||
meta: {
|
||||
title: "票据退库",
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "BillReceipt",
|
||||
name: "billReceipt",
|
||||
component: BillReceiptURL,
|
||||
meta: {
|
||||
title: "票据领用",
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "BillQuitneck",
|
||||
name: "billQuitneck",
|
||||
component: BillQuitneckURL,
|
||||
meta: {
|
||||
title: "票据退领",
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "BillBreakagek",
|
||||
name: "billBreakagek",
|
||||
component: BillBreakagekURL,
|
||||
meta: {
|
||||
title: "票据报损",
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "BillDestroy",
|
||||
name: "billDestroy",
|
||||
component: BillDestroyURL,
|
||||
meta: {
|
||||
title: "票据核销",
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "DetailReport",
|
||||
name: "detailReport",
|
||||
component: DetailReportURL,
|
||||
meta: {
|
||||
title: "报表明细",
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "BillDraw",
|
||||
name: "billDraw",
|
||||
component: BillDrawURL,
|
||||
meta: {
|
||||
title: "报表明细",
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "drag",
|
||||
name: "drag",
|
||||
component: dragUrl,
|
||||
meta: {
|
||||
title: "拖拽效果",
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
export default financeBillManage;
|
|
@ -1,93 +0,0 @@
|
|||
import Layout from "@/layout/index.vue";
|
||||
|
||||
const ReceivablesManagement = [
|
||||
{
|
||||
path: "/accounts",
|
||||
meta: { title: "应收款管理", name: "accounts" },
|
||||
component: Layout,
|
||||
children: [
|
||||
{
|
||||
path: "/accounts",
|
||||
name: "Accounts",
|
||||
component: () => import("@/pages/receivables-management/accountReceivable.vue"),
|
||||
meta: {
|
||||
title: "应收款管理",
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/billCollected",
|
||||
name: "BillCollected",
|
||||
component: () => import("@/pages/receivables-management/billCollected.vue"),
|
||||
meta: { title: "票据收款", },
|
||||
},
|
||||
{
|
||||
path: "/bill-bill",
|
||||
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: "助学贷款", },
|
||||
},
|
||||
{
|
||||
path: "/waivar-form",
|
||||
name: "WaivarForm",
|
||||
component: () => import("@/pages/receivables-management/waiverForm.vue"),
|
||||
meta: { title: "学生减免单", hidden: false },
|
||||
},
|
||||
{
|
||||
path: "/daily",
|
||||
name: "Daily",
|
||||
component: () => import("@/pages/receivables-management/daily.vue"),
|
||||
meta: { title: "收费日报及收费明细", },
|
||||
},
|
||||
{
|
||||
path: "/charge-schedule",
|
||||
name: "ChargeSchedule",
|
||||
component: () => import("@/pages/receivables-management/chargeSchedule.vue"),
|
||||
meta: { title: "学生催款单", },
|
||||
},
|
||||
{
|
||||
path: "/faculty-analysis",
|
||||
name: "FacultyAnalysis",
|
||||
component: () => import("@/pages/receivables-management/facultyAnalysis.vue"),
|
||||
meta: { title: "部门分析表", },
|
||||
},
|
||||
{
|
||||
path: "/student-information",
|
||||
name: "StudentInformation",
|
||||
component: () => import("@/pages/receivables-management/studentInformation.vue"),
|
||||
meta: { title: "学生信息统计表", },
|
||||
},
|
||||
{
|
||||
path: "/mitigate",
|
||||
name: "Mitigate",
|
||||
component: () => import("@/pages/receivables-management/Mitigate.vue"),
|
||||
meta: { title: "学生减免明细表", },
|
||||
},
|
||||
{
|
||||
path: "/return-premium",
|
||||
name: "ReturnPremium",
|
||||
component: () => import("@/pages/receivables-management/returnPremium.vue"),
|
||||
meta: { title: "学生退费明细表", },
|
||||
},
|
||||
{
|
||||
path: "/rrrearage",
|
||||
name: "Arrearage",
|
||||
component: () => import("@/pages/receivables-management/Arrearage.vue"),
|
||||
meta: { title: "学生欠费明细表", },
|
||||
},
|
||||
{
|
||||
path: "/shi-yan",
|
||||
name: "Shiyan",
|
||||
component: () => import("@/pages/receivables-management/ShiYan.vue"),
|
||||
meta: { title: "实验", },
|
||||
}
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
export default ReceivablesManagement;
|
|
@ -1,24 +0,0 @@
|
|||
import Layout from "@/layout/index.vue";
|
||||
// import studentURL from "@/pages/students/student";
|
||||
import studentURL from "@/pages/students/student.vue";
|
||||
|
||||
const financeBillManage = [
|
||||
{
|
||||
path: "/Student",
|
||||
name: "student",
|
||||
component: Layout,
|
||||
meta: { title: "学生", name: "resource" },
|
||||
children: [
|
||||
{
|
||||
path: "/Students",
|
||||
name: "students",
|
||||
component: studentURL,
|
||||
meta: {
|
||||
title: "学生管理",
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
export default financeBillManage;
|
|
@ -1,36 +0,0 @@
|
|||
import { defineStore } from "pinia";
|
||||
import { reqBreakageList } from "@/api/finance-bill-manage/breakageList";
|
||||
|
||||
export const useBreakage = defineStore("breakageList", {
|
||||
state: () => {
|
||||
return {
|
||||
breakageList: [],
|
||||
destroyList: [],
|
||||
};
|
||||
},
|
||||
actions: {
|
||||
async getBreakageList() {
|
||||
let { data } = await reqBreakageList();
|
||||
this.breakageList = data.list;
|
||||
return this.breakageList;
|
||||
},
|
||||
addBreakageList(arr) {
|
||||
const index = this.breakageList.findIndex((item) => item.id === arr.id);
|
||||
if (index !== -1) {
|
||||
this.breakageList[index] = arr;
|
||||
} else {
|
||||
arr.id = new Date().getTime();
|
||||
this.breakageList.unshift(arr);
|
||||
localStorage.setItem("breakageList", JSON.stringify(this.breakageList));
|
||||
}
|
||||
this.destroyList.push(arr);
|
||||
localStorage.setItem("destroyList", JSON.stringify(this.breakageList));
|
||||
return this.breakageList;
|
||||
},
|
||||
deleteBreakageList(item) {
|
||||
let arr = this.breakageList.filter((i) => i.id !== item.id);
|
||||
this.breakageList = arr;
|
||||
},
|
||||
},
|
||||
persist: true,
|
||||
});
|
|
@ -1,28 +0,0 @@
|
|||
import { defineStore } from "pinia";
|
||||
import { reqCancelList } from "@/api/finance-bill-manage/cancelList";
|
||||
|
||||
export const useCancel = defineStore("CancelList", {
|
||||
state: () => {
|
||||
return {
|
||||
cancelList: [],
|
||||
};
|
||||
},
|
||||
actions: {
|
||||
async getCancelList() {
|
||||
let { data } = await reqCancelList();
|
||||
this.cancelList = data.list;
|
||||
return this.cancelList;
|
||||
},
|
||||
editApprovalStatus(arr) {
|
||||
const index = this.cancelList.findIndex((item) => item.id === arr.row.id);
|
||||
if (index !== -1) {
|
||||
this.cancelList[index] = arr.row;
|
||||
}
|
||||
},
|
||||
deleteCancelList(item) {
|
||||
let arr = this.cancelList.filter((i) => i.id !== item.id);
|
||||
this.cancelList = arr;
|
||||
},
|
||||
},
|
||||
persist: true,
|
||||
});
|
|
@ -1,35 +0,0 @@
|
|||
import { defineStore } from "pinia";
|
||||
|
||||
export const useDestroy = defineStore("destroyList", {
|
||||
state: () => {
|
||||
return {
|
||||
destroyList: [],
|
||||
};
|
||||
},
|
||||
actions: {
|
||||
async getDestroyList() {
|
||||
const storedData = localStorage.getItem("breakageList");
|
||||
if (storedData) {
|
||||
const parsedData = JSON.parse(storedData);
|
||||
this.destroyList = parsedData.destroyList;
|
||||
}
|
||||
return this.destroyList;
|
||||
},
|
||||
auditDestroyList(item) {
|
||||
const storedData = localStorage.getItem("breakageList");
|
||||
if (storedData) {
|
||||
const parsedData = JSON.parse(storedData);
|
||||
parsedData.destroyList = parsedData.destroyList.filter((i) => i.id !== item.id);
|
||||
parsedData.breakageList = parsedData.breakageList.map((i) => {
|
||||
if (i.id === item.id) {
|
||||
return { ...i, breakStatus: item.breakStatus }; // 返回更新后的对象
|
||||
}
|
||||
return i; // 保持其他项不变
|
||||
});
|
||||
localStorage.setItem("breakageList", JSON.stringify(parsedData));
|
||||
this.destroyList = parsedData.destroyList; // 更新store中的destroyList状态
|
||||
}
|
||||
},
|
||||
},
|
||||
persist: true,
|
||||
});
|
|
@ -1,56 +0,0 @@
|
|||
import { defineStore } from "pinia";
|
||||
|
||||
export const useQuitneckList = defineStore("QuitneckList", {
|
||||
state: () => {
|
||||
return {
|
||||
sdyList: [],
|
||||
ycyList: [],
|
||||
lczList: [],
|
||||
lxyList: [],
|
||||
};
|
||||
},
|
||||
actions: {
|
||||
getQuitneckList(name) {
|
||||
this.sdyList = [];
|
||||
this.ycyList = [];
|
||||
this.lczList = [];
|
||||
this.lxyList = [];
|
||||
const allArr = JSON.parse(
|
||||
localStorage.getItem("ReceiptList")
|
||||
).quitneckList;
|
||||
if (name === "孙东宇") {
|
||||
allArr.forEach((item) => {
|
||||
if (item.proposer === "孙东宇") {
|
||||
this.sdyList.push(item);
|
||||
}
|
||||
});
|
||||
return this.sdyList;
|
||||
}
|
||||
if (name === "杨春宇") {
|
||||
allArr.forEach((item) => {
|
||||
if (item.proposer === "杨春宇") {
|
||||
this.ycyList.push(item);
|
||||
}
|
||||
});
|
||||
return this.ycyList;
|
||||
}
|
||||
if (name === "吕才卓") {
|
||||
allArr.forEach((item) => {
|
||||
if (item.proposer === "吕才卓") {
|
||||
this.lczList.push(item);
|
||||
}
|
||||
});
|
||||
return this.lczList;
|
||||
}
|
||||
if (name === "刘欣宇") {
|
||||
allArr.forEach((item) => {
|
||||
if (item.proposer === "刘欣宇") {
|
||||
this.lxyList.push(item);
|
||||
}
|
||||
});
|
||||
return this.lxyList;
|
||||
}
|
||||
},
|
||||
},
|
||||
persist: true,
|
||||
});
|
|
@ -1,33 +0,0 @@
|
|||
import { defineStore } from "pinia";
|
||||
import { reqPersonName, reqReceiptList } from "@/api/finance-bill-manage/receiptList";
|
||||
|
||||
export const useReceiptList = defineStore("ReceiptList", {
|
||||
state: () => {
|
||||
return {
|
||||
personName: [],
|
||||
receiptList: [],
|
||||
quitneckList: [],
|
||||
};
|
||||
},
|
||||
actions: {
|
||||
async getPersonNameList() {
|
||||
const { data } = await reqPersonName();
|
||||
this.personName = data;
|
||||
return this.personName;
|
||||
},
|
||||
|
||||
async getReceiptList(obj) {
|
||||
const { data } = await reqReceiptList(obj);
|
||||
this.receiptList = data;
|
||||
return this.receiptList;
|
||||
},
|
||||
async getquitneckNum(obj) {
|
||||
const index = this.receiptList.findIndex((item) => item.id === obj.id);
|
||||
if (index !== -1) {
|
||||
this.receiptList[index].receiptNum = this.receiptList[index].receiptNum - obj.quitneckNum;
|
||||
}
|
||||
this.quitneckList.push(obj);
|
||||
},
|
||||
},
|
||||
persist: true,
|
||||
});
|
|
@ -1,33 +0,0 @@
|
|||
import { defineStore } from "pinia";
|
||||
import { reqStockList } from "@/api/finance-bill-manage/stockList";
|
||||
|
||||
export const useStock = defineStore("menuManagement", {
|
||||
state: () => {
|
||||
return {
|
||||
stockList: [],
|
||||
};
|
||||
},
|
||||
actions: {
|
||||
async getStockList() {
|
||||
let { data } = await reqStockList();
|
||||
this.stockList = data.list;
|
||||
return this.stockList;
|
||||
},
|
||||
addStockList(arr) {
|
||||
const index = this.stockList.findIndex((item) => item.id === arr.id);
|
||||
if (index !== -1) {
|
||||
this.stockList[index] = arr;
|
||||
} else {
|
||||
arr.id = new Date().getTime();
|
||||
this.stockList.unshift(arr);
|
||||
localStorage.setItem("stockList", JSON.stringify(this.stockList));
|
||||
}
|
||||
return this.stockList;
|
||||
},
|
||||
deleteStockList(item) {
|
||||
let arr = this.stockList.filter((i) => i.id !== item.id);
|
||||
this.stockList = arr;
|
||||
},
|
||||
},
|
||||
persist: true,
|
||||
});
|
|
@ -1,9 +0,0 @@
|
|||
import { createPinia } from "pinia";
|
||||
import piniaPluginPersistedstate from "pinia-plugin-persistedstate";
|
||||
|
||||
const pinia = createPinia();
|
||||
pinia.use(piniaPluginPersistedstate);
|
||||
|
||||
export { store };
|
||||
|
||||
export default store;
|
|
@ -1,211 +0,0 @@
|
|||
/**
|
||||
* ENGINE
|
||||
* v0.2 | 20150615
|
||||
* License: none (public domain)
|
||||
*/
|
||||
*,
|
||||
*:after,
|
||||
*:before {
|
||||
box-sizing: border-box;
|
||||
outline: none;
|
||||
}
|
||||
html,
|
||||
body,
|
||||
div,
|
||||
span,
|
||||
applet,
|
||||
object,
|
||||
iframe,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
p,
|
||||
blockquote,
|
||||
pre,
|
||||
a,
|
||||
abbr,
|
||||
acronym,
|
||||
address,
|
||||
big,
|
||||
cite,
|
||||
code,
|
||||
del,
|
||||
dfn,
|
||||
em,
|
||||
img,
|
||||
ins,
|
||||
kbd,
|
||||
q,
|
||||
s,
|
||||
samp,
|
||||
small,
|
||||
strike,
|
||||
strong,
|
||||
sub,
|
||||
sup,
|
||||
tt,
|
||||
var,
|
||||
b,
|
||||
u,
|
||||
i,
|
||||
center,
|
||||
dl,
|
||||
dt,
|
||||
dd,
|
||||
ol,
|
||||
ul,
|
||||
li,
|
||||
fieldset,
|
||||
form,
|
||||
label,
|
||||
legend,
|
||||
table,
|
||||
caption,
|
||||
tbody,
|
||||
tfoot,
|
||||
thead,
|
||||
tr,
|
||||
th,
|
||||
td,
|
||||
article,
|
||||
aside,
|
||||
canvas,
|
||||
details,
|
||||
embed,
|
||||
figure,
|
||||
figcaption,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
output,
|
||||
ruby,
|
||||
section,
|
||||
summary,
|
||||
time,
|
||||
mark,
|
||||
audio,
|
||||
video {
|
||||
font: inherit;
|
||||
font-size: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
vertical-align: baseline;
|
||||
border: 0;
|
||||
}
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
section {
|
||||
display: block;
|
||||
}
|
||||
body {
|
||||
line-height: 1;
|
||||
}
|
||||
ol,
|
||||
ul {
|
||||
list-style: none;
|
||||
}
|
||||
blockquote,
|
||||
q {
|
||||
quotes: none;
|
||||
}
|
||||
blockquote:before,
|
||||
q:before,
|
||||
blockquote:after,
|
||||
q:after {
|
||||
content: '';
|
||||
content: none;
|
||||
}
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
table {
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
input,
|
||||
textarea,
|
||||
button {
|
||||
font-family: inhert;
|
||||
font-size: inherit;
|
||||
color: inherit;
|
||||
}
|
||||
select {
|
||||
text-indent: 0.01px;
|
||||
text-overflow: '';
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
}
|
||||
select::-ms-expand {
|
||||
display: none;
|
||||
}
|
||||
code,
|
||||
pre {
|
||||
font-family: monospace, monospace;
|
||||
font-size: 1em;
|
||||
}
|
||||
::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
}
|
||||
::-webkit-scrollbar-track {
|
||||
width: 10px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
border-radius: 8px;
|
||||
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
||||
background: #e5e5e5;
|
||||
}
|
||||
.t-default-menu__inner .t-menu--scroll {
|
||||
background-image: linear-gradient(#fff, rgba(146, 146, 255, 0.2));
|
||||
}
|
||||
.back-color {
|
||||
background-color: #f5f7fb;
|
||||
padding: 16px 24px;
|
||||
height: calc(96vh - 64px);
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
a,
|
||||
a:link,
|
||||
a:visited,
|
||||
a:hover,
|
||||
a:active {
|
||||
text-decoration: none;
|
||||
}
|
||||
.t-button--variant-text .t-button__text {
|
||||
color: #0052d9;
|
||||
}
|
||||
.t-button--variant-text .t-button__text:hover {
|
||||
color: #8799a3;
|
||||
}
|
||||
.t-is-disabled .t-button__text {
|
||||
color: #d3d3d3 !important;
|
||||
}
|
||||
.form-item-width {
|
||||
width: 100%;
|
||||
}
|
|
@ -1,60 +0,0 @@
|
|||
// 引入清除模式样式
|
||||
@import './reset.less';
|
||||
@import './variables.less';
|
||||
|
||||
// 滚动条外观样式
|
||||
::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
width: 10px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
border-radius: 8px;
|
||||
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
||||
background: @base-scrollbar-color;
|
||||
}
|
||||
|
||||
.t-default-menu__inner .t-menu--scroll {
|
||||
background-image: linear-gradient(#fff, rgba(146, 146, 255, 0.2));
|
||||
}
|
||||
|
||||
// 主体背景颜色以及大小
|
||||
.back-color {
|
||||
background-color: #f5f7fb;
|
||||
padding: 16px 24px;
|
||||
height: calc(96vh - 64px);
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
// 去除a标签默认样式
|
||||
a,
|
||||
a:link,
|
||||
a:visited,
|
||||
a:hover,
|
||||
a:active {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
// 改变文字按钮的颜色
|
||||
.t-button--variant-text .t-button__text {
|
||||
color: @base-text-color;
|
||||
}
|
||||
|
||||
// 改变文字按钮移入的颜色
|
||||
.t-button--variant-text .t-button__text:hover {
|
||||
color: #8799a3;
|
||||
}
|
||||
// 禁用的颜色
|
||||
.t-is-disabled .t-button__text{
|
||||
color: #d3d3d3 !important;
|
||||
}
|
||||
|
||||
// 查询框宽度
|
||||
.form-item-width {
|
||||
width: 100%;
|
||||
}
|
|
@ -168,3 +168,16 @@ pre {
|
|||
font-family: monospace, monospace;
|
||||
font-size: 1em;
|
||||
}
|
||||
#app {
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
padding: 2rem;
|
||||
font-weight: normal;
|
||||
}
|
||||
a,
|
||||
.green {
|
||||
text-decoration: none;
|
||||
color: hsl(160, 100%, 37%);
|
||||
transition: 0.4s;
|
||||
padding: 3px;
|
||||
}
|
|
@ -185,4 +185,18 @@
|
|||
pre {
|
||||
font-family: monospace, monospace;
|
||||
font-size: 1em;
|
||||
}
|
||||
}
|
||||
#app {
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
padding: 2rem;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
a,
|
||||
.green {
|
||||
text-decoration: none;
|
||||
color: hsla(160, 100%, 37%, 1);
|
||||
transition: 0.4s;
|
||||
padding: 3px;
|
||||
}
|
|
@ -1,14 +0,0 @@
|
|||
// 设置less全局变量
|
||||
|
||||
// 左侧的菜单的宽度
|
||||
@base-menu-width: 260px;
|
||||
// 左侧菜单的背景颜色
|
||||
@base-menu-background: rgb(229, 229, 229);
|
||||
// 顶部导航高度b
|
||||
@base-tabbar-height: 50px;
|
||||
// 公用颜色
|
||||
@base-white-color: #fff;
|
||||
// text按钮的颜色
|
||||
@base-text-color: #0052d9;
|
||||
// 滚动条的颜色
|
||||
@base-scrollbar-color: rgb(229, 229, 229);
|
|
@ -1,24 +0,0 @@
|
|||
import ExcelJS from "exceljs";
|
||||
import saveAs from "file-saver"; // 引入FileSaver.js以使用saveAs函数
|
||||
|
||||
const ExcelUtils = (title, titleFile, columns, addRow) => {
|
||||
// 创建一个新的工作簿
|
||||
const workbook = new ExcelJS.Workbook();
|
||||
// 添加一个新的工作表
|
||||
const worksheet = workbook.addWorksheet(title);
|
||||
// 添加表头
|
||||
worksheet.columns = columns;
|
||||
// 添加数据行
|
||||
for (const row of addRow) {
|
||||
worksheet.addRow(row);
|
||||
}
|
||||
// 写入文件并下载
|
||||
workbook.xlsx.writeBuffer().then((buffer) => {
|
||||
const blob = new Blob([buffer], {
|
||||
type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
|
||||
});
|
||||
saveAs(blob, `${titleFile}.xlsx`);
|
||||
});
|
||||
};
|
||||
|
||||
export { ExcelUtils };
|
|
@ -1,20 +0,0 @@
|
|||
import pdfMake from "pdfmake/build/pdfmake";
|
||||
import pdfFonts from "pdfmake/build/vfs_fonts";
|
||||
|
||||
pdfMake.vfs = pdfFonts.pdfMake.vfs;
|
||||
|
||||
export const exportToPDF = (content) => {
|
||||
const docDefinition = {
|
||||
pageSize: "A4",
|
||||
pageMargins: [40, 70, 40, 90],
|
||||
content: content,
|
||||
styles: {
|
||||
header: { fontSize: 16, bold: true },
|
||||
label: { fontSize: 12, bold: true },
|
||||
value: { fontSize: 12 },
|
||||
tableHeader: { fontSize: 12, bold: true, color: "#666" },
|
||||
footer: { fontSize: 10, italics: true },
|
||||
},
|
||||
};
|
||||
pdfMake.createPdf(docDefinition).download("output.pdf");
|
||||
};
|
|
@ -1,72 +0,0 @@
|
|||
// 进行axios二次封装:使用请求与响应拦截器
|
||||
import axios from "axios";
|
||||
import { MessagePlugin } from "tdesign-vue-next";
|
||||
|
||||
// import { refreshToken } from '@/apis/token'
|
||||
// import { useTokenStore } from '@/stores/index'
|
||||
// 第一步:利用axios对象的create方法,去创建axios实例(其他的配置:基础的路径、超时的时间)
|
||||
const request = axios.create({
|
||||
baseURL: "/", // 基础路径上会携带/api
|
||||
timeout: 5000, // 超时的时间的设置
|
||||
});
|
||||
// 第二步:axios实例添加请求与响应拦截器
|
||||
request.interceptors.request.use((config) => {
|
||||
// config配置对象,headers属性请求头,经常给服务器端携带公共参数
|
||||
// 返回配置对象
|
||||
// const { token } = useTokenStore()
|
||||
// if (token) {
|
||||
// config.headers.Authorization = `Bearer ${token}`
|
||||
// }
|
||||
return config;
|
||||
});
|
||||
|
||||
// 第三步:axios响应拦截器
|
||||
request.interceptors.response.use(
|
||||
(response) => {
|
||||
// 成功回调
|
||||
// 简化数据
|
||||
return response.data;
|
||||
},
|
||||
async (error) => {
|
||||
// 失败回调:处理http网络错误的
|
||||
// 定义一个变量:存储网络错误信息
|
||||
let message = "";
|
||||
const { status } = error.response;
|
||||
// http状态码
|
||||
switch (status) {
|
||||
case 401:
|
||||
// try {
|
||||
// const tokenStore = useTokenStore()
|
||||
// const refreshedTokenData = await refreshToken(tokenStore.refreshToken)
|
||||
// if (refreshedTokenData && refreshedTokenData.data.token) {
|
||||
// tokenStore.setToken(refreshedTokenData.data.token)
|
||||
// const originalRequest = error.config
|
||||
// originalRequest.headers.Authorization = `Bearer ${refreshedTokenData.data.token}`
|
||||
// return request(originalRequest)
|
||||
// }
|
||||
// } catch (error) {
|
||||
// const tokenStore = useTokenStore()
|
||||
// tokenStore.clearToken()
|
||||
// useRouter().push('/login')
|
||||
// }
|
||||
break;
|
||||
case 403:
|
||||
message = "无权访问";
|
||||
break;
|
||||
case 404:
|
||||
message = "请求地址错误";
|
||||
break;
|
||||
case 500:
|
||||
message = "服务器出现问题";
|
||||
break;
|
||||
default:
|
||||
message = "网络出现问题";
|
||||
break;
|
||||
}
|
||||
MessagePlugin.error(message);
|
||||
return Promise.reject(error);
|
||||
}
|
||||
);
|
||||
|
||||
// 对外暴露
|
||||
export default request;
|
|
@ -1,51 +0,0 @@
|
|||
// 进行axios二次封装:使用请求与响应拦截器
|
||||
import axios from "axios";
|
||||
import { MessagePlugin } from "tdesign-vue-next";
|
||||
|
||||
// 第一步:利用axios对象的create方法,去创建axios实例(其他的配置:基础的路径、超时的时间)
|
||||
const request = axios.create({
|
||||
baseURL: "/api", // 基础路径上会携带/api
|
||||
timeout: 5000, // 超时的时间的设置
|
||||
});
|
||||
// 第二步:axios实例添加请求与响应拦截器
|
||||
request.interceptors.request.use((config) => {
|
||||
return config;
|
||||
});
|
||||
|
||||
// 第三步:axios响应拦截器
|
||||
request.interceptors.response.use(
|
||||
(response) => {
|
||||
// 成功回调
|
||||
// 简化数据
|
||||
return response.data;
|
||||
},
|
||||
async (error) => {
|
||||
// 失败回调:处理http网络错误的
|
||||
// 定义一个变量:存储网络错误信息
|
||||
let message = "";
|
||||
const { status } = error.response;
|
||||
// http状态码
|
||||
switch (status) {
|
||||
case 401:
|
||||
message = "TOKEN过期";
|
||||
break;
|
||||
case 403:
|
||||
message = "无权访问";
|
||||
break;
|
||||
case 404:
|
||||
message = "请求地址错误";
|
||||
break;
|
||||
case 500:
|
||||
message = "服务器出现问题";
|
||||
break;
|
||||
default:
|
||||
message = "网络出现问题";
|
||||
break;
|
||||
}
|
||||
MessagePlugin.error(message);
|
||||
return Promise.reject(error);
|
||||
}
|
||||
);
|
||||
|
||||
// 对外暴露
|
||||
export default request;
|
|
@ -1,45 +1,34 @@
|
|||
import { fileURLToPath, URL } from "node:url";
|
||||
import path from "path";
|
||||
import { fileURLToPath, URL } from 'node:url'
|
||||
|
||||
import { defineConfig } from "vite";
|
||||
import vue from "@vitejs/plugin-vue";
|
||||
import vueJsx from "@vitejs/plugin-vue-jsx";
|
||||
import { viteMockServe } from "vite-plugin-mock";
|
||||
import { defineConfig } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
import vueJsx from '@vitejs/plugin-vue-jsx'
|
||||
import { viteMockServe } from 'vite-plugin-mock'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
server: {
|
||||
proxy: {
|
||||
"/api": {
|
||||
target: "http://192.168.1.2:8080",
|
||||
changeOrigin: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
plugins: [
|
||||
vue(),
|
||||
vueJsx(),
|
||||
viteMockServe({
|
||||
mockPath: "mock",
|
||||
enable: true,
|
||||
}),
|
||||
mockPath: 'mock',
|
||||
enable: true
|
||||
})
|
||||
],
|
||||
resolve: {
|
||||
alias: {
|
||||
"@": fileURLToPath(new URL("./src", import.meta.url)),
|
||||
},
|
||||
'@': fileURLToPath(new URL('./src', import.meta.url))
|
||||
}
|
||||
},
|
||||
css: {
|
||||
preprocessorOptions: {
|
||||
less: {
|
||||
modifyVars: {
|
||||
hack: `true; @import (reference) "${path.resolve(
|
||||
"src/style/variables.less"
|
||||
)}";`,
|
||||
hack: `true; @import (reference) "${path.resolve('src/style/variables.less')}";`
|
||||
},
|
||||
math: "strict",
|
||||
javascriptEnabled: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
math: 'strict',
|
||||
javascriptEnabled: true
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
Loading…
Reference in New Issue
Block a user