|
@@ -4,10 +4,10 @@
|
|
|
<bread-crumb />
|
|
|
|
|
|
<div class="w-1200px m-auto flex flex-row justify-between">
|
|
|
- <div class="w-188">
|
|
|
+ <div class="w-188px">
|
|
|
<leftSider :activeIndex="activeIndex" :ykjId="ykjId" @parentClick="parentClick"/>
|
|
|
</div>
|
|
|
- <div class="w-942 p-4 blueBg">
|
|
|
+ <div class="w-942px p-4 blueBg">
|
|
|
<div class="flex items-center">
|
|
|
<optionSelect @optionClick="optionClick" />
|
|
|
</div>
|
|
@@ -34,15 +34,15 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
- <div class="h-auto mt-9px listMain" >
|
|
|
- <div class="h-74px flex flex-wrap flex-grow justify-between rounded px-4 listMain_title" >
|
|
|
- <div class="singleT" :class="{ 'h-full singleD': !!([1, 2, 3].indexOf(index) + 1) }">{{ listTitleShow.kh }}</div>
|
|
|
- <div class="singleT" :class="{ 'h-full singleD': !!([1, 2, 3].indexOf(index) + 1) }">{{ listTitleShow.xm }}</div>
|
|
|
- <div class="singleT" :class="{ 'h-full singleD': !!([1, 2, 3].indexOf(index) + 1) }">{{ listTitleShow.bj }}</div>
|
|
|
+ <div class="w-full h-auto mt-9px listMain" >
|
|
|
+ <div class="h-74px rounded px-4 listMain_title" >
|
|
|
+ <div class="float-left singleTitle" :class="{ 'h-full singleDupli': !!([1, 2, 3].indexOf(index) + 1) }">{{ listTitleShow.kh }}</div>
|
|
|
+ <div class="float-left singleTitle" :class="{ 'h-full singleDupli': !!([1, 2, 3].indexOf(index) + 1) }">{{ listTitleShow.xm }}</div>
|
|
|
+ <div class="float-left singleTitle" :class="{ 'h-full singleDupli': !!([1, 2, 3].indexOf(index) + 1) }">{{ listTitleShow.bj }}</div>
|
|
|
|
|
|
- <div class="h-full singleD" v-for="(secItem, secIndex) in listTitleShow.subInfo" :key="secIndex">
|
|
|
+ <div class="h-full float-left singleDupli" v-for="(secItem, secIndex) in listTitleShow.subInfo" :key="secIndex">
|
|
|
<div class="h-1/2 text-center">{{ secItem.subTitle }}</div>
|
|
|
- <div class="h-1/2 flex flex-wrap flex-grow justify-between">
|
|
|
+ <div class="h-1/2 flex flex-wrap flex-grow justify-between flex-nowrap">
|
|
|
<div class="secFullWidth">{{ secItem.fs }}</div>
|
|
|
<div class="secFullWidth">{{ secItem.bp }}</div>
|
|
|
<div class="secFullWidth">{{ secItem.np }}</div>
|
|
@@ -51,14 +51,13 @@
|
|
|
|
|
|
</div>
|
|
|
|
|
|
- <div class="h-60px flex flex-wrap flex-grow justify-between px-4" :class="{ 'whiteBG': (index + 1) % 2 != 1 }"
|
|
|
+ <div class="h-60px px-4 listMain_cont" :class="{ 'whiteBG': (index + 1) % 2 != 1 }"
|
|
|
v-for="(item, index) in listShow" :key="index">
|
|
|
-
|
|
|
- <div class="singleTSec" :class="{ 'h-full singleDSec': !!([1, 2, 3].indexOf(index) + 1) }">{{ item.kh }}</div>
|
|
|
- <div class="singleTSec" :class="{ 'h-full singleDSec': !!([1, 2, 3].indexOf(index) + 1) }">{{ item.xm }}</div>
|
|
|
- <div class="singleTSec" :class="{ 'h-full singleDSec': !!([1, 2, 3].indexOf(index) + 1) }">{{ item.bj }}</div>
|
|
|
- <div class="h-full singleDSec" v-for="(secItem, secIndex) in item.subInfo" :key="secIndex">
|
|
|
- <div class="h-full flex flex-wrap flex-grow justify-between">
|
|
|
+ <div class="float-left singleContentSec" :class="{ 'h-full singleDSec': !!([1, 2, 3].indexOf(index) + 1) }">{{ item.kh }}</div>
|
|
|
+ <div class="float-left singleContentSec" :class="{ 'h-full singleDSec': !!([1, 2, 3].indexOf(index) + 1) }">{{ item.xm }}</div>
|
|
|
+ <div class="float-left singleContentSec" :class="{ 'h-full singleDSec': !!([1, 2, 3].indexOf(index) + 1) }">{{ item.bj }}</div>
|
|
|
+ <div class="h-full float-left singleDSec" v-for="(secItem, secIndex) in item.subInfo" :key="secIndex">
|
|
|
+ <div class="h-full flex flex-wrap flex-grow justify-between flex-nowrap">
|
|
|
<div class="secFullWidth">{{ secItem.fs }}</div>
|
|
|
<div class="secFullWidth">{{ secItem.bp }}</div>
|
|
|
<div class="secFullWidth">{{ secItem.np }}</div>
|
|
@@ -71,20 +70,23 @@
|
|
|
|
|
|
|
|
|
<!-- 优化的图标结构 -->
|
|
|
- <el-table :data="tableMicData" border style="width: 100%">
|
|
|
- <el-table-column prop="name" align="center" label="年级"> </el-table-column>
|
|
|
+
|
|
|
+ <el-table :data="tableMicData" style="width: 100%" v-if="false">
|
|
|
+ <el-table-column prop="kh" align="center" label="考号" width="150px;"> </el-table-column>
|
|
|
+ <el-table-column prop="xm" align="center" label="姓名" width="150px;"> </el-table-column>
|
|
|
+ <el-table-column prop="bj" align="center" label="班级" width="150px;"> </el-table-column>
|
|
|
<!-- 循环1级表头 -->
|
|
|
<template v-for="(item, index) in tableMicTitle" :key="index">
|
|
|
<el-table-column align="center" :label="item" >
|
|
|
<!-- 循环2级表头 -->
|
|
|
- <template v-for="items in tableMicLabel" :key="items.key">
|
|
|
- <el-table-column :label="items.label" width="100" align="center">
|
|
|
- <template v-for="(i,index) in items.type" :key="index" slot-scope="scope">
|
|
|
-
|
|
|
- <div>
|
|
|
- {{ scope.row.type[index][items.key] }}
|
|
|
- </div>
|
|
|
- </template>
|
|
|
+ <template v-for="items in tableMicLabel" :key="items.key">
|
|
|
+ <el-table-column :label="items.label" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span>
|
|
|
+ {{ scope }}888
|
|
|
+ <!-- {{ scope.row.type[index][items.key] }} -->
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
@@ -92,6 +94,7 @@
|
|
|
</el-table>
|
|
|
|
|
|
|
|
|
+
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
@@ -112,7 +115,6 @@ import {user} from "~/store";
|
|
|
const route = useRoute();
|
|
|
|
|
|
|
|
|
-
|
|
|
// 侧边栏点击
|
|
|
const activeIndex = ref('1-1');
|
|
|
let ykjId = ref();
|
|
@@ -156,39 +158,46 @@ let listShow = ref([
|
|
|
ykjId.value = route.params.ykj_id;
|
|
|
|
|
|
const tableMicTitle = ref();
|
|
|
-const tableMicLabel=ref([
|
|
|
- {
|
|
|
- label: "R%",
|
|
|
- key: "mgan",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "S%",
|
|
|
- key: "naiyao",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "I%",
|
|
|
- key: "zjie",
|
|
|
- },
|
|
|
-]);
|
|
|
+
|
|
|
const tableMicData = ref(
|
|
|
[{
|
|
|
- name: "asd",
|
|
|
+ kh: "1000001",
|
|
|
+ xm:"力王",
|
|
|
+ bj:"初一(1)班",
|
|
|
type: [
|
|
|
- { tab: "肺炎克雷伯", mgan: "1", naiyao: "2", zjie: "3" },
|
|
|
- { tab: "铜绿假", mgan: "4", naiyao: "5", zjie: "6" },
|
|
|
- { tab: "鲍式不动杆菌", mgan: "9", naiyao: "8", zjie: "7" },
|
|
|
+ { tab: "语文", aa: "11", bb: "12", cc: "13" },
|
|
|
+ { tab: "数学", aa: "21", bb: "22", cc: "23" },
|
|
|
+ { tab: "外语", aa: "1", bb: "2", cc: "33" },
|
|
|
],
|
|
|
},
|
|
|
{
|
|
|
- name: "asd2",
|
|
|
+ kh: "1000002",
|
|
|
+ xm:"力王就",
|
|
|
+ bj:"初一(2)班",
|
|
|
type: [
|
|
|
- { tab: "肺炎克雷伯", mgan: "11", naiyao: "12", zjie: "13" },
|
|
|
- { tab: "铜绿假", mgan: "21", naiyao: "22", zjie: "23" },
|
|
|
- { tab: "鲍式不动杆菌", mgan: "1", naiyao: "2", zjie: "33" },
|
|
|
+ { tab: "语文", aa: "11", bb: "12", cc: "13" },
|
|
|
+ { tab: "数学", aa: "21", bb: "22", cc: "23" },
|
|
|
+ { tab: "外语", aa: "1", bb: "2", cc: "33" },
|
|
|
],
|
|
|
- }]
|
|
|
+ }
|
|
|
+ ]
|
|
|
);
|
|
|
|
|
|
+const tableMicLabel=ref([
|
|
|
+ {
|
|
|
+ label: "分数",
|
|
|
+ key: "aa",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "班排",
|
|
|
+ key: "bb",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "年排",
|
|
|
+ key: "cc",
|
|
|
+ },
|
|
|
+]);
|
|
|
+
|
|
|
onMounted(() => {
|
|
|
initData();
|
|
|
|
|
@@ -198,15 +207,15 @@ onMounted(() => {
|
|
|
})
|
|
|
const aa = () => {
|
|
|
let tableMicTitle_temp: Iterable<any>|null|undefined = [];
|
|
|
- tableMicData.value.forEach(o=>{
|
|
|
- o.type.forEach(item => {
|
|
|
+ tableMicData.value.forEach(items=>{
|
|
|
+ items.type.forEach(item => {
|
|
|
tableMicTitle_temp.push(item.tab)
|
|
|
})
|
|
|
})
|
|
|
- tableMicTitle.value = [...new Set(tableMicTitle_temp)]
|
|
|
+ tableMicTitle.value = [...new Set(tableMicTitle_temp)];
|
|
|
+ console.log(tableMicTitle.value,"5645")
|
|
|
}
|
|
|
|
|
|
-
|
|
|
const school_id = ref("");
|
|
|
const grade_id = ref("");
|
|
|
const xueke_id = ref("");
|
|
@@ -232,7 +241,6 @@ const initData =() => {
|
|
|
|
|
|
//option筛选
|
|
|
const optionClick = (val: any, marke: any) => {
|
|
|
-
|
|
|
if (marke == "scholl") {
|
|
|
school_id.value = val;
|
|
|
} else if (marke == "grade") {
|
|
@@ -252,12 +260,10 @@ const exportBtn = () => {
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
-
|
|
|
-::v-deep .el-sub-menu__title {
|
|
|
+:deep(.el-sub-menu__title){
|
|
|
background: #003eee;
|
|
|
color: #fff;
|
|
|
}
|
|
|
-
|
|
|
.blueBg {
|
|
|
background: #F1F7FF;
|
|
|
}
|
|
@@ -273,7 +279,7 @@ const exportBtn = () => {
|
|
|
|
|
|
.listMain {
|
|
|
max-height: 600px;
|
|
|
- overflow: auto;
|
|
|
+ overflow-x: auto;
|
|
|
}
|
|
|
|
|
|
.listMain_title {
|
|
@@ -282,8 +288,7 @@ const exportBtn = () => {
|
|
|
background: #003eee;
|
|
|
overflow-y: auto;
|
|
|
}
|
|
|
-
|
|
|
-.singleT {
|
|
|
+.singleTitle {
|
|
|
// flex: 1;
|
|
|
// width: fit-content;
|
|
|
line-height: 74px;
|
|
@@ -291,12 +296,11 @@ const exportBtn = () => {
|
|
|
text-align: center;
|
|
|
}
|
|
|
|
|
|
-.singleD {
|
|
|
+.singleDupli {
|
|
|
// flex: 1;
|
|
|
- width:100px;
|
|
|
+ width:150px;
|
|
|
}
|
|
|
-
|
|
|
-.singleTSec {
|
|
|
+.singleContentSec {
|
|
|
// width: fit-content;
|
|
|
// flex: 1;
|
|
|
width:100px;
|
|
@@ -307,7 +311,7 @@ const exportBtn = () => {
|
|
|
.singleDSec {
|
|
|
// flex: 1;
|
|
|
line-height: 60px;
|
|
|
- width:200px;
|
|
|
+ width:150px;
|
|
|
}
|
|
|
|
|
|
.secFullWidth {
|