| | |
| | | { required: true, trigger: "blur", validator: validateNickname }, |
| | | ], |
| | | parentId: [ |
| | | { required: true, trigger: "blur", validator: validatePass }, |
| | | { required: false, trigger: "blur", validator: validatePass }, |
| | | ], |
| | | departType: [ |
| | | { required: true, trigger: "blur", validator: validateTruename }, |
| | | { required: false, trigger: "blur", validator: validatePhone }, |
| | | ], |
| | | departDes: [ |
| | | { required: true, trigger: "blur" }, |
| | | { required: false, trigger: "blur" }, |
| | | ], |
| | | }, |
| | | roleList: [ |
| | |
| | | </el-table> |
| | | <!-- 查看修改页面 --> |
| | | <el-dialog :visible.sync="dialogUpdate" width="45%" v-if="dialogUpdate"> |
| | | <updateUser :updateFlag="updateFlag" :userInfo=userInfo /> |
| | | <updateUser :updateFlag="updateFlag" :userInfo="userInfo" :getUserList="getUserList" @changeDialog="changMyDialog" /> |
| | | </el-dialog> |
| | | <!-- 分页 --> |
| | | <div class="pagination"> |
| | |
| | | handleNext(page){ |
| | | this.currentPage = page; |
| | | this.search(); |
| | | }} |
| | | }, |
| | | // 关闭dialog |
| | | changMyDialog(val){ |
| | | this.dialogUpdate = val.dialogFlag; |
| | | } |
| | | }, |
| | | } |
| | | </script> |
| | | <style lang="scss" scoped> |
| | |
| | | <div class="mainContent"> |
| | | <el-form ref="user" label-width="140px" autoComplete="on" :model="user" :rules="createUserRules" |
| | | label-position="right"> |
| | | <!-- 部门id --> |
| | | <el-form-item class="optionItem" label="部门名称:" prop="id"> |
| | | <el-input v-model="user.id" placeholder="请输入部门名称" :disabled="!updateFlag"></el-input> |
| | | </el-form-item> |
| | | <!-- 部门名称 --> |
| | | <el-form-item class="optionItem" label="部门名称:" prop="departName"> |
| | | <el-input v-model="user.departName" placeholder="请输入部门名称" :disabled="true"></el-input> |
| | | <el-input v-model="user.departName" placeholder="请输入部门名称" :disabled="!updateFlag"></el-input> |
| | | </el-form-item> |
| | | <!-- 上级部门 --> |
| | | <el-form-item class="optionItems" label="上级部门:" prop="parentId"> |
| | | <el-select v-model="user.parentId" placeholder="请选择上级部门" disabled> |
| | | <el-select v-model="user.parentId" placeholder="请选择上级部门" :disabled="!updateFlag"> |
| | | <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value"> |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | <!-- 部门类型 --> |
| | | <el-form-item class="optionItem" label="部门类型:" prop="departType"> |
| | | <el-select v-model="user.departType" placeholder="请选择部门类型" disabled> |
| | | <el-select v-model="user.departType" placeholder="请选择部门类型" :disabled="!updateFlag"> |
| | | <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value"> |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | <!-- 部门描述 --> |
| | | <el-form-item class="optionItem" label="部门描述:" prop="departDes"> |
| | | <el-input v-model="user.departDes" placeholder="请输入部门描述" :disabled="true"></el-input> |
| | | <el-input v-model="user.departDes" placeholder="请输入部门描述" :disabled="!updateFlag"></el-input> |
| | | </el-form-item> |
| | | <el-form-item v-if="updateFlag"> |
| | | <div class="optionBtn"> |
| | |
| | | data() { |
| | | const validateNickname = (rule, value, callback) => { |
| | | if (!value) { |
| | | callback(new Error("请填写用户名称")); |
| | | callback(new Error("请填写部门名称")); |
| | | } |
| | | }; |
| | | const validateId = (rule, value, callback) => { |
| | | if (!value) { |
| | | callback(new Error("请填写部门id")); |
| | | } |
| | | } |
| | | const validatePass = (rule, value, callback) => { |
| | | if (!value) { |
| | | callback(new Error("请填写登录密码")); |
| | |
| | | const rep = /^\w+$/; |
| | | if (!rep.test(value)) { |
| | | callback(new Error("密码只能是以数字、26个英文字母或者下划线组成的字符串")); |
| | | } |
| | | } |
| | | }; |
| | | const validateTruename = (rule, value, callback) => { |
| | | if (!value) { |
| | | callback(new Error("请填写用户姓名")); |
| | | } else { |
| | | const rep = /^[\u4E00-\u9FA5]{2,4}$/; |
| | | if (!rep.test(value)) { |
| | | callback("请输入正确的用户姓名"); |
| | | } |
| | | } |
| | | }; |
| | |
| | | }; |
| | | return { |
| | | user: { |
| | | id: '', |
| | | departName: '', |
| | | parentId: '', |
| | | departDes: '', |
| | | departType:'', |
| | | }, |
| | | createUserRules: { |
| | | id: [ |
| | | { required: true, trigger: "blur", validator: validateId }, |
| | | ], |
| | | departName: [ |
| | | { required: true, trigger: "blur", validator: validateNickname }, |
| | | ], |
| | | parentId: [ |
| | | { required: true, trigger: "blur", validator: validatePass }, |
| | | { required: false, trigger: "blur", validator: validatePass }, |
| | | ], |
| | | departDes: [ |
| | | { required: true, trigger: "blur", validator: validateTruename }, |
| | | { required: false, trigger: "blur" }, |
| | | ], |
| | | departType: [ |
| | | { required: true, trigger: "blur" }, |
| | | { required: false, trigger: "blur" }, |
| | | ], |
| | | }, |
| | | roleList: [ |
| | |
| | | methods: { |
| | | handleUser() { |
| | | const { user } = this; |
| | | this.$axios.post('sccg/depart/status', { |
| | | id: user.departmentId, |
| | | status: user.status ? 1 : 0, |
| | | const that = this; |
| | | this.$axios.post('sccg/depart/update', { |
| | | id: user.id, |
| | | departName: user.departName, |
| | | parentId: user.parentId, |
| | | departDes: user.departDes |
| | | }).then(res => { |
| | | console.log(res); |
| | | this.$emit('changeDialog',{dialogUpdate:false}); |
| | | this.getUserList(); |
| | | }) |
| | | } |
| | | }, |
| | | props: ['userInfo', 'updateFlag'] |
| | | props: ['userInfo', 'updateFlag', 'getUserList', 'changeDialog'] |
| | | } |
| | | </script> |
| | | <style lang="scss" scoped> |
| | |
| | | line-height: 60px; |
| | | padding: 0 20px; |
| | | border: 1px solid #fff; |
| | | |
| | | .headerTitle { |
| | | color: #4b9bb7; |
| | | font-weight: 600; |
| | |
| | | padding: 0 55px; |
| | | background-color: #09152f; |
| | | padding-bottom: 50px; |
| | | |
| | | .mainTitle { |
| | | color: #4b9bb7; |
| | | font-weight: 600; |
| | |
| | | display: flex; |
| | | justify-content: center; |
| | | margin-top: 50px; |
| | | |
| | | .el-form-item__content { |
| | | width: 400px; |
| | | |
| | |
| | | </el-form-item> |
| | | <!-- 当前职务 --> |
| | | <el-form-item class="optionItem" label="当前职务:" prop="jobTitle"> |
| | | <el-select v-model="user.work" placeholder="请选择当前职务"> |
| | | <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value" |
| | | :disabled="item.disabled"> |
| | | </el-option> |
| | | </el-select> |
| | | <el-input v-model="user.work" placeholder="请输入当前职务" ></el-input> |
| | | </el-form-item> |
| | | <!-- 填写所属mac地址 --> |
| | | <!-- <el-form-item class="optionItem" label="填写所属mac地址:" prop="mac"> |