From 4f7b045ebfba0d7237a3a35c6fd358c59e8293cc Mon Sep 17 00:00:00 2001
From: XiaoMo <a1300399510@qq.com>
Date: Thu, 30 Mar 2023 19:00: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/30=20-19:00:02?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/icons/svg/quotation-left.svg  |  6 ++++
 src/icons/svg/quotation-right.svg |  6 ++++
 src/views/detail/detailIndex.vue  | 56 ++++++++++++++++---------------
 3 files changed, 41 insertions(+), 27 deletions(-)
 create mode 100755 src/icons/svg/quotation-left.svg
 create mode 100755 src/icons/svg/quotation-right.svg

diff --git a/src/icons/svg/quotation-left.svg b/src/icons/svg/quotation-left.svg
new file mode 100755
index 0000000..f08432c
--- /dev/null
+++ b/src/icons/svg/quotation-left.svg
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="16px" height="13px" xmlns="http://www.w3.org/2000/svg">
+  <g transform="matrix(1 0 0 1 -28 -703 )">
+    <path d="M 6.84615384615385 6.42613636363636  C 7.2051282051282 6.77083333333333  7.38461538461539 7.18939393939394  7.38461538461539 7.68181818181818  L 7.38461538461539 11.2272727272727  C 7.38461538461539 11.719696969697  7.2051282051282 12.1382575757576  6.84615384615385 12.4829545454545  C 6.48717948717949 12.8276515151515  6.05128205128205 13  5.53846153846154 13  L 1.84615384615385 13  C 1.33333333333333 13  0.897435897435898 12.8276515151515  0.538461538461538 12.4829545454545  C 0.179487179487179 12.1382575757576  0 11.719696969697  0 11.2272727272727  L 0 4.72727272727273  C 0 4.08712121212121  0.129807692307692 3.47620738636364  0.389423076923077 2.89453125  C 0.649038461538462 2.31285511363636  1 1.80965909090909  1.44230769230769 1.38494318181818  C 1.88461538461538 0.960227272727273  2.40865384615385 0.623224431818182  3.01442307692308 0.37393465909091  C 3.62019230769231 0.124644886363637  4.25641025641026 0  4.92307692307692 0  L 5.53846153846154 0  C 5.70512820512821 0  5.84935897435897 0.0584753787878776  5.97115384615385 0.175426136363637  C 6.09294871794872 0.292376893939392  6.15384615384615 0.430871212121211  6.15384615384615 0.59090909090909  L 6.15384615384615 1.77272727272727  C 6.15384615384615 1.93276515151515  6.09294871794872 2.07125946969697  5.97115384615385 2.18821022727273  C 5.84935897435897 2.30516098484848  5.70512820512821 2.36363636363636  5.53846153846154 2.36363636363636  L 4.92307692307692 2.36363636363636  C 4.24358974358974 2.36363636363636  3.66346153846154 2.59446022727273  3.18269230769231 3.05610795454546  C 2.70192307692308 3.51775568181818  2.46153846153846 4.0748106060606  2.46153846153846 4.72727272727273  L 2.46153846153846 5.02272727272727  C 2.46153846153846 5.26893939393939  2.55128205128205 5.4782196969697  2.73076923076923 5.65056818181818  C 2.91025641025641 5.82291666666667  3.12820512820513 5.90909090909091  3.38461538461538 5.90909090909091  L 5.53846153846154 5.90909090909091  C 6.05128205128205 5.90909090909091  6.48717948717949 6.0814393939394  6.84615384615385 6.42613636363636  Z M 15.4615384615385 6.42613636363636  C 15.8205128205128 6.77083333333333  16 7.18939393939394  16 7.68181818181818  L 16 11.2272727272727  C 16 11.719696969697  15.8205128205128 12.1382575757576  15.4615384615385 12.4829545454545  C 15.1025641025641 12.8276515151515  14.6666666666667 13  14.1538461538462 13  L 10.4615384615385 13  C 9.94871794871795 13  9.51282051282051 12.8276515151515  9.15384615384615 12.4829545454545  C 8.7948717948718 12.1382575757576  8.61538461538461 11.719696969697  8.61538461538461 11.2272727272727  L 8.61538461538461 4.72727272727273  C 8.61538461538461 4.08712121212121  8.74519230769231 3.47620738636364  9.00480769230769 2.89453125  C 9.26442307692308 2.31285511363636  9.61538461538461 1.80965909090909  10.0576923076923 1.38494318181818  C 10.5 0.960227272727273  11.0240384615385 0.623224431818182  11.6298076923077 0.37393465909091  C 12.2355769230769 0.124644886363637  12.8717948717949 0  13.5384615384615 0  L 14.1538461538462 0  C 14.3205128205128 0  14.4647435897436 0.0584753787878776  14.5865384615385 0.175426136363637  C 14.7083333333333 0.292376893939392  14.7692307692308 0.430871212121211  14.7692307692308 0.59090909090909  L 14.7692307692308 1.77272727272727  C 14.7692307692308 1.93276515151515  14.7083333333333 2.07125946969697  14.5865384615385 2.18821022727273  C 14.4647435897436 2.30516098484848  14.3205128205128 2.36363636363636  14.1538461538462 2.36363636363636  L 13.5384615384615 2.36363636363636  C 12.8589743589744 2.36363636363636  12.2788461538462 2.59446022727273  11.7980769230769 3.05610795454546  C 11.3173076923077 3.51775568181818  11.0769230769231 4.0748106060606  11.0769230769231 4.72727272727273  L 11.0769230769231 5.02272727272727  C 11.0769230769231 5.26893939393939  11.1666666666667 5.4782196969697  11.3461538461538 5.65056818181818  C 11.525641025641 5.82291666666667  11.7435897435897 5.90909090909091  12 5.90909090909091  L 14.1538461538462 5.90909090909091  C 14.6666666666667 5.90909090909091  15.1025641025641 6.0814393939394  15.4615384615385 6.42613636363636  Z " fill-rule="nonzero" fill="#50e3c2" stroke="none" transform="matrix(1 0 0 1 28 703 )" />
+  </g>
+</svg>
\ No newline at end of file
diff --git a/src/icons/svg/quotation-right.svg b/src/icons/svg/quotation-right.svg
new file mode 100755
index 0000000..ad23ec9
--- /dev/null
+++ b/src/icons/svg/quotation-right.svg
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="16px" height="13px" xmlns="http://www.w3.org/2000/svg">
+  <g transform="matrix(1 0 0 1 -277 -794 )">
+    <path d="M 6.84615384615385 0.517045454545455  C 7.2051282051282 0.861742424242424  7.38461538461539 1.28030303030303  7.38461538461539 1.77272727272727  L 7.38461538461539 8.27272727272727  C 7.38461538461539 8.91287878787879  7.25480769230769 9.52379261363637  6.99519230769231 10.10546875  C 6.73557692307692 10.6871448863636  6.38461538461539 11.1903409090909  5.94230769230769 11.6150568181818  C 5.5 12.0397727272727  4.97596153846154 12.3767755681818  4.37019230769231 12.6260653409091  C 3.76442307692308 12.8753551136364  3.12820512820513 13  2.46153846153846 13  L 1.84615384615385 13  C 1.67948717948718 13  1.53525641025641 12.9415246212121  1.41346153846154 12.8245738636364  C 1.29166666666667 12.7076231060606  1.23076923076923 12.5691287878788  1.23076923076923 12.4090909090909  L 1.23076923076923 11.2272727272727  C 1.23076923076923 11.0672348484848  1.29166666666667 10.928740530303  1.41346153846154 10.8117897727273  C 1.53525641025641 10.6948390151515  1.67948717948718 10.6363636363636  1.84615384615385 10.6363636363636  L 2.46153846153846 10.6363636363636  C 3.14102564102564 10.6363636363636  3.72115384615385 10.4055397727273  4.20192307692308 9.94389204545454  C 4.68269230769231 9.48224431818182  4.92307692307692 8.92518939393939  4.92307692307692 8.27272727272727  L 4.92307692307692 7.97727272727273  C 4.92307692307692 7.73106060606061  4.83333333333333 7.5217803030303  4.65384615384615 7.34943181818182  C 4.47435897435897 7.17708333333333  4.25641025641026 7.09090909090909  4 7.09090909090909  L 1.84615384615385 7.09090909090909  C 1.33333333333333 7.09090909090909  0.897435897435898 6.91856060606061  0.538461538461538 6.57386363636364  C 0.179487179487179 6.22916666666667  0 5.81060606060606  0 5.31818181818182  L 0 1.77272727272727  C 0 1.28030303030303  0.179487179487179 0.861742424242424  0.538461538461538 0.517045454545455  C 0.897435897435898 0.172348484848484  1.33333333333333 0  1.84615384615385 0  L 5.53846153846154 0  C 6.05128205128205 0  6.48717948717949 0.172348484848484  6.84615384615385 0.517045454545455  Z M 15.4615384615385 0.517045454545455  C 15.8205128205128 0.861742424242424  16 1.28030303030303  16 1.77272727272727  L 16 8.27272727272727  C 16 8.91287878787879  15.8701923076923 9.52379261363637  15.6105769230769 10.10546875  C 15.3509615384615 10.6871448863636  15 11.1903409090909  14.5576923076923 11.6150568181818  C 14.1153846153846 12.0397727272727  13.5913461538462 12.3767755681818  12.9855769230769 12.6260653409091  C 12.3798076923077 12.8753551136364  11.7435897435897 13  11.0769230769231 13  L 10.4615384615385 13  C 10.2948717948718 13  10.150641025641 12.9415246212121  10.0288461538462 12.8245738636364  C 9.90705128205128 12.7076231060606  9.84615384615385 12.5691287878788  9.84615384615385 12.4090909090909  L 9.84615384615385 11.2272727272727  C 9.84615384615385 11.0672348484848  9.90705128205128 10.928740530303  10.0288461538462 10.8117897727273  C 10.150641025641 10.6948390151515  10.2948717948718 10.6363636363636  10.4615384615385 10.6363636363636  L 11.0769230769231 10.6363636363636  C 11.7564102564103 10.6363636363636  12.3365384615385 10.4055397727273  12.8173076923077 9.94389204545454  C 13.2980769230769 9.48224431818182  13.5384615384615 8.92518939393939  13.5384615384615 8.27272727272727  L 13.5384615384615 7.97727272727273  C 13.5384615384615 7.73106060606061  13.4487179487179 7.5217803030303  13.2692307692308 7.34943181818182  C 13.0897435897436 7.17708333333333  12.8717948717949 7.09090909090909  12.6153846153846 7.09090909090909  L 10.4615384615385 7.09090909090909  C 9.94871794871795 7.09090909090909  9.51282051282051 6.91856060606061  9.15384615384615 6.57386363636364  C 8.7948717948718 6.22916666666667  8.61538461538461 5.81060606060606  8.61538461538461 5.31818181818182  L 8.61538461538461 1.77272727272727  C 8.61538461538461 1.28030303030303  8.7948717948718 0.861742424242424  9.15384615384615 0.517045454545455  C 9.51282051282051 0.172348484848484  9.94871794871795 0  10.4615384615385 0  L 14.1538461538462 0  C 14.6666666666667 0  15.1025641025641 0.172348484848484  15.4615384615385 0.517045454545455  Z " fill-rule="nonzero" fill="#50e3c2" stroke="none" transform="matrix(1 0 0 1 277 794 )" />
+  </g>
+</svg>
\ No newline at end of file
diff --git a/src/views/detail/detailIndex.vue b/src/views/detail/detailIndex.vue
index 9cc1ebd..a92eda8 100755
--- a/src/views/detail/detailIndex.vue
+++ b/src/views/detail/detailIndex.vue
@@ -19,41 +19,27 @@
         </div>
 
         <!--  -->
