chore: initial import

2026-06-29 09:42:53 +08:00
commit 9fea127de1
241 changed files with 82767 additions and 0 deletions
--- a/pkgExplore/room_detail/components/RoomInfo.vue
+++ b/pkgExplore/room_detail/components/RoomInfo.vue
@@ -0,0 +1,174 @@
+<template>
+  <view class="room-info-wrapper">
+    <view class="section-panel" v-if="basicInfoRows.length">
+      <view class="section-header">
+        <text class="section-title">{{ t('basicInfo') }}</text>
+      </view>
+      <view class="info-list">
+        <view v-for="item in basicInfoRows" :key="item.label" class="info-row tn-flex tn-flex-row-between tn-flex-col-center">
+          <text class="info-label">{{ item.label }}</text>
+          <text class="info-value">{{ item.value }}</text>
+        </view>
+      </view>
+    </view>
+
+    <slot></slot>
+
+    <view class="section-panel" v-if="displayDescriptions.length">
+      <view class="section-header">
+        <text class="section-title">{{ isRoomType ? t('roomTypeDesc') : t('roomDesc') }}</text>
+      </view>
+      <view class="desc-wrap" :class="{ 'desc-wrap--collapsed': isDescCollapsed }">
+        <view
+          v-for="(item, index) in displayDescriptions"
+          :key="`${item}-${index}`"
+          class="desc-text"
+        >
+          <rich-text :nodes="item"></rich-text>
+        </view>
+      </view>
+      <view
+        v-if="shouldShowDescToggle"
+        class="expand-btn tn-flex tn-flex-row-center tn-flex-col-center"
+        @click="toggleDesc"
+      >
+        <text>{{ isDescCollapsed ? t('expandAll') : t('collapse') }}</text>
+        <text :class="isDescCollapsed ? 'tn-icon-down' : 'tn-icon-up'" class="expand-icon"></text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  props: {
+    basicInfoRows: {
+      type: Array,
+      default: () => []
+    },
+    displayDescriptions: {
+      type: Array,
+      default: () => []
+    },
+    isRoomType: {
+      type: Boolean,
+      default: true
+    },
+    shouldShowDescToggle: {
+      type: Boolean,
+      default: false
+    },
+    language: {
+      type: String,
+      default: 'zh'
+    }
+  },
+  data() {
+    return {
+      isDescCollapsed: true
+    }
+  },
+  methods: {
+    t(key) {
+      return this.$tm('pkgExplore.room_detail.room_detail', key)
+    },
+    toggleDesc() {
+      this.isDescCollapsed = !this.isDescCollapsed;
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.room-info-wrapper {
+  padding: 0;
+}
+
+.section-panel {
+  background: #ffffff;
+  padding: 48rpx 32rpx;
+  border-bottom: 1rpx solid #F2F3F5;
+}
+
+.section-header {
+  margin-bottom: 32rpx;
+}
+
+.section-title {
+  position: relative;
+  font-size: 36rpx;
+  font-weight: 800;
+  color: #1D2129;
+  letter-spacing: 2rpx;
+}
+
+.info-list {
+  display: flex;
+  flex-direction: column;
+  gap: 32rpx;
+}
+
+.info-row {
+  gap: 24rpx;
+  align-items: flex-start;
+}
+
+.info-label {
+  width: 160rpx;
+  font-size: 26rpx;
+  color: #86909C;
+}
+
+.info-value {
+  flex: 1;
+  text-align: right;
+  font-size: 28rpx;
+  line-height: 1.5;
+  color: #1D2129;
+  font-weight: 600;
+}
+
+.desc-wrap {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  gap: 24rpx;
+  transition: max-height 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
+  max-height: 5000rpx;
+  overflow: hidden;
+}
+
+.desc-wrap--collapsed {
+  max-height: 180rpx;
+}
+
+.desc-wrap--collapsed::after {
+  content: '';
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  height: 80rpx;
+  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
+  pointer-events: none;
+}
+
+.desc-text {
+  font-size: 28rpx;
+  line-height: 1.8;
+  color: #4E5969;
+  text-align: justify;
+}
+
+.expand-btn {
+  margin-top: 22rpx;
+  color: $brand-primary;
+  font-size: 25rpx;
+  font-weight: 600;
+}
+
+.expand-icon {
+  margin-left: 8rpx;
+  font-size: 26rpx;
+}
+</style>