component

src/onlineSelling/components/RaiseHouse/index.js

@@ -0,0 +1,46 @@
+import { View, Image, Text } from "@tarojs/components";
+import { transferImage } from '@/utils/tools'
+import dayjs from 'dayjs'
+
+import './index.scss'
+
+export default function RaiseHouse(props) {
+  const {
+    buildingName,
+    termname,
+    blockName,
+    unitName,
+    roomName,
+    price,
+    createDate,
+    buildingImgList = [],
+  } = props.summary || {}
+
+  const title = `${buildingName} ${termname||''} ${blockName} ${unitName} ${roomName}`
+  const thumb = (buildingImgList || []).length
+  const showDT = dayjs(createDate).format('YYYY/MM/DD')
+  const wanY = Number(price)
+
+  return (
+    <View className="raisehouse">
+      <View className="head">
+        {thumb ? <Image className="thumb" src={transferImage((buildingImgList)[0].url)} mode="aspectFit" /> :
+          <Text style="font-size:26rpx;color:#666">暂无户型图</Text>
+        }
+      </View>
+      <View className="body">
+        <View className="apartment">A户型</View>
+        <View className="price">现价234万</View>
+        <View className="title">XX嘉苑 1号楼 2单元 3楼 303号</View>
+        <View className="subtitle">
+          <Text>建筑面积约</Text>
+          <Text className="red">{wanY + 'm²' || '待定'}</Text>
+        </View>
+        <View className="subtitle">
+          <Text>使用面积约</Text>
+          <Text className="red">{wanY + 'm²' || '待定'}</Text>
+        </View>
+      </View>
+    </View>
+  )
+}

src/onlineSelling/components/RaiseHouse/index.scss

@@ -0,0 +1,65 @@
+.raisehouse {
+  width: 690px;
+  height: 250px;
+  background:#fff;
+  border-radius: 8px;
+  display: flex;
+  margin: 16px 30px;
+  box-shadow: 0 4px 15px 1px rgba(0, 0, 0, 0.12);
+  font-weight: 400;
+
+  .head {
+    width: 250px;
+    flex: none;
+    border-right: 2px solid rgba(0, 0, 0, 0.04);
+    padding: 20px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    .thumb {
+      width: 100%;
+      height: 100%;
+    }
+  }
+
+  .body {
+    width: 438px;
+    flex: none;
+    position: relative;
+    line-height: 40px;
+    padding: 20px 16px;
+
+    .apartment {
+      font-size: 26px;
+      color: #FE1C1C;
+      font-weight: 700;
+    }
+
+    .price {
+      font-size: 24px;
+      font-weight: 700;
+      color: #FE1C1C;
+      line-height: 1.8;
+    }
+    .title {
+      font-size: 26px;
+      font-weight: bold;
+      color: #333;
+      line-height: 1.8;
+    }
+
+    .subtitle {
+      font-size: 28px;
+      color:#333;
+      line-height: 1.6;
+
+    }
+  }
+
+  .red {
+    color: #FF3C3C;
+    margin: 0 6px;
+  }
+
+}