专题修改

parent 12e8e220
<template>
<Header background="white" :show="false">
<div class="header">
<!-- <van-icon name="arrow-left" class="icon" @click="back" /> -->
<div class="h-content">
<img src="../../static/image/subject-list-logo.png" />
<div class="title">当前专题:{{ queryParams.tagName }}</div>
</div>
<div class="overlay"></div>
</div>
</Header>
<div class="container">
<van-sticky>
<!-- <van-nav-bar title="专题列表" :left-arrow="true" fixed placeholder safe-area-inset-top
@click-left="router.go(-1)" /> -->
<div class="header">
<!-- <div class="header">
<div class="h-content">
<img src="../../static/image/subject-list-logo.png" />
<div class="title">当前专题:{{ queryParams.tagName }}</div>
</div>
<div class="overlay"></div>
</div>
</div> -->
</van-sticky>
<div class="content">
<van-pull-refresh v-model="refreshing" @refresh="handleRefresh">
......@@ -25,7 +35,7 @@
</span>
<div class="tag">
<span v-for="(tagName, index) in item.tagName.split(',')" :key="index">{{
tagName }}</span>
tagName }}</span>
</div>
<div class="info">
<div class="user">
......@@ -50,9 +60,11 @@
<script setup name="subject-list">
import { selectSubjectList } from '@/api/subject'
import { useInitScroll } from '@/hooks/useScroll'
import { selectOrganizeList } from '@/api/prefecture'
import useUserStore from '@/store/user'
useInitScroll()
const userStore = useUserStore()
const router = useRouter()
const route = useRoute()
......@@ -69,16 +81,31 @@ const queryParams = reactive({
tagName: '',
materialType: 3,
typeClassify: '',
organizeId: null,
organizeName: ''
organizeName: '',
organizeInt: [0]
})
onLoad((options) => {
queryParams.tagId = options.tagId
queryParams.tagName = options.tagName
getList()
getOrganizeList()
})
const organizeList = ref([])
const getOrganizeList = async () => {
const data = {
userId: userStore.userinfo.user.id,
sysCode: import.meta.env.VITE_APP_SYSTEM_CODE,
moduleCode: 'practice-mediaCatalog'
}
const res = await selectOrganizeList(data)
organizeList.value = res.data
organizeList.value.forEach(item => {
queryParams.organizeInt.push(item.id)
})
getList()
}
const dataList = ref([])
const handleSelectDataList = async () => {
const res = await selectSubjectList(page, queryParams)
......@@ -107,6 +134,10 @@ const handleRefresh = () => {
getList()
}
const back = () => {
xma.navigateBack();
};
// onActivated(() => {
// nextTick(() => { }).then(() => {
......@@ -117,53 +148,61 @@ const handleRefresh = () => {
// })
</script>
<style lang="scss" scoped>
.container {
background-color: #f6f6f6;
min-height: 100vh;
:deep(.searchComponent .search) {
display: contents;
}
.header {
background-image: url('../../static/image/subject-list-bg.png');
background-size: cover;
background-repeat: no-repeat;
background-position: center;
position: relative;
.header {
background-image: url('../../static/image/subject-list-bg.png');
background-size: cover;
background-repeat: no-repeat;
background-position: center;
position: relative;
display: flex;
.h-content {
position: relative;
z-index: 999;
width: 100%;
height: 62px;
display: flex;
justify-content: center;
align-items: center;
gap: 10px;
img {
width: 23px;
height: 23px;
}
.h-content {
position: relative;
z-index: 999;
width: 100%;
height: 62px;
display: flex;
justify-content: center;
align-items: center;
gap: 10px;
.title {
font-size: 15px;
color: #ffffff;
font-weight: 500;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
img {
width: 23px;
height: 23px;
}
.overlay {
background-color: #000000;
opacity: 0.3;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
.title {
font-size: 15px;
color: #ffffff;
font-weight: 500;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
.overlay {
background-color: #000000;
opacity: 0.3;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
}
}
.container {
background-color: #f6f6f6;
min-height: 100vh;
.content {
padding: 0 10px;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment