From bab8eda21fc362d1b35aaa26d10df6dc4f4b2c90 Mon Sep 17 00:00:00 2001
From: XiaoMo <a1300399510@qq.com>
Date: Fri, 31 Mar 2023 11:40:11 +0800
Subject: [PATCH] =?UTF-8?q?a1300399510@qq.com=20=E6=8F=90=E4=BA=A4?=
 =?UTF-8?q?=E4=BA=8E=202023/03/31=20-11:40:02?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue                                   |   9 +
 src/components/DetailReply.vue                |  75 ++---
 .../SearchResult-冲突-肖荣豪_Win10.vue        | 267 ------------------
 .../search/searchResult/SearchResult.vue      |   3 -
 4 files changed, 48 insertions(+), 306 deletions(-)
 delete mode 100755 src/views/search/searchResult/SearchResult-冲突-肖荣豪_Win10.vue

diff --git a/src/App.vue b/src/App.vue
index 925ab5b..4534b35 100755
--- a/src/App.vue
+++ b/src/App.vue
@@ -109,4 +109,13 @@ export default {
 	justify-content: flex-end;
 	overflow: auto;
 }
+
+// 清除 input 和 textarea 的默认样式
+input,
+textarea {
+	border: none;
+	outline: none;
+	background: transparent;
+	resize: none;
+}
 </style>
diff --git a/src/components/DetailReply.vue b/src/components/DetailReply.vue
index 31db5d8..a5b9df9 100755
--- a/src/components/DetailReply.vue
+++ b/src/components/DetailReply.vue
@@ -15,7 +15,7 @@
                     <div class="discussion-single-content flexacenter flex1">
                         <input class="discussion-single-input flex1" cursor-spacing="5" type="text"
                             :placeholder="twoCommentData ? '写回复…' : '想问啥，大胆问…'" v-model="commentContent" />
-                        <img class="discussion-single-input-icom" @click="setValue('popState', 'discussionMulti',)"
+                        <img class="discussion-single-input-icom" @click="setValue('popState', 'discussionMulti')"
                             src="@/assets/img/detail/u1448.png" />
                     </div>
                     <div class="discussion-single-btn flexcenter" @click="postComment(commentContent)">
@@ -23,7 +23,6 @@
                     </div>
                 </div>
             </div>
-
         </div>
 
         <!-- 弹窗-讨论-多行 -->
@@ -31,20 +30,15 @@
             <div class="discussion-multi-box pop-box-box flexflex flexcolumn" style="border-radius: .4rem .4rem 0 0;"
                 @click.stop="">
                 <div class="discussion-header flexacenter" v-if="twoCommentData">
-                    <image class="discussion-avatar" :src="twoCommentData.avatar"></image>
+                    <img class="discussion-avatar" :src="twoCommentData.avatar" />
                     <div class="discussion-text one-line">{{ twoCommentData.content }}</div>
                     <img class="discussion-icom" @click.stop="clearTwoCommentData()" src="@/assets/img/detail/u1428.png">
                 </div>
                 <div class="discussion-multi-content flexflex flex1">
-                    <textarea v-if="discussionMultiState" class="discussion-multi-textarea flex1" type="text"
-                        maxlength="500" v-model="commentContent" @blur="setValue('discussionMultiState', false, 'boolean')"
-                        :placeholder="twoCommentData ? '写回复…' : '想问啥，大胆问…'"></textarea>
-                    <div v-else @click="setValue('discussionMultiState', true, 'boolean')"
-                        class="discussion-multi-textarea flex1"
-                        :style="{ color: !commentContent ? 'rgba(118,118,118,1)' : '' }">{{ commentContent ?
-                            commentContent : (twoCommentData ? '写回复…' : '想问啥，大胆问…') }}</div>
-                    <image class="discussion-multi-icom" catchtap="openDiscussionSingle" mode="widthFix"
-                        src="@/assets/img/detail/u1431.png"></image>
+                    <textarea class="discussion-multi-textarea flex1" type="text"
+                        maxlength="500" v-model="commentContent" :placeholder="twoCommentData ? '写回复…' : '想问啥，大胆问…'"></textarea>
+                    <img class="discussion-multi-icom" @click.stop="openDiscussionSingle()" 
+                        src="@/assets/img/detail/u1431.png" />
                     <div class="discussion-multi-sum">{{ 500 - commentContent.length }}</div>
                 </div>
                 <div class="discussion-multi-bottom flexflex flexacenter">
@@ -69,10 +63,13 @@ export default {
             },
             popState: "discussionSingle",
 
-            openDiscussionSingleState: ""
+            openDiscussionSingleState: false, // 弹出键盘动画
+
         };
     },
 
+    props: ["twoCommentData"],
+
     mounted() {
         console.log("gjklgjklg");
     },
@@ -84,6 +81,16 @@ export default {
             console.log("dffgkgfk");
         },
 
