liankao/src/pages/ksfx/stu_stfx.vue

<template>
  <div class="stu_stfx">
    <div class="w-1200px h-600px m-auto flex flex-row justify-between">
      <div class="w-188px h-full" style="background-color: #fff;">
        <leftSiderStu :StuLeftMenuNum="StuLeftMenuNum" />
      </div>

      <div class="w-1012px p-4 blueBg">

        <div class="flex mt-20px items-center">
          <el-select class="mr-10px" v-model="normal_subject" placeholder="请选择学科" size="large">
            <el-option label="全部" value="0" />
            <el-option v-for="item in subject_list" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>
        </div>

        <div class="flex justify-between mt-4 exportBtn">
          <div>
            <el-button color="#003eee" type="primary" size="large" @click="exportBtn">导出</el-button>
          </div>
        </div>

        <div class="h-auto mt-9px listMain">
          <el-table :data="tableData" style="width: 100%" height="auto">
            <el-table-column prop="xk" label="学科" />
            <el-table-column prop="tm" label="题目" />
            <el-table-column prop="lx" label="类型" />
            <el-table-column prop="nd" label="难度" />
            <el-table-column prop="df" label="得分" />
            <el-table-column prop="grdf" label="个人得分" />

            <el-table-column label="得分率" fixed="right">
              <el-table-column prop="gr" label="个人" />
              <el-table-column prop="bj" label="班级"  />
              <el-table-column prop="bj" label="年级"  />
              <el-table-column prop="ztks" label="整体考试" />
            </el-table-column>
          </el-table>

        </div>

      </div>

    </div>
  </div>
</template>

<script setup lang="ts">
import {student_stfx_list} from "~/pages/process/api";
import { useRouter } from "vue-router";
import { skeletonProps } from 'element-plus';
const router = useRouter();

let StuLeftMenuNum = 0;

let normal_subject = $ref("");
let subject_list = [{
  value: '1',
  label: '语文'
}, {
  value: '2',
  label: '数学'
}]

const tableData = [
  {
   xk: '语文',
    tm: '1',
    lx: '选择题',
    nd: '5',
    df: '12',
    grdf: '12',

    gr: '23%',
    bj: '23%',
    nj: '23%',
    ztks:'23%',
  },
  {
   xk: '语文',
    tm: '1',
    lx: '选择题',
    nd: '5',
    df: '12',
    grdf: '12',

    gr: '23%',
    bj: '23%',
    nj: '23%',
    ztks:'23%',
  },
  {
   xk: '语文',
    tm: '1',
    lx: '选择题',
    nd: '5',
    df: '12',
    grdf: '12',

    gr: '23%',
    bj: '23%',
    nj: '23%',
    ztks:'23%',
  },
  {
   xk: '语文',
    tm: '1',
    lx: '选择题',
    nd: '5',
    df: '12',
    grdf: '12',

    gr: '23%',
    bj: '23%',
    nj: '23%',
    ztks:'23%',
  },
  {
   xk: '语文',
    tm: '1',
    lx: '选择题',
    nd: '5',
    df: '12',
    grdf: '12',

    gr: '23%',
    bj: '23%',
    nj: '23%',
    ztks:'23%',
  },
  {
   xk: '语文',
    tm: '1',
    lx: '选择题',
    nd: '5',
    df: '12',
    grdf: '12',

    gr: '23%',
    bj: '23%',
    nj: '23%',
    ztks:'23%',
  },
  {
   xk: '语文',
    tm: '1',
    lx: '选择题',
    nd: '5',
    df: '12',
    grdf: '12',

    gr: '23%',
    bj: '23%',
    nj: '23%',
    ztks:'23%',
  },
]



//导出
const exportBtn = () => {
  console.log("导出")
}

</script>

<style scoped>
@import '@/styles/ksfx.css';
.singleT {
  flex: 1;
  font-size: 16px;
  line-height: 74px;
  width: fit-content;
  text-align: center;
  background: #003eee;
}
.secFullWidth{
  flex: 1;
  width: fit-content;
}

</style>