From 0227cf6db28c79f147def49bf3f2c5fdf710fe66 Mon Sep 17 00:00:00 2001
From: A1300399510 <A1300399510>
Date: Fri, 21 Jul 2023 11:57:54 +0800
Subject: [PATCH] =?UTF-8?q?=E5=BC=80=E5=A7=8B=E5=85=AC=E5=AF=93=E8=AF=A6?=
 =?UTF-8?q?=E6=83=85=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue                                  |   2 -
 src/assets/img/publicImage/transmit-icon.png | Bin 0 -> 2196 bytes
 src/views/apartmentDetail.vue                | 156 ++++++++++++++++++-
 3 files changed, 153 insertions(+), 5 deletions(-)
 create mode 100644 src/assets/img/publicImage/transmit-icon.png

diff --git a/src/App.vue b/src/App.vue
index 551ba9e..39ae6cc 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,8 +1,6 @@
 <template>
-
   <router-view />
   <login></login>
->>>>>>> 542e853 (提交)
 </template>
 <script setup>
 import login from '@/components/public/login.vue'
diff --git a/src/assets/img/publicImage/transmit-icon.png b/src/assets/img/publicImage/transmit-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..8314c169a9d78d308a8fb849bea4ac8f5e64f5b4
GIT binary patch
literal 2196
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
W2o3jV6cLgD0000<MNUMnLSTY9OYm9%

literal 0
HcmV?d00001

diff --git a/src/views/apartmentDetail.vue b/src/views/apartmentDetail.vue
index 1004eea..8262d58 100644
--- a/src/views/apartmentDetail.vue
+++ b/src/views/apartmentDetail.vue
@@ -1,9 +1,38 @@
 <template>
     <page-top-bar></page-top-bar>
 
-    <div class="content"></div>
+    <div class="content wid1200">
+        <div class="header">
+            <div class="top flexflex">
+                <div class="brand-name flexcenter">ZHELI這裡</div>
+                <div class="brand-abstract">高颜值高品质学生公寓，城理浸公学生首选</div>
+            </div>
+        </div>
 
-    
+        <div class="operate-box flexacenter">
+            <div class="nav-box flexacenter">
+                <div class="nav-item flexcenter" :class="{ 'pitch': item == 1 }" v-for="item in 5">优惠活动</div>
+            </div>
+            <div class="btn-box flexacenter">
+                <div class="btn-item transmit-btn flexcenter">
+                    <img class="transmit-icon" src="@/assets/img/publicImage/transmit-icon.png" />
+                    转发
+                </div>
+                <div class="btn-item consult-btn flexcenter">咨询</div>
+            </div>
+        </div>
+        <div class="details-box flexflex">
+            <div class="details-left flex1">
+                <div class="type-box">
+                    <div class="type-item">
+                        <div class="type-name">双人套间A</div>
+                    </div>
+                </div>
+            </div>
+            <div class="details-right"></div>
+        </div>
+
+    </div>
 </template>
 
 <script setup>
@@ -13,4 +42,125 @@ const uniqid = "1qfWOLTPbyPH"
 
 </script>
 
-<style lang="less" scoped></style>
\ No newline at end of file
+<style lang="less" scoped>
+.content {
+    margin: 0 auto;
+    height: 100px;
+    background-color: rgb(13, 67, 114);
+    font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
+
+    .top {
+        width: 1200px;
+        height: 65px;
+        background: -webkit-linear-gradient(356.899508550192deg, rgba(253, 218, 85, 1) 0%, rgba(229, 215, 190, 1) 50%, rgba(203, 254, 191, 1) 100%);
+        background: -moz-linear-gradient(93.1004914498078deg, rgba(253, 218, 85, 1) 0%, rgba(229, 215, 190, 1) 50%, rgba(203, 254, 191, 1) 100%);
+        background: linear-gradient(93.1004914498078deg, rgba(253, 218, 85, 1) 0%, rgba(229, 215, 190, 1) 50%, rgba(203, 254, 191, 1) 100%);
+        border-radius: 16px 16px 0 0;
+        padding: 0 30px;
+
+        .brand-name {
+            height: 22px;
+            background-color: rgba(128, 108, 36, 1);
+            border-radius: 8px;
+            font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
+            color: #FDDA55;
+            padding: 0 11px;
+            margin-top: 12px;
+            margin-right: 10px;
+        }
+
+        .brand-abstract {
+            color: #806C24;
+            font-size: 14px;
+            padding-top: 13px;
+        }
+    }
+
+    .operate-box {
+        width: 1200px;
+        height: 70px;
+        background-color: rgba(255, 255, 255, 1);
+        border: 1px solid rgba(235, 235, 235, 1);
+        border-radius: 16px;
+        -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
+        -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
+        box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
+        font-size: 14px;
+        padding: 0 30px;
+        justify-content: space-between;
+
+        .nav-box {
+            .nav-item {
+                height: 40px;
+                background-color: rgba(246, 246, 246, 1);
+                border-radius: 8px;
+                font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
+                font-weight: 400;
+                font-size: 14px;
+                color: #7F7F7F;
+                padding: 0 17px;
+                cursor: pointer;
+
+                &.pitch {
+                    background-color: #000;
+                    font-weight: 650;
+                    color: #fff;
+                }
+
+                &:not(:last-of-type) {
+                    margin-right: 10px;
+                }
+            }
+        }
+
+        .btn-box {
+
+            .btn-item {
+                width: 100px;
+                height: 40px;
+                border-radius: 50px;
+                cursor: pointer;
+
+                &.transmit-btn {
+                    border: 1px solid rgba(235, 235, 235, 1);
+                    color: #333333;
+                    margin-right: 10px;
+
+                    .transmit-icon {
+                        width: 20px;
+                        height: 20px;
+                        margin-right: 4px;
+                    }
+                }
+
+                &.consult-btn {
+                    background: -webkit-linear-gradient(324.854454500294deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
+                    background: -moz-linear-gradient(125.145545499706deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
+                    background: linear-gradient(125.145545499706deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
+                    font-size: 16px;
+                    color: #FFFFFF;
+                }
+            }
+        }
+    }
+
+    .details-box {
+        justify-content: space-between;
+        height: 100px;
+        background-color: #FDDA55;
+
+        .details-left {
+            .type-box {
+                .type-item {
+                    height: ;
+                }
+            }
+        }
+
+        .details-right {
+            width: 304px;
+        }
+    }
+
+}
+</style>
\ No newline at end of file