Spaces:
Sleeping
Sleeping
Refactor Step5Interaction component to streamline profile display and remove unused topics section
Browse files- Combined conditions for displaying the profile card body and bio for improved clarity.
- Removed the topics section and associated CSS styles to simplify the component and enhance user experience.
frontend/src/components/Step5Interaction.vue
CHANGED
|
@@ -156,17 +156,11 @@
|
|
| 156 |
</svg>
|
| 157 |
</button>
|
| 158 |
</div>
|
| 159 |
-
<div v-if="showFullProfile" class="profile-card-body">
|
| 160 |
-
<div
|
| 161 |
<div class="profile-card-label">简介</div>
|
| 162 |
<p>{{ selectedAgent.bio }}</p>
|
| 163 |
</div>
|
| 164 |
-
<div v-if="selectedAgent.interested_topics?.length" class="profile-card-topics">
|
| 165 |
-
<div class="profile-card-label">兴趣领域</div>
|
| 166 |
-
<div class="profile-topics-list">
|
| 167 |
-
<span v-for="topic in selectedAgent.interested_topics" :key="topic" class="profile-topic-tag">{{ topic }}</span>
|
| 168 |
-
</div>
|
| 169 |
-
</div>
|
| 170 |
</div>
|
| 171 |
</div>
|
| 172 |
|
|
@@ -1335,28 +1329,6 @@ watch(() => props.simulationId, (newId) => {
|
|
| 1335 |
color: #4B5563;
|
| 1336 |
}
|
| 1337 |
|
| 1338 |
-
.profile-card-topics {
|
| 1339 |
-
background: #FFFFFF;
|
| 1340 |
-
padding: 12px 14px;
|
| 1341 |
-
border-radius: 8px;
|
| 1342 |
-
border: 1px solid #E5E7EB;
|
| 1343 |
-
}
|
| 1344 |
-
|
| 1345 |
-
.profile-topics-list {
|
| 1346 |
-
display: flex;
|
| 1347 |
-
flex-wrap: wrap;
|
| 1348 |
-
gap: 6px;
|
| 1349 |
-
}
|
| 1350 |
-
|
| 1351 |
-
.profile-topic-tag {
|
| 1352 |
-
padding: 4px 10px;
|
| 1353 |
-
background: #F3F4F6;
|
| 1354 |
-
color: #374151;
|
| 1355 |
-
border-radius: 12px;
|
| 1356 |
-
font-size: 12px;
|
| 1357 |
-
font-weight: 500;
|
| 1358 |
-
}
|
| 1359 |
-
|
| 1360 |
/* Target Selector */
|
| 1361 |
.target-selector {
|
| 1362 |
padding: 16px 24px;
|
|
|
|
| 156 |
</svg>
|
| 157 |
</button>
|
| 158 |
</div>
|
| 159 |
+
<div v-if="showFullProfile && selectedAgent.bio" class="profile-card-body">
|
| 160 |
+
<div class="profile-card-bio">
|
| 161 |
<div class="profile-card-label">简介</div>
|
| 162 |
<p>{{ selectedAgent.bio }}</p>
|
| 163 |
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 164 |
</div>
|
| 165 |
</div>
|
| 166 |
|
|
|
|
| 1329 |
color: #4B5563;
|
| 1330 |
}
|
| 1331 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1332 |
/* Target Selector */
|
| 1333 |
.target-selector {
|
| 1334 |
padding: 16px 24px;
|