feat(评论组件): 添加删除评论功能并调整样式

为评论组件添加删除功能按钮，支持删除主评论和子评论
调整评论列表标题样式，增加间距和子评论项的上边距

src/views/resourceDetails/components/TallItem.vue

@@ -1,7 +1,7 @@
 <template>
 	<div>
 		<div>
-			<div style="display: flex; margin-left: 10px; margin-right: 10px">
+			<div style="display: flex; margin-left: 10px; margin-right: 10px" class="mt-2">
 				<div style="width: 40px; height: 40px; background: #1e90ff; border-radius: 50%; margin-right: 10px">
 					<a-image
 						width="100%"
@@ -35,11 +35,15 @@
 							<div style="margin-left: 15px">
 								<MessageOutlined style="cursor: pointer" @click="handerMessage" />
 							</div>
+							<!-- 添加删除图标 -->
+							<div style="margin-left: 15px">
+								<DeleteOutlined style="cursor: pointer" @click="handerDel" />
+							</div>
 						</div>
 					</div>
 				</div>
 			</div>
-			<div v-show="props.item.child.length > 0" v-for="(item, index) in props.item.child" :key="index">
+			<div v-show="props.item.child.length > 0" v-for="(item, index) in props.item.child" :key="index" class="mt-2">
 				<div style="display: flex; margin-left: 50px; margin-right: 0px">
 					<div style="width: 40px; height: 40px; background: #1e90ff; border-radius: 50%; margin-right: 10px">
 							<a-image
@@ -75,6 +79,9 @@
 									<LikeOutlined v-if="item.giveNumSelf == 0" style="cursor: pointer" @click="handerfollwChild(item)" />
 									<span style="margin-left: 5px">{{ item.giveNum }}</span>
 								</div>
+								<div style="margin-left: 15px">
+									<DeleteOutlined style="cursor: pointer" @click="handerDel" />
+								</div>
 							</div>
 						</div>
 					</div>
@@ -105,6 +112,7 @@
 		queryList,
 		pageComment,
 		addComment,
+		deleteComment,
 		giveComment,
 		giveCancelComment
 	} from '@/api/portal'
@@ -188,6 +196,11 @@
 			tallTag.value = false
 		}
 	}
+	const handerDel = () => {
+		deleteComment([{ id: props.item.id }]).then(() => {
+			EventBus.emit('onGetPageComment')
+		})
+	}
 	onMounted(() => {
 		// getList()
 

src/views/resourceDetails/components/TallList.vue

@@ -1,7 +1,7 @@
 <template>
 	<div style="display: flex">
 		<div class="tallList">
-			<div>
+			<div class="tallListTitle">
 				<span style="font-weight: bold; font-size: 14px">发表评论</span>
 				<span class="tallListInfo">文明上网理性发言,请遵守评论服务协议</span>
 			</div>
@@ -485,10 +485,13 @@
 		padding: 20px;
 		margin-top: 10px;
 	}
-
+	.tallList .tallListTitle{
+		margin-bottom: 20px;
+	}
 	.tallListInfo {
 		color: rgba(0, 0, 0, 0.479);
 		font-size: 12px;
+		padding-left: 10px;
 	}
 
 	.line {