Skip to content

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

首页改版

parent 7d535a6e
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 342 additions and 16 deletions
components.d.ts
View file @ bec8a37e
......@@ -20,6 +20,7 @@ declare module 'vue' {
VanImagePreview: typeof import('vant/es')['ImagePreview']
VanList: typeof import('vant/es')['List']
VanNavBar: typeof import('vant/es')['NavBar']
VanNoticeBar: typeof import('vant/es')['NoticeBar']
VanPopup: typeof import('vant/es')['Popup']
VanProgress: typeof import('vant/es')['Progress']
VanPullRefresh: typeof import('vant/es')['PullRefresh']
......@@ -28,6 +29,8 @@ declare module 'vue' {
VanStep: typeof import('vant/es')['Step']
VanSteps: typeof import('vant/es')['Steps']
VanSticky: typeof import('vant/es')['Sticky']
VanSwipe: typeof import('vant/es')['Swipe']
VanSwipeItem: typeof import('vant/es')['SwipeItem']
VanTab: typeof import('vant/es')['Tab']
VanTabs: typeof import('vant/es')['Tabs']
VanTextEllipsis: typeof import('vant/es')['TextEllipsis']
......
src/pages.json
View file @ bec8a37e
......@@ -15,13 +15,21 @@
}
},
{
"path": "pages/home/index",
"path": "pages/home/indexNew",
"name": "home",
"style": {
"navigationBarTitleText": "甲秀图库",
"navigationStyle": "custom"
}
},
{
"path": "pages/home/index",
"name": "home-index",
"style": {
"navigationBarTitleText": "甲秀图库",
"navigationStyle": "custom"
}
},
{
"path": "pages/classify/index",
"name": "classify",
......@@ -125,7 +133,14 @@
"style": {
"navigationBarTitleText": "分类详情"
}
}
},
{
"path": "pages/home/list",
"name": "home-list",
"style": {
"navigationBarTitleText": "图组列表"
}
},
],
"globalStyle": {
"navigationBarTextStyle": "black",
......@@ -144,7 +159,7 @@
"backgroundColor": "#ffffff",
"list": [
{
"pagePath": "pages/home/index",
"pagePath": "pages/home/indexNew",
"iconPath": "static/image/home.png",
"selectedIconPath": "static/image/home-select.png",
"text": "首页"
......
src/pages/classify/list.vue
View file @ bec8a37e
......@@ -30,8 +30,9 @@
<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 />
<van-icon name="star-o" color="#9F9F9F" />
<!-- <van-icon name="star-o" color="#9F9F9F" v-if="index < 5" />
<van-icon name="star" color="#F1C13E" v-else /> -->
<span>收藏</span>
</div>
</div>
......
src/pages/home/indexNew.vue 0 → 100644
View file @ bec8a37e
<template>
<Header backgroundBox="#D2E4FF" :show="false">
<div class="header">
<div class="title">推荐</div>
<div class="search">
<div class="s-box" @click="router.push({ name: 'home-list' })">
<van-icon name="search" color="#303030" />
<input class="placeholder" placeholder="请输入关键词" />
</div>
</div>
</div>
</Header>
<div class="bg">
<div class="content">
<div class="top">
<van-swipe :autoplay="3000" lazy-render>
<van-swipe-item v-for="image in images" :key="image">
<img class="img" :src="image" mode="aspectFill" />
</van-swipe-item>
</van-swipe>
</div>
<van-notice-bar color="#2879FE" background="#EFF4FB" left-icon="volume" text="公告信息" />
<div class="info">
<div class="titlebox" @click="router.push({ name: 'home-list' })" >
<div class="title">推荐图组</div>
<div class="flexend">
<div class="more">查看更多</div>
<van-icon name="arrow" color="#707070" size="12" />
</div>
</div>
<scroll-view scroll-x="true" class="scroll-view_H" style="white-space: nowrap;">
<div class="list">
<img :src="fileDomain + item.coverpicture" v-for="(item, index) in dataList" :key="index"
@click="router.push({ name: 'classify-detail', params: { id: item.materialId } })" />
</div>
</scroll-view>
</div>
<div class="info">
<div class="titlebox">
<div class="title">分类</div>
<div class="flexend" @click="router.pushTab({ name: 'classify' })">
<div class="more">查看更多</div>
<van-icon name="arrow" color="#707070" size="12" />
</div>
</div>
<div class="classifyList">
<div class="item" v-for="(item, index) in classifyList" :key="index"
@click="toClassifyDetail(item.classifyType, index)">
<img src="/static/image/defaultPic.png">
<div class="showMore" v-if="index == classifyList.length - 1">
<div class="more">查看更多</div>
</div>
<div class="blurbox" v-else>
<div class="bg"></div>
<div class="title">{{ item.classifyType }}</div>
</div>
</div>
</div>
</div>
<div style="height: 100rpx;"></div>
</div>
</div>
</template>
<script setup>
import { selectFinePictureList } from '@/api/publish'
import { selectClassifyTypeList } from '@/api/classify';
const router = useRouter()
const fileDomain = import.meta.env.VITE_APP_FILE_URL
const images = ref([
'../static/image/banner4.jpg',
'../static/image/banner2.jpg',
]);
const page = reactive({
pageNum: 1,
pageSize: 6
})
const catalog = reactive({
materialTitle: '',
collect: 1,
materialType: 3,
typeClassify: '',
sourceName: '',
organizeInt: [0],
tagId: '',
beginTime: '',
endTime: ''
})
const dataList = ref([])
const handleSelectFindList = async () => {
const res = await selectFinePictureList(page, catalog)
dataList.value.push(...res.data.list)
}
handleSelectFindList()
const queryParams = reactive({
materialType: 3,
classifyType: '',
})
const classifyList = ref([])
const getList = async () => {
page.pageNum++
const res = await selectClassifyTypeList(page, queryParams)
classifyList.value.push(...res.data.list)
}
getList()
const toClassifyDetail = (classifyType, idx) => {
if (idx == classifyList.value.length - 1) {
router.pushTab({ name: 'classify' })
} else {
router.push({ name: 'classify-list', params: { typeClassify: classifyType } })
}
}
</script>
<style scoped lang="scss">
.header {
display: flex;
align-items: center;
padding: 0 20px;
height: 50px;
gap: 15px;
background-color: #D2E4FF;
.title {
font-size: 18px;
font-weight: bold;
}
.search {
width: 45%;
background-color: #F7F8FA;
border-radius: 20px;
display: flex;
align-items: center;
justify-content: space-between;
height: 32px;
opacity: 0.7;
padding: 0 10px;
.s-box {
display: flex;
align-items: center;
gap: 5px;
.placeholder {
color: #303030;
font-size: 14px;
}
}
}
}
.bg {
height: 100vh;
background: linear-gradient(to bottom, #D2E4FF 5%, #fff 25%);
.content {
padding: 30rpx 30rpx;
display: flex;
flex-direction: column;
gap: 30rpx;
.top {
border-radius: 14rpx;
.img {
width: 100%;
height: 360rpx;
border-radius: 14rpx;
}
}
.info {
display: flex;
flex-direction: column;
gap: 30rpx;
margin-top: 20rpx;
.titlebox {
display: flex;
align-items: center;
justify-content: space-between;
.title {
font-size: 32rpx;
font-weight: bold;
color: #000;
}
.flexend {
display: flex;
justify-content: flex-end;
align-items: center;
gap: 8rpx;
.more {
font-size: 24rpx;
color: #707070;
}
}
}
.scroll-view_H {
width: 100%;
.list {
white-space: nowrap;
img {
object-fit: cover;
display: inline-block;
/* 内部元素横向展示 */
margin-right: 16rpx;
/* 可根据需求设置间距 */
width: 286rpx;
height: 340rpx;
border-radius: 6rpx;
}
}
}
.classifyList {
display: flex;
flex-wrap: wrap;
gap: 12rpx;
.item {
break-inside: avoid;
background-color: #ffffff;
border-radius: 10rpx;
margin-bottom: 20rpx;
width: 32%;
position: relative;
img {
width: 100%;
height: 340rpx;
object-fit: cover;
border-radius: 10rpx;
}
.showMore {
border-radius: 10rpx;
top: 0;
left: 0;
width: 100%;
height: 340rpx;
position: absolute;
background: rgba(255, 255, 255, 0.25);
backdrop-filter: blur(20rpx);
display: flex;
align-items: center;
justify-content: center;
z-index: 10;
.more {
font-size: 32rpx;
color: #fff;
}
}
.blurbox {
display: flex;
align-items: center;
justify-content: center;
position: absolute;
bottom: 0;
height: 32px;
width: 100%;
border-radius: 0 0 5px 5px;
.bg {
position: absolute;
border-radius: 0 0 5px 5px;
width: 100%;
height: 100%;
background: rgba(255, 255, 255, 0.25);
backdrop-filter: blur(10px);
}
.title {
font-size: 28rpx;
color: #fff;
font-weight: bold;
z-index: 1;
}
}
}
}
}
}
}
</style>
\ No newline at end of file
src/pages/home/list.vue 0 → 100644
View file @ bec8a37e
This diff is collapsed.
src/pages/home/loading.vue
View file @ bec8a37e
......@@ -12,8 +12,8 @@ const router = useRouter()
const userStore = useUserStore()
onLoad(async () => {
await fastLoginBySgy();
// if (userStore.logout) await signIn2();
// await fastLoginBySgy();
if (userStore.logout) await signIn2();
router.pushTab({ name: 'home' })
});
......
src/pages/mine/index.vue
View file @ bec8a37e
......@@ -98,6 +98,7 @@ const total = reactive({
onShow(() => {
toLogin()
// if (userStore.isLogin())
getOrganizeList()
})
......
src/pages/prefecture/index.vue
View file @ bec8a37e
......@@ -51,8 +51,9 @@
<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 />
<van-icon name="star-o" color="#9F9F9F" />
<!-- <van-icon name="star-o" color="#9F9F9F" v-if="index < 5" />
<van-icon name="star" color="#F1C13E" v-else /> -->
<span>收藏</span>
</div>
</div>
......
src/pages/publish/components/AtlasInfo/index.vue
View file @ bec8a37e
......@@ -68,12 +68,12 @@ const areaConfirm = (selectedOptions) => {
const shoottimeCalendarConfirm = (data) => {
showShoottimeCalendar.value = false
formData.value.shoottime = dayjs(data).format('YYYY-MM-DD HH:mm:ss')
formData.value.shoottime = dayjs(data).format('YYYY-MM-DD')
}
const materialtimeCalendarConfirm = (data) => {
showMaterialtimeCalendar.value = false
formData.value.materialtime = dayjs(data).format('YYYY-MM-DD HH:mm:ss')
formData.value.materialtime = dayjs(data).format('YYYY-MM-DD')
}
const handleRegionPicker = () => {
......
src/pages/subject/index.vue
View file @ bec8a37e
......@@ -12,7 +12,7 @@
<div class="item"
@click="router.push({ name: 'subject-list', params: { tagId: item.tagId, tagName: item.tagName } })"
v-for="(item, index) in dataList" :key="index">
<img class="cover" src="../../static/image/subject-cover.png">
<img class="cover" src="../../static/image/banner1.jpg">
<div class="title">{{ item.tagName }}</div>
</div>
</div>
......@@ -70,6 +70,7 @@ getList()
width: 77px;
height: 77px;
border-radius: 50%;
object-fit: cover;
}
.title {
......
src/pages/subject/list.vue
View file @ bec8a37e
......@@ -43,10 +43,11 @@
<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>
<van-icon name="star-o" color="#9F9F9F" />
<!-- <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>
......
src/router/index.js
View file @ bec8a37e
......@@ -13,8 +13,10 @@ const router = createRouter({
router.beforeEach((to, from, next) => {
console.log(router)
const userStore = useUserStore()
if(to.meta) {
console.log(to.meta)
if (to.meta.requireAuth) {
if (userStore.isLogin()) {
next()
......
vite.config.ts
View file @ bec8a37e
......@@ -6,6 +6,7 @@ import Components from 'unplugin-vue-components/vite';
import { VantResolver } from '@vant/auto-import-resolver';
import legacy from '@vitejs/plugin-legacy';
// import TransformPages from 'uni-read-pages-vite';
// https://vitejs.dev/config/
export default defineConfig(({ mode }) => {
......
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