|
@@ -0,0 +1,61 @@
|
|
|
+<script setup lang="ts">
|
|
|
+import dayjs from 'dayjs'
|
|
|
+import mpHtml from 'mp-html/dist/uni-app/components/mp-html/mp-html.vue'
|
|
|
+import view from '@designer-hub/assets/src/libs/assets/view'
|
|
|
+
|
|
|
+const props = defineProps({
|
|
|
+ title: {
|
|
|
+ type: String,
|
|
|
+ default: '',
|
|
|
+ },
|
|
|
+ author: {
|
|
|
+ type: Object,
|
|
|
+ default: () => ({ name: '匿名' }),
|
|
|
+ },
|
|
|
+ createdAt: {
|
|
|
+ type: Date,
|
|
|
+ default: () => new Date(),
|
|
|
+ },
|
|
|
+ viewNum: {
|
|
|
+ type: Number,
|
|
|
+ default: 0,
|
|
|
+ },
|
|
|
+ content: {
|
|
|
+ type: String,
|
|
|
+ default: '<div>1111</div>',
|
|
|
+ },
|
|
|
+})
|
|
|
+</script>
|
|
|
+<template>
|
|
|
+ <div class="px-3.5 bg-white flex-grow">
|
|
|
+ <div class="text-black text-xl font-normal font-['PingFang_SC'] leading-loose">
|
|
|
+ {{ title }}
|
|
|
+ </div>
|
|
|
+ <div class="flex items-center my-5">
|
|
|
+ <div class="w-7 h-7 overflow-hidden roudnded-full">
|
|
|
+ <slot name="avatar"></slot>
|
|
|
+ </div>
|
|
|
+ <div class="flex-1 ml-1">
|
|
|
+ <div class="text-black/90 text-sm font-normal font-['PingFang_SC'] leading-normal">
|
|
|
+ {{ author.name }}
|
|
|
+ </div>
|
|
|
+ <div class="text-black/40 text-xs font-normal font-['PingFang_SC'] leading-normal">
|
|
|
+ 编辑于
|
|
|
+ {{ dayjs(createdAt).format('YYYY/MM/DD') }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="flex items-center gap-1">
|
|
|
+ <slot name="viewLeft"></slot>
|
|
|
+ <!-- <wd-icon name="view" size="18" color="rgba(0,0,0,.45)"></wd-icon> -->
|
|
|
+ <wd-img :src="view" width="18" height="18"></wd-img>
|
|
|
+ <div class="text-black/40 text-xs font-normal font-['PingFang_SC'] leading-normal">
|
|
|
+ {{ viewNum || 0 }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- <u-parse :content="content"></u-parse> -->
|
|
|
+ <!-- <div class="content" v-html="content"></div> -->
|
|
|
+ <mpHtml :content="content"></mpHtml>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<style lang="scss"></style>
|