1

lzhe

2024-05-19 f3e57aff6030b629e5387fcbb43507fe4a4a2da4

 src/views/login/components/passwordForm.vue

@@ -1,171 +1,178 @@
<template>
   <el-form ref="loginForm" :model="form" :rules="rules" label-width="0" size="large" @keyup.enter="login" class="login-form">
   <el-form ref="loginForm" :model="form" :rules="rules" label-width="0" size="large" @keyup.enter="login"
      class="login-form">
      <el-form-item prop="user">
         <el-input v-model="form.user" prefix-icon="el-icon-user" clearable :placeholder="$t('login.userPlaceholder')" class="inputHeight">
         <el-input v-model="form.user" prefix-icon="el-icon-user" clearable
            :placeholder="$t('login.userPlaceholder')" class="inputHeight">
         </el-input>
      </el-form-item>
      <el-form-item prop="password">
         <el-input v-model="form.password" prefix-icon="el-icon-lock" clearable show-password :placeholder="$t('login.PWPlaceholder')" class="inputHeight"></el-input>
         <el-input v-model="form.password" prefix-icon="el-icon-lock" clearable show-password
            :placeholder="$t('login.PWPlaceholder')" class="inputHeight"></el-input>
      </el-form-item>
      <el-form-item>
         <el-button type="primary" style="width: 100%;" :loading="islogin" @click="login">{{ $t('login.signIn') }}</el-button>
         <el-button type="primary" style="width: 100%;" :loading="islogin" @click="login">{{ $t('login.signIn')
            }}</el-button>
      </el-form-item>
   </el-form>
</template>

