From 3df06d7515db396b34ed1d088502556484df6527 Mon Sep 17 00:00:00 2001
From: xiangpei <xiangpei@timesnew.cn>
Date: 星期四, 11 七月 2024 10:55:01 +0800
Subject: [PATCH] 教师管理
---
src/views/login/index.vue | 4
src/views/user/teacher/list.vue | 131 ++++++++++++++++++
src/router.js | 13 +
src/views/user/admin/edit.vue | 48 +++++-
src/views/user/teacher/edit.vue | 166 +++++++++++++++++++++++
src/views/user/student/edit.vue | 2
6 files changed, 352 insertions(+), 12 deletions(-)
diff --git a/src/router.js b/src/router.js
index 0059a0d..0391f7c 100644
--- a/src/router.js
+++ b/src/router.js
@@ -111,6 +111,19 @@
hidden: true
},
{
+ path: 'teacher/list',
+ component: () => import('@/views/user/teacher/list'),
+ name: 'UserTeacherPageList',
+ meta: { title: '鏁欏笀鍒楄〃', noCache: true }
+ },
+ {
+ path: 'teacher/edit',
+ component: () => import('@/views/user/teacher/edit'),
+ name: 'UserTeacherEdit',
+ meta: { title: '鏁欏笀缂栬緫', noCache: true, activeMenu: '/user/teacher/list' },
+ hidden: true
+ },
+ {
path: 'admin/list',
component: () => import('@/views/user/admin/list'),
name: 'UserAdminPageList',
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index 019ad5a..a194d26 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -115,8 +115,8 @@
remember: false
},
loginRules: {
- userName: [{ required: true, trigger: 'blur', validator: validateUsername }],
- password: [{ required: true, trigger: 'blur', validator: validatePassword }]
+ userName: [{ required: true, trigger: 'blur'}],
+ password: [{ required: true, trigger: 'blur'}]
},
passwordType: 'password',
capsTooltip: false,
diff --git a/src/views/user/admin/edit.vue b/src/views/user/admin/edit.vue
index 40d73a9..ac6dc9f 100644
--- a/src/views/user/admin/edit.vue
+++ b/src/views/user/admin/edit.vue
@@ -2,14 +2,17 @@
<div class="app-container">
<el-form :model="form" ref="form" label-width="100px" v-loading="formLoading" :rules="rules">
- <el-form-item label="鐢ㄦ埛鍚嶏細" prop="userName" required>
+ <el-form-item label="鐪熷疄濮撳悕锛�" prop="realName" required>
+ <el-input v-model="form.realName"></el-input>
+ </el-form-item>
+ <el-form-item label="鎵嬫満鍙风爜锛�" prop="phone" required>
+ <el-input v-model="form.phone"></el-input>
+ </el-form-item>
+ <el-form-item label="鐧诲綍璐﹀彿锛�" prop="userName" required>
<el-input v-model="form.userName"></el-input>
</el-form-item>
- <el-form-item label="瀵嗙爜锛�" required>
- <el-input v-model="form.password"></el-input>
- </el-form-item>
- <el-form-item label="鐪熷疄濮撳悕锛�" prop="realName" required>
- <el-input v-model="form.realName"></el-input>
+ <el-form-item label="鐧诲綍瀵嗙爜锛�" prop="password" required>
+ <el-input v-model="form.password" show-password></el-input>
</el-form-item>
<el-form-item label="骞撮緞锛�">
<el-input v-model="form.age"></el-input>
@@ -21,9 +24,6 @@
</el-form-item>
<el-form-item label="鍑虹敓鏃ユ湡锛�">
<el-date-picker v-model="form.birthDay" value-format="yyyy-MM-dd" type="date" placeholder="閫夋嫨鏃ユ湡"/>
- </el-form-item>
- <el-form-item label="鎵嬫満锛�">
- <el-input v-model="form.phone"></el-input>
</el-form-item>
<el-form-item label="鐘舵�侊細" required>
<el-select v-model="form.status" placeholder="鐘舵��">
@@ -44,6 +44,30 @@
export default {
data () {
+ var validatePassword = (rule, value, callback) => {
+ if (value === '') {
+ callback(new Error('璇疯緭鍏ュ瘑鐮�'))
+ } else if (!/[A-Z]/.test(value)) {
+ callback(new Error('瀵嗙爜蹇呴』鍖呭惈鑷冲皯涓�涓ぇ鍐欏瓧姣�'))
+ } else if (!/[a-z]/.test(value)) {
+ callback(new Error('瀵嗙爜蹇呴』鍖呭惈鑷冲皯涓�涓皬鍐欏瓧姣�'))
+ } else if (!/[0-9]/.test(value)) {
+ callback(new Error('瀵嗙爜蹇呴』鍖呭惈鑷冲皯涓�涓暟瀛�'))
+ } else {
+ callback()
+ }
+ }
+ var validatePhone = (rule, value, callback) => {
+ // 鎵嬫満鍙烽獙璇侀�昏緫
+ const phoneRegex = /^1[3-9]\d{9}$/;
+ if (!value) {
+ callback(new Error('璇疯緭鍏ユ墜鏈哄彿'));
+ } else if (!phoneRegex.test(value)) {
+ callback(new Error('鎵嬫満鍙锋牸寮忎笉姝ｇ‘'));
+ } else {
+ callback();
+ }
+ }
return {
form: {
id: null,
@@ -64,6 +88,12 @@
],
realName: [
{ required: true, message: '璇疯緭鍏ョ湡瀹炲鍚�', trigger: 'blur' }
+ ],
+ password: [
+ { validator: validatePassword, trigger: 'blur' }
+ ],
+ phone: [
+ { validator: validatePhone, trigger: 'blur' }
]
}
}
diff --git a/src/views/user/student/edit.vue b/src/views/user/student/edit.vue
index 6323e4d..e686016 100644
--- a/src/views/user/student/edit.vue
+++ b/src/views/user/student/edit.vue
@@ -5,7 +5,7 @@
<el-form-item label="鐪熷疄濮撳悕锛�" prop="realName" required>
<el-input v-model="form.realName"></el-input>
</el-form-item>
- <el-form-item label="鎵嬫満锛�" prop="phone" required>
+ <el-form-item label="鎵嬫満鍙风爜锛�" prop="phone" required>
<el-input v-model="form.phone"></el-input>
</el-form-item>
<el-form-item label="鐧诲綍璐﹀彿锛�" prop="userName" required>
diff --git a/src/views/user/teacher/edit.vue b/src/views/user/teacher/edit.vue
new file mode 100644
index 0000000..e9c9774
--- /dev/null
+++ b/src/views/user/teacher/edit.vue
@@ -0,0 +1,166 @@
+<template>
+ <div class="app-container">
+
+ <el-form :model="form" ref="form" label-width="100px" v-loading="formLoading" :rules="rules">
+ <el-form-item label="鐪熷疄濮撳悕锛�" prop="realName" required>
+ <el-input v-model="form.realName"></el-input>
+ </el-form-item>
+ <el-form-item label="鎵嬫満鍙风爜锛�" prop="phone" required>
+ <el-input v-model="form.phone"></el-input>
+ </el-form-item>
+ <el-form-item label="鐧诲綍璐﹀彿锛�" prop="userName" required>
+ <el-input v-model="form.userName"></el-input>
+ </el-form-item>
+ <el-form-item label="鐧诲綍瀵嗙爜锛�" prop="password" required>
+ <el-input v-model="form.password" show-password></el-input>
+ </el-form-item>
+ <el-form-item label="骞撮緞锛�">
+ <el-input v-model="form.age"></el-input>
+ </el-form-item>
+ <el-form-item label="鎬у埆锛�">
+ <el-select v-model="form.sex" placeholder="鎬у埆" clearable>
+ <el-option v-for="item in sexEnum" :key="item.key" :value="item.key" :label="item.value"></el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鍑虹敓鏃ユ湡锛�">
+ <el-date-picker v-model="form.birthDay" value-format="yyyy-MM-dd" type="date" placeholder="閫夋嫨鏃ユ湡"/>
+ </el-form-item>
+ <el-form-item label="鐘舵�侊細" required>
+ <el-select v-model="form.status" placeholder="鐘舵��">
+ <el-option v-for="item in statusEnum" :key="item.key" :value="item.key" :label="item.value"></el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" @click="submitForm">鎻愪氦</el-button>
+ <el-button @click="resetForm">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </div>
+</template>
+
+<script>
+import { mapGetters, mapState, mapActions } from 'vuex'
+import userApi from '@/api/user'
+
+export default {
+ data () {
+ var validatePassword = (rule, value, callback) => {
+ if (value === '') {
+ callback(new Error('璇疯緭鍏ュ瘑鐮�'))
+ } else if (!/[A-Z]/.test(value)) {
+ callback(new Error('瀵嗙爜蹇呴』鍖呭惈鑷冲皯涓�涓ぇ鍐欏瓧姣�'))
+ } else if (!/[a-z]/.test(value)) {
+ callback(new Error('瀵嗙爜蹇呴』鍖呭惈鑷冲皯涓�涓皬鍐欏瓧姣�'))
+ } else if (!/[0-9]/.test(value)) {
+ callback(new Error('瀵嗙爜蹇呴』鍖呭惈鑷冲皯涓�涓暟瀛�'))
+ } else {
+ callback()
+ }
+ }
+ var validatePhone = (rule, value, callback) => {
+ // 鎵嬫満鍙烽獙璇侀�昏緫
+ const phoneRegex = /^1[3-9]\d{9}$/;
+ if (!value) {
+ callback(new Error('璇疯緭鍏ユ墜鏈哄彿'));
+ } else if (!phoneRegex.test(value)) {
+ callback(new Error('鎵嬫満鍙锋牸寮忎笉姝ｇ‘'));
+ } else {
+ callback();
+ }
+ }
+ return {
+ form: {
+ id: null,
+ userName: '',
+ password: '',
+ realName: '',
+ role: 2,
+ status: 1,
+ age: '',
+ sex: '',
+ birthDay: null,
+ phone: null
+ },
+ formLoading: false,
+ rules: {
+ userName: [
+ { required: true, message: '璇疯緭鍏ョ敤鎴峰悕', trigger: 'blur' }
+ ],
+ realName: [
+ { required: true, message: '璇疯緭鍏ョ湡瀹炲鍚�', trigger: 'blur' }
+ ],
+ password: [
+ { validator: validatePassword, trigger: 'blur' }
+ ],
+ phone: [
+ { validator: validatePhone, trigger: 'blur' }
+ ]
+ }
+ }
+ },
+ created () {
+ let id = this.$route.query.id
+ let _this = this
+ if (id && parseInt(id) !== 0) {
+ _this.formLoading = true
+ userApi.selectUser(id).then(re => {
+ _this.form = re.data
+ _this.formLoading = false
+ })
+ }
+ },
+ methods: {
+ submitForm () {
+ let _this = this
+ this.$refs.form.validate((valid) => {
+ if (valid) {
+ this.formLoading = true
+ userApi.createUser(this.form).then(data => {
+ if (data.code === 1) {
+ _this.$message.success(data.message)
+ _this.delCurrentView(_this).then(() => {
+ _this.$router.push('/user/teacher/list')
+ })
+ } else {
+ _this.$message.error(data.message)
+ _this.formLoading = false
+ }
+ }).catch(e => {
+ _this.formLoading = false
+ })
+ } else {
+ return false
+ }
+ })
+ },
+ resetForm () {
+ let lastId = this.form.id
+ this.$refs['form'].resetFields()
+ this.form = {
+ id: null,
+ userName: '',
+ password: '',
+ realName: '',
+ role: 2,
+ status: 1,
+ age: '',
+ sex: '',
+ birthDay: null,
+ phone: null
+ }
+ this.form.id = lastId
+ },
+ ...mapActions('tagsView', { delCurrentView: 'delCurrentView' })
+ },
+ computed: {
+ ...mapGetters('enumItem', [
+ 'enumFormat'
+ ]),
+ ...mapState('enumItem', {
+ sexEnum: state => state.user.sexEnum,
+ roleEnum: state => state.user.roleEnum,
+ statusEnum: state => state.user.statusEnum
+ })
+ }
+}
+</script>
diff --git a/src/views/user/teacher/list.vue b/src/views/user/teacher/list.vue
new file mode 100644
index 0000000..b858e87
--- /dev/null
+++ b/src/views/user/teacher/list.vue
@@ -0,0 +1,131 @@
+<template>
+ <div class="app-container">
+ <el-form :model="queryParam" ref="queryForm" :inline="true">
+ <el-form-item label="鐢ㄦ埛鍚嶏細">
+ <el-input v-model="queryParam.userName"></el-input>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" @click="submitForm">鏌ヨ</el-button>
+ <router-link :to="{path:'/user/teacher/edit'}" class="link-left">
+ <el-button type="primary">娣诲姞</el-button>
+ </router-link>
+ </el-form-item>
+ </el-form>
+
+ <el-table v-loading="listLoading" :data="tableData" border fit highlight-current-row style="width: 100%">
+ <el-table-column prop="id" label="Id" />
+ <el-table-column prop="userName" label="鐢ㄦ埛鍚�"/>
+ <el-table-column prop="realName" label="鐪熷疄濮撳悕" />
+ <el-table-column prop="sex" label="鎬у埆" width="60px;" :formatter="sexFormatter"/>
+ <el-table-column prop="phone" label="鎵嬫満鍙�"/>
+ <el-table-column prop="createTime" label="鍒涘缓鏃堕棿" width="160px"/>
+ <el-table-column label="鐘舵��" prop="status" width="70px">
+ <template slot-scope="{row}">
+ <el-tag :type="statusTagFormatter(row.status)">
+ {{ statusFormatter(row.status) }}
+ </el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column width="220px" label="鎿嶄綔" align="center">
+ <template slot-scope="{row}">
+ <el-button size="mini" @click="changeStatus(row)" class="link-left">
+ {{ statusBtnFormatter(row.status) }}
+ </el-button>
+ <router-link :to="{path:'/user/teacher/edit', query:{id:row.id}}" class="link-left">
+ <el-button size="mini">缂栬緫</el-button>
+ </router-link>
+ <el-button size="mini" type="danger" @click="deleteUser(row)" class="link-left">鍒犻櫎</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ <pagination v-show="total>0" :total="total" :page.sync="queryParam.pageIndex" :limit.sync="queryParam.pageSize"
+ @pagination="search"/>
+ </div>
+</template>
+
+<script>
+import { mapGetters, mapState } from 'vuex'
+import Pagination from '@/components/Pagination'
+import userApi from '@/api/user'
+
+export default {
+ components: { Pagination },
+ data () {
+ return {
+ queryParam: {
+ userName: '',
+ role: 2,
+ pageIndex: 1,
+ pageSize: 10
+ },
+ listLoading: true,
+ tableData: [],
+ total: 0
+ }
+ },
+ created () {
+ this.search()
+ },
+ methods: {
+ search () {
+ this.listLoading = true
+ userApi.getUserPageList(this.queryParam).then(data => {
+ const re = data.data
+ this.tableData = re.list
+ this.total = re.total
+ this.queryParam.pageIndex = re.pageNum
+ this.listLoading = false
+ })
+ },
+ changeStatus (row) {
+ let _this = this
+ userApi.changeStatus(row.id).then(re => {
+ if (re.code === 1) {
+ row.status = re.data
+ _this.$message.success(re.message)
+ } else {
+ _this.$message.error(re.message)
+ }
+ })
+ },
+ deleteUser (row) {
+ let _this = this
+ userApi.deleteUser(row.id).then(re => {
+ if (re.code === 1) {
+ _this.search()
+ _this.$message.success(re.message)
+ } else {
+ _this.$message.error(re.message)
+ }
+ })
+ },
+ submitForm () {
+ this.queryParam.pageIndex = 1
+ this.search()
+ },
+ sexFormatter (row, column, cellValue, index) {
+ return this.enumFormat(this.sexEnum, cellValue)
+ },
+ statusFormatter (status) {
+ return this.enumFormat(this.statusEnum, status)
+ },
+ statusTagFormatter (status) {
+ return this.enumFormat(this.statusTag, status)
+ },
+ statusBtnFormatter (status) {
+ return this.enumFormat(this.statusBtn, status)
+ }
+ },
+ computed: {
+ ...mapGetters('enumItem', [
+ 'enumFormat'
+ ]),
+ ...mapState('enumItem', {
+ sexEnum: state => state.user.sexEnum,
+ statusEnum: state => state.user.statusEnum,
+ statusTag: state => state.user.statusTag,
+ statusBtn: state => state.user.statusBtn
+ })
+ }
+}
+</script>
--
Gitblit v1.8.0