From e9c4997aa45f64643e3026ac3845fc86d2793680 Mon Sep 17 00:00:00 2001
From: xiangpei <xiangpei@timesnew.cn>
Date: 星期五, 12 七月 2024 14:20:46 +0800
Subject: [PATCH] 显示隐藏在线情况
---
src/views/meet/index.vue | 67 +++++++++++++++++++--------------
1 files changed, 38 insertions(+), 29 deletions(-)
diff --git a/src/views/meet/index.vue b/src/views/meet/index.vue
index a7d0f28..d66df30 100644
--- a/src/views/meet/index.vue
+++ b/src/views/meet/index.vue
@@ -1,33 +1,34 @@
<template>
<div>
- <div style="display: flex; flex-direction: row">
+ <div style="display: flex; flex-direction: row; position: relative">
<div id="meet" ref="meet"/>
- <div style="padding: 5px">
- <el-row :gutter="5">
- <el-col :span="22">
- <el-input placeholder="鎼滅储" size="small" clearable @input="getStudentList" @clear="getStudentList" v-model="searchForm.keyword"/>
- </el-col>
- <el-col :span="2">
- <el-button type="primary" size="small" @click="getStudentList">鎼滅储</el-button>
- </el-col>
- </el-row>
- <el-row>
- <el-tabs v-model="searchForm.onlineStatus" @tab-click="handleTabChange" style="margin-left: 3px">
- <el-tab-pane label="鍦ㄧ嚎瀛﹀憳" name="1"></el-tab-pane>
- <el-tab-pane label="绂荤嚎瀛﹀憳" name="0"></el-tab-pane>
- </el-tabs>
- </el-row>
- <el-row :gutter="20" v-for="student in showStudentList" :key="student.id" class="student-row">
- <el-col :span="18">
- <div>
- {{student.realName}}
- </div>
- </el-col>
- <el-col :span="6">
- <div :class="{online: student.onlineStatus === 1, outline: student.onlineStatus === 0}">
- {{getStatus(student.onlineStatus)}}
- </div>
- </el-col>
+ <div style="padding: 5px;position: absolute;right: 0">
+ <el-button type="primary" size="small" @click="showStudent = ! showStudent" style="float: right">{{getShowText()}}</el-button>
+ <el-row v-show="showStudent">
+ <el-row :gutter="5">
+ <el-col :span="22">
+ <el-input placeholder="鎼滅储" size="small" clearable @input="getStudentList" @clear="getStudentList" v-model="searchForm.keyword"/>
+ </el-col>
+ <el-col :span="2">
+ <el-button type="primary" size="small" @click="getStudentList">鎼滅储</el-button>
+ </el-col>
+ <el-tabs v-model="searchForm.onlineStatus" @tab-click="handleTabChange" style="margin-left: 3px">
+ <el-tab-pane label="鍦ㄧ嚎瀛﹀憳" name="1"></el-tab-pane>
+ <el-tab-pane label="绂荤嚎瀛﹀憳" name="0"></el-tab-pane>
+ </el-tabs>
+ <el-row :gutter="20" v-for="student in showStudentList" :key="student.id" class="student-row">
+ <el-col :span="18">
+ <div>
+ {{student.realName}}
+ </div>
+ </el-col>
+ <el-col :span="6">
+ <div :class="{online: student.onlineStatus === 1, outline: student.onlineStatus === 0}">
+ {{getStatus(student.onlineStatus)}}
+ </div>
+ </el-col>
+ </el-row>
+ </el-row>
</el-row>
</div>
</div>
@@ -41,6 +42,7 @@
export default {
data () {
return {
+ showStudent: true,
intervalId: null,
meetId: null,
roomName: '',
@@ -55,6 +57,13 @@
}
},
methods: {
+ getShowText() {
+ if (this.showStudent) {
+ return '闅愯棌鍦ㄧ嚎鎯呭喌'
+ } else {
+ return '灞曠ず鍦ㄧ嚎鎯呭喌'
+ }
+ },
getStatus (status) {
if (status === 1) {
return '鍦ㄧ嚎'
@@ -110,7 +119,7 @@
}
},
mounted () {
- const width = window.innerWidth * 0.7
+ const width = window.innerWidth * 0.8
const height = window.innerHeight
this.meetId = this.$route.query.meetId
this.getStudentList()
@@ -170,7 +179,7 @@
}
.studentWarp {
display: flex;
- flex-display: row;
+ flex-direction: row;
}
.student-row {
margin-top: 8px;
--
Gitblit v1.8.0