hejianhao
2025-04-21 c08d0ebace5e9f20eb442ad7cb1db05d61ecbd0d
src/components/LeftPanel.vue
@@ -4,34 +4,55 @@
      <div class="title">西藏国投租金系统数据看板</div>
      <div class="sub-title">Ecological simulation display in business district</div>
    </div>
    <div class="header-left" style="width: 350px;">
    <div class="header-left" style="width: 410px;">
      <div class="stat-group">
        <div class="stat-item">
          <img :src="require('@/assets/area.png')" width="40" height="40" />
          <div class="stat-info">
            <div class="stat-label"> <i class="icon-area"></i> 房屋总面积</div>
            <div class="stat-value">{{ staticsData.houseTotalArea }}<span class="unit">m²</span></div>
            <div class="stat-value">{{ Number(staticsData.houseTotalArea / 10000).toFixed(2) }}<span class="unit">万m²</span>
            </div>
          </div>
        </div>
        <div class="stat-item">
          <img :src="require('@/assets/rent.png')" width="40" height="40" />
          <div class="stat-info">
            <div class="stat-label"> <i class="icon-area"></i>已出租面积</div>
            <div class="stat-value">{{ staticsData.houseRentedArea }}<span class="unit">m²</span></div>
            <div class="stat-value">{{ Number(staticsData.houseRentedArea / 10000).toFixed(2) }}<span class="unit">万m²</span></div>
          </div>
        </div>
      </div>
      <div class="header-right">
        <div class="stat-group">
          <div class="stat-item mt-10">
            <img :src="require('@/assets/money.png')" width="40" height="40" />
            <div class="stat-info">
              <div class="stat-label"> <i class="icon-money"></i>总计应收租金</div>
              <div class="stat-value">{{ staticsData.totalReceivableRent }}<span class="unit">万元</span></div>
            </div>
          </div>
          <div class="stat-item mt-10">
            <img :src="require('@/assets/successPay.png')" width="40" height="40" />
            <div class="stat-info">
              <div class="stat-label"><i class="icon-money"></i>总计已收租金</div>
              <div class="stat-value">{{ staticsData.totalReceivedRent }}<span class="unit">万元</span></div>
            </div>
          </div>
        </div>
      </div>
      <div class="stat-group mt-10">
        <div class="stat-item">
          <img :src="require('@/assets/arrears.png')" width="40" height="40" />
          <div class="stat-info">
            <div class="stat-label"> <i class="icon-area"></i> 本季度欠费</div>
            <div class="stat-value">{{ staticsData.totalRentOwe }}<span class="unit">万元</span></div>
          </div>
        </div>
        <div class="stat-item">
          <img :src="require('@/assets/totalArrears.png')" width="40" height="40" />
          <div class="stat-info">
            <div class="stat-label"> <i class="icon-area"></i>总计欠费</div>
            <div class="stat-value">{{ staticsData.totalRentOweAll }}<span class="unit">万元</span></div>
          </div>
        </div>
      </div>
@@ -264,7 +285,7 @@
  border-radius: 8px;
  padding: 15px;
  min-height: 300px;
  max-height: calc(100vh - 600px);
  /* max-height: calc(100vh - 600px); */
  overflow: hidden;
  margin-bottom: 20px;
}