添加用户

src/api/login.js

@@ -4,21 +4,10 @@ export function login(data) {
   return request({
     url: '/login',
     method: 'post',
-    data
+    data,
+    headers:{
+      "Content-Type":' application/x-www-form-urlencoded'
+    }
   })  
 }
 
-export function getInfo(token) {
-  return request({
-    url: '',
-    method: 'get',
-    params: { token }
-  })
-}
-
-export function logout() {
-  return request({
-    url: '',
-    method: 'post'
-  })
-}

src/layout/sidebar/sidebarItem.vue

@@ -1,25 +1,18 @@
 <template>
   <div>
-    <div v-for="(menu, index) in $store.state.menus" :key="index">
+    <div v-for="(menu, index) in menus" :key="index">
       <el-submenu :index="String(index)" v-if="menu.submenus != null">
         <template slot="title">
           <el-image :src="menu.url"></el-image>
           <span>{{ menu.name }}</span>
         </template>
-        <el-menu-item-group
-          v-for="(submenu, index2) in menu.submenus"
-          :key="index2"
-        >
+        <el-menu-item-group v-for="(submenu, index2) in menu.submenus" :key="index2">
           <el-menu-item :index="submenu.path">
             <span class="subMenu">{{ submenu.name }}</span>
           </el-menu-item>
         </el-menu-item-group>
       </el-submenu>
-      <el-menu-item
-        v-if="menu.submenus == null"
-        :key="menu.path"
-        :index="menu.path"
-      >
+      <el-menu-item v-if="menu.submenus == null" :key="menu.path" :index="menu.path">
         <el-image :src="menu.url"></el-image>
         <span slot="title">
           {{ menu.name }}
