feat: first commit

2025-01-24 00:49:17 +08:00
commit c2cbc1b1d6
88 changed files with 12831 additions and 0 deletions
@@ -0,0 +1,119 @@
+<template>
+    <div :class="$style['header']">
+        <!-- <img src="/logo.png" height="80"> -->
+        <el-row :style="{ width: '100%' }">
+            <el-col :span="3">
+                <div class="system-name">
+                    出行管理
+                    <!-- <img src="/logo.png" height="60"> -->
+                </div>
+            </el-col>
+            <el-col :span="21">
+                <div :class="$style['header-content']">
+                    <el-dropdown trigger="click" :class="$style['user-panel']">
+                        <div ref="userPopup" class="header-user">
+                            <span class="name" :style="{ cursor: 'pointer' }">
+                                <el-link>
+                                    {{ appStore.userInfo?.userName }}
+                                    <el-icon class="el-icon--right">
+                                        <arrow-down />
+                                    </el-icon>
+                                </el-link>
+                            </span>
+                        </div>
+                        <template #dropdown>
+                            <el-dropdown-menu>
+                                <el-dropdown-item @click="openPwdDialog">更改密码</el-dropdown-item>
+                                <el-dropdown-item @click="onLogout">退出登录</el-dropdown-item>
+                            </el-dropdown-menu>
+                        </template>
+                    </el-dropdown>
+                </div>
+            </el-col>
+        </el-row>
+        <pwd-dialog ref="pwdRef" />
+    </div>
+</template>
+<script setup lang="ts">
+import Cookies from "js-cookie";
+import { useAppStore } from "@/store/app";
+import PwdDialog from "@/containers/PwdDialog/index.vue";
+import { ref, onBeforeMount } from "vue";
+import {
+    ArrowDown
+} from "@element-plus/icons-vue";
+import { useRouter } from "vue-router";
+
+const appStore = useAppStore();
+const pwdRef = ref<any>();
+const router=useRouter();
+
+onBeforeMount(() => {
+    const userInfo = Cookies.get("UserInfo");    
+    try {
+        const uI = JSON.parse(userInfo);        
+        if (!uI?.id) {
+            router.push("/login");
+            return;
+        }
+        appStore.saveUserInfo(uI);
+    } catch (error) {
+        router.push("/login");
+    }
+})
+
+const onLogout = () => {
+    Cookies.remove("Authorization")
+    window.location.href = '/';
+}
+
+/**
+ * 修改密码
+ */
+const openPwdDialog = () => {
+    pwdRef.value?.show();
+};
+</script>
+<style module lang="scss">
+:global {
+    :local(.header) {
+        height: 80px;
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
+        align-items: center;
+        width: 100%;
+
+        .system-name {
+            height: 80px;
+            overflow: hidden;
+            line-height: 80px;
+            background: #002140;
+            // display: inline-block;
+            text-align: center;
+            color: #fff;
+            font-weight: 600;
+            font-size: 20px;
+            width: 100%;
+            line-height: 80px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+        }
+
+        :local(.header-content) {
+            box-shadow: 0 1px 4px rgb(0 21 41 / 8%);
+            height: 80px; // calc(100% - 4px);
+            position: relative;
+            z-index: 1;
+
+            :local(.user-panel) {
+                position: absolute;
+                right: 40px;
+                top: 50%;
+                transform: translate(0, -50%);
+            }
+        }
+    }
+}
+</style>