-        <div class="card flexflex">
-            <div class="card-item shadow">
+        <div class="card flexcenter">
+            <div class="card-item shadow" v-for="(item, index) in 5" :key="index">
                 <div class="card-head flexacenter">
                     <img class="card-head-icon"
                         src="https://axure-file.lanhuapp.com/md516b251fb-9cfa-46fc-a9b6-2a41a7b4dc37__3ad73406ff4bc8b138dafc6dcbf1a635.svg" />
                     <div class="card-head-content flex1 flexflex">
-                        <div class="card-head-name flexcenter">闫旭Mike <div class="landlord">楼主</div>
+                        <div class="card-head-name flexflex">闫旭Mike <div class="landlord flexcenter" v-if="index == 0">楼主
+                            </div>
                         </div>
                         <div class="card-head-time">2022-7-6 14:56</div>
                     </div>
-                    <div class="card-head-fool">1楼</div>
+                    <div class="card-head-fool">{{ index == 0 ? '楼主' : `${index}楼` }}</div>
                 </div>
 
                 <div class="card-content">
-                    之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。
-
-                    之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。
-
-                    之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。
-
-                    之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。
-
-                    之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。
-
-                    之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。
-
-                    之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。
-
-                    之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。
-
-                    之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。
-
-                    之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。
-
-
+                    <!-- 回复引用 -->
+                    <div class="quotation">
+                        <div class="quotation-left"></div>
+                        <svg-icon icon-class="quotation-left" class-name="quotation-left"></svg-icon>
+                    </div>
+                    <!-- 之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。 -->
                 </div>
             </div>
 
@@ -166,12 +152,13 @@ export default {
 
     .card {
         margin-top: .48rem;
-        justify-content: center;
+        flex-direction: column;
 
         .card-item {
             width: 9.4rem;
             border-radius: .4rem;
             background: #fff;
+            margin-bottom: .4rem;
 
             .card-head {
                 padding: .48rem .32rem;
@@ -197,9 +184,10 @@ export default {
                             font-size: .26rem;
                             width: .64rem;
                             height: .44rem;
-                            border: rgb(215, 215, 215);
+                            border: rgb(215, 215, 215) .0133rem solid;
                             background: rgb(240, 242, 245);
                             border-radius: .1rem;
+                            margin-left: .16rem;
                         }
                     }
 
@@ -220,6 +208,20 @@ export default {
                 font-size: .36rem;
                 line-height: .6rem;
                 padding: .5rem .32rem;
+
+                .quotation {
+                    width: 100%;
+                    color: #333;
+                    font-size: .32rem;
+                    border-radius: .16rem;
+                    background: rgb(246, 246, 246);
+
+
+                    img {
+                        width: .32rem;
+
+                    }
+                }
             }
         }
     }