From 51253b8fff80924124a2119f62449b0fe3d67ff3 Mon Sep 17 00:00:00 2001
From: 龚焕茏 <2842157468@qq.com>
Date: 星期一, 06 五月 2024 18:04:48 +0800
Subject: [PATCH] 新增标签菜单添加、查询、删除、修改，学生绑定、展示、修改
---
src/api/user.js | 9 +
src/views/user/student/list.vue | 26 ++++
src/views/user/tag/list.vue | 166 +++++++++++++++++++++++++++
src/router.js | 13 ++
src/views/user/student/edit.vue | 28 ++++
src/views/user/tag/edit.vue | 92 +++++++++++++++
6 files changed, 328 insertions(+), 6 deletions(-)
diff --git a/src/api/user.js b/src/api/user.js
index 03a9197..aeb2081 100644
--- a/src/api/user.js
+++ b/src/api/user.js
@@ -1,14 +1,21 @@
-import { post } from '@/utils/request'
+import { get,post } from '@/utils/request'
export default {
getUserPageList: query => post('/api/admin/user/page/list', query),
getUserEventPageList: query => post('/api/admin/user/event/page/list', query),
+ getTagList: query => post('/api/admin/tag/page/list', query),
+ tagList: query => get('/api/admin/tag/list', query),
createUser: query => post('/api/admin/user/edit', query),
+ createTag: query => post('/api/admin/tag/edit', query),
selectUser: id => post('/api/admin/user/select/' + id),
+ selectTag: id => post('/api/admin/tag/select/' + id),
+ selectCount: id => post('/api/admin/tag/selectCount/' + id),
getCurrentUser: () => post('/api/admin/user/current'),
updateUser: query => post('/api/admin/user/update', query),
+ updateTag: query => post('/api/admin/tag/update', query),
changeStatus: id => post('/api/admin/user/changeStatus/' + id),
deleteUser: id => post('/api/admin/user/delete/' + id),
+ deleteTag: id => post('/api/admin/tag/delete/' + id),
selectByUserName: query => post('/api/admin/user/selectByUserName', query),
addMeetin:query => post('/api/admin/video/add', query),
delMeetin:query => post('/api/admin/video/clear', query)
diff --git a/src/router.js b/src/router.js
index a4c18b1..cf03701 100644
--- a/src/router.js
+++ b/src/router.js
@@ -70,6 +70,19 @@
name: 'UserAdminEdit',
meta: { title: '绠＄悊鍛樼紪杈�', noCache: true, activeMenu: '/user/admin/list' },
hidden: true
+ },
+ {
+ path: 'tag/list',
+ component: () => import('@/views/user/tag/list'),
+ name: 'TagAdminPageList',
+ meta: { title: '鏍囩鍒楄〃', noCache: true }
+ },
+ {
+ path: 'tag/edit',
+ component: () => import('@/views/user/tag/edit'),
+ name: 'TagAdminEdit',
+ meta: { title: '鏍囩缂栬緫', noCache: true, activeMenu: '/user/tag/list' },
+ hidden: true
}
]
},
diff --git a/src/views/user/student/edit.vue b/src/views/user/student/edit.vue
index f1b4acb..428e7ab 100644
--- a/src/views/user/student/edit.vue
+++ b/src/views/user/student/edit.vue
@@ -19,8 +19,8 @@
<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" type="date" value-format="yyyy-MM-dd" placeholder="閫夋嫨鏃ユ湡" />
+ <el-form-item label="鍑虹敓鏃ユ湡锛�" prop="birthDay">
+ <el-date-picker v-model="form.birthDay" required type="date" value-format="yyyy-MM-dd" placeholder="閫夋嫨鏃ユ湡" />
</el-form-item>
<el-form-item label="鎵嬫満锛�">
<el-input v-model="form.phone"></el-input>
@@ -28,6 +28,11 @@
<el-form-item label="閮ㄩ棬锛�" prop="deptIds" required>
<el-select v-model="form.deptIds" multiple collapse-tags placeholder="閮ㄩ棬">
<el-option v-for="item in levelEnum" :key="item.key" :value="item.key" :label="item.value"></el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鏍囩锛�" prop="tagIds">
+ <el-select v-model="form.tagIds" multiple collapse-tags placeholder="鏍囩">
+ <el-option v-for="item in tags" :key="item.id" :value="item.id" :label="item.name"></el-option>
</el-select>
</el-form-item>
<el-form-item label="鐘舵�侊細" required>
@@ -50,6 +55,7 @@
export default {
data () {
return {
+ tags: [],
value2:[],
form: {
id: null,
@@ -62,7 +68,8 @@
sex: '',
birthDay: null,
phone: null,
- deptIds: []
+ deptIds: [],
+ tagIds: []
},
formLoading: false,
rules: {
@@ -74,11 +81,16 @@
],
deptIds: [
{ required: true, message: '璇烽�夋嫨閮ㄩ棬', trigger: 'change' }
+ ],
+ birthDay: [
+ { required: true, message: '璇烽�夋嫨鍑虹敓鏃ユ湡', trigger: 'blur' }
]
}
}
},
created () {
+ this.getTags();
+
console.log(this.levelEnum)
let id = this.$route.query.id
let _this = this
@@ -102,12 +114,19 @@
}
},
methods: {
+ getTags () {
+ userApi.tagList(null).then(data => {
+ this.tags = data.response
+ })
+ },
submitForm () {
+ console.log("this.form", this.form)
let _this = this
this.form.deptIds = this.form.deptIds.join(',')
this.$refs.form.validate((valid) => {
if (valid) {
this.formLoading = true
+ console.log("this.form", this.form)
userApi.createUser(this.form).then(data => {
if (data.code === 1) {
_this.$message.success(data.message)
@@ -140,7 +159,8 @@
sex: '',
birthDay: null,
phone: null,
- deptIds: []
+ deptIds: [],
+ tagIds: []
}
this.form.id = lastId
},
diff --git a/src/views/user/student/list.vue b/src/views/user/student/list.vue
index d8272e9..ba9feba 100644
--- a/src/views/user/student/list.vue
+++ b/src/views/user/student/list.vue
@@ -30,6 +30,11 @@
<el-table-column prop="userName" label="鐢ㄦ埛鍚�"/>
<el-table-column prop="realName" label="鐪熷疄濮撳悕" />
<el-table-column prop="deptNames" label="閮ㄩ棬" />
+ <el-table-column label="鏍囩" prop="tagNames">
+ <template slot-scope="{row}">
+ <el-tag style="margin-right: 5px;" v-for="(item,index) in row.tagNames" :key="index">{{ item }}</el-tag>
+ </template>
+ </el-table-column>
<el-table-column prop="sex" label="鎬у埆" width="60px;" :formatter="sexFormatter"/>
<el-table-column prop="phone" label="鎵嬫満鍙�"/>
<el-table-column prop="createTime" label="鍒涘缓鏃堕棿" width="160px"/>
@@ -40,7 +45,7 @@
</el-tag>
</template>
</el-table-column>
- <el-table-column width="270px" label="鎿嶄綔" align="center">
+ <el-table-column width="340px" label="鎿嶄綔" align="center">
<template slot-scope="{row}">
<el-button size="mini" @click="changeStatus(row)" class="link-left">
{{ statusBtnFormatter(row.status) }}
@@ -51,12 +56,23 @@
<router-link :to="{path:'/log/user/list', query:{userId:row.id}}" class="link-left">
<el-button size="mini" >鏃ュ織</el-button>
</router-link>
+ <el-button size="mini" @click="status(row.id)" class="link-left">鐘舵��</el-button>
<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"/>
+
+
+
+ <el-dialog :visible.sync="statusVisible" append-to-body :close-on-click-modal="false" style="width: 100%;height: 100%" :show-close="false" center>
+ 111
+ <span slot="footer" class="dialog-footer">
+ <el-button type="primary" @click="statusConfirm">纭� 瀹�</el-button>
+ <el-button @click="statusVisible = false">鍙� 娑�</el-button>
+ </span>
+ </el-dialog>
</div>
</template>
@@ -69,6 +85,8 @@
components: { Pagination },
data () {
return {
+ form: {},
+ statusVisible: false,
upLoadUrl:'/api/admin/user/import',
fileList:[],
queryParam: {
@@ -86,6 +104,12 @@
this.search()
},
methods: {
+ status(id) {
+ this.statusVisible = true;
+ },
+ statusConfirm() {
+ this.form;
+ },
handlePreview(e){
console.log(e)
if (e.code==1){
diff --git a/src/views/user/tag/edit.vue b/src/views/user/tag/edit.vue
new file mode 100644
index 0000000..7ff9f50
--- /dev/null
+++ b/src/views/user/tag/edit.vue
@@ -0,0 +1,92 @@
+<template>
+ <div class="app-container">
+
+ <el-form :model="form" ref="form" label-width="100px" v-loading="formLoading" :rules="rules">
+ <el-form-item label="鏍囩鍚嶏細" prop="name" required>
+ <el-input v-model="form.name"></el-input>
+ </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 () {
+ return {
+ form: {
+ id: null,
+ name: ''
+ },
+ formLoading: false,
+ rules: {
+ name: [
+ { required: true, message: '璇疯緭鍏ユ爣绛惧悕', trigger: 'blur' }
+ ]
+ }
+ }
+ },
+ created () {
+ let id = this.$route.query.id
+ let _this = this
+ if (id && parseInt(id) !== 0) {
+ _this.formLoading = true
+ userApi.selectTag(id).then(re => {
+ _this.form = re.response
+ _this.formLoading = false
+ })
+ }
+ },
+ methods: {
+ submitForm () {
+ let _this = this
+ this.$refs.form.validate((valid) => {
+ if (valid) {
+ this.formLoading = true
+ userApi.createTag(this.form).then(data => {
+ if (data.code === 1) {
+ _this.$message.success(data.message)
+ _this.delCurrentView(_this).then(() => {
+ _this.$router.push('/user/tag/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,
+ name: ''
+ }
+ 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/tag/list.vue b/src/views/user/tag/list.vue
new file mode 100644
index 0000000..1968043
--- /dev/null
+++ b/src/views/user/tag/list.vue
@@ -0,0 +1,166 @@
+<template>
+ <div class="app-container">
+ <el-form :model="queryParam" ref="queryForm" :inline="true">
+ <el-form-item label="鏍囩鍚嶏細">
+ <el-input v-model="queryParam.name"></el-input>
+ </el-form-item>
+ <el-form-item>
+ <div style="display: flex">
+ <el-button type="primary" @click="submitForm">鏌ヨ</el-button>
+ <router-link :to="{ path: '/user/tag/edit' }" class="link-left">
+ <el-button type="primary">娣诲姞</el-button>
+ </router-link>
+ </div>
+ </el-form-item>
+ </el-form>
+
+ <el-table v-loading="listLoading" :data="tableData" border fit highlight-current-row style="width: 100%">
+ <el-table-column prop="name" label="鏍囩鍚�" />
+ <el-table-column width="270px" label="鎿嶄綔" align="center">
+ <template slot-scope="{row}">
+ <router-link :to="{ path: '/user/tag/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 {
+ upLoadUrl: '/api/admin/user/import',
+ fileList: [],
+ queryParam: {
+ name: '',
+ role: 1,
+ pageIndex: 1,
+ pageSize: 10
+ },
+ listLoading: true,
+ tableData: [],
+ total: 0
+ }
+ },
+ created() {
+ this.search()
+ },
+ methods: {
+ handlePreview(e) {
+ console.log(e)
+ if (e.code == 1) {
+ this.search()
+ this.$message.success(e.message)
+ } else {
+ this.$message.error(e.message)
+ }
+ },
+ beforeAvatarUpload(file) {
+ let legalName = ['xlsx', 'xls']
+ // 鎷垮埌鍚庣紑鍚�
+ let name = file.name.substring(file.name.lastIndexOf('.') + 1, file.name.length)
+ if (legalName.includes(name)) {
+ // console.log(legalName.includes(name));
+ } else {
+ this.$message.warning('鏂囦欢鏍煎紡涓嶅锛屼粎闄恱ls鍜寈lsx')
+ return false
+ }
+ // console.log(file)
+ // const isJPG = file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
+ // // const isLt2M = file.size / 1024 / 1024 < 2;
+ //
+ // if (!isJPG) {
+ // this.$message.error('涓婁紶鏂囦欢鍙兘鏄疎xcel!');
+ // }
+ // // if (!isLt2M) {
+ // // this.$message.error('涓婁紶澶村儚鍥剧墖澶у皬涓嶈兘瓒呰繃 2MB!');
+ // // }
+ // return isJPG ;
+ },
+ search() {
+ this.listLoading = true
+ userApi.getTagList(this.queryParam).then(data => {
+ const re = data.response
+ 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.response
+ _this.$message.success(re.message)
+ } else {
+ _this.$message.error(re.message)
+ }
+ })
+ },
+ deleteUser(row) {
+ userApi.selectCount(row.id).then(re => {
+ if (re.response.length > 0) {
+ this.$message.warning(re.response.length + '浣嶇敤鎴锋鍦ㄤ娇鐢ㄨ鏍囩锛屾棤娉曞垹闄�')
+ } else {
+ let _this = this
+ userApi.deleteTag(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()
+ },
+ levelFormatter(row, column, cellValue, index) {
+ return this.enumFormat(this.levelEnum, cellValue)
+ },
+ 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,
+ levelEnum: state => state.user.levelEnum
+ })
+ }
+}
+</script>
+<style lang="scss" scoped>
+.upload-demo {
+ margin-left: 5px;
+}
+</style>
--
Gitblit v1.8.0