Commit 6bb51ff0 authored by 郭铭瑶's avatar 郭铭瑶 🤘

交易数据

parent eb4e0d06
...@@ -57,7 +57,6 @@ import Circle from '@/components/circle.vue' ...@@ -57,7 +57,6 @@ import Circle from '@/components/circle.vue'
color #fff color #fff
font-weight bold font-weight bold
span span
margin 0 .04rem
color #ccc color #ccc
&:last-child &:last-child
float right float right
......
<template>
<m-card title="交易数据">
<div class="sum">
<p v-for="item in summary" :key="item.name">
{{ item.name }}
<span>
<m-count class="orange-count" :value="item.value" />
{{ item.unit }}
</span>
</p>
</div>
<m-sub>新建商品房</m-sub>
<div class="house">
<div class="title">
<p>福新名苑</p>
<span class="line" />
<span>
<m-count class="orange-count" :value="13.2" :decimal="2" />万㎡
</span>
</div>
<div class="company">上海北航置业发展有限公司</div>
<div class="info">
<div>
<span>上市套数</span>
<p><m-count class="count" :value="199" /><span></span></p>
</div>
<div>
<span>上市面积</span>
<p>
<m-count class="count" :value="29.6" :decimal="2" />
<span>万㎡</span>
</p>
</div>
<div>
<span>去化率</span>
<p><m-count class="count" :value="100" /><span>%</span></p>
</div>
</div>
</div>
</m-card>
</template>
<script lang="ts">
export default {
name: 'A010',
title: '交易数据',
}
</script>
<script lang="ts" setup>
const summary = [
{ name: '房屋供应总套数', value: 714, unit: '套' },
{ name: '房屋成交总套数', value: 1564, unit: '套' },
{ name: '车位成交总数', value: 1353, unit: '个' },
]
</script>
<style lang="stylus" scoped>
@import '../../components/MyComponent/main.styl'
.sum
display flex
flex-wrap wrap
$box()
padding .05rem 0
margin-bottom .05rem
>p
width 50%
padding 0 .05rem
box-sizing inherit
display flex
align-items center
justify-content space-between
.house
$box()
padding .04rem .1rem
margin-bottom .04rem
.title
display flex
align-items center
.line
flex 1
height 0
border-bottom .01rem dashed $blue
margin 0 .05rem
.info
display flex
justify-content space-between
>div
// flex 1
display flex
span
color #ccc
font-size .08rem
.count
color #EDB872
margin-left .04rem
</style>
<template>
<m-card title="交易数据">
<div class="sum">
<p v-for="item in summary" :key="item.name">
{{ item.name }}
<span>
<m-count class="orange-count" :value="item.value" />
{{ item.unit }}
</span>
</p>
</div>
<m-sub>新建商品房</m-sub>
<div class="house">
<div class="title">
<p>福新名苑</p>
<span class="line" />
<span>
<m-count class="orange-count" :value="13.2" :decimal="2" />万㎡
</span>
</div>
<div class="company">上海北航置业发展有限公司</div>
<div class="info">
<div>
<span>上市套数</span>
<p><m-count class="count" :value="199" /><span></span></p>
</div>
<div>
<span>上市面积</span>
<p>
<m-count class="count" :value="29.6" :decimal="2" />
<span>万㎡</span>
</p>
</div>
<div>
<span>去化率</span>
<p><m-count class="count" :value="100" /><span>%</span></p>
</div>
</div>
</div>
<m-sub>租赁住房</m-sub>
<div class="lease">
<div class="house">
<div class="title">
<p>魔方公寓</p>
<span class="line" />
<span> <m-count class="orange-count" :value="5000" /></span>
</div>
<div class="company">上海盛派投资管理有限公司</div>
<div class="info">
<div>
<span>上市套数</span>
<p><m-count class="count" :value="499" /><span></span></p>
</div>
<div>
<span>上市面积</span>
<p>
<m-count class="count" :value="8595" />
<span></span>
</p>
</div>
</div>
</div>
<div class="house">
<div class="title">
<p>宁家公寓止园路</p>
<span class="line" />
<span> <m-count class="orange-count" :value="4500" /></span>
</div>
<div class="company">上海金茂实业有限公司</div>
<div class="info">
<div>
<span>上市套数</span>
<p><m-count class="count" :value="113" /><span></span></p>
</div>
<div>
<span>上市面积</span>
<p>
<m-count class="count" :value="4146" />
<span></span>
</p>
</div>
</div>
</div>
</div>
</m-card>
</template>
<script lang="ts">
export default {
name: 'A010',
title: '交易数据',
}
</script>
<script lang="ts" setup>
const summary = [
{ name: '房屋供应总套数', value: 714, unit: '套' },
{ name: '房屋成交总套数', value: 1564, unit: '套' },
{ name: '车位成交总数', value: 1353, unit: '个' },
]
</script>
<style lang="stylus" scoped>
@import '../../components/MyComponent/main.styl'
.sum
display flex
flex-wrap wrap
$box()
padding .05rem 0
margin-bottom .05rem
>p
width 50%
padding 0 .05rem
box-sizing inherit
display flex
align-items center
justify-content space-between
.house
$box()
padding .04rem .1rem
margin-bottom .05rem
.title
display flex
align-items center
.line
flex 1
height 0
border-bottom .01rem dashed $blue
margin 0 .05rem
.info
display flex
justify-content space-between
>div
// flex 1
display flex
span
color #ccc
font-size .08rem
.count
color #EDB872
margin-left .04rem
</style>
...@@ -7,3 +7,5 @@ export { default as A006 } from './A006/index.vue' ...@@ -7,3 +7,5 @@ export { default as A006 } from './A006/index.vue'
export { default as A007 } from './A007/index.vue' export { default as A007 } from './A007/index.vue'
export { default as A008 } from './A008/index.vue' export { default as A008 } from './A008/index.vue'
export { default as A009 } from './A009/index.vue' export { default as A009 } from './A009/index.vue'
export { default as A010 } from './A010/index.vue'
export { default as A011 } from './A011/index.vue'
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment