hejianhao
2025-04-21 c08d0ebace5e9f20eb442ad7cb1db05d61ecbd0d
src/components/RightPanel.vue
@@ -51,7 +51,7 @@
              <span class="action-btn" :style="{ backgroundColor: item.leaseStatus == 2 ? '#FFB822' : item.leaseStatus == 1 ? '#66BAF8' : '#FF6B6B' }">{{ ['待出租', '已出租', '维修中'][item.leaseStatus - 1] }}</span>
            </div>
          </div>
          <div v-for="(item, index) in realTimeRentData" :key="'duplicate-' + index" class="status-item">
          <div v-for="(item, index) in realTimeRentData" v-if="realTimeRentData.length>10" :key="'duplicate-' + index" class="status-item">
            <span class="area-name">{{ item.streetName }}</span>
            <span class="area-name">{{ item.roomName }}</span>
            <div class="status-actions">
@@ -65,6 +65,7 @@
</template>
<script>
import { getRealTimeRentData } from './service'
export default {
  name: 'RightPanel',
  props: {
@@ -72,13 +73,22 @@
      type: Object,
      default: () => { }
    },
    realTimeRentData: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {}
    return {
      realTimeRentData: []
    }
  },
  created() {
    getRealTimeRentData().then(res => {
      this.realTimeRentData = res.data
    })
    setInterval(() => {
      getRealTimeRentData().then(res => {
        this.realTimeRentData = res.data
      })
    }, 10000)
  }
}
</script>
@@ -152,7 +162,7 @@
.right-panel-top,
.right-panel-top1 {
  display: flex;
  background: rgba(146, 146, 146, 0.5);
  background: rgba(146, 146, 146, 0.7);
  padding: 15px;
  border-radius: 8px;
  gap: 10px;
@@ -170,11 +180,12 @@
}
.status-list {
  background: rgba(146, 146, 146, 0.5);
  background: rgba(146, 146, 146, 0.7);
  border-radius: 8px;
  margin-top: 10px;
  padding: 15px;
  max-height: 500px;
  max-height: 600px;
  min-height: 500px;
  overflow: hidden;
  flex: 1;
}