From 6f221dcf9554642585222f52e6ae122d45f4eb9e Mon Sep 17 00:00:00 2001
From: xiangpei <xiangpei@timesnew.cn>
Date: 星期一, 14 十月 2024 15:52:40 +0800
Subject: [PATCH] 学生编辑使用弹窗形式
---
src/views/user/student/list.vue | 151 +++++++++++++++++++++++++++++++++++++++++++++++++-
1 files changed, 147 insertions(+), 4 deletions(-)
diff --git a/src/views/user/student/list.vue b/src/views/user/student/list.vue
index 2608227..346d738 100644
--- a/src/views/user/student/list.vue
+++ b/src/views/user/student/list.vue
@@ -39,7 +39,7 @@
<el-table-column prop="deptNames" label="閮ㄩ棬" />
<el-table-column label="鏍囩" prop="tagNames" align="center">
<template slot-scope="{row}">
- <el-tag v-for="item, index in row.tagNames" :key="index">{{ item }}</el-tag>
+ <el-tag v-for="(item, index) in row.tagNames" :key="index">{{ item }}</el-tag>
</template>
</el-table-column>
<el-table-column label="浜哄憳鐘舵��" prop="condition" align="center" width="100px">
@@ -62,9 +62,7 @@
<el-button size="mini" v-if="!deptAdmin()" @click="changeStatus(row)" class="link-left">
{{ statusBtnFormatter(row.status) }}
</el-button>
- <router-link :to="{path:'/user/student/edit', query:{id:row.id}}" class="link-left">
- <el-button size="mini" >缂栬緫</el-button>
- </router-link>
+ <el-button size="mini" @click="handleEdit(row.id)">缂栬緫</el-button>
<!-- <router-link :to="{path:'/log/user/list', query:{userId:row.id}}" class="link-left">
<el-button size="mini" >鏃ュ織</el-button>
</router-link> -->
@@ -92,6 +90,64 @@
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="statusConfirm">纭� 瀹�</el-button>
<el-button @click="statusVisible = false">鍙� 娑�</el-button>
+ </span>
+ </el-dialog>
+
+ <el-dialog
+ title="缂栬緫"
+ :visible.sync="editShow"
+ width="800px"
+ :before-close="handleClose">
+ <el-form :model="form" ref="form" label-width="100px" v-loading="formLoading" :rules="rules">
+ <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" type="password"></el-input>
+ </el-form-item>
+ <el-form-item label="鐪熷疄濮撳悕锛�" prop="realName" required>
+ <el-input v-model="form.realName"></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="鍑虹敓鏃ユ湡锛�" 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>
+ </el-form-item>
+ <el-form-item label="閮ㄩ棬锛�" prop="deptIds" required>
+ <!-- <el-select v-model="form.deptIds" multiple collapse-tags placeholder="閮ㄩ棬" :disabled="this.$route.query.id">
+ <el-option v-for="item in depts" :key="item.id" :value="item.id" :label="item.name"></el-option>
+ </el-select> -->
+ <el-cascader
+ clearable
+ :disabled="this.$route.query.id"
+ v-model="form.deptIds"
+ :options="depts"
+ :props="{ emitPath: false, multiple: true, value: 'id', label: 'name', checkStrictly: true }"
+ ></el-cascader>
+ </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>
+ <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>
+ <span slot="footer" class="dialog-footer">
+ <el-button @click="handleClose">鍙� 娑�</el-button>
+ <el-button type="primary" @click="submitEdit">鎻� 浜�</el-button>
</span>
</el-dialog>
@@ -134,7 +190,36 @@
},
data () {
return {
+ editShow: false,
depts: [],
+ tags: [],
+ value2:[],
+ form: {
+ id: null,
+ userName: '',
+ password: '',
+ realName: '',
+ role: 1,
+ status: 1,
+ age: '',
+ sex: '',
+ birthDay: null,
+ phone: null,
+ deptIds: [],
+ tagIds: []
+ },
+ formLoading: false,
+ rules: {
+ userName: [
+ { required: true, message: '璇疯緭鍏ョ敤鎴峰悕', trigger: 'blur' }
+ ],
+ realName: [
+ { required: true, message: '璇疯緭鍏ョ湡瀹炲鍚�', trigger: 'blur' }
+ ],
+ deptIds: [
+ { required: true, message: '璇烽�夋嫨閮ㄩ棬', trigger: 'change' }
+ ]
+ },
user:{},
statusVisible: false,
upLoadUrl:'/api/admin/user/import',
@@ -173,11 +258,35 @@
},
created () {
this.search();
+ this.getTags();
department.getDeptAdmins().then(res => {
this.depts = res.response;
})
},
methods: {
+ handleClose() {
+ this.form = {
+ id: null,
+ userName: '',
+ password: '',
+ realName: '',
+ role: 1,
+ status: 1,
+ age: '',
+ sex: '',
+ birthDay: null,
+ phone: null,
+ deptIds: [],
+ tagIds: []
+ }
+ this.editShow = false
+ this.search()
+ },
+ getTags () {
+ userApi.tagList(null).then(data => {
+ this.tags = data.response
+ })
+ },
deptAdmin() {
return sessionStorage.getItem('deptAdmin') === '1'
},
@@ -280,6 +389,20 @@
this.listLoading = false
})
},
+ handleEdit(id) {
+ this.formLoading = true
+ userApi.selectUser(id).then(re => {
+ this.form = re.response
+ this.formLoading = false
+ const isEmpty = re.response.deptIds.trim().length === 0;
+ if (isEmpty){
+ this.form.deptIds = []
+ }else {
+ this.form.deptIds = re.response.deptIds.split(',').map(Number)
+ }
+ this.editShow = true
+ })
+ },
changeStatus (row) {
let _this = this
userApi.changeStatus(row.id).then(re => {
@@ -302,6 +425,26 @@
}
})
},
+ submitEdit () {
+ 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.handleClose()
+ } else {
+ this.$message.error(data.message)
+ this.formLoading = false
+ }
+ }).catch(e => {
+ this.formLoading = false
+ })
+ } else {
+ return false
+ }
+ })
+ },
submitForm () {
this.queryParam.pageIndex = 1
this.search()
--
Gitblit v1.8.0