修改整体样式--初步提交

src/styles/public.css

@@ -201,32 +201,32 @@
 
 /*新增按钮颜色*/
 
-.el-button--info{
-  border-color:#00CF75;
+.el-button--success{
+  border-color:#00BF78;
+  background-color: #00BF78;
   color:white;
-  background-color: transparent;
+  /* background-color: transparent; */
   
 }
 
-.el-button--info:focus, .el-button--info:hover{
-  border-color: #00CF75;
+.el-button--success:focus, .el-button--success:hover{
+  border-color: #00BF78;
   color:white;
-  background-color: transparent;
+  background-color: #00BF78;
   
 }
 
 /* 清空按钮颜色  */
 
 .el-button--info{
-  border-color: #104FFF;
-  color:#104FFF;
+  border-color: #00BF78;
+  color:#00BF78;
   background-color: transparent;
-  
 }
 
 .el-button--info:focus, .el-button--info:hover{
-  border-color: #104FFF;
-  color:#104FFF;
+  border-color: #00BF78;
+  color:#00BF78;
   background-color: transparent;
   
 }
@@ -261,14 +261,14 @@
 .el-button--primary {
   
   color: #fff;
-  background-color: #104FFF;
-  border-color: #57acbb;
+  background-color: #565656;
+  border-color: #565656;
 }
 
 .el-button--primary:focus,
 .el-button--primary:hover {
-  background: #104FFF;
-  border-color: #59bbcc;
+  background: #565656;
+  border-color: #565656;
   color: #FFF;
 }
 
@@ -394,4 +394,25 @@
 }
 .add_class{
   margin-left: auto !important;
+}
+
+
+/* 单选框样式 */
+.el-radio__input.is-checked .el-radio__inner {
+  border-color: #00BF78;
+  background: #00BF78;
+}
+
+.el-radio__input.is-checked+.el-radio__label {
+  color: #000000;
+}
+
+/* 分页样式 */
+.el-pagination.is-background .el-pager li:not(.disabled).active {
+  background-color: #00BF78;
+  color: #FFF;
+}
+
+.pag_class{
+  text-align: end;
 }

src/utils/http.js

@@ -18,7 +18,8 @@ import { router } from "@/router";
 // axios.defaults.baseURL = 'https://child.hhnao.com:8070';
 //https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx01d1a44906973cf2&redirect_uri=http%3A%2F%2F192.168.18.51%3A8085&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect
 // export const basePath='http://10.113.248.3:8086'
-export const basePath='http://10.113.248.4:8089'
+export const basePath = "http://10.113.248.4:8089";
+// const base_url = 'http://10.113.248.4:8090/'
 // export const basePath='http://43.143.198.30:8086'
 axios.defaults.baseURL = basePath;
 // axios.defaults.baseURL = "http://43.143.198.30:8086";
@@ -29,10 +30,11 @@ axios.defaults.baseURL = basePath;
 // var urlCode ='https://child.hhnao.com';
 var urlCode = "";
 
-//接口白名单 
-var whiteList=[
-  '/user/blogin','/user/getCode'
-]
+//接口白名单
+var whiteList = ["/user/blogin", "/user/getCode"];
+
+//数据是否要加密
+var isMI = false;
 
 // axios.defaults.baseURL = 'http://cognitive.wistcm.com:8060/';
 // axios.defaults.baseURL = process.env.VUE_APP_BASE_URL;
@@ -47,18 +49,18 @@ axios.defaults.withCredentials = true;
 
 axios.interceptors.request.use(
   function (config) {
-    for(let i=0;i<whiteList.length;i++){
-      if(whiteList[i]!==config.url){
+    for (let i = 0; i < whiteList.length; i++) {
+      if (whiteList[i] !== config.url) {
         ////不在白名单内，需要判断用户是否在，不在的话存储到登录页
-        
-        if(oSessionStorage.getItem("userInfo")==''){
+
+        if (oSessionStorage.getItem("userInfo") == "") {
           router.replace({
             path: "/",
             // query: {redirect: router.currentRoute.fullPath}
           });
         }
         //在此判断需要  判断用户缓存是否存在
-          // break
+        // break
       }
     }
     //发送请求前判断token是存在
@@ -82,7 +84,7 @@ axios.interceptors.request.use(
     config.headers.Authorization = oSessionStorage.getItem("token")
       ? `Bearer ${oSessionStorage.getItem("token")}`
       : "";
-  //  console.log(config.headers.Authorization)
+    //  console.log(config.headers.Authorization)
     return config;
   },
   function (error) {
@@ -119,10 +121,20 @@ axios.interceptors.response.use(
 const http = {
   get: (url, data, sCallBack) => {
     if (data) {
-      data = Encrypt(JSON.stringify(data));
+      if (isMI) {
+        data = Encrypt(JSON.stringify(data));
+      } else {
+        data = JSON.stringify(data);
+      }
     }
     axios.get(url, { params: data }).then((res) => {
-      res.data = JSON.parse(Decrypt(res.data));
+      // res.data = JSON.parse(Decrypt(res.data));
+      if (isMI) {
+        res.data = JSON.parse(Decrypt(res.data));
+      } else {
+        // res.data = JSON.parse(res.data);
+      }
+      debugger
       if (sCallBack) {
         sCallBack(res.data);
       }
@@ -132,16 +144,19 @@ const http = {
     if (data) {
       data = Encrypt(JSON.stringify(data));
     }
-    axios({
-      method: "get",
-      url: url,
-      responseType: "blob",
-      params: data,
-      headers: {
-        Accept: "application/octet-stream",
-      //  "Content-Disposition":"attachment"
+    axios(
+      {
+        method: "get",
+        url: url,
+        responseType: "blob",
+        params: data,
+        headers: {
+          Accept: "application/octet-stream",
+          //  "Content-Disposition":"attachment"
+        },
       },
-    },{responseType:"arraybuffer"}).then((res) => {
+      { responseType: "arraybuffer" }
+    ).then((res) => {
       sCallBack(res);
     });
   },
@@ -156,7 +171,7 @@ const http = {
       params: data,
       headers: {
         // Accept: "application/octet-stream",
-        "Content-Disposition": "attachment" 
+        "Content-Disposition": "attachment",
       },
     }).then((res) => {
       sCallBack(res);
@@ -164,12 +179,21 @@ const http = {
   },
   post: (url, data, sucessCallBack, errCallBack) => {
     if (data) {
-      data = Encrypt(JSON.stringify(data));
+      if (isMI) {
+        data = Encrypt(JSON.stringify(data));
+      } else {
+        // data = JSON.stringify(data);
+        // data = data;
+      }
     }
-    axios.post(url, { data: data }).then((res) => {
+    axios.post(url,  data ).then((res) => {
       // res.status
       if (res) {
-        res.data = JSON.parse(Decrypt(res.data));
+        if (isMI) {
+          res.data = JSON.parse(Decrypt(res.data));
+        }else{
+          res.data = JSON.parse(res.data);
+        }
       }
 
       if (res.status >= 200 && res.status < 300) {
@@ -190,12 +214,22 @@ const http = {
   },
   delete: (url, data, sucessCallBack, errCallBack) => {
     if (data) {
-      data = Encrypt(JSON.stringify(data));
+      if(isMI){
+        data = Encrypt(JSON.stringify(data));
+      }else{
+        data = JSON.stringify(data);
+      }
+   
     }
     axios.delete(url, { data: data }).then((res) => {
       // res.status
       if (res) {
-        res.data = JSON.parse(Decrypt(res.data));
+        if(isMI){
+          res.data = JSON.parse(Decrypt(res.data));
+        }else{
+          res.data = JSON.parse(res.data);
+        }
+       
       }
 
       if (res.status >= 200 && res.status < 300) {

src/views/loginNew.vue

@@ -2,34 +2,23 @@
   <div class="login-wrapper-new">
     <div class="login-left-new">
       <div class="cpdm_left">
-        <img class="logo"  src="../assets/img/login/login_logo.png"  />
-        <img class="ye1" src="../assets/img/login/ye1.png">
-        <img class="ye2" src="../assets/img/login/ye2.png">
+        <img class="logo" src="../assets/img/login/login_logo.png" />
+        <img class="ye1" src="../assets/img/login/ye1.png" />
+        <img class="ye2" src="../assets/img/login/ye2.png" />
       </div>
       <div class="cpdm_right">
-        <el-form
-          class="login-left-middle-new"
-          :model="ruleForm"
-          :rules="rules"
-          ref="ruleForm"
-          :label-position="'left'"
-          label-width="10px"
-          size="mini"
-        >
+        <el-form class="login-left-middle-new" :model="ruleForm" :rules="rules" ref="ruleForm" :label-position="'left'"
+          label-width="10px" size="mini">
+          <div class="cpdm_right_top">
+            <div class="cpdm_right_top_des">欢迎登录</div>
+            <img class="cpdm_right_top_img" src="../assets/img/login/login-left-top.png" />
+          </div>
           <el-form-item label="" prop="account" class="account-new">
-            <el-input
-              class="input-account-new"
-              type="text"
-              v-model="ruleForm.account"
-              placeholder="请输入账号"
-              autocomplete="off"
-            >
+            <el-input class="input-account-new" type="text" v-model="ruleForm.account" placeholder="请输入账号"
+              autocomplete="off">
               <template slot="prefix">
                 <div class="account-inner">
-                  <img
-                    style="height: 20px; margin-left: 10px"
-                    src="../assets/img/login/persion.png"
-                  />
+                  <img style="height: 20px; margin-left: 10px" src="../assets/img/login/persion1.png" />
                   <div class="account-inner-line"></div>
                 </div>
               </template>
@@ -37,34 +26,26 @@
             <!-- <img src="../assets/img/login/persion.png" /> -->
           </el-form-item>
           <el-form-item label="" class="account-two-new" prop="pass">
-            <el-input
-              class="input-password-new"
-              type="password"
-              placeholder="请输入密码"
-              v-model="ruleForm.pass"
-              autocomplete="off"
-            >
+            <el-input class="input-password-new" type="password" placeholder="请输入密码" v-model="ruleForm.pass"
+              autocomplete="off">
               <template slot="prefix">
                 <div class="account-inner">
-                  <img
-                    style="height: 20px; margin-left: 10px"
-                    src="../assets/img/login/password.png"
-                  />
+                  <img style="height: 20px; margin-left: 10px" src="../assets/img/login/password1.png" />
                   <div class="account-inner-line"></div>
                 </div>
               </template>
             </el-input>
           </el-form-item>
-          <el-form-item class="button-new-parent">
-            <el-button class="button-new" type="primary" @click="submitForm('ruleForm')"
+          <el-form-item class="button-new-parent_login">
+            <!-- <el-button class="button-new" type="primary" @click="submitForm('ruleForm')"
               >登&nbsp;录</el-button
-            >
+            > -->
             <!-- <el-button @click="resetForm('ruleForm')">重置</el-button> -->
+            <div class="button-new" @click="submitForm('ruleForm')">登录</div>
           </el-form-item>
         </el-form>
       </div>
     </div>
-    
   </div>
 </template>
 
@@ -149,28 +130,38 @@ export default {
     submitForm(formName) {
       this.$refs[formName].validate((valid) => {
         if (valid) {
-          this.$http.post(
-            `/user/blogin`,
+          //?userNo=${this.ruleForm.account}&password=${md5(this.ruleForm.pass)}
+          this.$http.get(
+            `/system/login?userNo=${this.ruleForm.account}&password=${md5(this.ruleForm.pass)}`,
             //"/v1/system/login",
             {
-              name: this.ruleForm.account,
-              password: md5(this.ruleForm.pass),
-              imgText: this.ruleForm.imgText,
+              // userNo: this.ruleForm.account,
+              // password: md5(this.ruleForm.pass),
+              // imgText: this.ruleForm.imgText,
               // type: 0,
             },
             (res) => {
               console.log(res, "登录返回");
               if (res && res.code == 200) {
+                // type等于3  超级管理员
+                // type等于2  普通管理员
+                // type等于1  普通用户等不能登录
+
                 oSessionStorage.setItem("userInfo", JSON.stringify(res.data.user));
                 oSessionStorage.setItem("token", res.data.token);
                 // oSessionStorage.setItem("invitationCode", res.data.user.invitationCode);
                 //如果类型返回的是0则为普通用户
                 //如果类型返回的是1则为管理员用户
                 // this.$router.push({ path: "/manage/adminHome" });
-                if (res.data.user.type == "1") {
+                if (res.data.user.roleType == "3") {
                   this.$router.push({ path: "/manage/userManage" });
-                } else {
+                } else if (res.data.user.roleType == "2") {
                   this.$router.push({ path: "/manage/channelInfo" });
+                } else if (res.data.user.roleType == "1") {
+                  this.$message({
+                    message: '请使用管理账号登录',
+                    type: "error",
+                  });
                 }
 
                 // if (res.data.user.roleType === "0") {
@@ -208,13 +199,16 @@ export default {
 };
 </script>
 <style scoped>
-.input-account-new >>> .el-input__inner {
-  background-color: #ffffff !important;
+.input-account-new>>>.el-input__inner {
+  background-color: #f7f7f7 !important;
   background-image: none;
   border-radius: 30px;
   border: 0px solid #dcdfe6;
   box-sizing: border-box;
+  border: 0px;
+  box-shadow: none;
 
+  outline: none;
   /*color: #fff;*/
   color: #000;
   display: inline-block;
@@ -226,20 +220,23 @@ export default {
   transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
   width: 100%;
 }
-.account-new >>> .el-input {
+
+.account-new>>>.el-input {
   display: table !important;
 }
 
-.input-account-new >>> .el-input__inner::placeholder {
+.input-account-new>>>.el-input__inner::placeholder {
   /*color: #f9f9f9;*/
   color: #9a9a9a;
 }
-.input-password-new >>> .el-input__inner::placeholder {
+
+.input-password-new>>>.el-input__inner::placeholder {
   /*color: #f9f9f9;*/
   color: #9a9a9a;
 }
-.input-password-new >>> .el-input__inner {
-  background-color: #ffffff !important;
+
+.input-password-new>>>.el-input__inner {
+  background-color: #f7f7f7 !important;
   background-image: none;
   border-radius: 30px;
   border: 0px solid #dcdfe6;
@@ -255,11 +252,8 @@ export default {
   transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
   width: 100%;
 }
-.button-new-parent >>> .el-form-item__content {
-  width: 100px;
-  /* margin-left: 0px !important; */
-  text-align: center;
-}
+
+.button-new-parent>>>.el-form-item__content {}
 </style>
 
 <style lang="less" scoped>
@@ -289,32 +283,37 @@ export default {
     height: 600px;
     box-sizing: border-box;
     border-radius: 40px;
+
     .cpdm_left {
       position: relative;
       width: 50%;
       height: 100%;
       background: url("../assets/img/login/login_left.png") no-repeat;
       background-size: 100% 100%;
-     .logo{
-      height:60px;
-      margin-left:10%;
-      margin-top:5%;
-      
-      width: auto;
-     }
-     .ye1{
-      width: 40px;
-      margin-left:-20px;
-      position: absolute;
-      margin-top:25%;
-     }
-     .ye2{
-      position: absolute;
-      margin-left:calc(100% - 20px) ;
-      width: 40px;
-      margin-top:40%;
-     }
+
+      .logo {
+        height: 60px;
+        margin-left: 10%;
+        margin-top: 5%;
+
+        width: auto;
+      }
+
+      .ye1 {
+        width: 40px;
+        margin-left: -20px;
+        position: absolute;
+        margin-top: 25%;
+      }
+
+      .ye2 {
+        position: absolute;
+        margin-left: calc(100% - 20px);
+        width: 40px;
+        margin-top: 40%;
+      }
     }
+
     .cpdm_right {
       background-color: #fff;
       width: 50%;
@@ -324,19 +323,41 @@ export default {
       border-bottom-right-radius: 40px;
     }
 
-
     .login-left-top-new {
       margin-left: 10%;
       width: 80%;
       padding-top: 10%;
       padding-bottom: 12%;
     }
+
     .login-left-middle-new {
       width: 78%;
       margin-left: 11%;
+
+      .cpdm_right_top {
+        margin-top: 50px;
+        margin-bottom: 60px;
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        justify-content: space-between;
+
+        .cpdm_right_top_des {
+          letter-spacing: 3px;
+          font-size: 30px;
+          font-weight: 700;
+          margin-left: 10px;
+        }
+
+        .cpdm_right_top_img {
+          width: 100px;
+        }
+      }
+
       .account-new {
         color: #fff;
         margin-bottom: 10%;
+
         .login-label {
           display: inline-block;
           margin-top: 8px;
@@ -345,19 +366,22 @@ export default {
           font-size: 16px;
           font-weight: bold;
         }
+
         .input-account-new {
           background: rgba(255, 255, 255, 0.2);
           border-radius: 30px 30px 30px 30px;
           opacity: 1;
           //border: 1px solid #ffffff;
-          border: 1px solid #0263c4;
+          // border: 1px solid #0263c4;
           width: 100%;
         }
       }
+
       .account-two-new {
         color: #fff;
 
         margin-bottom: 10%;
+
         .login-label {
           display: inline-block;
           margin-top: 8px;
@@ -366,12 +390,13 @@ export default {
           font-size: 16px;
           font-weight: bold;
         }
+
         .input-password-new {
           background: rgba(255, 255, 255, 0.2);
           border-radius: 30px 30px 30px 30px;
           opacity: 1;
           //border: 1px solid #ffffff;
-          border: 1px solid #0263c4;
+          // border: 1px solid #0263c4;
           width: 100%;
         }
       }
@@ -388,20 +413,24 @@ export default {
   font-size: 15px;
   z-index: 1000;
 }
+
 .beianDetail {
   display: flex;
   justify-items: center;
   align-items: center;
 }
+
 .login-title-p {
   text-align: center;
   font-size: 20px;
   margin-bottom: 40px;
 }
+
 .code-class {
   height: 100%;
   border-radius: 20px;
 }
+
 .account-inner {
   display: flex;
   flex-direction: row;
@@ -409,10 +438,31 @@ export default {
   align-items: center;
   height: 50px;
 }
+
 .account-inner-line {
   width: 1px;
   background-color: #b5c8ff;
   height: 30px;
   margin-left: 10px;
 }
+
+.button-new-parent_login {
+  margin-top: 80px;
+  display: flex;
+  justify-content: center;
+
+  .button-new {
+    text-align: center;
+    border-radius: 50px;
+    border: 3px solid #48d68e;
+    color: #ffffff;
+    background-color: #000000;
+    // margin-right: 20px;
+    padding: 10px 90px;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    font-size: 24px;
+  }
+}
 </style>

src/views/manage/manageMain.vue

@@ -14,39 +14,102 @@
         @select="selectMenu"
       >
         <!-- <img  src="../../assets/img/commons/jhTop.png" /> -->
-        <img v-show="!isCollapse" src="../../assets/img/commons/jhTop.png" />
+        <img
+          v-show="!isCollapse"
+          style="
+            height: 40px;
+            width: auto;
+            padding-top: 20px;
+            padding-left: 10px;
+            padding-right: 10px;
+            margin-bottom: 20px;
+          "
+          src="../../assets/img/commons/jhTop1.png"
+        />
         <img
           v-show="isCollapse"
           style="menu_top_suo"
           src="../../assets/img/commons/jhTopSuo.png"
         />
-        <el-submenu
-          v-for="item in menuList"
-          :key="item.id"
-          :index="item.path"
-          v-show="item.showItem"
-        >
-          <template slot="title">
-            <i :class="item.icon"></i>
-            <span class="menu_name">{{ item.name }}</span>
-          </template>
-          <el-menu-item-group>
-            <el-menu-item v-for="el in item.child" :key="el.id" :index="el.path">
-              <span class="menu_sub_tt"
-                ><span class="menu_sub_t1"></span>{{ el.name }}</span
-              >
-            </el-menu-item>
-          </el-menu-item-group>
-        </el-submenu>
+
+        <div v-for="item in menuList" :key="item.id">
+          <el-menu-item :index="item.path" v-if="!item.hasOwnProperty('child')"
+            ><div class="menu_icon_mm">
+              <img :src="item.icon" class="menu_icon_img" /><span>{{ item.name }}</span>
+            </div></el-menu-item
+          >
+          <div v-if="item.hasOwnProperty('child')">
+            <!-- v-for="item in menuList"
+              :key="item.id"
+              :index="item.path"
+              v-show="item.showItem" -->
+
+            <el-submenu :index="item.path">
+              <template slot="title">
+                <div class="menu_icon_mm">
+                  <img :src="item.icon" class="menu_icon_img" />
+                  <span class="menu_name">{{ item.name }}</span>
+                </div>
+              </template>
+              <el-menu-item-group>
+                <el-menu-item v-for="el in item.child" :key="el.id" :index="el.path">
+                  <span class="menu_sub_tt"
+                    ><span class="menu_sub_t1">&nbsp;</span>{{ el.name }}</span
+                  >
+                </el-menu-item>
+              </el-menu-item-group>
+            </el-submenu>
+          </div>
+        </div>
+
+        <!-- <el-menu-item index="1">用户管理</el-menu-item> -->
       </el-menu>
     </el-aside>
-    <el-container style="height: 100vh; display: flex; flex-direction: column">
-      <el-header class="shadow-menu">
+    <!-- style="height:100vh; display: flex; flex-direction: column; border-top-left-radius: 40px; border-bottom-left-radius: 40px;background-color:#000000" -->
+    <el-container class="el-container-com">
+      <el-header
+        class="shadow-menu"
+        style="
+          background-color: #ffffff;
+          border-top-left-radius: 40px;
+          background-color: #f7f7f7;
+        "
+      >
         <el-row class="admin-header-content">
-          <el-col :span="12"> </el-col>
+          <el-col :span="12">
+            <el-row>
+              <!-- <el-col :span="1">
+                  <div class="menu-hide" @click="changeMenu">
+                    <i class="el-icon-s-fold" style="color: #000; font-size: 20px"></i>
+                  </div>
+                </el-col> -->
+              <el-col :span="10">
+                <div class="main_top_1">
+                  <div class="blue">&nbsp;&nbsp;</div>
+                  <el-breadcrumb class="admin-breadcrumb" separator=">>">
+                    <el-breadcrumb-item>{{ crumbParent }}</el-breadcrumb-item>
+                    <el-breadcrumb-item
+                      style="font-weight: 700"
+                      v-if="crumbChild && crumbChild != null"
+                      >{{ crumbChild }}</el-breadcrumb-item
+                    >
+                  </el-breadcrumb>
+                </div>
+              </el-col>
+            </el-row>
+          </el-col>
 
           <el-col :span="12" class="just-right">
-            <el-menu
+            <div class="user_out" @mouseenter="mouseenterFun" @mouseleave="mouseLeaveFun">
+              <img class="user_out_img" src="../../assets/menu/userAdmin.png" />
+              <div class="user_out_des">{{ userInfo.userName }}老师</div>
+              <div v-if="isShowMenu" class="user_out_ab">
+                <div class="exit" @click="escape()">退出</div>
+                <div class="update_pass" @click="changePwd()">修改密码</div>
+              </div>
+            </div>
+
+            <!-- <el-menu
               :default-active="activeIndex"
               class="el-menu-demo"
               mode="horizontal"
@@ -62,7 +125,7 @@
                 <el-menu-item index="2-1" @click="escape()">退出</el-menu-item>
                 <el-menu-item index="2-1" @click="changePwd()">修改密码</el-menu-item>
               </el-submenu>
-            </el-menu>
+            </el-menu> -->
 
             <vue-qr
               v-show="false"
@@ -75,24 +138,6 @@
         </el-row>
       </el-header>
       <el-container style="flex: 1; overflow: auto">
-        <el-header class="main-header">
-          <el-row>
-            <el-col :span="1">
-              <div class="menu-hide" @click="changeMenu">
-                <i class="el-icon-s-fold" style="color: #000; font-size: 20px"></i>
-              </div>
-            </el-col>
-            <el-col :span="10">
-              <el-breadcrumb class="admin-breadcrumb" separator="/">
-                <el-breadcrumb-item>{{ crumbParent }}</el-breadcrumb-item>
-                <el-breadcrumb-item v-if="crumbChild && crumbChild != null">{{
-                  crumbChild
-                }}</el-breadcrumb-item>
-              </el-breadcrumb>
-            </el-col>
-          </el-row>
-        </el-header>
-
         <el-main style="background-color: #f5f5f5; display: flex">
           <div class="el-main-inner">
             <transition name="fade" mode="out-in">
@@ -100,59 +145,60 @@
             </transition>
           </div>
         </el-main>
-        <!-- <el-footer>
-          <div style="background-color:#000000">递交</div>
-          </el-footer> -->
-        <!-- <el-footer style="padding-left: 0px; padding-right: 0px">
-      <Footer />
-    </el-footer> -->
       </el-container>
     </el-container>
 
     <!---lxh-修改密码-->
-    <el-dialog
-      title="修改密码"
-      :visible.sync="dialogVisible"
-      :close-on-click-modal="false"
-      width="40%"
-    >
-      <div>
-        <el-form
-          :model="ruleForm"
-          :rules="rules"
-          ref="ruleForm"
-          label-width="150px"
-          class="demo-ruleForm"
-        >
-          <el-form-item label="请输入旧密码" prop="oldpass">
-            <el-input
-              type="password"
-              v-model="ruleForm.oldpass"
-              autocomplete="off"
-            ></el-input>
-          </el-form-item>
-          <el-form-item label="请输入新密码" prop="pass">
-            <el-input
-              type="password"
-              v-model="ruleForm.pass"
-              autocomplete="off"
-            ></el-input>
-          </el-form-item>
-          <el-form-item label="确认新密码" prop="checkPass">
-            <el-input
-              type="password"
-              v-model="ruleForm.checkPass"
-              autocomplete="off"
-            ></el-input>
-          </el-form-item>
-
-          <el-form-item>
-            <el-button type="primary" @click="submitForm('ruleForm')">提交</el-button>
-            <el-button @click="resetForm('ruleForm')">重置</el-button>
-          </el-form-item>
-        </el-form>
-      </div>
-    </el-dialog>
+    <div class="dig_update">
+      <el-dialog
+        :visible.sync="dialogVisible"
+        :close-on-click-modal="false"
+        width="40%"
+        style="border-radius: 40px"
+      >
+        <div slot="title">
+          <el-form
+            :model="ruleForm"
+            :rules="rules"
+            :inline="true"
+            ref="ruleForm"
+            label-width="150px"
+            class="demo-ruleForm"
+          >
+            <p class="dig_title">修改密码</p>
+            <div slot=""></div>
+            <div slot="footer"></div>
+            <el-form-item label="请输入旧密码" prop="oldpass">
+              <el-input
+                type="password"
+                v-model="ruleForm.oldpass"
+                autocomplete="off"
+              ></el-input>
+            </el-form-item>
+            <el-form-item label="请输入新密码" prop="pass">
+              <el-input
+                type="password"
+                v-model="ruleForm.pass"
+                autocomplete="off"
+              ></el-input>
+            </el-form-item>
+            <el-form-item label="确认新密码" prop="checkPass">
+              <el-input
+                type="password"
+                v-model="ruleForm.checkPass"
+                autocomplete="off"
+              ></el-input>
+            </el-form-item>
+            <div  class="dig_button">
+             
+             <el-button type="info" round @click="resetForm('ruleForm')">重置</el-button>
+             <el-button  type="success" round  @click="submitForm('ruleForm')">提交</el-button>
+            </div>
+          
+          </el-form>
+        </div>
+      </el-dialog>
+    </div>
   </el-container>
 </template>
 <script>
@@ -230,6 +276,8 @@ export default {
     };
 
     return {
+      //是否显示退出菜单
+      isShowMenu: false,
       userInfo: {}, //用户信息
       dialogVisible: false, //弹出窗是否可见
       size: "small",
@@ -241,233 +289,65 @@ export default {
       menuList: [
         {
           id: "0",
-          name: "渠道信息",
-          icon: "el-icon-s-home",
-          path: "0",
+          name: "用户管理",
+          icon: require("../../assets/menu/user.png"),
           showItem: true,
-          child: [
-            {
-              id: "01",
-              name: "签约详情",
-              parentName: "渠道信息",
-              icon: "el-icon-user-solid",
-              path: "/manage/channelInfo",
-              showItem: true,
-            },
-            {
-              id: "02",
-              name: "订单结算",
-              icon: "el-icon-user-solid",
-              parentName: "渠道信息",
-              path: "/manage/orderSettlement",
-              showItem: true,
-            },
-            {
-              id: "03",
-              name: "邀请链接",
-              icon: "el-icon-user-solid",
-              parentName: "渠道信息",
-              path: "/manage/invite",
-              showItem: true,
-            },
-            {
-              id: "04",
-              name: "报告记录",
-              icon: "el-icon-user-solid",
-              parentName: "渠道信息",
-              path: "/manage/recordListAll",
-              showItem: true,
-            },
-            {
-              id: "05",
-              name: "员工管理",
-              icon: "el-icon-user-solid",
-              parentName: "渠道信息",
-              path: "/manage/channelUserManage",
-              showItem: true,
-            },
-          ],
-        },//channelUserManage
+          path: "/manage/userManage",
+        },
         {
           id: "1",
-          name: "渠道管理",
-          icon: "el-icon-user-solid",
-          path: "",
+          name: "院管理员管理",
+          icon: require("../../assets/menu/yuan.png"),
           showItem: true,
-          child: [
-            {
-              id: "11",
-              name: "渠道信息",
-              icon: "el-icon-user-solid",
-              parentName: "渠道管理",
-              path: "/manage/channelManagement",
-              showItem: true,
-            },
-            {
-              id: "12",
-              name: "签约详情",
-              icon: "el-icon-user-solid",
-              parentName: "渠道管理",
-              path: "/manage/contract",
-              showItem: true,
-            },
-          ],
+          path: "/manage/channelInfo",
         },
         {
           id: "2",
-          name: "财税报告",
-          icon: "el-icon-user-solid",
-          path: "2",
+          name: "组织架构",
+          icon: require("../../assets/menu/zu.png"),
           showItem: true,
-          child: [
-            {
-              id: "21",
-              name: "接口价格",
-              icon: "el-icon-user-solid",
-              path: "/manage/interfacePrice",
-              parentName: "渠道管理",
-              showItem: true,
-            },
-            {
-              id: "22",
-              name: "产品定价",
-              icon: "el-icon-user-solid",
-              parentName: "渠道管理",
-              path: "/manage/productPrice",
-              showItem: true,
-            },
-            {
-              id: "23",
-              name: "报告记录",
-              parentName: "渠道管理",
-              icon: "el-icon-user-solid",
-              path: "/manage/reportList",
-              showItem: true,
-            },
-          ],
+          path: "/manage/orderSettlement",
         },
         {
           id: "3",
-          name: "订单管理",
-          icon: "el-icon-user-solid",
-          path: "3",
+          name: "测试计划",
+          icon: require("../../assets/menu/plan.png"),
+          showItem: true,
+          path: "/manage/invite",
+        },
+        {
+          id: "4",
+          name: "报告分析",
+          icon: require("../../assets/menu/plan.png"),
           showItem: true,
+          // path: "/manage/recordListAll",
           child: [
             {
-              id: "31",
-              name: "用户订单",
-              icon: "el-icon-user-solid",
-              parentName: "订单管理",
-              path: "/manage/userOrder",
-              showItem: true,
-            },
-            {
-              id: "32",
-              name: "邀约订单",
-              icon: "el-icon-user-solid",
-              parentName: "订单管理",
-              path: "/manage/orderInvite",
-              showItem: true,
-            },
-            {
-              id: "33",
-              name: "订单结算",
+              id: "41",
+              name: "用户报告",
+              parentName: "报告分析",
               icon: "el-icon-user-solid",
-              parentName: "订单管理",
-              path: "/manage/orderSettlementManage",
+              path: "/manage/channelUserManage",
               showItem: true,
             },
-          ],
-        },
-        /*  
-        
-          {
-            id: '3',
-            name: "订单管理",
-            icon: "el-icon-user-solid",
-            path: "/manage/userManage",
-            showItem: true,
-            child:[
-              {
-                id: '31',
-                name: "用户订单",
-                icon: "el-icon-user-solid",
-                path: "/manage/agencyUserManage",
-                showItem: true,
-              },
-              {
-                id: '32',
-                name: "邀约订单",
-                icon: "el-icon-user-solid",
-                path: "/manage/agencyUserManage",
-                showItem: true,
-              },
-              {
-                id: '33',
-                name: "订单结算",
-                icon: "el-icon-user-solid",
-                path: "/manage/agencyUserManage",
-                showItem: true,
-              },
-            ]
-          },
-          {
-            id: '4',
-            name: "邀请管理",
-            icon: "el-icon-s-order",
-            path: "/manage/gameRecord1",
-            showItem: true,
-            child:[
-              {
-                id: '41',
-                name: "邀请链接",
-                icon: "el-icon-user-solid",
-                path: "/manage/agencyUserManage",
-                showItem: true,
-              },
-            ]
-          },*/
-        {
-          id: "5",
-          name: "用户管理",
-          icon: "el-icon-s-order",
-          path: "/manage/gameRecord2",
-          showItem: true,
-          child: [
             {
-              parentName: "用户管理",
-              id: "51",
-              name: "用户管理",
+              id: "42",
+              name: "计划报告",
+              parentName: "报告分析",
               icon: "el-icon-user-solid",
-              path: "/manage/userManage",
+              path: "/manage/channelManagement",
               showItem: true,
             },
             {
-              parentName: "用户管理",
-              id: "52",
-              name: "角色管理",
+              id: "43",
+              name: "对比分析",
+              parentName: "报告分析",
               icon: "el-icon-user-solid",
-              path: "/manage/roleManage",
+              path: "/manage/contract",
               showItem: true,
             },
           ],
-        },
-        // {
-        //   id: "6",
-        //   name: "数据大屏",
-        //   icon: "el-icon-s-order",
-        //   // path: "/manage/gameRecord",
-        //   showItem: true,
-        //   child: [
-        //     {
-        //       id: "61",
-        //       name: "大屏",
-        //       icon: "el-icon-user-solid",
-        //       path: "/manage/agencyUserManage",
-        //       showItem: true,
-        //     },
-        //   ],
-        // },
+        }
       ],
       //面包屑页签
       crumbParent: "首页",
@@ -517,11 +397,10 @@ export default {
     let codeImage = sessionStorage.getItem("codeImage");
     this.urlJump = codeImage + "?invitationCode=";
     let that = this;
-    // 页面初始化或者刷新页面初始化页签及激活菜单-2020-03-17 lwl
+    // 页面初始化或者刷新页面初始化页签及激活菜单-2020-03-17
     this.active = this.$route.path;
     this.selectMenu(this.$route.path);
     this.bus.$on("menuStatusUpdate", (e) => {
-
       that.$refs.menu.activeIndex = e;
       that.active = e;
       //  that.$forceUpdate()
@@ -538,21 +417,32 @@ export default {
     changeMenu: function () {
       this.isCollapse = !this.isCollapse;
     },
+
+    mouseenterFun() {
+      this.isShowMenu = true;
+    },
+    mouseLeaveFun() {
+      this.isShowMenu = false;
+    },
     //匹配获取页签名称-2020-03-17 lwl
     selectMenu(param) {
-
       this.menuList.forEach((item) => {
+        console.log(item);
         if (item.path == param) {
           this.crumbParent = item.name;
           this.crumbChild = null;
-          return;
+          // return;
         } else {
-          item.child.forEach((i) => {
-            if (i.path == param) {
-              this.crumbParent = i.parentName;
-              this.crumbChild = i.name;
-            }
-          });
+          //先判断是否有child
+          //如果没有
+          if (item.hasOwnProperty("child")) {
+            item.child.forEach((i) => {
+              if (i.path == param) {
+                this.crumbParent = i.parentName;
+                this.crumbChild = i.name;
+              }
+            });
+          }
         }
       });
     },
@@ -581,16 +471,17 @@ export default {
 
     /*lxh-修改密码*/
     submitForm(formName) {
-
       this.$refs[formName].validate((valid) => {
+        console.log(this.userInfo)
         if (valid) {
-          this.$http.post(
-            "/user/update/password",
-            {
-              id: this.userInfo.id,
-              newPassword: md5(this.ruleForm.pass),
-              oldPassword: md5(this.ruleForm.oldpass),
-            },
+          this.$http.get(
+            `/system/updatePassword?userNo=${ this.userInfo.userNo}&password=${md5(this.ruleForm.pass)}&oldPassword=${md5(this.ruleForm.oldpass)}`,
+            // {
+            //   userNo: this.userInfo.userNo,
+            //   password: md5(this.ruleForm.pass),
+            //   oldPassword: md5(this.ruleForm.oldpass),
+            // },
+            {},
             (res) => {
               if (res.code == 2001) {
                 this.$message({
@@ -623,7 +514,6 @@ export default {
     // 重置表单
     resetForm(formName) {
       this.$refs[formName].resetFields();
-
     },
     // 修改密码
     changePwd() {
@@ -634,20 +524,54 @@ export default {
 </script>
 >
 <style>
+.el-submenu .el-menu-item {
+  height: 50px;
+  line-height: 50px;
+  /* padding: 0 45px; */
+  min-width: auto !important;
+}
+.aside-menu .el-menu-item {
+  margin-left: 20px;
+  color: #ffffff !important;
+  margin-right: 20px;
+  border-radius: 40px;
+  height: 40px;
+  line-height: 40px;
+  margin-top: 20px;
+  padding-left: 0px !important;
+}
 .el-menu--popup {
   /* min-width:100px */
 }
 .el-submenu__title:hover {
-  background-color: #80a1ff;
+  background: #00bf78 !important;
+  margin-left: 20px;
+  margin-right: 20px;
+  border-radius: 40px;
+  height: 40px;
+  line-height: 40px;
+  margin-top: 20px;
+  padding-left: 0px !important;
+}
+.el-submenu__title {
+  /* background-color: #158824; */
+  /* margin-left:20px; */
+  margin-right: 20px;
+  height: 40px;
+  line-height: 40px;
+  margin-top: 20px;
+  border-radius: 40px;
 }
 .el-menu {
   background-color: #23315a;
+  border-right: 0px;
 }
 .el-menu-item-group .el-menu-item.is-active {
-  background-color: #80a1ff !important;
+  background-color: #00bf78 !important;
 }
 .el-menu-item-group .el-menu-item:hover {
-  background-color: #80a1ff !important;
+  background-color: #00bf78 !important;
+  padding-left: 0px !important;
 }
 .el-menu-item-group__title {
   padding: 0px !important;
@@ -658,10 +582,20 @@ export default {
 .el-menu--horizontal > .el-menu-item:not(.is-disabled):focus,
 .el-menu--horizontal > .el-menu-item:not(.is-disabled):hover,
 .el-menu--horizontal > .el-submenu .el-submenu__title:hover {
-  background-color: transparent !important;
+  /* background-color: transparent !important; */
+  background-color: #00bf78 !important;
+  padding-left: 0px !important;
+}
+.el-menu-item:focus,
+.el-menu-item:hover {
+  outline: 0;
+  background-color: #00bf78 !important;
 }
 </style>
+
 <style lang="less" scoped>
+
+
 .el-menu-vertical-demo:not(.el-menu--collapse) {
   width: 200px;
   min-height: 400px;
@@ -710,14 +644,9 @@ export default {
 /*float: right;*/
 /*}*/
 
-/*.el-menu--horizontal > .el-menu-item {*/
-/*float: right;*/
-/*height: 60px;*/
-/*line-height: 60px;*/
-/*margin: 0;*/
-/*border-bottom: 2px solid transparent;*/
-/*color: #909399;*/
-/*}*/
+// el-menu--horizontal > .el-menu-item {
+//   color:#000000
+// }
 
 .top-menu-control {
   float: left;
@@ -729,16 +658,35 @@ export default {
   height: 100vh;
   text-align: left;
   /*padding-top: 60px;*/
-  border-top-right-radius: 40px;
-  border-bottom-right-radius: 40px;
+  // border-top-right-radius: 40px;
+  // border-bottom-right-radius: 40px;
 }
 
 .aside-menu .el-menu-item.is-active {
-  background: #80a1ff !important;
+  background: #00bf78 !important;
+  margin-left: 20px;
+  margin-right: 20px;
+  border-radius: 40px;
+  height: 40px;
+  line-height: 40px;
+  margin-top: 20px;
+}
+.aside-menu .el-menu-item {
+  // background: #00BF78 !important;
+  margin-left: 20px;
+  color: #ffffff !important;
+  margin-right: 20px;
+  border-radius: 40px;
+  height: 40px;
+  line-height: 40px;
+  margin-top: 20px;
 }
 
 .el-menu-item-group .el-menu-item.is-active {
-  background: #80a1ff !important;
+  background: #00bf78 !important;
+  margin-left: 20px;
+  margin-right: 20px;
+  padding-left: 0px !important;
 }
 
 .fade-enter {
@@ -818,6 +766,8 @@ export default {
 .el-menu--horizontal > .el-submenu .el-submenu__title,
 /deep/.el-menu--horizontal > .el-submenu.is-active .el-submenu__title {
   border-bottom: none !important;
+  margin-left: 20px;
+  margin-right: 20px;
 }
 
 /deep/.el-menu--horizontal > .el-submenu .el-submenu__icon-arrow {
@@ -831,12 +781,52 @@ export default {
 .admin-breadcrumb {
   padding-top: 3px;
   margin-left: -18px;
+  font-weight: 700;
 }
 
 .just-right {
   display: flex;
   flex-direction: row;
   justify-content: flex-end;
+  .user_out {
+    position: relative;
+    display: flex;
+    align-items: center;
+    .user_out_img {
+      width: 40px;
+    }
+    .user_out_des {
+      margin-right: 40px;
+      font-size: 16px;
+      font-weight: 700;
+    }
+    .user_out_ab {
+      border-bottom-left-radius: 20px;
+      border-bottom-right-radius: 20px;
+      position: absolute;
+      background-color: #ffffff;
+      margin-top: 150px;
+      z-index: 100;
+      .exit {
+        padding-top: 20px;
+        padding-left: 40px;
+        padding-right: 40px;
+      }
+      .update_pass {
+        padding: 20px 40px;
+      }
+      .exit:hover {
+        color: #00bf78;
+        padding-top: 20px;
+        padding-left: 40px;
+        padding-right: 40px;
+      }
+      .update_pass:hover {
+        color: #00bf78;
+        padding: 20px 40px;
+      }
+    }
+  }
 }
 .el-main-inner {
   display: flex;
@@ -851,6 +841,7 @@ export default {
   box-sizing: border-box !important;
   display: flex !important;
   overflow: hidden !important;
+  border-bottom-left-radius: 40px;
 }
 .menu_name {
   color: #ffffff;
@@ -862,11 +853,100 @@ export default {
   flex-direction: row;
   align-items: center;
   .menu_sub_t1 {
-    background-color: #ffffff;
-    border-radius: 50%;
+    // background-color: #ffffff;
+    // border-radius: 50%;
     width: 5px;
     height: 5px;
+    margin-right: 20px;
+  }
+}
+.el-container-com {
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  // border-top-left-radius: 40px;
+  // border-bottom-left-radius: 40px;
+  background-color: #000000;
+}
+.main_top_1 {
+  border-top-left-radius: 40px;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  margin-top: 20px;
+  margin-left: 20px;
+  .blue {
+    background-color: #00bf78;
+    width: 10px;
+    margin-right: 30px;
+    height: 20px;
+    border-radius: 5px;
+  }
+}
+
+.menu_icon_mm {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  .menu_icon_img {
+    width: 15px;
+    margin-right: 10px;
+    padding-left: 10px;
+  }
+}
+
+.dig_update /deep/.el-dialog {
+  box-shadow: none !important;
+  background: transparent !important;
+}
+.demo-ruleForm /deep/ .el-form-item {
     margin-right: 10px;
+    vertical-align: top;
+    display: flex !important;
+    flex-direction: column;
+}
+.demo-ruleForm /deep/.el-form-item__label {
+    text-align: left;
+    vertical-align: middle;
+    float: left;
+    font-size: 14px;
+    color: #606266;
+    line-height: 40px;
+    padding: 0 12px 0 0;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+}
+
+.demo-ruleForm /deep/.el-input{
+  width: 100% !important;
+}
+
+.demo-ruleForm /deep/.el-input__inner{
+  width: 100% !important;
+  background-color: #F7F7F7;
+  border: 0px;
+}
+
+.dig_button{
+  display: flex;
+  width:100%;
+  justify-content: space-around;
+}
+
+.demo-ruleForm {
+  background-color: #ffffff;
+  // border-radius: 20px;
+  margin-right: -10px;
+  margin-top: -10px;
+  padding-right: 100px;
+  padding-left: 100px;
+  border-radius: 20px;
+  padding-top: 20px;
+  padding-bottom: 40px;
+  .dig_title {
+    margin-bottom: 30px;
+    text-align: center;
+    font-weight: 700;
   }
 }
 </style>

src/views/manage/userManage.vue

@@ -4,69 +4,153 @@
       <el-row>
         <el-col :span="24">
           <div class="search-head">
-            <span>用户名：</span>
-            <el-input v-model="name" clearable placeholder="请输入用户名"></el-input>&nbsp;&nbsp;&nbsp;&nbsp;
-            <span>用户昵称：</span>
-            <el-input v-model="userName" clearable placeholder="请输入用户昵称"></el-input>&nbsp;&nbsp;&nbsp;&nbsp;
-            <span>渠道：</span>
-            <el-select v-model="channel" placeholder="请选择渠道">
+            <el-input v-model="name" clearable placeholder="请输入姓名"></el-input
+            >&nbsp;&nbsp;&nbsp;&nbsp;
+
+            <el-input v-model="userName" clearable placeholder="请输入学号"></el-input
+            >&nbsp;&nbsp;&nbsp;&nbsp;
+            <el-cascader placeholder="请选择组织架构"
+             v-model="group"
+              :options="options"
+              :props="{ checkStrictly: true }"
+              clearable
+            ></el-cascader>
+            <!-- <el-select v-model="channel" placeholder="请选择所属组织架构">
               <el-option
                 :label="item.name"
                 :value="item.id"
                 v-for="item in channelList"
                 :key="item.id"
-              ></el-option> </el-select
-            >&nbsp;&nbsp;&nbsp;&nbsp;
-            <el-button type="primary" round icon="el-icon-search" @click="searchTarget">搜索</el-button>
-            <el-button type="info" round icon="el-icon-delete-solid" @click="clearSearch">清空</el-button>
-            <el-button type="success" round class="add_class" icon="el-icon-plus" @click="addUser">新增用户</el-button>
+              ></el-option> 
+            </el-select> -->
+            &nbsp;&nbsp;&nbsp;&nbsp;
+            <!-- <span style="font-size: 16px;">性别:</span>&nbsp;&nbsp; -->
+            <div style="display: flex; flex-direction: row; align-items: center">
+              <span
+                style="
+                  font-size: 16px;
+                  margin-right: 10px;
+                  line-height: 20px;
+                  min-width: 40px;
+                "
+                >性别:</span
+              >
+              <el-radio v-model="sex" label="1">男</el-radio>
+              <el-radio v-model="sex" label="0">女</el-radio>
+            </div>
+            &nbsp;&nbsp;&nbsp;&nbsp;
+            <el-button type="primary" round icon="el-icon-search" @click="searchTarget"
+              >搜索</el-button
+            >
+            <el-button type="info" round @click="clearSearch">清空</el-button>
+            <el-button type="success" round class="add_class">批量导入</el-button>
+            <el-button type="info" round @click="addUser">单独注册</el-button>
           </div>
         </el-col>
       </el-row>
       <el-row class="add_user_class">
         <el-col :span="24">
-          <div class="search-head">
-           
-          </div>
+          <div class="search-head"></div>
         </el-col>
       </el-row>
 
       <div class="table-content">
-        <el-table :data="tableData" :row-style="{ height: '0px' }" :cell-style="{ padding: '5px' }">
+        <el-table
+          :data="tableData"
+          :row-style="{ height: '0px' }"
+          :cell-style="{ padding: '5px' }"
+          :header-cell-style="{ background: '#F8F8F8', color: '#606266' }"
+        >
           <!-- <el-table-column prop="name" label="姓名" align="center" width=""  show-overflow-tooltip>
           </el-table-column> -->
-          <el-table-column show-overflow-tooltip prop="name" label="用户名" align="center" width="">
+          <el-table-column
+            show-overflow-tooltip
+            prop="name"
+            label="用户名"
+            align="center"
+            width=""
+          >
           </el-table-column>
           <el-table-column prop="userName" label="用户昵称" align="center" width="">
           </el-table-column>
           <!-- <el-table-column prop="state" label="用户状态" align="center" :formatter="formatterDelete" width="">
           </el-table-column> -->
-          <el-table-column prop="channelName" label="所属渠道" align="center" width=""></el-table-column>
-          <el-table-column prop="type" label="所属角色" align="center" width="" :formatter="formatterRole"
-            show-overflow-tooltip>
+          <el-table-column
+            prop="channelName"
+            label="所属渠道"
+            align="center"
+            width=""
+          ></el-table-column>
+          <el-table-column
+            prop="type"
+            label="所属角色"
+            align="center"
+            width=""
+            :formatter="formatterRole"
+            show-overflow-tooltip
+          >
           </el-table-column>
           <el-table-column label="操作" width="510px" align="center">
             <template slot-scope="scope">
-              <el-button @click="viewUser(scope.row)" v-if="scope.row.state != 0" type="text"
-                size="small">查看</el-button>
-              <el-button type="text" size="small" v-if="scope.row.state != 0"
-                @click="editUser(scope.row)">编辑</el-button>
+              <el-button
+                @click="viewUser(scope.row)"
+                v-if="scope.row.state != 0"
+                type="text"
+                size="small"
+                >查看</el-button
+              >
+              <el-button
+                type="text"
+                size="small"
+                v-if="scope.row.state != 0"
+                @click="editUser(scope.row)"
+                >编辑</el-button
+              >
 
-              <el-popconfirm v-if="scope.row.state != 0" title="确定删除吗？" placement="top"
-                @confirm="deleteUser(scope.$index, scope.row)">
-                <el-button size="small" style="margin-left: 10px" type="text" slot="reference">删除</el-button>
+              <el-popconfirm
+                v-if="scope.row.state != 0"
+                title="确定删除吗？"
+                placement="top"
+                @confirm="deleteUser(scope.$index, scope.row)"
+              >
+                <el-button
+                  size="small"
+                  style="margin-left: 10px"
+                  type="text"
+                  slot="reference"
+                  >删除</el-button
+                >
               </el-popconfirm>
-              <el-popconfirm v-if="scope.row.state != 0" title="密码将重置为123456" placement="top"
-                @confirm="resetUser(scope.$index, scope.row)">
-                <el-button size="small" style="margin-left: 10px" type="text" slot="reference">重置密码</el-button>
+              <el-popconfirm
+                v-if="scope.row.state != 0"
+                title="密码将重置为123456"
+                placement="top"
+                @confirm="resetUser(scope.$index, scope.row)"
+              >
+                <el-button
+                  size="small"
+                  style="margin-left: 10px"
+                  type="text"
+                  slot="reference"
+                  >重置密码</el-button
+                >
               </el-popconfirm>
             </template>
           </el-table-column>
         </el-table>
       </div>
-
-      <el-pagination small background @current-change="handleCurrentChange" :current-page.sync="pageNum"
-        layout="total, prev, pager, next" :page-size="pageSize" :total="total">
+      <!-- small -->
+      <el-pagination
+        class="pag_class"
+        background
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page.sync="pageNum"
+        layout="total, sizes, prev, pager, next"
+        :page-size="pageSize"
+        :page-sizes="[10, 20, 50, 100]"
+        :total="total"
+      >
       </el-pagination>
       <!-- <el-pagination small background layout="total prev, pager, next" :total="36">
       </el-pagination> -->
@@ -75,34 +159,24 @@
     <el-dialog title="查看" :visible.sync="centerDialogVisible" width="60%" center>
       <div>
         <div class="user_out">
-          <div class="user_out_sub">
-            用户名
-          </div>
+          <div class="user_out_sub">姓名</div>
           <div class="user_out_subNext">
             {{ view.name }}
           </div>
-          <div class="user_out_sub">
-            用户昵称
-          </div>
+          <div class="user_out_sub">学号</div>
           <div class="user_out_subNext">
             {{ view.userName }}
           </div>
-
         </div>
         <div class="user_out">
-          <div class="user_out_sub">
-            所属渠道
-          </div>
+          <div class="user_out_sub">性别</div>
           <div class="user_out_subNext">
             {{ view.channelName }}
           </div>
-          <div class="user_out_sub">
-            所属角色
-          </div>
+          <div class="user_out_sub">组织架构</div>
           <div class="user_out_subNext">
             {{ view.role }}
           </div>
-
         </div>
       </div>
     </el-dialog>
@@ -119,6 +193,10 @@ export default {
   },
   data() {
     return {
+      group:'',
+      options:[{value:'1',label:"选项1",children:[{value:'11',label:'选项11',children:[{value:'111',label:'选项111'}]}]}],
+      // sex: "1",
+      sex: "",
       centerDialogVisible: false,
       editUserFlag: false,
       startTime: "",
@@ -139,19 +217,21 @@ export default {
       roleType: "0",
       type: 0,
       view: {
-        name: '',
-        userName: '',
-        channelId: '',
-        channelName:'',
-        role: ''
+        name: "",
+        userName: "",
+        channelId: "",
+        channelName: "",
+        role: "",
       },
-      channel:'',
+      channel: "",
       channelList: [{ name: "渠道天成", id: "1" }],
     };
   },
-  created() { },
+  created() {},
   mounted() {
     this.userInfo = JSON.parse(oSessionStorage.getItem("userInfo"));
+
+
     
     this.getChannel();
     if (!this.userInfo) {
@@ -161,8 +241,14 @@ export default {
     this.searchTarget();
   },
   methods: {
-     //获取渠道信息
-     getChannel() {
+    //每页多少条
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+      //将首页重置为1时---且总条数变化
+      //设置为当前总条数
+    },
+    //获取渠道信息
+    getChannel() {
       this.$http.get(`/channel/findAll`, {}, (res) => {
         //  this.$toast.success({message:'成功'});
         if (res && res.code == 200) {
@@ -175,13 +261,13 @@ export default {
     },
     formatterDelete(row) {
       if (row.state == 0) {
-        return '已删除'
+        return "已删除";
       } else {
-        return '正常'
+        return "正常";
       }
     },
-    resetUser(index,val){
-      console.log(val)
+    resetUser(index, val) {
+      console.log(val);
       this.$http.get(`/user/reset/${val.id}`, {}, (res) => {
         //  this.$toast.success({message:'成功'});
         if (res && res.code == 200) {
@@ -194,16 +280,14 @@ export default {
       //重置密码
     },
     editUser(row) {
-
-      this.editRegisterUser(row)
-
+      this.editRegisterUser(row);
     },
     viewUser(row) {
-      this.view.name = row.name
-      this.view.userName = row.userName
-      this.view.channelId = row.channelId
-      this.view.channelName = row.channelName
-      this.view.role = row.type == '0' ? '渠道用户' : ''
+      this.view.name = row.name;
+      this.view.userName = row.userName;
+      this.view.channelId = row.channelId;
+      this.view.channelName = row.channelName;
+      this.view.role = row.type == "0" ? "渠道用户" : "";
       this.centerDialogVisible = true;
     },
     addUser() {
@@ -212,8 +296,8 @@ export default {
     clearSearch() {
       this.name = "";
       this.userName = "";
-      this.channel='';
-      this.searchTarget();
+      this.sex = "";
+      // this.searchTarget();
     },
     formatterRole(val) {
       if (val.type == "1") {
@@ -233,7 +317,7 @@ export default {
     addRegisterUser(val) {
       this.$refs.register.open(val);
     },
-    editRegisterUser(val){
+    editRegisterUser(val) {
       this.$refs.register.edit(val);
     },
     deleteUser(index, row) {
@@ -263,7 +347,7 @@ export default {
           phone: "",
           name: this.name,
           userName: this.userName,
-          channelId:this.channel
+          channelId: this.channel,
         },
         (res) => {
           // console.log(res,'用户测试记录')
@@ -325,6 +409,17 @@ export default {
 
 <style lang="less" scoped>
 @import "../../styles/theme.less";
+.pag_class {
+  text-align: end;
+}
+
+.pag_class /deep/.el-input__inner {
+  width: 100% !important;
+}
+.pag_class /deep/.el-pagination--small span:not([class*="suffix"]) {
+  height: 22px;
+  line-height: 28px !important;
+}
 
 .record-warp {
   width: 100%;
@@ -376,11 +471,10 @@ export default {
   background-color: #fafafa;
   text-align: center;
   // color:#ffffff
-
 }
 
 .user_out_subNext {
   padding-left: 10px;
-  flex: 3
+  flex: 3;
 }
 </style>

vue.config.js

@@ -8,7 +8,7 @@ module.exports = {
     productionSourceMap: false,
     lintOnSave: false,
     devServer: {
-        port: 8085, // 端口号
+        port: 8086, // 端口号
         hot:true,
         disableHostCheck:true,//热更新不生效  可以打开此属性
         // https: false, // https:{type:Boolean}