|
@@ -306,7 +306,7 @@
|
|
<div style="max-height: 400px;display: flex;gap: 10px;">
|
|
<div style="max-height: 400px;display: flex;gap: 10px;">
|
|
<div class="nameList">
|
|
<div class="nameList">
|
|
<div class="stuList" v-for="op in classJuri" :key="op.id">
|
|
<div class="stuList" v-for="op in classJuri" :key="op.id">
|
|
- <span style="position: absolute;top: -18px;left: 0;" :id="'group-'+op.id">{{ op.id }}</span>
|
|
|
|
|
|
+ <p class="stuListTit" :id="'group-'+op.id">{{ op.id }}</p>
|
|
<div
|
|
<div
|
|
v-for="i in op.child"
|
|
v-for="i in op.child"
|
|
:key="i.userid"
|
|
:key="i.userid"
|
|
@@ -321,7 +321,7 @@
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
- <div style="display: flex;flex-direction: column;gap: 5px;cursor: pointer;width: 20px;">
|
|
|
|
|
|
+ <div class="Abar">
|
|
<span v-for="op in classJuri" :key="op.id" @click="somp(op.id)">
|
|
<span v-for="op in classJuri" :key="op.id" @click="somp(op.id)">
|
|
{{ op.id }}
|
|
{{ op.id }}
|
|
</span>
|
|
</span>
|
|
@@ -1551,13 +1551,44 @@ export default {
|
|
flex-direction: column;
|
|
flex-direction: column;
|
|
gap: 20px;
|
|
gap: 20px;
|
|
}
|
|
}
|
|
|
|
+.Abar{
|
|
|
|
+ display: flex;
|
|
|
|
+ position: relative;
|
|
|
|
+ flex-direction: column;
|
|
|
|
+ gap: 5px;cursor: pointer;
|
|
|
|
+ width: 20px;
|
|
|
|
+ background: #f0f4fa;
|
|
|
|
+ align-items: center;
|
|
|
|
+ border-radius: 12px;
|
|
|
|
+ padding: 7px 0;
|
|
|
|
+ overflow: auto;
|
|
|
|
+ font-size: 14px;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+/* .Abar {
|
|
|
|
+ overflow-y: auto;
|
|
|
|
+ padding-right: 8px;
|
|
|
|
+} */
|
|
|
|
+/* 隐藏滚动条但保留功能 */
|
|
|
|
+.Abar::-webkit-scrollbar { width: 1px; }
|
|
|
|
+/* .Abar { scrollbar-width: none; } */
|
|
|
|
+
|
|
|
|
+.stuListTit{
|
|
|
|
+ position: absolute;
|
|
|
|
+ top: -35px;
|
|
|
|
+ left: 0;
|
|
|
|
+ background: #f5faff;
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ width: 100%;
|
|
|
|
+ padding: 4px 7px;
|
|
|
|
+}
|
|
.nameList{
|
|
.nameList{
|
|
overflow: auto;
|
|
overflow: auto;
|
|
display: flex;
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex-direction: column;
|
|
- padding-top: 20px;
|
|
|
|
|
|
+ padding-top: 35px;
|
|
box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
- gap: 25px;
|
|
|
|
|
|
+ gap: 45px;
|
|
flex: 1;
|
|
flex: 1;
|
|
}
|
|
}
|
|
.stuList {
|
|
.stuList {
|