Login.vue

 

<template>
    <div style=”height: 500px;width: 250px; border: 1px solid red;”>
        <h2 style=”text-align: center;”>登录</h2>
        <table border=”1px”>
            <tr>
                <td>账号</td>
                <td><input v-model=”user.phone” /></td>
            </tr>
            <tr>
                <td>密码</td>
                <td><input v-model=”user.pwd” /></td>
            </tr>
            <tr>
                <td></td>
                <td><button @click=”logins()”>登录</button></td>
            </tr>
        </table>
    </div>
</template>
<script setup>
import axios from ‘axios’;
</script>
<script>
export default {
    data() {
        return {
            user: {}
        }
    },
    methods: {
        logins() {
            if (this.user.phone == undefined || this.user.pwd == undefined) {
                alert(“登录不允许为空”)
                return;
            }
            var a = ”
            var fd = new FormData()
            fd.append(“username”, this.user.phone)
            fd.append(“password”, this.user.pwd)
            var than = this;
            this.$axios.post(this.$ip + “/api/login”, fd).then(function (resd) {
                a = “Bearer ” + resd.data.data.token
                window.localStorage.setItem(“token”, a)
                console.log(resd.data.data.token)
                console.log(a)
                than.$axios.get(than.$ip + “/api/user/info”, { headers: { ‘Authorization’: a } }).then(function (resd) {
                    than.$store.state.user = resd.data.data
                    than.$router.push(“/” + resd.data.data.role)
                    console.log(resd.data)
                })
            })
        }
    },
    mounted() {
    }
}
</script>
<style></style>

 

<template>
    <div style=”height: 500px;width: 100%; display: flex;”>
        <div style=”width: 20%; height: 100%; border: 1px solid blue;”>
            <h2 style=”text-align: center;”>管理员管理</h2>
            <ul>
                <li><router-link to=”/adm/clz”>班级管理</router-link></li>
                <li><router-link to=”/adm/course”>课程管理</router-link></li>
                <li><router-link to=”/adm/head”>修改头像</router-link></li>
                <li><router-link to=”/adm/stushow”>学生管理</router-link></li>
                <li><router-link to=”/adm/teashow”>教师管理</router-link></li>
                <li><router-link to=”/adm/task”>教学安排</router-link></li>
            </ul>
        </div>
        <div style=”width:80%;height: 100%;border: 1px solid red;”>
            <!– clz.vun$course.vun tea.vue &stu.vue&tea–>
            <router-view></router-view>
        </div>
    </div>
</template>
<script setup>
import axios from ‘axios’;
</script>
<script>
export default {
    data() {
        return {
        }
    },
    methods: {
    },
    mounted() {
    }
}
</script>
<style></style>