社区感知商业弹窗详情接口对接

guanqb

2024-01-26 4a981498f2885dd0573b89ce4d70e1826eea129a

社区感知商业弹窗详情接口对接

 src/api/dept/index.js

@@ -414,4 +414,16 @@
        method: 'get',
        params
    })
}

/**
 * @description:小区商铺-详情
 * @return {*}
 */
export const getBusinessDetail = (params) => {
    return request({
        url: `/api/blade-place/place/getDetail`,
        method: 'get',
        params
    })
}

 src/components/dialog/businessDetailDialog.vue

@@ -11,7 +11,7 @@
<template>
    <el-dialog class="business-detail-box" :title="popupTile" append-to-body :visible.sync="popupShow" center
        @close="popupClose">
        <div>
        <div style="height: 100%;" v-loading="loading" element-loading-background="rgba(0, 0, 0, 0.5)">
            <div class="type-tab-box">
                <div class="tab-item" :class="{ 'tab-choose-item': chooseTab == 1 }" @click="tabClick(1)">
                    基本信息</div>
@@ -27,7 +27,7 @@
                            场所名称：
                        </div>
                        <div class="value">
                            测试0111
                            {{ businessDetailData.placeName }}
                        </div>
                    </div>
                    <div class="info-item">
@@ -35,7 +35,7 @@
                            地址：
                        </div>
                        <div class="value">
                            江西省上饶市信州区灵溪街道吴楚大道春天新苑
                            {{ businessDetailData.location }}
                        </div>
                    </div>
                    <div class="info-item">
@@ -43,7 +43,7 @@
                            负责人：
                        </div>
                        <div class="value">
                            钟松
                            {{ businessDetailData.principal }}
                        </div>
                    </div>
                    <div class="info-item">
@@ -51,10 +51,10 @@
                            手机号码：
                        </div>
                        <div class="value">
                            15179776420
                            {{ businessDetailData.principalPhone }}
                        </div>
                    </div>
                    <div class="info-item">
                    <!-- <div class="info-item">
                        <div class="name">
                            所属社区：
                        </div>
@@ -69,13 +69,13 @@
                        <div class="value">
                            第五网格
                        </div>
                    </div>
                    </div> -->
                    <div class="info-item">
                        <div class="name">
                            场所标签：
                        </div>
                        <div class="value">
                            休闲餐饮 酒吧
                            {{ businessDetailData.labelName }}
                        </div>
                    </div>
                    <div class="info-item">
@@ -83,7 +83,7 @@
                            标签颜色：
                        </div>
                        <div class="value">
                            黄色
                            {{ businessDetailData.color }}
                        </div>
                    </div>
                    <div class="info-item photo-list">
@@ -91,8 +91,9 @@
                            场所图片：
                        </div>
                        <div class="value">
                            <el-image
                                src="https://srgdjczzxtpt.com:2080/gminio/jczz/upload/20240118/4f1acce9ae26f84850b70ee520ee5833.JPG"></el-image>
                            <div v-for="(url, index) in businessDetailData.imagesUrlsArr" :key="index">
                                <el-image :src="url"></el-image>
                            </div>
                        </div>
                    </div>
                </div>
@@ -104,7 +105,7 @@
                            法人信息：
                        </div>
                        <div class="value">
                            钟松
                            {{ businessDetailData.placeExtEntity.legalPerson }}
                        </div>
                    </div>
                    <div class="info-item">
@@ -112,7 +113,7 @@
                            法人电话：
                        </div>
                        <div class="value">
                            15179776420
                            {{ businessDetailData.placeExtEntity.legalTel }}
                        </div>
                    </div>
                    <div class="info-item photo-list">
@@ -120,11 +121,9 @@
                            营业执照：
                        </div>
                        <div class="value">
                            <div v-for="index in 3" :key="index">
                                <el-image
                                    src="https://srgdjczzxtpt.com:2080/gminio/jczz/upload/20240118/c238e632fab698b5ec78af77a9cb101a.jpg"></el-image>
                            <div v-for="(url, index) in businessDetailData.yyzzUrlsArr" :key="index">
                                <el-image :src="url"></el-image>
                            </div>

                        </div>
                    </div>
                    <div class="info-item photo-list">
