Files
front-pc/pages/personal-Center/components/components/favorite-table.vue

97 lines
3.4 KiB
Vue

<template>
<KlTabBar v-model="type" :data="tabBar" @change="props.refresh()" />
<el-table :data="modelValue" style="width: 100%" class="mt-14px">
<el-table-column prop="date" label="文件信息">
<template #default="scope">
<div class="flex items-center">
<el-image :src="scope.row.iconUrl" alt="" fit="cover" srcset="" class="h-91px w-181px rd-4px" />
<div class="ml-17px">
<div class="text-16px text-[#333333] font-normal">{{ scope.row.title }}</div>
<div class="text-14px text-[#333333] font-normal my-10px!">{{ scope.row?.ownedUserIdInfo?.nickName }}</div>
<div class="flex items-center">
<div class="flex items-center">
<img src="~/assets/images/look.png" alt="" srcset="" class="h-17px" />
<span class="ml-4px">{{ scope.rowpreviewPoint || 0 }}</span>
</div>
<div class="ml-13px flex items-center">
<img src="~/assets/images/add.png" alt="" srcset="" class="h-23px" />
<span class="ml-4px">{{ scope.row.hotPoint || 0 }}</span>
</div>
<div class="ml-13px flex items-center">
<img src="~/assets/images/chat.png" alt="" srcset="" class="h-17px" />
<span class="ml-4px">{{ scope.row.commentsPoint || 0 }}</span>
</div>
</div>
</div>
</div>
</template>
</el-table-column>
<el-table-column prop="type" label="文件类型" width="100">
<template #default="scope">{{ scope.row.type === 1 ? '图纸' : scope.row.type === 2 ? '文本' : scope.row.type === 3 ? '模型' : '工具箱' }}</template>
</el-table-column>
<el-table-column prop="createTime" label="下载时间" width="180">
<template #default="scope">{{ dayjs(scope.row.createTime).format('YYYY-MM-DD HH:mm:ss') }}</template>
</el-table-column>
<el-table-column prop="createTime" label="取消收藏" width="100" fixed="right">
<template #default="scope">
<el-link type="primary" :underline="false" @click="handleDelete(scope.row.id)">取消收藏</el-link>
</template>
</el-table-column>
</el-table>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
import KlTabBar from '~/components/kl-tab-bar/v2/index.vue'
import type { PageResultProjectMemberFavoritesRespVO } from '~/api/personal-center/types'
import { deleteProject } from '~/api/drawe-detail/index'
import dayjs from 'dayjs'
import { useMessage } from '~/utils/useMessage'
const message = useMessage()
const type = defineModel<number | string>('type', {
required: true,
}) // 双向绑定的value
const modelValue = defineModel<PageResultProjectMemberFavoritesRespVO['list']>('modelValue', {
required: true,
}) // 双向绑定的value
const props = defineProps({
// 刷新
refresh: {
type: Function,
default: () => Function,
},
})
const tabBar = ref([
{
label: '图纸',
value: 1,
},
{
label: '模型',
value: 3,
},
{
label: '文本',
value: 2,
},
])
const handleDelete = async (id: number) => {
const r = await message.confirm('确定取消收藏吗?')
if (!r) return
const res = await deleteProject({
id,
})
const { code } = res
if (code === 0) {
ElMessage.success('取消收藏成功')
props.refresh()
}
}
</script>
<style lang="scss" scoped></style>