Merge branch 'master' of http://47.103.92.60:3003/skyversation/qp_onemap_ui

public/static/config/config.js

@@ -1,9 +1,9 @@
 let systemConfig = {
     /* 通用全局变量 */
     defaultAccount: {
-        username: "user002",
+        username: "user_yztmh_dev",
     },
-    touristUserId: "5",//默认游客用户（user002）id，Oauth中配置
+    touristUserId: "191",//默认游客用户（user002）id，Oauth中配置
     adminRoleId: "1",//默认管理员角色id，Oauth中配置“系统管理员”角色
     baseServicerPath: "/oneMap",
     // oauth和DMS环境

src/components/AppVue/Header.vue

@@ -1,23 +1,36 @@
 <template>
   <div id="header">
     <div class="logo">青浦一张图</div>
+    <div class="userdropdown">
+      <User />
+    </div>
     <div class="menu">
       <ul class="menu_ul">
-        <li
-          v-for="item in $store.state.menuList"
-          :key="item.path"
-          :class="{ active: $route.path == item.path }"
-          @click="$router.push(item.path)"
-        >
-          {{ item.label }}
-        </li>
+        <template v-for="item in $store.state.menuList" :key="item.path">
+          <li
+            v-if="item.path != '/taskManger' || $getUserType() != 1"
+            :class="{ active: $route.path == item.path }"
+            @click="$router.push(item.path)"
+          >
+            <!-- 任务管理仅对非游客可见 -->
+            {{ item.label }}
+          </li>
+        </template>
       </ul>
     </div>
+
+    <el-dialog v-model="dialogLoginVisible" width="500">
+      <Login :close="closeLoginDialog" />
+    </el-dialog>
   </div>
 </template>
 
 <script>
+import User from "@/components/user/user.vue";
 export default {
+  components: {
+    User,
+  },
   data() {
     return {};
   },
@@ -45,7 +58,6 @@ export default {
   .menu {
     display: inline-block;
     float: right;
-
     .menu_ul {
       li {
         display: inline-block;
@@ -69,4 +81,14 @@ export default {
     }
   }
 }
+.userdropdown {
+  float: right;
+  width: 150px;
+  display: flex;
+  align-items: center;
+  height: 70px;
+  justify-content: center;
+  cursor: pointer;
+  border: 0;
+}
 </style>

src/components/login/login.vue

@@ -0,0 +1,90 @@
+<template>
+    <div style="text-align: center;font-size: 30px;margin-top: 40px;">登&nbsp;&nbsp;录</div>
+    <div style="margin: 80px;">
+        <el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
+            <el-form-item label="账号" prop="username">
+                <el-input type="text" v-model="ruleForm.username" autocomplete="off" placeholder="请输入账号"></el-input>
+            </el-form-item>
+            <el-form-item label="密码" prop="password">
+                <el-input type="password" v-model="ruleForm.password" autocomplete="off" placeholder="请输入密码"></el-input>
+            </el-form-item>
+            <div style="width: 100%;text-align: center;margin-top: 50px;">
+                <el-button type="primary" style="width: 100%;" @click="submitForm('ruleForm')">登&nbsp;&nbsp;&nbsp;&nbsp;录</el-button>
+            </div>
+            <!-- <el-form-item style="padding-top: 20px;">
+                <el-button type="primary" style="width: 100%;" @click="submitForm('ruleForm')">登录</el-button>
+                <el-button @click="resetForm('ruleForm')">重置</el-button>
+            </el-form-item> -->
+        </el-form>
+    </div>
+</template>
+
+<script>
+import encrypt‌ from "@/utils/encrypt‌";
+export default {
+  data() {
+    return {
+        ruleForm: {
+          username: '',
+          password: '',
+        },
+        rules: {
+          username: [
+            { required: true, message: '请输入账号', trigger: 'blur' },
+          ],
+          password: [
+            { required: true, message: '请输入密码', trigger: 'blur' },
+          ]
+        }
+    };
+  },
+  props: {
+    close: Function,
+  },
+  mounted() {},
+  methods: {
+    submitForm(formName) {
+        let that = this;
+        that.$refs[formName].validate((valid) => {
+            if (valid) {
+                // console.log('submit!');
+                encrypt‌(that.ruleForm).then((res) => {
+                    // console.log(res);
+                    that.$message({
+                        type: "success",
+                        message: "登录成功",
+                    });
+                    that.close();
+                 }).catch((err) => {
+                    that.$message({
+                        type: "error",
+                        message: err,
+                    });
+                });
+                
+            } else {
+                return false;
+            }
+        });
+    },
+    resetForm(formName) {
+        let that = this;
+        that.$refs[formName].resetFields();
+    },
+    handleCommand(command) {
+        let that = this;
+        that.$message({   
+            type: "info",
+            message: `Click on item ${command}`,
+        });
+    },
+  },
+};
+</script>
+<style lang="less" scoped>
+    :deep(.el-form-item--label-right .el-form-item__label) {
+        justify-content: flex-end;
+        text-align: right;
+        width: auto !important;
+    }
+</style>

src/components/user/user.vue

@@ -0,0 +1,89 @@
+<template>
+  <div id="container">
+    <div>
+        <el-dropdown @command="handleCommand">
+          <span class="el-dropdown-link">
+            <el-icon :size="20" color="#fff">
+            <UserFilled />
+            </el-icon>
+            <span style="padding: 0 6px;">
+              {{ $store.state.userInfo.id == touristUserId ? "游客" : $store.state.userInfo.username}}
+            </span>
+          </span>
+          <template #dropdown>
+            <el-dropdown-menu>
+              <el-dropdown-item command="login">登录</el-dropdown-item>
+              <el-dropdown-item command="register">注册用户</el-dropdown-item>
+              <el-dropdown-item command="upPassword">修改密码</el-dropdown-item>
+              <el-dropdown-item command="logout">退出</el-dropdown-item>
+            </el-dropdown-menu>
+          </template>
+        </el-dropdown>
+    </div>
+    <el-dialog v-model="dialogLoginVisible" width="500">
+      <Login :close="closeLoginDialog" />
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import Login from "@/components/login/login.vue";
+import encrypt‌ from "@/utils/encrypt‌";
+export default {
+  components: {
+    Login,
+  },
+  data() {
+    return {
+      touristUserId:systemConfig.touristUserId,
+      dialogLoginVisible: false,
+    };
+  },
+  mounted() {},
+  methods: {
+    closeLoginDialog() {
+      console.log("closeLoginDialog");
+      this.dialogLoginVisible = false;
+    },
+    handleCommand(command) {
+      if (command == "login") {
+        this.dialogLoginVisible = true;
+      } else if(command == "register"){
+        
+      } else if(command == "upPassword"){
+        
+      } else {
+        encrypt‌().then(() => {
+          this.$message({
+            type: "success",
+            message: "退出成功",
+          });
+        }).catch((err) => {
+          this.$message({
+            type: "error",
+            message: err,
+          });
+        });
+      }
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+    .container{
+        padding: 0;
+        margin: 0;
+    }
+    .el-dropdown-link {
+        cursor: pointer;
+        color: #fff;
+        display: flex;
+        align-items: center;
+        border: 0;
+    }
+    .el-dropdown,.el-dropdown * {
+    outline: none !important; /* 确保下拉触发器没有轮廓 */
+    }
+
+</style>

src/main.js

@@ -28,26 +28,41 @@ initApp.config.globalProperties.$getDmsTypes = (cName, index) => {
     return store.state.DmsTypesMap[cName] ? store.state.DmsTypesMap[cName][index + ''] : cName + "_" + index;
 };
 // 添加自定义方法，得到用户类型【1：游客；2：普通用户；3：管理员】
-initApp.config.globalProperties.$getUserType = () => {
-    // 得到用户id
-    let userId = store.state.userInfo.id;
-    // 得到角色ids
-    let roleIds = store.state.userInfo.roleId;
-    // 得到默认游客id
-    let touristUserId = systemConfig.touristUserId;
-    // 得到默认管理员角色id(roleId,在Oauth中配置)
-    let adminRoleId = systemConfig.adminRoleId;
-    if (!store.state.userInfo || !userId || !roleIds || userId == touristUserId) {
+const getUserType = () => {
+    if (store.state.userInfo && store.state.userInfo.id != null) {
+        // 得到用户id
+        let userId = store.state.userInfo.id;
+        // 得到角色ids
+        let roleIds = store.state.userInfo.roleId;
+        // 得到默认游客id
+        let touristUserId = systemConfig.touristUserId;
+        // 得到默认管理员角色id(roleId,在Oauth中配置)
+        let adminRoleId = systemConfig.adminRoleId;
+        if (!store.state.userInfo || !userId || !roleIds || userId == touristUserId) {
+            // 游客
+            return 1;
+        } else if (roleIds.split(',').includes(adminRoleId)) {
+            // 管理员
+            return 3;
+        } else {
+            // 普通用户
+            return 2;
+        }
+    } else {
         // 游客
         return 1;
-    } else if (roleIds.split(',').includes(adminRoleId)) {
-        // 管理员
-        return 3;
-    } else {
-        // 普通用户
-        return 2;
     }
 }
+initApp.config.globalProperties.$getUserType = getUserType;
+// 添加router的前置守卫，判断用户角色，游客不能访问任务管理页面
+router.beforeEach((to, from, next) => {
+    if (to.path == "/taskManger" && getUserType() == 1) {
+        // 游客不能访问任务管理页面
+        next({ path: "/" });
+    } else {
+        next();
+    }
+});
 
 for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
     initApp.component(key, component)

src/store/index.js

@@ -19,7 +19,7 @@ export default createStore({
       { path: "/wgn", label: "微功能" },
       { path: "/yygl", label: "应用管理" },
       { path: "/yxgl", label: "运行管理" },
-      { path: "/taskManger", label: "任务管理" },
+      { path: "/taskManger", label: "任务管理" }
     ],
     sksjgl: {},
     skmh: {},

src/utils/encrypt‌.js

@@ -30,10 +30,10 @@ export default function encrypt(loginObj) {
                 reject(err);
             });
         } else {
-            if (loginObj.username != undefined || loginObj.username != "" || loginObj.username != null) {
+            if (loginObj.username == undefined || loginObj.username == "" || loginObj.username == null) {
                 reject("用户名为空")
             }
-            if (loginObj.password != undefined || loginObj.password != "" || loginObj.password != null) {
+            if (loginObj.password == undefined || loginObj.password == "" || loginObj.password == null) {
                 reject("密码为空")
             }
             return login(loginObj.username, AesEncryptUtil.getPassword(loginObj.password)).then(function (result) {