|
@@ -30,14 +30,22 @@
|
|
|
<div class="item_right">{{ userNumber.freezeUser }}</div>
|
|
<div class="item_right">{{ userNumber.freezeUser }}</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
- <SearchMain @FnSearch="FnSearch" />
|
|
|
|
|
|
|
+
|
|
|
|
|
+ <!-- <div class="filter_box" :style="{ display: filterVisible ? 'block' : 'none' }" ref="filterAreaRef">
|
|
|
|
|
+ <div>
|
|
|
|
|
+ 111
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div> -->
|
|
|
|
|
+ <div ref="filterRef" class="filter_area">
|
|
|
|
|
+ <SearchMain @FnSearch="FnSearch" />
|
|
|
|
|
+ </div>
|
|
|
<div class="page_jg_20"></div>
|
|
<div class="page_jg_20"></div>
|
|
|
<div class="page_item">
|
|
<div class="page_item">
|
|
|
<div class="page_search">
|
|
<div class="page_search">
|
|
|
<div class="search_content">
|
|
<div class="search_content">
|
|
|
<div class="content_left">
|
|
<div class="content_left">
|
|
|
<el-select v-model="schoolTypeSelect" @change="SearchChange" placeholder="">
|
|
<el-select v-model="schoolTypeSelect" @change="SearchChange" placeholder="">
|
|
|
- <el-option label="全部类型" value=" "></el-option>
|
|
|
|
|
|
|
+ <el-option label="全部类型" value="all"></el-option>
|
|
|
<el-option label="单校" :value="0"></el-option>
|
|
<el-option label="单校" :value="0"></el-option>
|
|
|
<el-option label="联考" :value="1"></el-option>
|
|
<el-option label="联考" :value="1"></el-option>
|
|
|
</el-select>
|
|
</el-select>
|
|
@@ -48,7 +56,7 @@
|
|
|
</el-input>
|
|
</el-input>
|
|
|
</div>
|
|
</div>
|
|
|
<div class="content_right">
|
|
<div class="content_right">
|
|
|
- <el-button class="button_border_gray" @click="Refresh">
|
|
|
|
|
|
|
+ <el-button class="button_refresh" @click="Refresh">
|
|
|
<img src="@/assets/icon/refresh.svg" alt="" style="margin-right: 5px;">刷新
|
|
<img src="@/assets/icon/refresh.svg" alt="" style="margin-right: 5px;">刷新
|
|
|
</el-button>
|
|
</el-button>
|
|
|
<el-button class="button_border" @click="OpenSubject" v-if="permissions.includes('schoolOpenSubjects')">开通科目</el-button>
|
|
<el-button class="button_border" @click="OpenSubject" v-if="permissions.includes('schoolOpenSubjects')">开通科目</el-button>
|
|
@@ -142,7 +150,7 @@ import ResetPassword from '@/components/resetPassword.vue'
|
|
|
import { Search } from '@element-plus/icons-vue'
|
|
import { Search } from '@element-plus/icons-vue'
|
|
|
import { ElMessageBox, ElMessage } from 'element-plus'
|
|
import { ElMessageBox, ElMessage } from 'element-plus'
|
|
|
import { getSchoolNumber, getSchoolList, changeStatus } from '@/api/school'
|
|
import { getSchoolNumber, getSchoolList, changeStatus } from '@/api/school'
|
|
|
-import { ref, reactive, provide, onMounted } from 'vue'
|
|
|
|
|
|
|
+import { ref, reactive, provide, onMounted, nextTick, onUnmounted } from 'vue'
|
|
|
interface UserNumber {
|
|
interface UserNumber {
|
|
|
allUser: number
|
|
allUser: number
|
|
|
officialUser: number
|
|
officialUser: number
|
|
@@ -173,7 +181,7 @@ interface User {
|
|
|
// 初始化列表数据
|
|
// 初始化列表数据
|
|
|
const tableData = ref<User[]>([])
|
|
const tableData = ref<User[]>([])
|
|
|
|
|
|
|
|
-const schoolTypeSelect = ref<string>(" ")
|
|
|
|
|
|
|
+const schoolTypeSelect = ref<string>("all")
|
|
|
const schoolNameCode = ref('')
|
|
const schoolNameCode = ref('')
|
|
|
const tableLoading = ref(false)
|
|
const tableLoading = ref(false)
|
|
|
const showDialog = ref(false)
|
|
const showDialog = ref(false)
|
|
@@ -210,6 +218,16 @@ onMounted(() => {
|
|
|
GetSchoolNumber()
|
|
GetSchoolNumber()
|
|
|
GetSchoolList()
|
|
GetSchoolList()
|
|
|
})
|
|
})
|
|
|
|
|
+onUnmounted(() => {
|
|
|
|
|
+ // if (observer) {
|
|
|
|
|
+ // observer.disconnect();
|
|
|
|
|
+ // observer = null;
|
|
|
|
|
+ // }
|
|
|
|
|
+ window.addEventListener('scroll', aaa);
|
|
|
|
|
+});
|
|
|
|
|
+const aaa = () => {
|
|
|
|
|
+ console.log('aaa')
|
|
|
|
|
+}
|
|
|
// 新增用户
|
|
// 新增用户
|
|
|
const addUser = () => {
|
|
const addUser = () => {
|
|
|
showDialog.value = true
|
|
showDialog.value = true
|
|
@@ -266,7 +284,7 @@ const GetSchoolList = () => {
|
|
|
userId: searchData.value.userId,
|
|
userId: searchData.value.userId,
|
|
|
cityCode: searchData.value.cityCode,
|
|
cityCode: searchData.value.cityCode,
|
|
|
provinceCode: searchData.value.provinceCode,
|
|
provinceCode: searchData.value.provinceCode,
|
|
|
- schoolType: schoolTypeSelect.value,
|
|
|
|
|
|
|
+ schoolType: schoolTypeSelect.value == 'all' ? '' : schoolTypeSelect.value,
|
|
|
queryStr: schoolNameCode.value
|
|
queryStr: schoolNameCode.value
|
|
|
}
|
|
}
|
|
|
tableLoading.value = true
|
|
tableLoading.value = true
|
|
@@ -324,6 +342,52 @@ const Refresh = () => {
|
|
|
schoolNameCode.value = ""
|
|
schoolNameCode.value = ""
|
|
|
GetSchoolList()
|
|
GetSchoolList()
|
|
|
}
|
|
}
|
|
|
|
|
+const filterRef = ref(null)
|
|
|
|
|
+const isSticky = ref(false)
|
|
|
|
|
+let observer = null;
|
|
|
|
|
+const HandleScroll = () => {
|
|
|
|
|
+ console.log('1111')
|
|
|
|
|
+ observer = new IntersectionObserver(
|
|
|
|
|
+ (entries) => {
|
|
|
|
|
+ entries.forEach(entry => {
|
|
|
|
|
+ if (entry.boundingClientRect.top <= 65) {
|
|
|
|
|
+ isSticky.value = true;
|
|
|
|
|
+ } else {
|
|
|
|
|
+ isSticky.value = false;
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ root: null, // 使用视口作为根元素
|
|
|
|
|
+ threshold: 0, // 当元素顶部接触视口顶部时触发
|
|
|
|
|
+ rootMargin: `-${65}px 0px 0px 0px` // 相对于视口顶部的偏移
|
|
|
|
|
+ }
|
|
|
|
|
+ );
|
|
|
|
|
+
|
|
|
|
|
+ if (filterRef.value) {
|
|
|
|
|
+ observer.observe(filterRef.value);
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+const filterVisible = ref(false)
|
|
|
|
|
+// 获取筛选区域的引用
|
|
|
|
|
+const filterAreaRef = ref<HTMLDivElement | null>(null);
|
|
|
|
|
+
|
|
|
|
|
+// 监听页面滚动
|
|
|
|
|
+const OnScroll = () => {
|
|
|
|
|
+ console.log('123', window.scrollY)
|
|
|
|
|
+ const filterArea = filterAreaRef.value;
|
|
|
|
|
+ const scrollPosition = window.scrollY;
|
|
|
|
|
+ const contentTop = document.querySelector('.filter_area')?.getBoundingClientRect().top || 0;
|
|
|
|
|
+ console.log(contentTop)
|
|
|
|
|
+ // 当页面滚动到内容区域中间时显示筛选区域
|
|
|
|
|
+ if (scrollPosition >= contentTop - 100) {
|
|
|
|
|
+ filterVisible.value = true;
|
|
|
|
|
+ } else {
|
|
|
|
|
+ filterVisible.value = false;
|
|
|
|
|
+ }
|
|
|
|
|
+};
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
@@ -404,4 +468,21 @@ const Refresh = () => {
|
|
|
color: #ccc;
|
|
color: #ccc;
|
|
|
cursor: not-allowed;
|
|
cursor: not-allowed;
|
|
|
}
|
|
}
|
|
|
|
|
+.filter_box {
|
|
|
|
|
+ display: none;
|
|
|
|
|
+}
|
|
|
|
|
+.sticky-top {
|
|
|
|
|
+ display: block;
|
|
|
|
|
+ width: calc(100% - 190px);
|
|
|
|
|
+ position: fixed;
|
|
|
|
|
+ top: 65px; /* 与header高度一致 */
|
|
|
|
|
+ left: 170px;
|
|
|
|
|
+ right: 20px;
|
|
|
|
|
+ padding: 20px;
|
|
|
|
|
+ background: #F0F4FB;
|
|
|
|
|
+ z-index: 20;
|
|
|
|
|
+
|
|
|
|
|
+ // box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
</style>
|
|
</style>
|