Skip to content

J
jiaxiu-miniapp
Commit 64616be7 authored by 彭佳妮（贵阳日报）'s avatar 彭佳妮（贵阳日报）
Browse files
Options

个人中心

parent 47bed8f9
Hide whitespace changes
Inline Side-by-side
Showing with 108 additions and 912 deletions
.env.production
View file @ 64616be7
......@@ -11,7 +11,7 @@ VITE_APP_BASE_API = 'https://info.gyntv.com.cn/back/ty-visit/ty-visit'
VITE_APP_VISITOR_CODE = 'practice-mediaCatalog'
#文件路径
VITE_APP_FILE_URL = '/download'
VITE_APP_FILE_URL = 'https://info.gyntv.com.cn/'
#kkfile地址
VITE_APP_PREVIEW_URL = 'http://jiaxiu.gyntv.com.cn:8012/onlinePreview?url='
......
src/manifest.json
View file @ 64616be7
......@@ -77,7 +77,7 @@
"sdkConfigs" : {
"maps" : {
"qqmap" : {
"key" : "H2OBZ-4BRCV-HFTPF-5WH3N-TOXK5-NSBYX"
"key" : "MN4BZ-7JXKW-2RYRD-32QGF-AHONV-PAFUN"
}
}
},
......
src/pages.json
View file @ 64616be7
......@@ -74,6 +74,16 @@
"requireAuth": true
}
},
{
"path": "pages/subject/list",
"name": "subject-list",
"style": {
"navigationBarTitleText": "专题"
},
"meta": {
"requireAuth": true
}
},
{
"path": "pages/account/login",
"name": "account-login",
......@@ -108,18 +118,18 @@
"backgroundColor": "#ffffff",
"list": [{
"pagePath": "pages/home/index",
"iconPath": "../src/assets/image/home.png",
"selectedIconPath": "../src/assets/image/home-select.png",
"iconPath": "/src/assets/image/home.png",
"selectedIconPath": "/src/assets/image/home-select.png",
"text": "首页"
}, {
"pagePath": "pages/classify/index",
"iconPath": "../src/assets/image/classify.png",
"selectedIconPath": "../src/assets/image/classify-select.png",
"iconPath": "/src/assets/image/classify.png",
"selectedIconPath": "/src/assets/image/classify-select.png",
"text": "分类"
}, {
"pagePath": "pages/mine/index",
"iconPath": "../src/assets/image/mine.png",
"selectedIconPath": "../src/assets/image/mine-select.png",
"iconPath": "/src/assets/image/mine.png",
"selectedIconPath": "/src/assets/image/mine-select.png",
"text": "我的"
}]
}
......
src/pages/mine/index.vue
View file @ 64616be7
<template>
<div class="container" v-if="userStore.isLogin">
<div class="userinfo">
<img class="avatar"
mode="aspectFill"
<img class="avatar" mode="aspectFill"
:src="fileDomain + userStore.userinfo.user.headSculpturePhoto ?? '../../assets/image/avatar-content.png'"
@click="router.push({ name: 'account-userinfo' })">
<div class="user">
......@@ -37,6 +36,14 @@
<van-button plain type="default" round block
@click="router.push({ name: 'account-userinfo' })">编辑资料</van-button>
</div>
<div class="area">
<div class="a-prefecture a-box" @click="router.push({ name: 'prefecture' })">
<div class="a-text">专区</div>
</div>
<div class="a-subject a-box" @click="router.push({ name: 'subject' })">
<div class="a-text">专题</div>
</div>
</div>
<div class="content">
<van-tabs v-model:active="active" background="#f8f8f8" animated swipeable sticky>
<van-tab title="待发布">
......@@ -76,7 +83,7 @@ onShow(() => {
})
const toLogin = () => {
if(userStore.isLogin())
if (userStore.isLogin())
return
router.push({ name: 'account-login' })
}
......@@ -192,6 +199,41 @@ const logout = () => {
}
}
.area {
display: flex;
justify-content: space-between;
margin-top: 20px;
.a-box {
width: 344rpx;
height: 120rpx;
border-radius: 10px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.a-prefecture {
background-image: url('../../assets/image/prefecture.png');
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.a-subject {
background-image: url('../../assets/image/subject.png');
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.a-text {
font-size: 32rpx;
color: #232524;
}
}
.content {
margin-top: 20px;
}
......
src/pages/publish/components/AtlasUpload/index.vue
View file @ 64616be7
......@@ -16,7 +16,16 @@
</div>
</div>
<div class="info">
<span class="title">图片{{ index + 1 }}描述：</span>
<div class="info-box">
<span class="title">图片{{ index + 1 }}描述：</span>
<div>
<radio-group @change="radioChange" class="radio-box">
<span class="title">封面</span>
<radio style="transform: scale(0.6);" :value="index"
:checked="index == current" />
</radio-group>
</div>
</div>
<textarea v-model="item.enclosureDesc" rows="2" placeholder="请输入图片描述"
:disabled="!item.uploadResult" />
</div>
......@@ -86,7 +95,17 @@ const handleUpload = () => {
});
}
const current = ref(0)
const radioChange = (evt) => {
current.value = evt.detail.value
console.log(current.value)
}
const handleDelete = (index) => {
// 当删除的是最后一张图片且是封面图的时候，更换封面图为第一张
if (index + 1 == fileList.value.length && index == current.value) {
current.value = 0
}
fileList.value.splice(index, 1)
}
......@@ -110,12 +129,12 @@ const handleNext = () => {
enclosureAddr: item.uploadResult.data.compressNameAndPath[0].path,
enclosureDesc: item.enclosureDesc,
createBy: userStore.userinfo.user.name,
filesize: item.uploadResult.data.compressNameAndPath[0].size,
fileSize: item.uploadResult.data.compressNameAndPath[0].size,
compressPath: item.uploadResult.data.compressPath[0],
watermarkPath: item.uploadResult.data.waterpath[0]
})
}
emits('confirm', { code: 'next', enclosureLists: enclosureLists })
emits('confirm', { code: 'next', enclosureLists: enclosureLists, coverIndex: current.value })
}
</script>
......@@ -186,6 +205,21 @@ const handleNext = () => {
gap: 10px;
box-sizing: border-box;
.info-box {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
.radio-box {
display: flex;
align-items: center;
font-size: 28rpx;
color: #545454;
margin-bottom: 20rpx;
}
}
.title {
color: #545454;
font-size: 15px;
......
src/pages/publish/index.vue
View file @ 64616be7
......@@ -35,6 +35,7 @@ const catalog = ref({
checkState: 0,
collect: 0
})
const coverIndex = ref(0)
const handleConfirm = async (data) => {
if (data.code == 'next') {
......@@ -42,6 +43,7 @@ const handleConfirm = async (data) => {
componentName = componentList[stepsActive.value]
enclosureLists.value = data.enclosureLists ?? enclosureLists.value
catalog.value = data.catalog ? { ...catalog.value, ...data.catalog } : catalog.value
coverIndex.value = data.coverIndex ?? coverIndex.value
}
if (data.code == 'pre') {
stepsActive.value--
......@@ -75,14 +77,14 @@ const setCatalog = () => {
materialFilePath.push(item.enclosureAddr)
compressPath.push(item.compressPath)
watermarkPath.push(item.watermarkPath)
fileSize += parseInt(item.filesize)
fileSize += parseInt(item.fileSize)
})
catalog.value.materialFilePath = materialFilePath.join(',')
catalog.value.compressPath = compressPath.join(',')
catalog.value.watermarkPath = watermarkPath.join(',')
catalog.value.filesize = fileSize.toString()
catalog.value.fileSize = fileSize.toString()
catalog.value.fileNum = enclosureLists.value.length
catalog.value.coverpicture = enclosureLists.value[0].enclosureAddr
catalog.value.coverpicture = enclosureLists.value[coverIndex.value].enclosureAddr
}
</script>
......
src/pages/publish/result.vue
View file @ 64616be7
......@@ -6,7 +6,7 @@
<div class="title">提交成功</div>
<div class="desc">注：请前往“我的-待发布图组”进行图组发布</div>
</div>
<van-button type="primary" @click="router.push({name:'mine'})">前往待发布图组</van-button>
<van-button type="primary" @click="router.pushTab({name:'mine'})">前往待发布图组</van-button>
</div>
</template>
<script setup>
......
src/pages/subject/list.vue
View file @ 64616be7
<template>
<div class="container">
<van-sticky>
<van-nav-bar title="专题列表" :left-arrow="true" fixed placeholder safe-area-inset-top
@click-left="router.go(-1)" />
<!-- <van-nav-bar title="专题列表" :left-arrow="true" fixed placeholder safe-area-inset-top
@click-left="router.go(-1)" /> -->
<div class="header">
<div class="h-content">
<img src="../../assets/image/subject-list-logo.png" />
......
src/pages/subject/prefecture copy/components/OrganizationPopup.vue deleted 100644 → 0
View file @ 47bed8f9
<template>
<van-popup v-model:show="show" position="left" :style="{ width: '65%', height: '100%' }">
<div class="list">
<div class="container" v-for="(item, index) in dataList" :key="index" @click="handleChoose(item,index)">
<div class="list-item">
<img class="left-logo" src="../../../assets/image/organization-logo.png">
<span>{{ item.organName }}</span>
<!-- <van-icon name="arrow-down" size="20" /> -->
<van-icon name="success" size="25" color="#2879FE" v-if="active == index" />
</div>
<!-- <div class="children">
<div class="list-item">
<div class="left-logo"></div>
<span>贵阳日报</span>
<van-icon name="arrow-up" size="20" />
</div>
<div class="list-item">
<div class="left-logo"></div>
<span>摄影部</span>
<van-icon name="arrow-up" size="20" />
</div>
<div class="list-item">
<div class="left-logo"></div>
<span class="active">新媒体运营中心</span>
<van-icon name="success" size="25" color="#2879FE" />
</div>
<div class="list-item">
<div class="left-logo"></div>
<span>技术部</span>
<van-icon name="arrow-up" size="20" />
</div>
</div> -->
</div>
</div>
</van-popup>
</template>
<script setup>
import { selectOrganizeList } from '@/api/prefecture'
import useUserStore from '@/stores/user'
import index from '../index.vue';
const show = ref(false)
const userStore = useUserStore()
const emits = defineEmits(["confirm"])
const active = ref(0)
const dataList = ref([])
const getList = async () => {
const data = {
userId: userStore.userinfo.user.id,
sysCode: import.meta.env.VITE_APP_SYSTEM_CODE,
moduleCode: 'practice-mediaCatalog'
}
const res = await selectOrganizeList(data)
dataList.value = res.data
emits('confirm', dataList.value[0])
}
getList()
const handleChoose = (item, index) => {
active.value = index
emits('confirm', item)
close()
}
const open = () => {
show.value = true
}
const close = () => {
show.value = false
}
defineExpose({
open,
close
})
</script>
<style lang="scss" scoped>
.list {
padding: 50px 10px;
.list-item {
display: flex;
align-items: center;
gap: 5px;
padding: 10px 0;
border-bottom: 1px solid #f2F2F2;
.left-logo {
width: 25px;
height: 25px;
}
.active {
color: #2879FE;
}
span {
font-size: 15px;
color: #232524;
flex: 1;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style>
\ No newline at end of file
src/pages/subject/prefecture copy/index.vue deleted 100644 → 0
View file @ 47bed8f9
<template>
<van-sticky>
<div class="header">
<div class="tools">
<van-search v-model="queryParams.materialTitle" shape="round" placeholder="请输入搜索关键词"
@search="handleRefresh" @clear="handleRefresh" />
</div>
<div class="menu">
<div class="organization" @click="openOrganizationPopup">
<img src="../../assets/image/prefecture-logo1.png">
<span>{{ organize.organName }}</span>
</div>
<div class="filtrate">
<div class="item" @click="openTypePopup" :class="{ active: typeActive }">
<span>类型</span>
<van-icon :name="typeActive ? 'arrow-up' : 'arrow-down'" size="13" />
</div>
<div class="item" @click="openCatalogPopup" :class="{ active: tagsActive }">
<span>标签</span>
<van-icon :name="tagsActive ? 'arrow-up' : 'arrow-down'" size="13" />
</div>
<div class="item" @click="openSourcePopup" :class="{ active: sourceChannelActive }">
<span>来源</span>
<van-icon :name="sourceChannelActive ? 'arrow-up' : 'arrow-down'" size="13" />
</div>
</div>
</div>
</div>
</van-sticky>
<div class="content">
<van-pull-refresh v-model="refreshing" @refresh="handleRefresh">
<van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" :offset="50" @load="getList"
v-if="dataList.length">
<div class="list">
<div class="item" v-for="(item, index) in dataList" :key="index"
@click="router.push({ name: 'home-content', query: { id: item.materialId } })">
<img :src="fileDomain + item.coverpicture">
<div class="desc">
<span class="title">
<van-text-ellipsis :content="item.materialTitle" />
</span>
<div class="tag">
<span v-for="(tagName, index) in item.tagName.split(',')" :key="index">{{ tagName
}}</span>
</div>
<div class="info">
<div class="user">
<img src="../../assets/image/avatar.png">
<span>{{ item.author }}</span>
</div>
<div class="collect">
<van-icon name="star-o" color="#9F9F9F" v-if="index < 5" />
<van-icon name="star" color="#F1C13E" v-else />
<span>收藏</span>
</div>
</div>
</div>
</div>
</div>
</van-list>
<van-empty description="暂无数据" v-else />
</van-pull-refresh>
</div>
<type-popup ref="typePopupRef" @confirm="confirmTypePopup" @close="typeActive = false"></type-popup>
<source-channel-popup ref="sourceChannelPopupRef" @confirm="confirmSourceChannelPopup"
@close="sourceChannelActive = false"></source-channel-popup>
<tags-popup ref="tagsPopupRef" @confirm="confirmTagsPopup" @close="tagsActive = false"></tags-popup>
<organization-popup ref="organizationPopupRef" @confirm="confirmOrganizationPopup"></organization-popup>
</template>
<script setup>
import OrganizationPopup from './components/OrganizationPopup.vue'
import TypePopup from '../components/TypePopup/index.vue'
import SourceChannelPopup from '../components/SourceChannelPopup/index.vue'
import TagsPopup from '../components/TagsPopup/index.vue'
import { selectPrefecturetList } from '@/api/prefecture'
import { useInitScroll } from '@/hooks/useScroll'
useInitScroll()
const router = useRouter()
const refreshing = ref(false)
const loading = ref(false)
const finished = ref(true)
const fileDomain = import.meta.env.VITE_APP_FILE_URL
const organize = ref({})
const page = reactive({
pageNum: 0,
pageSize: 10
})
const queryParams = reactive({
materialTitle: '',
materialType: 3,
organizeId: 1720,
typeClassify: null,
tagId: null,
sourceName: null
})
const dataList = ref([])
const getList = async () => {
page.pageNum++
loading.value = true
const res = await selectPrefecturetList(page, queryParams)
setDataList(res)
}
const setDataList = (res) => {
if (refreshing.value) {
dataList.value = res.data.list
} else {
dataList.value.push(...res.data.list)
}
loading.value = false
finished.value = dataList.value.length >= res.data.total
refreshing.value = false
}
const handleRefresh = () => {
refreshing.value = true
page.pageNum = 0
getList()
}
const typeActive = ref(false)
const typePopupRef = ref()
const openTypePopup = () => {
typeActive.value = true
typePopupRef.value.open()
}
const confirmTypePopup = (e) => {
page.pageNum = 0
queryParams.typeClassify = e?.classifyType ?? ''
refreshing.value = true
getList()
}
const sourceChannelActive = ref(false)
const sourceChannelPopupRef = ref()
const openSourcePopup = () => {
sourceChannelActive.value = true
sourceChannelPopupRef.value.open()
}
const confirmSourceChannelPopup = (e) => {
page.pageNum = 0
queryParams.sourceName = e?.sourceName ?? ''
refreshing.value = true
getList()
}
const tagsActive = ref(false)
const tagsPopupRef = ref()
const openCatalogPopup = () => {
tagsActive.value = true
tagsPopupRef.value.open()
}
const confirmTagsPopup = (e) => {
page.pageNum = 0
queryParams.tagId = e?.id.toString() ?? ''
refreshing.value = true
getList()
}
const organizationPopupRef = ref()
const openOrganizationPopup = () => {
organizationPopupRef.value.open()
}
const confirmOrganizationPopup = (item) => {
organize.value = item
queryParams.organizeId = item?.id
handleRefresh()
}
</script>
<style lang="scss" scoped>
.header {
padding: 10px;
background-color: #ffffff;
box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.1);
.tools {
:deep(.van-search) {
flex: 1;
padding: 0;
}
}
.menu {
display: flex;
justify-content: space-between;
align-items: center;
padding-top: 10px;
.organization {
display: flex;
align-items: center;
gap: 3px;
img {
width: 21px;
height: 21px;
}
span {
line-height: 21px;
width: 100px;
font-size: 15px;
color: #545454;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
.filtrate {
display: flex;
align-items: center;
height: 44px;
gap: 10px;
.item {
display: flex;
gap: 2px;
align-items: center;
justify-content: center;
font-size: 14px;
background-color: #e7e8e9;
width: 60px;
height: 24px;
border-radius: 4px;
}
}
}
}
.header-placeholder {
height: 117px;
}
.content {
background-color: #f3f3f3;
padding: 10px 10px 0 10px;
min-height: 100vh;
.list {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.item {
break-inside: avoid;
background-color: #ffffff;
border-radius: 5px;
margin-bottom: 10px;
width: 49%;
img {
width: 100%;
height: 150px;
object-fit: cover;
}
.desc {
padding: 5px 10px;
display: flex;
flex-direction: column;
gap: 5px;
.title {
font-size: 16px;
}
.tag {
display: flex;
flex-wrap: wrap;
gap: 3px;
span {
font-size: 14px;
padding: 0 5px;
background-color: #F3F8FF;
color: #4C70AC;
font-size: 12PX;
border-radius: 3px;
}
}
.info {
display: flex;
justify-content: space-between;
padding: 5px 0;
.user {
display: flex;
gap: 7px;
align-items: center;
img {
width: 23px;
height: 23px;
border-radius: 50%;
}
span {
color: #9F9F9F;
font-size: 12px;
}
}
}
.collect {
display: flex;
align-items: center;
gap: 3px;
span {
color: #9F9F9F;
font-size: 12px;
}
}
}
}
}
}
.active {
background-color: #0e7ce3 !important;
color: #ffffff !important;
}
</style>@/hooks/useScroll
\ No newline at end of file
src/pages/subject/prefecture/components/OrganizationPopup.vue deleted 100644 → 0
View file @ 47bed8f9
<template>
<van-popup v-model:show="show" position="left" :style="{ width: '65%', height: '100%' }">
<div class="list">
<div class="container" v-for="(item, index) in dataList" :key="index" @click="handleChoose(item,index)">
<div class="list-item">
<img class="left-logo" src="../../../assets/image/organization-logo.png">
<span>{{ item.organName }}</span>
<!-- <van-icon name="arrow-down" size="20" /> -->
<van-icon name="success" size="25" color="#2879FE" v-if="active == index" />
</div>
<!-- <div class="children">
<div class="list-item">
<div class="left-logo"></div>
<span>贵阳日报</span>
<van-icon name="arrow-up" size="20" />
</div>
<div class="list-item">
<div class="left-logo"></div>
<span>摄影部</span>
<van-icon name="arrow-up" size="20" />
</div>
<div class="list-item">
<div class="left-logo"></div>
<span class="active">新媒体运营中心</span>
<van-icon name="success" size="25" color="#2879FE" />
</div>
<div class="list-item">
<div class="left-logo"></div>
<span>技术部</span>
<van-icon name="arrow-up" size="20" />
</div>
</div> -->
</div>
</div>
</van-popup>
</template>
<script setup>
import { selectOrganizeList } from '@/api/prefecture'
import useUserStore from '@/stores/user'
import index from '../index.vue';
const show = ref(false)
const userStore = useUserStore()
const emits = defineEmits(["confirm"])
const active = ref(0)
const dataList = ref([])
const getList = async () => {
const data = {
userId: userStore.userinfo.user.id,
sysCode: import.meta.env.VITE_APP_SYSTEM_CODE,
moduleCode: 'practice-mediaCatalog'
}
const res = await selectOrganizeList(data)
dataList.value = res.data
emits('confirm', dataList.value[0])
}
getList()
const handleChoose = (item, index) => {
active.value = index
emits('confirm', item)
close()
}
const open = () => {
show.value = true
}
const close = () => {
show.value = false
}
defineExpose({
open,
close
})
</script>
<style lang="scss" scoped>
.list {
padding: 50px 10px;
.list-item {
display: flex;
align-items: center;
gap: 5px;
padding: 10px 0;
border-bottom: 1px solid #f2F2F2;
.left-logo {
width: 25px;
height: 25px;
}
.active {
color: #2879FE;
}
span {
font-size: 15px;
color: #232524;
flex: 1;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style>
\ No newline at end of file
src/pages/subject/prefecture/index.vue deleted 100644 → 0
View file @ 47bed8f9
<template>
<van-sticky>
<div class="header">
<div class="tools">
<van-search v-model="queryParams.materialTitle" shape="round" placeholder="请输入搜索关键词"
@search="handleRefresh" @clear="handleRefresh" />
</div>
<div class="menu">
<div class="organization" @click="openOrganizationPopup">
<img src="../../assets/image/prefecture-logo1.png">
<span>{{ organize.organName }}</span>
</div>
<div class="filtrate">
<div class="item" @click="openTypePopup" :class="{ active: typeActive }">
<span>类型</span>
<van-icon :name="typeActive ? 'arrow-up' : 'arrow-down'" size="13" />
</div>
<div class="item" @click="openCatalogPopup" :class="{ active: tagsActive }">
<span>标签</span>
<van-icon :name="tagsActive ? 'arrow-up' : 'arrow-down'" size="13" />
</div>
<div class="item" @click="openSourcePopup" :class="{ active: sourceChannelActive }">
<span>来源</span>
<van-icon :name="sourceChannelActive ? 'arrow-up' : 'arrow-down'" size="13" />
</div>
</div>
</div>
</div>
</van-sticky>
<div class="content">
<van-pull-refresh v-model="refreshing" @refresh="handleRefresh">
<van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" :offset="50" @load="getList"
v-if="dataList.length">
<div class="list">
<div class="item" v-for="(item, index) in dataList" :key="index"
@click="router.push({ name: 'home-content', query: { id: item.materialId } })">
<img :src="fileDomain + item.coverpicture">
<div class="desc">
<span class="title">
<van-text-ellipsis :content="item.materialTitle" />
</span>
<div class="tag">
<span v-for="(tagName, index) in item.tagName.split(',')" :key="index">{{ tagName
}}</span>
</div>
<div class="info">
<div class="user">
<img src="../../assets/image/avatar.png">
<span>{{ item.author }}</span>
</div>
<div class="collect">
<van-icon name="star-o" color="#9F9F9F" v-if="index < 5" />
<van-icon name="star" color="#F1C13E" v-else />
<span>收藏</span>
</div>
</div>
</div>
</div>
</div>
</van-list>
<van-empty description="暂无数据" v-else />
</van-pull-refresh>
</div>
<type-popup ref="typePopupRef" @confirm="confirmTypePopup" @close="typeActive = false"></type-popup>
<source-channel-popup ref="sourceChannelPopupRef" @confirm="confirmSourceChannelPopup"
@close="sourceChannelActive = false"></source-channel-popup>
<tags-popup ref="tagsPopupRef" @confirm="confirmTagsPopup" @close="tagsActive = false"></tags-popup>
<organization-popup ref="organizationPopupRef" @confirm="confirmOrganizationPopup"></organization-popup>
</template>
<script setup>
import OrganizationPopup from './components/OrganizationPopup.vue'
import TypePopup from '../components/TypePopup/index.vue'
import SourceChannelPopup from '../components/SourceChannelPopup/index.vue'
import TagsPopup from '../components/TagsPopup/index.vue'
import { selectPrefecturetList } from '@/api/prefecture'
import { useInitScroll } from '@/hooks/useScroll'
useInitScroll()
const router = useRouter()
const refreshing = ref(false)
const loading = ref(false)
const finished = ref(true)
const fileDomain = import.meta.env.VITE_APP_FILE_URL
const organize = ref({})
const page = reactive({
pageNum: 0,
pageSize: 10
})
const queryParams = reactive({
materialTitle: '',
materialType: 3,
organizeId: 1720,
typeClassify: null,
tagId: null,
sourceName: null
})
const dataList = ref([])
const getList = async () => {
page.pageNum++
loading.value = true
const res = await selectPrefecturetList(page, queryParams)
setDataList(res)
}
const setDataList = (res) => {
if (refreshing.value) {
dataList.value = res.data.list
} else {
dataList.value.push(...res.data.list)
}
loading.value = false
finished.value = dataList.value.length >= res.data.total
refreshing.value = false
}
const handleRefresh = () => {
refreshing.value = true
page.pageNum = 0
getList()
}
const typeActive = ref(false)
const typePopupRef = ref()
const openTypePopup = () => {
typeActive.value = true
typePopupRef.value.open()
}
const confirmTypePopup = (e) => {
page.pageNum = 0
queryParams.typeClassify = e?.classifyType ?? ''
refreshing.value = true
getList()
}
const sourceChannelActive = ref(false)
const sourceChannelPopupRef = ref()
const openSourcePopup = () => {
sourceChannelActive.value = true
sourceChannelPopupRef.value.open()
}
const confirmSourceChannelPopup = (e) => {
page.pageNum = 0
queryParams.sourceName = e?.sourceName ?? ''
refreshing.value = true
getList()
}
const tagsActive = ref(false)
const tagsPopupRef = ref()
const openCatalogPopup = () => {
tagsActive.value = true
tagsPopupRef.value.open()
}
const confirmTagsPopup = (e) => {
page.pageNum = 0
queryParams.tagId = e?.id.toString() ?? ''
refreshing.value = true
getList()
}
const organizationPopupRef = ref()
const openOrganizationPopup = () => {
organizationPopupRef.value.open()
}
const confirmOrganizationPopup = (item) => {
organize.value = item
queryParams.organizeId = item?.id
handleRefresh()
}
</script>
<style lang="scss" scoped>
.header {
padding: 10px;
background-color: #ffffff;
box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.1);
.tools {
:deep(.van-search) {
flex: 1;
padding: 0;
}
}
.menu {
display: flex;
justify-content: space-between;
align-items: center;
padding-top: 10px;
.organization {
display: flex;
align-items: center;
gap: 3px;
img {
width: 21px;
height: 21px;
}
span {
line-height: 21px;
width: 100px;
font-size: 15px;
color: #545454;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
.filtrate {
display: flex;
align-items: center;
height: 44px;
gap: 10px;
.item {
display: flex;
gap: 2px;
align-items: center;
justify-content: center;
font-size: 14px;
background-color: #e7e8e9;
width: 60px;
height: 24px;
border-radius: 4px;
}
}
}
}
.header-placeholder {
height: 117px;
}
.content {
background-color: #f3f3f3;
padding: 10px 10px 0 10px;
min-height: 100vh;
.list {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.item {
break-inside: avoid;
background-color: #ffffff;
border-radius: 5px;
margin-bottom: 10px;
width: 49%;
img {
width: 100%;
height: 150px;
object-fit: cover;
}
.desc {
padding: 5px 10px;
display: flex;
flex-direction: column;
gap: 5px;
.title {
font-size: 16px;
}
.tag {
display: flex;
flex-wrap: wrap;
gap: 3px;
span {
font-size: 14px;
padding: 0 5px;
background-color: #F3F8FF;
color: #4C70AC;
font-size: 12PX;
border-radius: 3px;
}
}
.info {
display: flex;
justify-content: space-between;
padding: 5px 0;
.user {
display: flex;
gap: 7px;
align-items: center;
img {
width: 23px;
height: 23px;
border-radius: 50%;
}
span {
color: #9F9F9F;
font-size: 12px;
}
}
}
.collect {
display: flex;
align-items: center;
gap: 3px;
span {
color: #9F9F9F;
font-size: 12px;
}
}
}
}
}
}
.active {
background-color: #0e7ce3 !important;
color: #ffffff !important;
}
</style>@/hooks/useScroll
\ No newline at end of file
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