@@ -132,8 +131,9 @@
                            场所平面图：
                        </div>
                        <div class="value">
                            <el-image
                                src="https://srgdjczzxtpt.com:2080/gminio/jczz/upload/20240118/43a4fa65ee7ca772f61f0da5d681abcb.JPG"></el-image>
                            <div v-for="(url, index) in businessDetailData.pmtUrlsArr" :key="index">
                                <el-image :src="url"></el-image>
                            </div>
                        </div>
                    </div>
                </div>
@@ -144,9 +144,9 @@
                        :cell-style="{ 'text-align': 'center' }">
                        <el-table-column prop="name" label="名称" width="180">
                        </el-table-column>
                        <el-table-column prop="tel" label="手机号码" width="180">
                        <el-table-column prop="telephone" label="手机号码" width="180">
                        </el-table-column>
                        <el-table-column prop="address" label="暂住地">
                        <el-table-column prop="tempAddress" label="暂住地">
                        </el-table-column>
                    </el-table>
                </div>
@@ -157,6 +157,10 @@
</template>

<script>
import {
    getBusinessDetail
} from "@/api/dept/index.js"

export default {
    name: 'DetailsPopup',

@@ -171,25 +175,21 @@
        return {
            popupShow: false,

            data: [],
            businessId: '',
            chooseTab: 1,
            tableData: [{
                tel: '19866665555',
                name: '张三',
                address: ''
            }]
            tableData: [],
            loading: false,
            businessDetailData: {}
        }
    },

    methods: {
        // 打开弹窗初始化数据
        initOpen (data) {
            // 数据格式 data = [{ label: '字段名', prop:'字段属性名',value: '字段值' }]

            this.data = data

        initOpen (id) {
            this.chooseTab = 1
            this.popupShow = true
            this.loading = true
            this.getBusinessDetail(id)
        },

        // 关闭弹窗按钮
@@ -203,11 +203,65 @@
            console.log('tabClick', type)
        },

        goDetail () {

        // 获取详情数据
        getBusinessDetail (id) {
            getBusinessDetail({ id }).then(res => {
                console.log('getBusinessDetail', res.data.data)
                let data = res.data.data
                // 标签颜色
                if (data.color == 'red') {
                    data.color = '红色'
                } else if (data.color == 'yellow') {
                    data.color = '黄色'
                } else if (data.color == 'green') {
                    data.color = '绿色'
                }
                // 场所图片
                if (data.imageUrls) {
                    let picArr = data.imageUrls.split(',')
                    data.imagesUrlsArr = []
                    if (picArr.length > 0) {
                        picArr.forEach(item => {
                            item = 'http://10.141.11.11/place/' + item
                            data.imagesUrlsArr.push(item)
                        })
                    }
                }
                // 营业执照图片
                if (data.imageUrls) {
                    let picArr = data.placeExtEntity.imageUrls.split(',')
                    data.yyzzUrlsArr = []
                    if (picArr.length > 0) {
                        picArr.forEach(item => {
                            item = 'http://10.141.11.11/place/' + item
                            data.yyzzUrlsArr.push(item)
                        })
                    }
                }
                // 场所平面图图片
                if (data.imageUrls) {
                    let picArr = data.placeExtEntity.planImageUrls.split(',')
                    data.pmtUrlsArr = []
                    if (picArr.length > 0) {
                        picArr.forEach(item => {
                            item = 'http://10.141.11.11/place/' + item
                            data.pmtUrlsArr.push(item)
                        })
                    }
                }
                this.tableData = res.data.data.placePractitionerEntityList
                this.businessDetailData = res.data.data
                setTimeout(() => {
                    this.loading = false
                }, 500)
            })
        }
    },
}
</script>

<style lang="scss" scoped></style>
<style lang="scss" scoped>
:deep(.el-image__error) {
    height: 120px;
}
</style>

 src/components/map/components/businessDataPopup.vue

@@ -115,7 +115,7 @@
        },

        goDetail () {
            this.$refs.businessDetailDialog.initOpen()
            this.$refs.businessDetailDialog.initOpen(this.businessDataPopupData.id)
        },
    }
}

 src/views/house/index.vue

@@ -1171,7 +1171,7 @@
            let params = {
                current: 1,
                size: 10,
                aoiId: 111
                aoiId: aoiId
            }
            getBusinessList(params).then(res => {
                console.log('getBusinessList', res.data.data.records)