You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

87 lines
2.2 KiB

<template>
<div :class="[prefixCls, 'flex']">
<div>
<mai-tab :active="currentTab.id" :data-source="tabs" @change="handleChange"/>
</div>
<div :class="`${prefixCls}-content dynamicInfo flex flex-col px-8`" style="border-left: 1px solid #d9d9d9;">
<div class="py-8 cursor-pointer select-none" style="border-bottom: 1px solid #d9d9d9;" v-for="item in content" :key="item.id">
<nuxt-link :to="`/rules/${item.id}`">
<h3 class="text-2xl mb-6 w-full overflow-hidden text-ellipsis">{{ item.title }}</h3>
<p class="text-xl text-zinc-500 mb-6">{{ item.description }}</p>
<p class="">{{ dayjs(item.createtime * 1000).format('YYYY-MM-DD hh:mm:ss') }}</p>
</nuxt-link>
</div>
<Pagination
:current="current"
:total="total"
:limit="limit"
:pages="pagesRef"
@change="onChangePage"
/>
</div>
</div>
</template>
<script setup lang="ts">
import dayjs from "dayjs";
definePageMeta({
name: '法规标准',
headerHost: true,
order: 2,
})
useHead({
title:'法规标准'
})
import {randomUUID} from '~~/utils';
const {setTotal, current, total, setCurrentPage, limit, pagesRef} = usePagination(1, 4, 0)
const { technicalApi } = useApi()
const {prefixCls} = useDesign('mai-wrap');
const tabs = ref([
{
name: '法规标准',
id: randomUUID(),
children: [],
},
]);
const currentTab = ref({});
const content = ref([]);
const searchData = ref({})
async function handleChange(data:any) {
currentTab.value = data;
setCurrentPage(1)
await getList(data)
}
function onChangePage(val: number) {
setCurrentPage(val)
getList(currentTab.value)
}
async function getList(data: any) {
if(data) {
// loading.value = true;
const {data:listDatas} = await technicalApi.getTechnicalList({...searchData.value,page: current.value, limit: limit, category_id: data.id})
content.value = listDatas.data;
// loading.value = false;
setTotal(listDatas.total)
}
}
async function getData() {
const cate = await technicalApi.getTechnicalCate()
tabs.value[0].children = cate.data
await handleChange(cate.data[0]);
}
getData()
</script>
<style scoped lang="less">
.dynamicInfo {
margin-top: 0;
padding-bottom: 100px;
}
</style>