<script>
   export default {
      data() {
         return {
            userType: 'admin',
            form: {
               user: "admin",
               password: "123456",
               autologin: false
            },
            rules: {
               user: [
                  {required: true, message: this.$t('login.userError'), trigger: 'blur'}
               ],
               password: [
                  {required: true, message: this.$t('login.PWError'), trigger: 'blur'}
               ]
            },
            islogin: false,
         }
      },
      watch:{
         userType(val){
            if(val == 'admin'){
               this.form.user = 'admin'
               this.form.password = 'admin'
            }else if(val == 'user'){
               this.form.user = 'user'
               this.form.password = 'user'
            }
         }
      },
      mounted() {
         //this.$HTTP.get('/api/blade-sync/outer-app-config/appStatus')
      },
      methods: {
         async login(){
            var validate = await this.$refs.loginForm.validate().catch(()=>{})
            if(!validate){ return false }
            this.islogin = true
            var data = {
               username: this.form.user,
               //password: this.$TOOL.crypto.MD5(this.form.password)
               password: this.form.password,
               tenantId: "000000",
               grant_type: "password",
               scope: "all"
            }
            await this.$HTTP.postJ("/api/blade-auth/oauth/token?" + this.$TOOL.qsStringify(data)).then(res=> {
               if(res.user_id) {
                  //获取token
                  this.$TOOL.cookie.set("TOKEN", res.access_token, {
                     expires: this.form.autologin? 24*60*60 : 0
                  })
                  res.userName = res.user_name;
                  res.role = ["SA", "admin", "Auditor"];
                  res.dashboard = "0";
                  res.userId =  "1";
                  this.$TOOL.data.set("USER_INFO", res);
                  this.islogin = false;
               }else {
                  this.$message({
                      showClose: true,
                      message: res.error_description,
                      type: 'error'
                    });
               }
            })
            await this.$HTTP.get("/api/blade-system/menu/routes?" + this.$TOOL.qsStringify({"appCode": "CPS"})).then(res=> {
               if(res.data.length==0){
                  this.islogin = false
                  this.$alert("当前用户无任何菜单权限，请联系系统管理员", "无权限访问", {
                     type: 'error',
                     center: true
                  })
                  return false
               } 
               //开始
               function addComponentToLastLevel(items) {  
                  return items.map((item) => {  
                     // 复制当前项，避免直接修改原始对象  
                     const clonedItem = { ...item };  
					
                     // 检查当前项是否有 children 属性  
                     if (clonedItem.children) {  
                        // 递归处理 children  
                        clonedItem.children = addComponentToLastLevel(clonedItem.children);  
                     } else {  
                        // 如果没有 children 属性，说明是最后一级，添加 component 对象  
                        var len = clonedItem.path.length;
                        if(item.name == "任务调度") {
                           //clonedItem.component = clonedItem.path;   //有component不可以使用iframe
                        }else {
                           clonedItem.component = clonedItem.path.substring(1,len); 
                        }
                     } 
                     if(item.name == "任务调度") {
                        clonedItem.meta = {title: clonedItem.name,icon: "el-icon-takeaway-box", type: "iframe"}
                     }else {
                        clonedItem.meta = {title: clonedItem.name,icon: "el-icon-takeaway-box", type: "menu"}
                     }
                     return clonedItem;
                  });  
               }   
               var transformedArray = addComponentToLastLevel(res.data); 
               transformedArray[0].path = "/home";
               transformedArray[0].children = [{
                  component: "home",
                  meta: {title: "工作台", icon: 'el-icon-menu', affix: true},
                  name: "工作台",
                  path: "/dashboard"
               }] 
               // this.$HTTP.get("/api/blade-system/workbench/list?status=1").then(resp=> {
               //    if(resp.data.length) {
               //       console.log(resp.data,resp.data[0].name,333);
                     // resp.data.forEach(item=> {
                     //    item.component = "home";
                     //    item.meta = {title: item.nam, icon: 'el-icon-menu', affix: true};
                     //    item.path = "/dashboard";
                     //    item.parentId = item.id;
                     // })
                     // transformedArray[0].path = "/home";
                     // transformedArray[0].children = resp.data;
               //    }
               // })
               //结束
               var obj = {
                  dashboardGrid: ["welcome", "ver", "time", "progress", "echarts", "about"],
                  menu: transformedArray,
                  permissions: ["list.add", "list.edit", "list.delete", "user.add", "user.edit", "user.delete"]
               }
               console.log(transformedArray,123)
               // this.$API.system.menu.myMenus.get().then(resp=> {
               //    Object.assign({},transformedArray,resp.data.menu);
               //    this.$TOOL.data.set("MENU", obj.menu)
               //    this.$TOOL.data.set("PERMISSIONS", obj.permissions)
               //    this.$TOOL.data.set("DASHBOARDGRID", obj.dashboardGrid)
               // });
               this.$TOOL.data.set("MENU", obj.menu)
               this.$TOOL.data.set("PERMISSIONS", obj.permissions)
               this.$TOOL.data.set("DASHBOARDGRID", obj.dashboardGrid)
            })
            this.$router.replace({
               path: '/'
            })
            this.$message.success("Login Success 登录成功")
            this.islogin = false;
//import io from 'socket.io-client';
export default {
   data() {
      return {
         socket: null,  
         userType: 'admin',
         form: {
            user: "admin",
            password: "123456",
            autologin: false
         },
         rules: {
            user: [
               { required: true, message: this.$t('login.userError'), trigger: 'blur' }
            ],
            password: [
               { required: true, message: this.$t('login.PWError'), trigger: 'blur' }
            ]
         },
         islogin: false,
      }
   },
   watch: {
      userType(val) {
         if (val == 'admin') {
            this.form.user = 'admin'
            this.form.password = 'admin'
         } else if (val == 'user') {
            this.form.user = 'user'
            this.form.password = 'user'
         }
      }
   },
   mounted() {
      //this.$HTTP.get('/api/blade-sync/outer-app-config/appStatus')
   },
   methods: {  
      async login() {
         var validate = await this.$refs.loginForm.validate().catch(() => { })
         if (!validate) { return false }
         this.islogin = true
         var data = {
            username: this.form.user,
            //password: this.$TOOL.crypto.MD5(this.form.password)
            password: this.form.password,
            tenantId: "000000",
            grant_type: "password",
            scope: "all"
         }
         var isToken = false;
         await this.$HTTP.postJ("/api/blade-auth/oauth/token?" + this.$TOOL.qsStringify(data)).then(res => {
            this.islogin = false;
            if (res.user_id) {
               isToken = true;
               //获取token
               this.$TOOL.cookie.set("TOKEN", res.access_token, {
                  expires: this.form.autologin ? 24 * 60 * 60 : 0
               })
               res.userName = res.user_name;
               res.role = ["SA", "admin", "Auditor"];
               res.dashboard = "0";
               res.userId = "1";
               this.$TOOL.data.set("USER_INFO", res);
            } else {
               this.$message({
                  showClose: true,
                  message: res.msg || res.error_description,
                  type: 'error'
               });
            }
         })
         if(!isToken) return;
         //获取菜单
         await this.$HTTP.get("/api/blade-system/menu/routes?" + this.$TOOL.qsStringify({ "appCode": "CPS" })).then(res => {
            if (res.data.length == 0) {
               this.islogin = false
               this.$alert("当前用户无任何菜单权限，请联系系统管理员", "无权限访问", {
                  type: 'error',
                  center: true
               })
               return false
            }
            //开始
            function addComponentToLastLevel(items) {
               return items.map((item) => {
                  // 复制当前项，避免直接修改原始对象  
                  const clonedItem = { ...item };

                  // 检查当前项是否有 children 属性  
                  if (clonedItem.children) {
                     // 递归处理 children  
                     clonedItem.children = addComponentToLastLevel(clonedItem.children);
                  } else {
                     // 如果没有 children 属性，说明是最后一级，添加 component 对象  
                     var len = clonedItem.path.length;
                     if (item.name == "任务调度") {
                        //clonedItem.component = clonedItem.path;   //有component不可以使用iframe
                     } else {
                        clonedItem.component = clonedItem.path.substring(1, len);
                     }
                  }
                  if (item.name == "任务调度") {
                     clonedItem.meta = { title: clonedItem.name, icon: "el-icon-takeaway-box", type: "iframe" }
                  } else {
                     clonedItem.meta = { title: clonedItem.name, icon: "el-icon-takeaway-box", type: "menu" }
                  }
                  return clonedItem;
               });
            }
            var transformedArray = addComponentToLastLevel(res.data);
            //获取多个工作台
            this.$HTTP.get("/api/blade-system/workbench/list?status=1").then(resp => {
               if (resp.data.length) {
                  //console.log(resp.data,resp.data[0].name,333);
                  resp.data.forEach((item, index) => {
                     item.component = "home";
                     item.meta = { title: item.name, icon: 'el-icon-menu', affix: true };
                     item.path = "/dashboard";
                     item.parentId = item.id;
                  })
                  transformedArray[0].path = "/home";
                  transformedArray[0].children = resp.data;
                  var obj = {
                     dashboardGrid: ["welcome", "ver", "time", "progress", "echarts", "about"],
                     menu: transformedArray,
                     permissions: ["list.add", "list.edit", "list.delete", "user.add", "user.edit", "user.delete"]
                  }
                  this.$TOOL.data.set("MENU", obj.menu);
                  console.log(obj.menu,'menu')
                  this.$TOOL.data.set("PERMISSIONS", obj.permissions)
                  this.$TOOL.data.set("DASHBOARDGRID", obj.dashboardGrid)

                  this.$router.replace({
                     path: '/'
                  })
                  // this.$message.success("Login Success 登录成功")
                  this.islogin = false;
               }
            })
         })

      }
   }
}
</script>

<style>
.login-form {margin: 0 auto;margin-top: 46px;width: 294px;}
.inputHeight {height: 40px;line-height: 40px;}
.login-form {
   margin: 0 auto;
   margin-top: 46px;
   width: 294px;
}

.inputHeight {
   height: 40px;
   line-height: 40px;
}
</style>