大搜功能完善

guanqb

2023-01-04 25d3ee7f5339ce8c469a8cf3f4c12a2e3dd0b7fc

大搜功能完善

 public/img/icon/clear.png

 public/img/icon/location.png

 src/components/map/index.vue

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2022-08-18 17:00:30
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2023-01-04 16:05:36
 * @LastEditTime: 2022-12-30 13:59:43
 * @FilePath: \srs-police-affairs\src\components\map\index.vue
 * @Description: 公用地图组件
 * 
@@ -15,20 +15,37 @@
        <!-- 全屏控制按钮 -->
        <div class="screen-full-btn">
            <el-tooltip v-if="isFullscreen" content="缩放" placement="bottom" effect="dark">
                <i class="fa fa-compress" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i>
                <i
                    class="fa fa-compress"
                    style="vertical-align: middle; cursor: pointer"
                    @click="fullscreenchange"
                ></i>
            </el-tooltip>
            <el-tooltip v-if="!isFullscreen" content="全屏" placement="bottom" effect="dark">
                <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i>
                <i
                    class="fa fa-expand"
                    style="vertical-align: middle; cursor: pointer"
                    @click="fullscreenchange"
                ></i>
            </el-tooltip>
        </div>
        <!-- 切换矢量图按钮 -->
        <div class="image-switch-icon-btn" title="切换影像" @mouseover="showImgBtn = true" @mouseleave="showImgBtn = false">
        <div
            class="image-switch-icon-btn"
            title="切换影像"
            @mouseover="showImgBtn = true"
            @mouseleave="showImgBtn = false"
        >
            <div class="icon-box">
                <img src="/img/base_map.png" alt />
            </div>

            <div class="image-switch-img-btn" v-show="showImgBtn" @mouseover="showImgBtn = true"
                @mouseleave="showImgBtn = false">
            <div
                class="image-switch-img-btn"
                v-show="showImgBtn"
                @mouseover="showImgBtn = true"
                @mouseleave="showImgBtn = false"
            >
                <div class="img" @click="switchImg">
                    <span :class="{ on: imgtype == 0 }">影像</span>
                </div>
@@ -171,7 +188,7 @@
            // global.viewer.addTerrain(terrain)

            // 天地图 影像
            baseLayers = global.viewer.imageryLayers.addImageryProvider(
            global.viewer.imageryLayers.addImageryProvider(
                new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                    url: 'http://t{s}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=e45274b0235bb913eceb393aabbf9c9c',
                    subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
@@ -183,7 +200,7 @@


            // 上饶部署，内网使用的
            // baseLayers = global.viewer.imageryLayers.addImageryProvider(
            // global.viewer.imageryLayers.addImageryProvider(
            //     new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
            //         url: "http://10.141.11.11:8090/MapTileService/wmts?STORETYPE=merged-dat&PROJECTION=4326",
            //         layer: "wmts_4326_361100",

 src/views/house/index.vue

@@ -195,7 +195,7 @@
                                <div class="one">
                                    <div>
                                        <div>160</div>
                                        <div>实有人口</div>
                                        <div>户籍人口</div>
                                    </div>
                                    <div>
                                        <div style="color:#FF796C">16</div>
@@ -219,7 +219,7 @@
                                </div>-->
                            </div>
                        </div>
                        <div class="house-info">
                        <!-- <div class="house-info">
                            <div class="title">房屋情况</div>

                            <div class="content">
@@ -227,7 +227,7 @@
                                    <div>288</div>
                                    <div>房屋总数</div>
                                </div>
                                <!-- <div>
                                <div>
                                    <div>120</div>
                                    <div>出租</div>
                                </div>
@@ -238,9 +238,9 @@
                                <div>
                                    <div>8</div>
                                    <div>空置</div>
                                </div>-->
                                </div>
                            </div>
                        </div>
                        </div>-->
                        <div class="house-element-info">
                            <!-- 选择单元 -->
                            <div class="condo">
@@ -439,6 +439,7 @@
                type="text"
                placeholder="请输入搜索条件"
            />
            <div class="clear">×</div>
            <button @click="searchExtensivelyClick" class="el-icon-search"></button>
        </div>
        <div v-show="searchExtensivelyValBoxShow" class="searchExtensively-val-box">
@@ -970,6 +971,20 @@
                    sitePitch: -45
                })
                this.searchExtensivelyValue = this.searchExtensivelyArray[0].name
                this.$EventBus.$emit('mapClearLayer', {
                    layerName: 'searchLayer',
                    type: 'VectorLayer'
                })
                this.$EventBus.$emit('layerPointAdd', {
                    layerName: 'searchLayer',
                    type: 'label',
                    params: {
                        lng: `${this.searchExtensivelyArray[0].location.lng}`,
                        lat: `${this.searchExtensivelyArray[0].location.lat}`,
                        alt: 0,
                        text: this.searchExtensivelyArray[0].name
                    },
                })
            }
        },

@@ -980,6 +995,10 @@
            } else {
                this.searchExtensivelyValBoxShow = true
                this.getSearchExtensively('ebf48ecaa1fd436fa3d40c4600aa051f', '361100', this.searchExtensivelyValue)
                this.$EventBus.$emit('mapClearLayer', {
                    layerName: 'searchLayer',
                    type: 'VectorLayer'
                })
            }
        },

@@ -989,11 +1008,11 @@
            this.$EventBus.$emit('toPosition', {
                siteJd: `${item.location.lng}`,
                siteWd: `${item.location.lat}`,
                siteGd: 10000
                siteGd: 200,
            })
            this.$EventBus.$emit('mapClearLayer', {
                layerName: 'searchLayer',
                type: 'label'
                type: 'VectorLayer'
            })
            this.$EventBus.$emit('layerPointAdd', {
                layerName: 'searchLayer',
@@ -1003,8 +1022,17 @@
                    lat: `${item.location.lat}`,
                    alt: 0,
                    text: item.name
                }
            })
            this.$EventBus.$emit('layerPointAdd', {
                layerName: 'searchLayer',
                type: "billboard",
                params: {
                    lng: `${item.location.lng}`,
                    lat: `${item.location.lat}`,
                    alt: 0,
                    url: '/img/icon/location.png'
                },
                // distanceDisplayCondition: { "near": 0, "far": 200000 }
            })
        },

@@ -1020,6 +1048,10 @@
        // })

        this.$parent.$parent.resize('0px')
        this.$EventBus.$emit('mapClearLayer', {
            layerName: 'searchLayer',
            type: 'label'
        })
    }
}
</script>
@@ -1596,7 +1628,7 @@

        input {
            flex: 1;
            width: 380px;
            width: 400px;
            height: 100%;
            font-size: 18px;
            text-indent: 1em;
@@ -1615,10 +1647,21 @@
            color: rgba(238, 238, 238, 0.7);
        }

        .clear {
            position: absolute;
            top: 0;
            right: 90px;
            font-size: 30px;
            height: 100%;
            line-height: 100%;
            color: #a8a8a8;
            cursor: pointer;
        }

        button {
            font-size: 24px;
            font-weight: 700;
            width: 80px;
            width: 60px;
            height: 100%;
            background-color: $table-body-tr-n-color;
            color: #fff;