From e422239791b35a7c466372eda8c99d2775a6bae1 Mon Sep 17 00:00:00 2001
From: wayne <wayne8692wayne8692@gmail.com>
Date: 星期六, 22 一月 2022 14:55:51 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/Phase3' into Phase3

---
 PAMapp/components/Interview/InterviewCard.vue |  100 ++++++++++++++++++++++++++++++++-----------------
 1 files changed, 65 insertions(+), 35 deletions(-)

diff --git a/PAMapp/components/Interview/InterviewCard.vue b/PAMapp/components/Interview/InterviewCard.vue
index e3f4f54..edef55d 100644
--- a/PAMapp/components/Interview/InterviewCard.vue
+++ b/PAMapp/components/Interview/InterviewCard.vue
@@ -1,35 +1,46 @@
 <template>
     <div>
-       <template v-if="!interviewList.length">
-          <div class="record-card record-card--empty">
+      <template v-if="!interviewList.length">
+          <span class="record-card record-card--empty" style="display:flex">
             �蝝赤蝝����
-          </div>
+          </span>
       </template>
 
       <template v-else>
         <div class="interview--future">
-            <div class="record-card mb-10"
+          <div class="record-card mb-10"
                 v-for="(item, index) in futureList"
                 :key="index + 'feature'"
                 @click="editInterview(item)"
-            >
-                <div class="record-card-date">
-                    <div>
-                        <UiDateFormat
+          >
+            <div class="remind-container">
+              <div class="remind-date mr-10">
+                <div class="mb-3 smTxt bgc-primary-red date-year">
+                  <div class="mb-3 mt-2">
+                    <UiDateFormat
                             class="date bold"
                             :date="item.interviewDate"
-                            onlyShowSection="DAY" />
-                    </div>
-                    <div>
-                        <UiDateFormat
-                            class="time mt-5 line-space"
+                            onlyShowSection="YEAR" />
+                  </div>
+                </div>
+              <div class="p mt-5">
+                <UiDateFormat
+                            class="date bold"
+                            :date="item.interviewDate"
+                            onlyShowSection="DATE" />
+              </div>
+            </div>
+            <div class="remind-content-txt">
+              <div style="display:flex">
+                <UiDateFormat
+                            class="date bold "
                             :date="item.interviewDate"
                             onlyShowSection="TIME" />
-                    </div>
-                </div>
-                <div class="record-card-content">
-                    <span>{{item.content}}</span>
-                </div>
+              </div>
+                <div class="interview-card-content">{{item.content}}</div>
+            </div>
+
+          </div>
             </div>
         </div>
 
@@ -39,23 +50,34 @@
                 :key="index + 'past'"
                 @click="editInterview(item)"
             >
-                <div class="record-card-date">
-                    <div>
-                        <UiDateFormat
-                            class="date bold"
+
+              <div class="remind-container">
+                <div class="remind-date mr-10">
+                  <div class="mb-3 smTxt bgc-primary-red date-year">
+                    <div class="mb-3 mt-2">
+                      <UiDateFormat
+                            class="bold date"
                             :date="item.interviewDate"
-                            onlyShowSection="DAY" />
+                            onlyShowSection="YEAR" />
                     </div>
-                    <div>
-                        <UiDateFormat
-                            class="time mt-5 line-space"
+                    </div>
+                  <div class="p mt-5">
+                    <UiDateFormat
+                            class="mt-5 line-space time"
+                            :date="item.interviewDate"
+                            onlyShowSection="DATE" />
+                  </div>
+                </div>
+                <div class="remind-content-txt">
+                  <div style="display:flex">
+                    <UiDateFormat
+                            class="mt-5 line-space mb-3 time"
                             :date="item.interviewDate"
                             onlyShowSection="TIME" />
-                    </div>
+                  </div>
+                    <div class="interview-card-content">{{item.content}}</div>
                 </div>
-                <div class="record-card-content">
-                    <span>{{item.content}}</span>
-                </div>
+              </div>
             </div>
         </section>
       </template>
@@ -109,16 +131,13 @@
     }
 }
 .interview--past {
+    margin-top: 10px;
     border-top: 1px solid #CCCCCC;
     padding-top: 17px;
     margin-top: 17px;
 }
 .record-card {
-    height: 62px;
-    border: 1px solid #707070;
-    border-radius: 5px;
-    display: flex;
-    border-bottom: 1px solid #000;
+    height: 64px;
     .record-card-date{
         display: flex;
         flex-direction: column;
@@ -126,11 +145,13 @@
         margin-right: 10px;
         margin-top: 10px;
     }
+
     .record-card-content{
         height: 42px;
         margin-top: 10px;
         margin-right: 10px;
         line-height: 1.2;
+
     }
   &.record-card--empty {
     align-items     : center;
@@ -139,6 +160,15 @@
     justify-content : center;
   }
 }
+.interview-card-content{
+ overflow: hidden;
+        text-overflow: ellipsis;
+        display: -webkit-box;
+        -webkit-box-orient: vertical;
+        word-break: break-all;
+        word-wrap: break-word;
+        -webkit-line-clamp: 2;
+}
 .line-space{
     letter-spacing: 1px;
 }

--
Gitblit v1.8.0