|
@@ -0,0 +1,169 @@
|
|
|
+
|
|
|
+<template>
|
|
|
+ <div class="modelBlock">
|
|
|
+ <template v-if="permissionFiltering">
|
|
|
+ <div class="model-title">
|
|
|
+ <div class="model-title-text">本月房屋点击排名前十</div>
|
|
|
+ </div>
|
|
|
+ <div class="titleDe">
|
|
|
+ <span>房屋信息</span>
|
|
|
+ <span>点击量</span>
|
|
|
+ </div>
|
|
|
+ <div class="model-content">
|
|
|
+ <div class="listInformation" v-for="(item, index) in datas" :key="index">
|
|
|
+ <div class="flex">
|
|
|
+ <img class="listInformation_img" :src="item.pictureUrl" />
|
|
|
+ <div class="listInformation_text">
|
|
|
+ <div>{{ item.title }}</div>
|
|
|
+ <div>{{ filterType(item.buildingType, item.residenceType) }} {{ item.houseArea || 0 }}㎡</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="listInformation_text">
|
|
|
+ <div>{{ item.monthlyRentAmount | filterMoney }}/月</div>
|
|
|
+ <div>{{ item.sellAmount | filterMoney }}</div>
|
|
|
+ </div>
|
|
|
+ <div class="listInformation_operation">{{ item.clickNumber }}</div>
|
|
|
+ </div>
|
|
|
+ <div v-if="datas.length <= 0" class="noData">暂无数据</div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <no-permission v-else tipsText="本月房屋点击排名前十"></no-permission>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import permissionComponent from './permissionComponent';
|
|
|
+import { residenceTypeArr } from '@views/assetManagement/housPublic';
|
|
|
+export default {
|
|
|
+ mixins: [permissionComponent],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ defaultModel: {
|
|
|
+ permissUrl: 'propertyManagement/index',
|
|
|
+ titleName: '投诉建议'
|
|
|
+ },
|
|
|
+ mixins_query: {
|
|
|
+ communityId: '',
|
|
|
+ limit: 10,
|
|
|
+ year: 1,
|
|
|
+ month: 10
|
|
|
+ },
|
|
|
+ datas: []
|
|
|
+ };
|
|
|
+ },
|
|
|
+ filters: {
|
|
|
+ filterMoney(val) {
|
|
|
+ let num = Number(val);
|
|
|
+ if (num == 0) {
|
|
|
+ return val;
|
|
|
+ } else if (num > 1 && num < 10000) {
|
|
|
+ return val + '元';
|
|
|
+ } else if (num > 10000 && num < 100000000) {
|
|
|
+ return (num / 10000).toFixed(2) + '万元';
|
|
|
+ } else {
|
|
|
+ return (num / 100000000).toFixed(2) + '亿元';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.mixins_query.year = this.$moment().format('YYYY');
|
|
|
+ this.mixins_query.month = this.$moment().format('MM');
|
|
|
+ this.getData();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getData() {
|
|
|
+ this.$http
|
|
|
+ .get('/sc-community/report/click/top', this.mixins_query)
|
|
|
+ .then(({ status, data, msg }) => {
|
|
|
+ if (status == 0) {
|
|
|
+ this.datas = data;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch((err) => {});
|
|
|
+ },
|
|
|
+ filterType(val, val2) {
|
|
|
+ let names = '';
|
|
|
+ if (val == 1) {
|
|
|
+ names = '住宅';
|
|
|
+ } else if (val == 2) {
|
|
|
+ names = '商用';
|
|
|
+ }
|
|
|
+
|
|
|
+ residenceTypeArr[val == 1 ? 'residence' : 'shops'].map((item) => {
|
|
|
+ if (item.value == val2) {
|
|
|
+ names += '-' + item.label;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return names;
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style scoped lang="scss">
|
|
|
+@import './style.scss';
|
|
|
+.noData {
|
|
|
+ text-align: center;
|
|
|
+ line-height: rem(100);
|
|
|
+}
|
|
|
+.titleDe {
|
|
|
+ width: calc(100% - #{rem(6)});
|
|
|
+ height: rem(30);
|
|
|
+ font-size: rem(12);
|
|
|
+ background: rgba(224, 225, 227, 0.1);
|
|
|
+ line-height: rem(30);
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 0 rem(10);
|
|
|
+}
|
|
|
+.modelBlock {
|
|
|
+ padding: rem(15) rem(14) rem(20) rem(20);
|
|
|
+ .model-title {
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+ .model-content {
|
|
|
+ display: block;
|
|
|
+ height: calc(100% - #{rem(62)});
|
|
|
+ overflow-y: auto;
|
|
|
+ overflow-x: hidden;
|
|
|
+ padding-right: rem(10);
|
|
|
+ &::-webkit-scrollbar {
|
|
|
+ z-index: 11;
|
|
|
+ width: rem(6);
|
|
|
+ }
|
|
|
+ &::-webkit-scrollbar-track,
|
|
|
+ &::-webkit-scrollbar-corner {
|
|
|
+ background: transparent;
|
|
|
+ }
|
|
|
+ &::-webkit-scrollbar-thumb {
|
|
|
+ border-radius: 5px;
|
|
|
+ width: rem(6);
|
|
|
+ background: rgba(250, 250, 250, 0.09);
|
|
|
+ }
|
|
|
+ &::-webkit-scrollbar-track-piece {
|
|
|
+ background: transparent;
|
|
|
+ width: rem(6);
|
|
|
+ }
|
|
|
+ .flex {
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+ .listInformation {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-top: rem(10);
|
|
|
+ .listInformation_img {
|
|
|
+ width: rem(46);
|
|
|
+ height: rem(46);
|
|
|
+ margin-right: rem(20);
|
|
|
+ }
|
|
|
+ .listInformation_text {
|
|
|
+ line-height: rem(23);
|
|
|
+ opacity: 0.5;
|
|
|
+ }
|
|
|
+ .listInformation_operation {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ opacity: 0.5;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|