+        // 关闭弹窗
+        handlePopCancel(){
+            this.twoCommentData = null
+        },
+        
+        // 切换简单的切换数据
+        setValue(key, value) {
+            this[key] = value
+        },
+
     },
 };
 </script>
@@ -130,9 +137,6 @@ export default {
 
 .discussion-single-input {
     height: 100%;
-    background: transparent;
-    border: none;
-    outline: none;
 }
 
 .discussion-header {
@@ -168,34 +172,33 @@ export default {
 
 .discussion-multi-box {
     .discussion-header {
-        padding-bottom: 24rpx;
-        border-bottom: 1rpx solid #dbdcdd;
+        padding-bottom: .32rem;
+        border-bottom: .0133rem solid #dbdcdd;
     }
 
     .discussion-multi-content {
         position: relative;
-        height: 663rpx;
+        height: 8.84rem;
         box-sizing: border-box;
 
     }
 
     .discussion-multi-textarea {
-        font-size: 30rpx;
-        padding: 24rpx;
-        /* height: 663rpx; */
+        font-size: .4rem;
+        padding: .32rem;
         box-sizing: border-box;
         height: 50vh;
 
         overflow: auto;
 
         word-break: break-word;
-        line-height: 36rpx;
+        line-height: .48rem;
     }
 
     .discussion-multi-icom {
-        width: 36rpx;
-        height: 36rpx;
-        padding: 24rpx;
+        width: .48rem;
+        height: .48rem;
+        padding: .32rem;
         position: absolute;
         top: 0;
         right: 0;
@@ -206,25 +209,25 @@ export default {
         position: absolute;
         bottom: 0;
         right: 0;
-        padding: 24rpx;
-        font-size: 21rpx;
+        padding: .32rem;
+        font-size: .28rem;
         color: #aaaaaa;
     }
 
     .discussion-multi-bottom {
-        height: 96rpx;
-        border-top: 1rpx solid #dbdcdd;
+        height: 1.28rem;
+        border-top: .0133rem solid #dbdcdd;
         justify-content: flex-end;
-        padding-right: 24rpx;
+        padding-right: .32rem;
     }
 
     .discussion-multi-btn {
         background-color: rgba(80, 227, 194, 1);
-        border-radius: 12rpx;
-        width: 105rpx;
-        height: 66rpx;
-        margin: 15rpx 0;
-        font-size: 27rpx;
+        border-radius: .16rem;
+        width: 1.4rem;
+        height: .88rem;
+        margin: .2rem 0;
+        font-size: .36rem;
     }
 
 }
diff --git a/src/views/search/searchResult/SearchResult-冲突-肖荣豪_Win10.vue b/src/views/search/searchResult/SearchResult-冲突-肖荣豪_Win10.vue
deleted file mode 100755
index 03656f4..0000000
--- a/src/views/search/searchResult/SearchResult-冲突-肖荣豪_Win10.vue
+++ /dev/null
@@ -1,267 +0,0 @@
-<template>
-	<div class="container">
-		<!-- 搜索框 -->
-		<div class="search-input-box flexacenter">
-			<div class="search-input flexacenter">
-				<img class="search-input-icon" src="@/assets/img/headerNav/search.png">
-				<input class="search-input-input flex1" placeholder="请输入搜索关键词" />
-				<img class="search-input-cross" src="@/assets/img/icon/clear.png">
-			</div>
-
-			<div class="search-input-cancel" @click.stop="handCancel">取消</div>
-		</div>
-
-		<!-- 结果数量 -->
-		<div class="numberResults flexacenter">大约找到 <div class="number">{{ 800 }}</div> 条结果</div>
-
-		<div class="result-box flexacenter">
-			<div class="result-item flexflex" v-for="item in 3" :key="item">
-				<div class="result-header one-line">
-					<div class="result-label">租房租房租房</div>
-					<div class="result-title">诚招室友一起合租香港大学附近房子 女生</div>
-				</div>
-
-				<div class="result-content two-lines flex1">
-					<template v-if="item == 1">
-						香港理工大学附近求租房，红磡何文田或黄埔附近最好
-					</template>
-
-					<div v-else class="reply-visible flexcenter">
-						回复可见
-					</div>
-				</div>
-
-
-				<div class="result-info flexacenter">
-					<div class="user-info flexacenter">
-						<svg-icon icon-class="test-head" class-name="icon-head"></svg-icon>
-						<div class="user-name">匿名用户</div>
-					</div>
-					<div class="item-data flexacenter">
-						<div class="item-data-item flexacenter">
-							<svg-icon icon-class="look" class-name="icon-look"></svg-icon>
-							<div>1552</div>
-						</div>
-						<div class="item-data-item flexacenter">
-							<svg-icon icon-class="msg" class-name="icon-msg"></svg-icon>
-							<div>12</div>
-						</div>
-					</div>
-				</div>
-
-
-				<!-- 精华 -->
-				<div class="rightTop">
-					<img class="rightTop-img" src="@/assets/img/icon/topRight .png">
-					<span>精华</span>
-				</div>
-
-			</div>
-
-		</div>
-
-		<div class="paging flexcenter">
-			<el-pagination small background layout="prev, pager, next" :total="1000">
-			</el-pagination>
-		</div>
-
-	</div>
-</template>
-
-<script>
-export default {
-	name: "SearchResult",
-	data() {
-		return {
-
-		}
-	},
-	components: {
-
-	},
-
-	methods: {
-		// 处理点击取消的返回上一页
-		handCancel() {
-			if (this.$route.fullPath != "/") this.$router.go(-1)
-			else this.$router.push('/recommend')
-		},
-	},
-}
-</script>
-
-<style lang="scss" scoped>
-.container {
-	padding-top: 1.3rem;
-
-	.search-input-box {
-		margin-left: .32rem;
-
-		.search-input {
-			width: 8.2rem;
-			height: .96rem;
-			border-radius: 2.56rem;
-			background: rgba(235, 235, 235, 1);
-
-			.search-input-icon,
-			.search-input-cross {
-				width: .4rem;
-				height: .4rem;
-			}
-
-			.search-input-icon {
-				padding: 0 .4rem;
-			}
-
-			.search-input-cross {
-				padding-right: .4rem;
-			}
-
-			.search-input-input {
-				height: 100%;
-				background: transparent;
-				border: none;
-				outline: none;
-			}
-
-		}
-
-		.search-input-cancel {
-			color: #000;
-			font-size: .36rem;
-			padding-left: .46rem;
-			width: .74rem;
-		}
-	}
-
-	.numberResults {
-		font-size: .32rem;
-		color: #555;
-		// margin-top: .64rem;
-		margin: .64rem .32rem .48rem;
-
-		.number {
-			color: #000;
-			font-weight: 650;
-			margin: 0 .1667rem;
-		}
-	}
-
-	.result-box {
-		justify-content: center;
-		flex-direction: column;
-
-		.result-item {
-			margin-bottom: .32rem;
-			width: 9.36rem;
-			height: 3.96rem;
-			background-color: rgba(255, 255, 255, 1);
-			border: none;
-			border-radius: .32rem;
-			-moz-box-shadow: 0 0 .16rem rgba(0, 0, 0, 0.0784313725490196);
-			-webkit-box-shadow: 0 0 .16rem rgba(0, 0, 0, 0.08);
-			box-shadow: 0 0 .16rem rgba(0, 0, 0, .08);
-			padding: 0.4rem;
-			box-sizing: border-box;
-			flex-direction: column;
-			position: relative;
-
-			.result-header {
-				margin-bottom: .32rem;
-
-				.result-label {
-					font-size: .28rem;
-					height: .52rem;
-					line-height: .52rem;
-					background: rgb(51, 51, 51);
-					color: #fff;
-					display: inline-block;
-					border-radius: .16rem;
-					padding: 0 .12rem;
-					margin-right: .12rem;
-				}
-
-				.result-title {
-					color: #000;
-					font-size: 0.37333rem;
-					line-height: 0.65rem;
-					display: inline;
-				}
-
-			}
-
-			.result-content {
-				line-height: .52rem;
-				font-size: .3rem;
-				color: #7f7f7f;
-			}
-
-			.reply-visible {
-				font-size: .32rem;
-				height: 1.04rem;
-				background: rgba(242, 242, 242, 0.7);
-			}
-
-			.result-info {
-
-				justify-content: space-between;
-
-				.user-info {
-					.icon-head {
-						width: .64rem;
-						height: .64rem;
-					}
-
-					.user-name {
-						font-size: .32rem;
-						color: #333;
-						margin-left: .2rem;
-					}
-				}
-
-				.item-data {
-
-					font-size: .28rem;
-
-					.item-data-item {
-
-						&:last-of-type {
-							margin-left: .4rem;
-						}
-
-						.icon-look {
-							width: .4267rem;
-							height: .18rem;
-						}
-
-						.icon-msg {
-							width: .32rem;
-							height: .28rem;
-						}
-					}
-				}
-			}
-
-		}
-	}
-
-	.paging {
-		// width: 6.44rem;
-		margin-top: .48rem;
-
-		::v-deep {
-			.el-pagination.is-background .el-pager li:not(.disabled).active {
-				background: rgba(98, 177, 255, 1);
-				border-radius: 50%;
-			}
-
-			.el-pagination .btn-next .el-icon,
-			.el-pagination .btn-prev .el-icon {
-				font-size: .4rem;
-			}
-		}
-	}
-
-
-}
-</style>
diff --git a/src/views/search/searchResult/SearchResult.vue b/src/views/search/searchResult/SearchResult.vue
index e737919..04ec52f 100755
--- a/src/views/search/searchResult/SearchResult.vue
+++ b/src/views/search/searchResult/SearchResult.vue
@@ -120,9 +120,6 @@ export default {
 
 			.search-input-input {
 				height: 100%;
-				background: transparent;
-				border: none;
-				outline: none;
 			}
 
 		}