Refactor code structure and remove redundant changes
This commit is contained in:
16
pages/text/components/FeaturedSpecials.vue
Normal file
16
pages/text/components/FeaturedSpecials.vue
Normal file
@ -0,0 +1,16 @@
|
||||
<template>
|
||||
<div class="box-border w-100% border border-[#EEEEEE] rounded-12px border-solid bg-[#FFFFFF] px-26px py-30px">
|
||||
<div class="flex items-center">
|
||||
<div class="text-28px text-[#333333] font-normal">精选专题</div>
|
||||
<div class="ml-50px text-21px text-[#999999] font-normal">了解最新趋势发展</div>
|
||||
</div>
|
||||
<div class="mt-36px flex justify-between">
|
||||
<div v-for="item in 4" :key="item" class="flex flex-col items-center">
|
||||
<img :src="`https://picsum.photos/320/190?_t${new Date().getTime()}`" alt="" srcset="" class="h-190px w320 rounded-4px" />
|
||||
<div class="mt-10px text-18px text-[#333333] font-normal">机器人</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts"></script>
|
||||
50
pages/text/components/RecommendedColumnsV2.vue
Normal file
50
pages/text/components/RecommendedColumnsV2.vue
Normal file
@ -0,0 +1,50 @@
|
||||
<template>
|
||||
<div class="relative mt-34px w-100%">
|
||||
<KlTabBar v-model="query.source" :data="tabBar" />
|
||||
<div class="absolute right-0px top-10px text-16px text-[#999999] font-normal"
|
||||
>共<span class="color-#1A65FF">{{ result.total }}</span
|
||||
>个筛选结果</div
|
||||
>
|
||||
<div class="content mt-10px">
|
||||
<el-row :gutter="20">
|
||||
<el-col v-for="(item, index) in result.list" :key="index" :span="6">
|
||||
<CardPicture :item-info="item" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-empty v-if="!result.list.length" :image="emptyImg"></el-empty>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import KlTabBar from '@/components/kl-tab-bar/index.vue'
|
||||
import CardPicture from '@/components/kl-card-picture/index.vue'
|
||||
import { ref } from 'vue'
|
||||
import { pageRes, pageReq } from '@/api/upnew/types'
|
||||
import emptyImg from '@/assets/images/empty.png'
|
||||
|
||||
const query = defineModel<pageReq>('modelValue', {
|
||||
required: true,
|
||||
})
|
||||
|
||||
const result = defineModel<pageRes>('result', {
|
||||
required: true,
|
||||
})
|
||||
|
||||
const tabBar = ref([
|
||||
{
|
||||
label: '文本推荐',
|
||||
value: '',
|
||||
},
|
||||
{
|
||||
label: '原创文本',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '转载分享',
|
||||
value: 2,
|
||||
},
|
||||
])
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
Reference in New Issue
Block a user