dianshang-qianduan/src/views/index.vue

<template>
  <div class="index">
    <div v-if="role == '1'" class="school-admin-workbench">
      <section class="admin-hero">
        <div class="admin-badge">Platform Admin / Console</div>
        <h1 class="admin-title">平台超管工作台</h1>
        <p class="admin-subtitle">统一维护学校档案和学校管理员账号，学校内部数据交给学校管理员处理。</p>
      </section>
      <section class="admin-panel">
        <div class="quick-grid">
          <div class="quick-card" @click="go('/platform-schools/index')">
            <div class="quick-label">Schools</div>
            <h2>学校管理</h2>
            <p>新增、编辑、删除学校基础信息。</p>
            <el-button type="primary">进入管理</el-button>
          </div>
          <div class="quick-card" @click="go('/platform-school-admins/index')">
            <div class="quick-label">Admins</div>
            <h2>学校管理员</h2>
            <p>为每所学校维护 role=2 管理员账号。</p>
            <el-button type="primary">进入管理</el-button>
          </div>
        </div>
      </section>
    </div>
    <div v-else-if="role == '2'" class="school-admin-workbench">
      <section class="admin-hero">
        <div class="admin-badge">School Admin / Console</div>
        <h1 class="admin-title">学校管理员工作台</h1>
        <p class="admin-subtitle">维护本校组织架构、教师和学生账号，所有数据限定在当前学校。</p>
      </section>
      <section class="admin-panel">
        <div class="quick-grid">
          <div v-for="item in schoolAdminLinks" :key="item.path" class="quick-card" @click="go(item.path)">
            <div class="quick-label">{{ item.label }}</div>
            <h2>{{ item.title }}</h2>
            <p>{{ item.desc }}</p>
            <el-button type="primary">进入管理</el-button>
          </div>
        </div>
      </section>
    </div>
    <teacher v-else-if="role == '3'" />
    <student v-else />
  </div>
</template>
<script setup>
import "@/views/schoolAdmin/admin-theme.scss";
import student from "./student/index.vue";
import teacher from "./teacherEnd/index.vue";
import useUserStore from "@/store/modules/user";
import { computed } from "vue";
const userStore = useUserStore();
const router = useRouter();
const role = computed(() => userStore.userInfo.roleId);
const go = (path) => {
  router.push(path);
};
const schoolAdminLinks = [
  { label: "School", title: "学校管理", desc: "查看并编辑当前学校基础信息。", path: "/admin-school/index" },
  { label: "Faculty", title: "院系管理", desc: "维护本校院系数据。", path: "/admin-faculty/index" },
  { label: "Major", title: "专业管理", desc: "维护本校专业数据。", path: "/admin-major/index" },
  { label: "Class", title: "班级管理", desc: "维护本校班级数据。", path: "/admin-class/index" },
  { label: "Teacher", title: "教师管理", desc: "维护本校教师账号。", path: "/admin-teacher/index" },
  { label: "Student", title: "学生管理", desc: "维护本校学生账号。", path: "/admin-student/index" },
];
</script>
<style lang='scss'  scoped>
.index {
  margin: 10px;
}
.quick-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 18px;
}
.quick-card {
  min-height: 178px;
  padding: 22px;
  border: 1px solid rgba(80, 172, 255, 0.28);
  border-radius: 8px;
  background: linear-gradient(145deg, rgba(10, 25, 54, 0.92), rgba(7, 18, 42, 0.78));
  box-shadow: inset 0 0 24px rgba(35, 122, 255, 0.12), 0 16px 34px rgba(0, 0, 0, 0.24);
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}
.quick-card:hover {
  transform: translateY(-3px);
  border-color: rgba(83, 199, 255, 0.72);
  box-shadow: inset 0 0 30px rgba(35, 122, 255, 0.18), 0 22px 44px rgba(0, 0, 0, 0.32);
}
.quick-card h2 {
  margin: 10px 0 8px;
  color: #f7fbff;
  font-size: 22px;
  font-weight: 700;
}
.quick-card p {
  min-height: 44px;
  margin: 0 0 18px;
  color: rgba(221, 236, 255, 0.72);
  line-height: 1.6;
}
.quick-label {
  display: inline-flex;
  padding: 4px 10px;
  border-radius: 999px;
  color: #76dcff;
  font-size: 12px;
  background: rgba(73, 178, 255, 0.12);
  border: 1px solid rgba(73, 178, 255, 0.26);
}
</style>