adan
/
dakesheqian
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

完善了router表，前端缺席表格单页化

This commit is contained in:
GitHub 2024-12-27 00:03:41 +08:00
parent ba3d2ae9c9
commit 19cb07d9dd
4 changed files with 87 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
package-lock.json generated
View File

@ -423,6 +423,7 @@
"version": "2.9.1", "version": "2.9.1",
"resolved": "https://registry.npmmirror.com/element-plus/-/element-plus-2.9.1.tgz", "resolved": "https://registry.npmmirror.com/element-plus/-/element-plus-2.9.1.tgz",
"integrity": "sha512-9Agqf/jt4Ugk7EZ6C5LME71sgkvauPCsnvJN12Xid2XVobjufxMGpRE4L7pS4luJMOmFAH3J0NgYEGZT5r+NDg==", "integrity": "sha512-9Agqf/jt4Ugk7EZ6C5LME71sgkvauPCsnvJN12Xid2XVobjufxMGpRE4L7pS4luJMOmFAH3J0NgYEGZT5r+NDg==",
"license": "MIT",
"dependencies": { "dependencies": {
"@ctrl/tinycolor": "^3.4.1", "@ctrl/tinycolor": "^3.4.1",
"@element-plus/icons-vue": "^2.3.1", "@element-plus/icons-vue": "^2.3.1",

17
public/index.html Normal file
View File

@ -0,0 +1,17 @@
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

7
src/router/router.js
View File

@ -64,7 +64,12 @@ const routes = [
path: '/studentUpdate', path: '/studentUpdate',
name: '修改学生', name: '修改学生',
component: StudentUpdate component: StudentUpdate
}/* , },
{
path: '/absentRecord',
name: '缺寝记录',
component: AbsentRecord
}/* ,
{ {
path: '/buildingAdd', path: '/buildingAdd',
name: '添加楼宇', name: '添加楼宇',

162
src/views/AbsentRecord.vue
View File

@ -1,138 +1,102 @@
<template> <template>
<div style="margin-top: 60px;margin-left:80px;border: 0px solid red;" > <div style="margin-top: 60px; margin-left: 80px; border: 0px solid red;">
<el-form style="margin-left: -40px" :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm"> <el-form style="margin-left: -40px" :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
<el-form-item label="字段：" prop="key"> <el-form-item label="字段：" prop="key">
<el-select v-model="ruleForm.key" style="width: 160px;float: left" placeholder="请选择字段"> <el-select v-model="ruleForm.key" style="width: 160px; float: left" placeholder="请选择字段">
<el-option label="楼宇" value="buildingName"></el-option> <el-option label="楼宇" value="buildingName"></el-option>
<el-option label="宿舍" value="dormitoryName"></el-option> <el-option label="宿舍" value="dormitoryName"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<div style="border: 0px solid red;width: 400px;height: 60px;position: relative;top: -64px;left: 270px"> <div style="border: 0px solid red; width: 400px; height: 60px; position: relative; top: -64px; left: 270px">
<el-form-item label="值："> <el-form-item label="值：">
<el-input v-model="ruleForm.value" placeholder="请输入关键字" style="width: 160px;"></el-input> <el-input v-model="ruleForm.value" placeholder="请输入关键字" style="width: 160px;"></el-input>
<el-button type="primary" icon="el-icon-search" style="position: relative;left: 10px;" @click="submitForm('ruleForm')">搜索</el-button> <el-button type="primary" icon="el-icon-search" style="position: relative; left: 10px;" @click="submitForm('ruleForm')">搜索</el-button>
</el-form-item> </el-form-item>
</div> </div>
</el-form> </el-form>
<el-table <el-table
:data="tableData" :data="tableData"
border border
stripe stripe
style="width: 1210px;position: relative;top:-30px"> style="width: 1210px; position: relative; top: -30px">
<el-table-column <el-table-column
fixed fixed
prop="id" prop="id"
label="ID" label="ID"
width="130"> width="130">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="buildingName" prop="buildingId"
label="楼宇" label="楼宇"
width="180"> width="180">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="dormitoryName" prop="dormitoryId"
label="宿舍" label="宿舍"
width="180"> width="180">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="studentName" prop="studentId"
label="学生" label="学生"
width="180"> width="180">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="reason" prop="reason"
label="原因" label="原因"
width="180"> width="180">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="dormitoryAdminName" prop="dormitoryAdminId"
label="宿管" label="宿管"
width="180"> width="180">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="createDate" prop="createDate"
label="日期" label="日期"
width="180"> width="180">
</el-table-column> </el-table-column>
</el-table> </el-table>
<el-pagination style="margin-top: 20px;float: right"
background
layout="prev, pager, next"
:page-size="pageSize"
:total="total"
:current-page.sync="currentPage"
@current-change="page">
</el-pagination>
</div> </div>
</template> </template>
<script> <script>
import axios from 'axios'; import axios from 'axios';
export default {
data() { export default {
return { data() {
tableData: null, return {
currentPage: 1, tableData: [],
pageSize: 3, key: '',
total: null, value: '',
ruleForm: {
key: '', key: '',
value: '', value: ''
ruleForm: {
key: '',
value: '',
page: '',
size: 3
},
rules: {
key: [
{ required: true, message: '请选择字段', trigger: 'change' }
]
}
}
},
methods:{
submitForm(formName) {
const _this = this
//让翻页复原
_this.currentPage=1
this.$refs[formName].validate((valid) => {
if (valid) {
const _this = this
_this.ruleForm.page = _this.currentPage
axios.get('http://localhost:8080/absent/search',{params:_this.ruleForm}).then(function (resp) {
_this.tableData = resp.data.data.data
_this.total = resp.data.data.total
})
}
});
}, },
page(currentPage){ rules: {
const _this = this key: [
if(_this.ruleForm.value == ''){ { required: true, message: '请选择字段', trigger: 'change' }
axios.get('http://localhost:8080/absent/list/'+currentPage+'/'+_this.pageSize).then(function (resp) { ]
_this.tableData = resp.data.data.data
_this.total = resp.data.data.total
})
} else {
_this.ruleForm.page = _this.currentPage
axios.get('http://localhost:8080/absent/search',{params:_this.ruleForm}).then(function (resp) {
_this.tableData = resp.data.data.data
_this.total = resp.data.data.total
})
}
} }
},
created() {
const _this = this
axios.get('http://localhost:8080/absent/list/1/'+_this.pageSize).then(function (resp) {
_this.tableData = resp.data.data.data
_this.total = resp.data.data.total
})
} }
},
methods: {
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
axios.get('http://localhost:8080/system/absent/search', { params: this.ruleForm })
.then(resp => {
this.tableData = resp.data.data.data;
})
.catch(error => {
console.error('Error fetching data:', error);
});
}
});
}
},
created() {
axios.get('http://localhost:8080/system/absent/list')
} }
}
</script> </script>