@@ -31,7 +24,125 @@
 <script>
 export default {
   data() {
-    return {};
+    return {
+      menus: [
+        {
+          url: require('@/assets/images/userManagement@3x.png'),
+          name: '用户管理',
+          submenus: [
+            {
+              name: '人员管理',
+              path: '/home/user/person',
+            },
+            {
+              name: '组织管理',
+              path: '/home/user/group',
+            },
+          ]
+        },
+        {
+          url: require('@/assets/images/roleManagement@3x.png'),
+          name: '角色管理',
+          path: '/home/role',
+        },
+        {
+          url: require('@/assets/images/permissionManagement@3x.png'),
+          name: '权限管理',
+          path: '/home/permission',
+        },
+        {
+          url: require('@/assets/images/systemConfiguration@3x.png'),
+          name: '系统配置',
+          path: '/home/system',
+          submenus: [
+            {
+              name: '策略配置',
+              path: '/home/system/strategy',
+            },
+            {
+              name: '消息配置',
+              path: '/home/system/message',
+            },
+            {
+              name: '信息配置',
+              path: '/home/system/info',
+            },
+            {
+              name: '指标配置',
+              path: '/home/system/index',
+            }
+          ]
+        },
+        {
+          url: require('@/assets/images/deviceManagement@3x.png'),
+          name: '设备管理',
+          path: '/home/device',
+          submenus: [
+            {
+              name: '设备配置',
+              path: '/home/device/config',
+            },
+            {
+              name: '设备告警',
+              path: '/home/device/warning',
+            }
+          ]
+        },
+        {
+          url: require('@/assets/images/dataManagement@3x.png'),
+          name: '数据管理',
+          path: '/home/data',
+          submenus: [
+            {
+              name: '报表配置',
+              path: '/home/data/statement',
+            },
+            {
+              name: '报告配置',
+              path: '/home/data/report',
+            },
+            {
+              name: '基础信息',
+              path: '/home/data/basicInfo',
+            }
+          ]
+        },
+        {
+          url: require('@/assets/images/serviceManagement@3x.png'),
+          name: '服务管理',
+          path: '/home/service',
+          submenus: [
+            {
+              name: '全部服务',
+              path: '/home/service/all',
+            },
+            {
+              name: '已安装服务',
+              path: '/home/service/installed',
+            },
+            {
+              name: '未安装服务',
+              path: '/home/service/uninstall',
+            },
+          ]
+        },
+        {
+          url: require('@/assets/images/securityManagement@3x.png'),
+          name: '安全管理',
+          path: '/home/security',
+          submenus: [
+            {
+              name: '日志监控',
+              path: '/home/security/logMonitor',
+            },
+            {
+              name: '系统监控',
+              path: '/home/security/systemMonitor',
+            },
+          ]
+        }
+      ],
+    };
   },
   methods: {
     selectMenu(menu) {
@@ -71,11 +182,11 @@ export default {
   padding: 0;
 }
 
-.el-menu-item-group > .span {
+.el-menu-item-group>.span {
   margin-left: 70px;
 }
 
-/deep/.el-menu--inline > {
+/deep/.el-menu--inline> {
   border: none;
   text-align: left;
 }

src/main.js

@@ -17,28 +17,6 @@ import "./utils/directive";
 Vue.use(ElementUI, { locale });
 Vue.prototype.axios = axios;
 
-router.afterEach((to, from, next) => {
-  let stateName = []; //保存 遍历已保存的name
-  let dict = {};
-  const name = to.name;
-  const path = to.path;
-
-  if (name) {
-    dict.name = name;
-    dict.path = path;
-
-    let stateRouterMenuMessage = store.state.routerMenuMessage;
-    for (let item of stateRouterMenuMessage) {
-      stateName.push(item.name);
-    }
-    let isExist = stateName.indexOf(name);
-    if (isExist) {
-      stateRouterMenuMessage.push(dict);
-    }
-  }
-  // next();
-});
-
 new Vue({
   router,
   store,

src/store/index.js

@@ -1,135 +1,13 @@
 import Vue from 'vue'
 import Vuex from 'vuex'
-import user from './user'
+import user from './modules/user'
 import getters from './getters'
 
 Vue.use(Vuex)
 
 export default new Vuex.Store({
-  getters, user,
-  state: {
-    routerMenuMessage: [
-      {
-        name: '首页',
-        path: '/home'
-      }
-    ],
-    menus: [
-      {
-        url: require('@/assets/images/userManagement@3x.png'),
-        name: '用户管理',
-        submenus: [
-          {
-            name: '人员管理',
-            path: '/home/user/person',
-          },
-          {
-            name: '组织管理',
-            path: '/home/user/group',
-          },
-        ]
-      },
-      {
-        url: require('@/assets/images/roleManagement@3x.png'),
-        name: '角色管理',
-        path: '/home/role',
-      },
-      {
-        url: require('@/assets/images/permissionManagement@3x.png'),
-        name: '权限管理',
-        path: '/home/permission',
-      },
-      {
-        url: require('@/assets/images/systemConfiguration@3x.png'),
-        name: '系统配置',
-        path: '/home/system',
-        submenus: [
-          {
-            name: '策略配置',
-            path: '/home/system/strategy',
-          },
-          {
-            name: '消息配置',
-            path: '/home/system/message',
-          },
-          {
-            name: '信息配置',
-            path: '/home/system/info',
-          },
-          {
-            name: '指标配置',
-            path: '/home/system/index',
-          }
-        ]
-      },
-      {
-        url: require('@/assets/images/deviceManagement@3x.png'),
-        name: '设备管理',
-        path: '/home/device',
-        submenus: [
-          {
-            name: '设备配置',
-            path: '/home/device/config',
-          },
-          {
-            name: '设备告警',
-            path: '/home/device/warning',
-          }
-        ]
-      },
-      {
-        url: require('@/assets/images/dataManagement@3x.png'),
-        name: '数据管理',
-        path: '/home/data',
-        submenus: [
-          {
-            name: '报表配置',
-            path: '/home/data/statement',
-          },
-          {
-            name: '报告配置',
-            path: '/home/data/report',
-          },
-          {
-            name: '基础信息',
-            path: '/home/data/basicInfo',
-          }
-        ]
-      },
-      {
-        url: require('@/assets/images/serviceManagement@3x.png'),
-        name: '服务管理',
-        path: '/home/service',
-        submenus: [
-          {
-            name: '全部服务',
-            path: '/home/service/all',
-          },
-          {
-            name: '已安装服务',
-            path: '/home/service/installed',
-          },
-          {
-            name: '未安装服务',
-            path: '/home/service/uninstall',
-          },
-        ]
-      },
-      {
-        url: require('@/assets/images/securityManagement@3x.png'),
-        name: '安全管理',
-        path: '/home/security',
-        submenus: [
-          {
-            name: '日志监控',
-            path: '/home/security/logMonitor',
-          },
-          {
-            name: '系统监控',
-            path: '/home/security/systemMonitor',
-          },
-        ]
-      }
-    ],
+  getters,
+  modules:{
+    user
   }
 })

src/store/user.js → src/store/modules/user.js

@@ -1,9 +1,9 @@
 import { login } from '@/api/login'
-import { setToken } from '@/utils/auth'
-
+import { getToken } from '@/utils/auth'
 const user = {
+    namespaced: true,
     state: {
-        token: '',
+        token: getToken(),
         name: '',
         avatar: '',
         role: []
@@ -27,10 +27,11 @@ const user = {
         login({ commit }, userInfo) {
             const { username, password } = userInfo;
             return new Promise((resolve, reject) => {
-                login({ username: username.trim(), password: password }).then(response => {
-                    const { data } = response;
-                    commit('SET_TOKEN', data.token);
-                    setToken(data.token);
+                login({ username: username.trim(), password: password }).then(res => {
+                    const { data } = res;
+                    console.log(data);
+                    commit('SET_TOKEN', data.date);
+                    localStorage.setItem('Authorization',data.date);
                     resolve(data);
                 }).catch(error => {
                     console.log('登陆失败');

src/utils/auth.js

@@ -1,15 +1,11 @@
-import Cookies from 'js-cookie'
-
-const TokenKey = 'Token'
 
 export function getToken() {
-  return Cookies.get(TokenKey)
+  return localStorage.getItem('Authorization');
 }
 
 export function setToken(token) {
-  return Cookies.set(TokenKey, token)
 }
 
 export function removeToken() {
-  return Cookies.remove(TokenKey)
+
 }

src/utils/requestMethod.js

@@ -1,7 +1,5 @@
 import request from '@/utils/request'
-import user from "@/store/user"
-
-let currentToken = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjoxLCJ1c2VyX25hbWUiOiJcdTVmMjBcdTRlMDkiLCJleHAiOjE2ODA5MzM4Mzd9.FIkjJKlrssf4MYABzO2NQ76rxI4w6EOvqRm0aEi-LZY"
+import user from '@/store/modules/user';
 
 function get(url, params) {
   return new Promise((resolve, reject) => {
@@ -10,7 +8,7 @@ function get(url, params) {
       url,
       params: params,
       headers: {
-        token: user.token || currentToken,
+        token: user.state.token,
       },
     })
       .then((res) => {
@@ -29,7 +27,7 @@ function post(url, data) {
       url,
       data: data,
       headers: {
-        token: user.token || currentToken,
+        token: user.state.token,
         "Content-Type": "multipart/form-data;",
       },
     })
@@ -49,7 +47,7 @@ function put(url, data) {
       url,
       data: data,
       headers: {
-        token: user.token || currentToken,
+        token: user.state.token,
         "Content-Type": "application/json;",
       },
     })
@@ -69,7 +67,7 @@ function del(url, data) {
       url,
       data: data,
       headers: {
-        token: user.token || currentToken,
+        token: user.state.token,
         "Content-Type": "application/json;",
       },
     })

src/views/login/index.vue

@@ -54,17 +54,13 @@
 </template>
 
 <script>
-import { validUsername } from '@/utils/validate';
 import identify from '@/components/Identify/index';
-import { login } from '@/api/login';
 export default {
     components: { identify },
     data() {
         const validateUsername = (rule, value, callback) => {
             if (value === '') {
                 callback(new Error('用户名不能为空！'));
-            } else if (!validUsername(value)) {
-                callback(new Error('请输入正确的用户名！'));
             } else {
                 callback();
             }
@@ -88,7 +84,7 @@ export default {
         return {
             title: '智慧运营管理中心',
             loginForm: {
-                username: 'admin',
+                username: 'user001',
                 password: '123456',
                 vertification: '',
             },
@@ -123,47 +119,38 @@ export default {
     //     }
     // },
     methods: {
-        // handleLogin() {
-        //     if (this.loginForm.vertification.toLowerCase() != this.identifyCode.toLowerCase()) {
-        //         this.$message.error('请输入正确的验证码!');
-        //         this.refreshCode();
-        //     } else {
-        //         this.$refs.loginForm.validate(valid => {
-        //             if (valid) {
-        //                 this.loading = true;
-        //                 this.$store.dispatch('user/login', this.loginForm).then((res) => {
-        //                     if (res.data.code == 200) {
-        //                         let Authorization = res.data.token;
-        //                         localStorage.setItem('Authorization', Authorization);
-        //                         this.$message.success('登录成功');
-        //                         this.$router.push({ path: '/home' });
-        //                         this.loading = false;
-        //                     } else {
-        //                         this.$message.error(res.data.message);
-        //                     }
-        //                 }).catch(() => {
-        //                     this.loading = false;
-        //                 })
-        //             } else {
-        //                 return false;
-        //             }
-        //         })
-        //     }
-        // },
+        //登录验证
         handleLogin() {
             if (this.loginForm.vertification.toLowerCase() != this.identifyCode.toLowerCase()) {
                 this.$message.error('请输入正确的验证码!');
                 this.refreshCode();
             } else {
-                if (this.loginForm.username === 'admin' && this.loginForm.password === '123456') {
-                    this.$router.push('/home');
-                }
+                this.$refs.loginForm.validate(valid => {
+                    if (valid) {
+                        this.loading = true;
+                        this.$store.dispatch('user/login', this.loginForm).then((res) => {
+                            if (res.code == 0) {
+                                this.$message.success(res.message);
+                                this.$router.push({ path: '/home' });
+                                this.loading = false;
+                            } else {
+                                this.$message.error(res.message);
+                            }
+                        }).catch(() => {
+                            this.loading = false;
+                        })
+                    } else {
+                        return false;
+                    }
+                })
             }
         },
+        //验证码刷新
         refreshCode() {
             this.identifyCode = '';
             this.makeCode(4);
         },
+        //验证码生成
         makeCode(l) {
             for (let i = 0; i < l; i++) {
                 this.identifyCode += this.identifyCodes[this.randomNum(0, this.identifyCodes.length)];
@@ -173,7 +160,7 @@ export default {
             return Math.floor(Math.random() * (max - min) + min);
         },
         getVetifiedCode() {
-
+            //
         }
     },
     mounted() {

src/views/userManagement/personManagement/index.vue

@@ -8,7 +8,7 @@
                 <i class="el-icon-user"></i>停用账户
             </el-button>
                 <el-input class="searchBox" v-model="input" placeholder="用户名；手机；单位" suffix-icon="el-icon-search"></el-input>
-            <el-button class="addUser">
+            <el-button class="addUser" @click="addUser()">
                 <i class="el-icon-user"></i>添加用户
             </el-button>
         </div>
@@ -16,6 +16,8 @@
             <activeuser v-show="show"></activeuser>
             <deactiveuser v-show="show1"></deactiveuser>
         </div>
+        <!--弹窗-->
+        <userinfo ref="addUser"></userinfo>
     </div>
 </template>
 
@@ -23,7 +25,7 @@
 import activeuser from './tables/activeUser'
 import deactiveuser from './tables/deactiveUser'
 import table3 from './tables/table3'
-import userinfo from './messageDialog/userInfo'
+import userinfo from './messageDialog/addUser'
 
 
 export default {
@@ -49,6 +51,9 @@ export default {
             this.show = false;
             this.show1 = true;
         },
+        addUser(){
+            this.$refs.addUser.dialogVisible = true;
+        }
     }
 };
 </script>

src/views/userManagement/personManagement/messageDialog/addUser.vue

@@ -0,0 +1,252 @@
+<template>
+    <div>
+        <el-dialog v-dialog-drag class="dialog" title="添加用户" :visible.sync="dialogVisible" width="30%" append-to-body
+            center>
+            <el-divider></el-divider>
+            <div style="height: 550px; padding: 20px">
+                <el-form ref="form" :model="form" label-position="right" label-width="75px">
+                    <el-form-item style="margin-bottom: 0;" label="用户名：" prop="username">
+                        <div>
+                            <el-input class="username" type="text" v-model="form.username" placeholder="用户名" @input="charStatic"></el-input>
+                            <p style="font-size: 12px; line-height: 20px; color: #E9E9E9;">最大长度64个字符，允许英文字母、数字或特殊字符 {{
+                                charNum }}/64</p>
+                        </div>
+                    </el-form-item>
+                    <el-form-item style="margin-bottom: 0; width: 380px; " label-width="65px" label="密码:" prop="password">
+                        <div>
+                            <el-input class="password" v-model="form.password" placeholder="密码" show-password></el-input>
+                            <p style="font-size: 12px; line-height: 20px; color: #E9E9E9;">最小长度8个字符，需带有英文字母、数字与特殊字符</p>
+                        </div>
+                    </el-form-item>
+                    <el-form-item label="姓名：" prop="name">
+                        <el-input class="name" v-model="form.name" placeholder="姓名"></el-input>
+                    </el-form-item>
+                    <el-form-item label="电话：" prop="phone">
+                        <div style="display: flex;">
+                            <el-select class="select" v-model="select">
+                                <el-option label="CN+86"></el-option>
+                            </el-select>
+                            <el-input class="phone" v-model="form.phone" placeholder="请输入手机号">
+                            </el-input>
+                        </div>
+                    </el-form-item>
+                    <el-form-item label="邮箱：" prop="email">
+                        <el-input v-model="form.email" placeholder="请输入"></el-input>
+                    </el-form-item>
+                    <el-form-item label="公司：" prop="copporation">
+                        <el-input v-model="form.corporation" placeholder="公司"></el-input>
+                    </el-form-item>
+                    <el-form-item label="部门：" prop="department">
+                        <el-input v-model="form.department" placeholder="部门"></el-input>
+                    </el-form-item>
+                    <div style="display: flex;">
+                        <el-form-item label="角色：" prop="role">
+                            <el-select v-model="form.role">
+                                <el-option value="用户组"></el-option>
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="权限：" prop="permission">
+                            <el-select v-model="form.permission">
+                                <el-option value="权限级别"></el-option>
+                            </el-select>
+                        </el-form-item>
+                    </div>
+                    <div style="display: flex;">
+                        <el-form-item label="在职状态：" prop="working_status">
+                            <el-select v-model="form.working_status">
+                                <el-option value="在职"></el-option>
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="职务：" prop="post">
+                            <el-select v-model="form.post">
+                                <el-option value="职务"></el-option>
+                            </el-select>
+                        </el-form-item>
+                    </div>
+                    <div style="display: flex;">
+                        <el-form-item label="账户状态：" prop="account_status">
+                            <el-select v-model="form.account_status">
+                                <el-option value="正常"></el-option>
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="国籍：" prop="nationality">
+                            <el-select v-model="form.nationality">
+                                <el-option value="中国"></el-option>
+                            </el-select>
+                        </el-form-item>
+                    </div>
+                    <div class="avatar">
+                        <el-avatar :size="110" :src="testUrl" @click=""></el-avatar>
+                        <span>
+                            <p style="font-size: 12px; line-height: 20px; color: #E9E9E9; text-align: center;">上传头像</p>
+                        </span>
+                    </div>
+                </el-form>
+            </div>
+            <div slot="footer" class="dialog-footer">
+                <el-button class="next">下一个</el-button>
+                <el-button class="reset" @click="resetForm('form')">重置</el-button>
+                <el-button class="update" @click="submitForm('form')">更新</el-button>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            dialogVisible: false,
+            form: {
+                username: '',
+                password: '',
+                name: '',
+                phone: '',
+                email: '',
+                corporation: '',
+                department: '',
+                role: '',
+                permission: '',
+                working_status: '',
+                post: '',
+                account_status: '',
+                nationality: ''
+            },
+            charNum:0,
+            testUrl: require('@/assets/images/头像上传@3x.png')
+        }
+    },
+    watch: {
+        charStatic(){
+            
+        }
+    },
+    methods: {
+        handleNodeClick() {
+
+        },
+        resetForm(formName) {
+            this.$refs[formName].resetFields();
+        },
+        submitForm(formName) {
+            this.$refs[formName].validate((valid) => {
+                if (valid) {
+                    //
+                }
+            })
+        }
+    }
+
+}
+</script>
+<style lang="less" scoped>
+/deep/.el-dialog {
+    height: 750px !important;
+}
+.next{
+    background-color: #2EA8E6;
+    color: #FFFFFF;
+}
+.reset{
+    background-color: #B3B3B3;
+    color: #FFFFFF;
+}
+.update{
+    background-color: #2EA8E6;
+    color: #FFFFFF;
+}
+
+.avatar {
+    position: absolute;
+    right: 40px;
+    top: 100px;
+}
+
+.select {
+    /deep/.el-input__inner {
+        width: 100px;
+        border-right: 0;
+        border-top-right-radius: 0;
+        border-bottom-right-radius: 0;
+    }
+}
+
+.phone {
+    /deep/.el-input__inner {
+        border-left: 0;
+        border-top-left-radius: 0;
+        border-bottom-left-radius: 0;
+    }
+}
+
+.username {
+    /deep/.el-input__inner {
+        width: 300px !important;
+    }
+}
+
+.password {
+    margin-left: 10px;
+        /deep/.el-input__inner {
+        width: 300px !important;
+    }
+}
+
+.name {
+    /deep/.el-input__inner {
+        width: 300px !important;
+    }
+}
+
+.el-form {
+    .el-form-item {
+        margin-bottom: 15px;
+        /deep/.el-form-item__label {
+            padding: 0;
+            font-size: 15px;
+        }
+        /deep/.el-input__inner {
+            height: 30px;
+            background-color: #F7F9FA;
+        }
+    }
+}
+
+
+
+/deep/.el-dialog {
+    height: 30vh;
+}
+
+/deep/.el-dialog__title {
+    margin-right: 450px;
+}
+
+/deep/.el-dialog__headerbtn {
+    font-size: 25px;
+}
+
+/deep/.el-dialog__body {
+    padding: 0;
+}
+
+/deep/.el-divider--horizontal {
+    display: block;
+    height: 1px;
+    width: 95%;
+    margin: 0;
+    margin-left: 2.5%;
+}
+
+/deep/.el-dialog__footer {
+    margin-top: 0px;
+}
+
+.el-button {
+    width: 100px;
+    height: 30px;
+    text-align: center;
+    margin: 30px;
+    padding: 5px;
+}
+</style>

src/views/userManagement/personManagement/messageDialog/userInfo.vue

@@ -1,142 +0,0 @@
-<template>
-    <div class="form">
-        <div class="header">
-            <p style="text-align: left;margin-top: 10px;margin-left: 20px;">用户详情</p><span><i
-                    class="el-icon-close"></i></span>
-        </div>
-        <el-form :model="form" label-position="left" label-width="80px">
-            <el-form-item style="width: 350px;" :model="form.username" label="用户名：">
-                <el-input placeholder="test" type="text"></el-input>
-            </el-form-item>
-            <el-form-item style="width: 350px;" :model="form.password" label="密码：">
-                <el-input placeholder="test" show-password></el-input>
-            </el-form-item>
-            <el-form-item style="width: 350px;" :model="form.name" label="姓名：">
-                <el-input placeholder="test"></el-input>
-            </el-form-item>
-            <el-form-item style="width: 500px;" :model="form.phone" label="电话：">
-                <el-select style="width: 100px;">
-                    <el-option label="CN +86"></el-option>
-                </el-select><span><el-input style="width: 280px;" placeholder="test"></el-input></span>
-            </el-form-item>
-            <el-form-item :model="form.email" label="邮箱：">
-                <el-input style="width: 380px;" placeholder="test"></el-input>
-            </el-form-item>
-            <el-form-item :model="form.corporation" label="公司：">
-                <el-input style="width: 380px;" placeholder="test"></el-input>
-            </el-form-item>
-            <el-form-item :model="form.department" label="部门：">
-                <el-input style="width: 380px;" placeholder="test"></el-input>
-            </el-form-item>
-            <div style="display: flex;">
-                <el-form-item :model="form.role" label="角色：">
-                    <el-select style="width: 130px;">
-                        <el-option label="CN +86"></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.permission" label="权限：">
-                    <el-select style="width: 130px;">
-                        <el-option label="CN +86"></el-option>
-                    </el-select>
-                </el-form-item>
-            </div>
-            <div style="display: flex;">
-                <el-form-item :model="form.working_status" label="在职状态：">
-                    <el-select style="width: 130px;">
-                        <el-option label="CN +86"></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.post" label="职务：">
-                    <el-select style="width: 130px;">
-                        <el-option label="CN +86"></el-option>
-                    </el-select>
-                </el-form-item>
-            </div>
-            <div style="display: flex;">
-                <el-form-item :model="form.account_status" label="账户状态：">
-                    <el-select style="width: 130px;">
-                        <el-option label="CN +86"></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.nationality" label="国籍：">
-                    <el-select style="width: 130px;">
-                        <el-option label="CN +86"></el-option>
-                    </el-select>
-                </el-form-item>
-            </div>
-            <div>
-                <el-button>下一个</el-button>
-                <el-button>重置</el-button>
-                <el-button>更新</el-button>
-            </div>
-            <el-avatar :size="122" :src="testUrl"></el-avatar>
-        </el-form>
-    </div>
-</template>
-
-<script>
-export default {
-    data() {
-        return {
-            form: {
-
-            },
-            testUrl: 'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png'
-        }
-    }
-
-}
-</script>
-<style lang="less" scoped>
-.form {
-    position: absolute;
-    left: 500px;
-    width: 586px;
-    height: 700px;
-    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
-}
-
-.el-form {
-    margin: 40px 0 0 0;
-
-    .el-form-item {
-        padding-top: 20px;
-        margin-inline: 20px;
-        margin-bottom: 0;
-    }
-    /deep/.el-form-item__label{
-        padding: 0;
-    }
-    /deep/.el-form-item__content{
-        display: flex;
-    }
-}
-
-.header {
-    position: absolute;
-    top: 0;
-    width: 586px;
-    height: 40px;
-    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
-
-    .el-icon-close {
-        position: absolute;
-        top: 10px;
-        right: 10px;
-    }
-}
-
-
-.el-button {
-    width: 80px;
-    height: 30px;
-    text-align: center;
-    margin: 20px;
-    padding: 5px;
-}
-.el-avatar {
-    position: absolute;
-    right: 60px;
-    top: 80px;
-}
-</style>