监控视频样式调整、搜索框隐藏问题

guanqb

2023-01-06 f0a88bdf72fb54502e2f219e92eb7e9c57a1be93

监控视频样式调整、搜索框隐藏问题

 src/router/axios.js

@@ -41,7 +41,8 @@
        // 调用监控平台的
        if (config.requestBaseUrl == "outside") {
            // 内网部署地址
            config.baseURL = 'http://10.141.11.11:18185/api'
            // config.baseURL = 'http://10.141.11.11:18185/api'
            config.baseURL = 'http://192.168.0.126:18185/api'
            // config.baseURL = "http://192.168.0.129:18185/api"
        } else if (config.requestBaseUrl == "fengt") {
            // feng tu 数据

 src/styles/base/index.scss

@@ -102,7 +102,6 @@
            align-items: center;
            justify-content: center;
            width: 100%;
            height: 100%;
        }
    }
}
@@ -292,7 +291,7 @@
        display: flex;
        flex-direction: column;
        width: 1000px;
        height: 600px;
        height: 620px;
        top: 50%;
        left: 50% !important;
        transform: translate(-50%, -50%);

 src/styles/media/index.scss

@@ -319,6 +319,24 @@
                            }
                        }

                        .equiment-detail {
                            height: countSizeVh(540);
                            .right {
                                .monitor {
                                    height: countSizeVh(540);
                                }
                    
                                .others {
                                    height: countSizeVh(495);
                    
                                    .pages {
                                        padding-bottom: countSizeVh(3);
                                        padding-top: countSizeVh(10);
                                    }
                                }
                            }
                        }



                    }
@@ -812,7 +830,7 @@

                        .search-content {
                            left: countSizeVw(760, 1920);
                            top: countSizeVh(40);
                            top: countSizeVh(100);
                            width: countSizeVw(460, 1920);
                            height: countSizeVh(36);

@@ -1036,7 +1054,7 @@

                        .search-content {
                            left: countSizeVw(760, 1920);
                            top: countSizeVh(40);
                            top: countSizeVh(100);
                            width: countSizeVw(460, 1920);
                            height: countSizeVh(36);

@@ -1230,7 +1248,7 @@

                            .search-content {
                                left: countSizeVw(760, 1920);
                                top: countSizeVh(40);
                                top: countSizeVh(100);
                                width: countSizeVw(460, 1920);
                                height: countSizeVh(36);

@@ -1725,7 +1743,7 @@

                        .search-content {
                            left: countSizeVw(760, 1920);
                            top: countSizeVh(40);
                            top: countSizeVh(120);
                            width: countSizeVw(460, 1920);
                            height: countSizeVh(36);

@@ -1777,6 +1795,28 @@
                }

                .main-content {
                    .car-video-box {
                        .el-dialog .el-dialog__header {
                            height: countSizeVh(30);
                            line-height: countSizeVh(30);
                            font-size: countSizeVh(16);
                        }
                        .el-dialog__header span {
                            font-size: countSizeVh(18);
                        }
                        .el-dialog__header button {
                            font-size: countSizeVh(18);
                            right: countSizeVw(10, 1920);
                        }
                        .el-dialog {
                            width: countSizeVw(720, 1920);
                            height: countSizeVh(480);
                        }
                        .el-dialog .el-dialog__body  {
                            height: countSizeVh(450);
                            padding: countSizeVh(6);
                        }
                    }
                    .police-affairs-details-box {
                        .el-dialog {
                            width: countSizeVw(540, 1920);
@@ -1957,7 +1997,7 @@

                        .el-dialog {
                            width: countSizeVw(1000, 1920);
                            height: countSizeVh(600);
                            height: countSizeVh(620);
                        }
                    }


 src/views/activity/index.vue

@@ -1787,8 +1787,10 @@

    .search-content {
        position: absolute;
        position: fixed;
        z-index: 99;
        left: 760px;
        top: 40px;
        top: 140px;
        width: 460px;
        height: 36px;


 src/views/home/index.vue

@@ -11,18 +11,31 @@

<template>
    <div class="home-page container">
        <left-container class="left-container" @showpeopledetail="showpeopledetail" @showlanddetail="showlanddetail"
            @showkeypersondetail="showkeypersondetail" ref="leftContainer"></left-container>
        <left-container
            class="left-container"
            @showpeopledetail="showpeopledetail"
            @showlanddetail="showlanddetail"
            @showkeypersondetail="showkeypersondetail"
            ref="leftContainer"
        ></left-container>

        <right-container class="right-container" @showequimentdetail="showequimentdetail"
            @selectPoliceChangeEventData="selectPoliceChangeEventData" @changeActivityType="changeActivityType"
            @activityChange="activityChange" ref="rightContainer"></right-container>
        <right-container
            class="right-container"
            @showequimentdetail="showequimentdetail"
            @selectPoliceChangeEventData="selectPoliceChangeEventData"
            @changeActivityType="changeActivityType"
            @activityChange="activityChange"
            ref="rightContainer"
        ></right-container>

        <bottom-container class="bottom-container" ref="bottomContainer"
        <bottom-container
            class="bottom-container"
            ref="bottomContainer"
            @changePoliceSituationHistoryType="changePoliceSituationHistoryType"
            @changePoliceSituationTimeType="changePoliceSituationTimeType"
            @policeSituationChange="policeSituationChange"
            @policeSituationSiteClick="policeSituationSiteClick"></bottom-container>
            @policeSituationSiteClick="policeSituationSiteClick"
        ></bottom-container>

        <div class="center-container">
            <div class="layers-control-btn house">
@@ -49,30 +62,69 @@
        </div>

        <div ref="RegionSelect" style="left: 0;" class="region-select">
            <map-select class="map-select" @selectCheck="policeStationSelect" :checkValue="policeStationCheckValue"
                :options="policeStationOptions" :optionsName="'policeStationName'"></map-select>
            <map-select
                class="map-select"
                @selectCheck="policeStationSelect"
                :checkValue="policeStationCheckValue"
                :options="policeStationOptions"
                :optionsName="'policeStationName'"
            ></map-select>

            <map-select class="map-select" @selectCheck="areaSelect" :checkValue="areaCheckValue" :options="areaOptions"
                :optionsName="'areaCheckName'"></map-select>
            <map-select
                class="map-select"
                @selectCheck="areaSelect"
                :checkValue="areaCheckValue"
                :options="areaOptions"
                :optionsName="'areaCheckName'"
            ></map-select>

            <map-select class="map-select" @selectCheck="housingSelect" :checkValue="housingCheckValue"
                :options="housingOptions" :optionsName="'housingsName'"></map-select>
            <map-select
                class="map-select"
                @selectCheck="housingSelect"
                :checkValue="housingCheckValue"
                :options="housingOptions"
                :optionsName="'housingsName'"
            ></map-select>
        </div>

        <el-dialog :title="dialogTitle" :modal="true" :visible.sync="dialogVisible" :before-close="dialogBeforeClose"
            :close-on-click-modal="true">
            <video src="/video/sp.mp4" autoplay controls width="100%" height="100%" ref="videoElement"
                style="object-fit: fill"></video>
        <el-dialog
            :title="dialogTitle"
            :modal="true"
            :visible.sync="dialogVisible"
            :before-close="dialogBeforeClose"
            :close-on-click-modal="true"
        >
            <video
                src="/video/sp.mp4"
                autoplay
                controls
                width="100%"
                height="100%"
                ref="videoElement"
                style="object-fit: fill"
            ></video>
        </el-dialog>

        <el-dialog :title="panoramaTitle" :modal="true" :visible.sync="panoramaVisible"
            :before-close="panoramaBeforeClose" :close-on-click-modal="true" class="panorama-details-box">
        <el-dialog
            :title="panoramaTitle"
            :modal="true"
            :visible.sync="panoramaVisible"
            :before-close="panoramaBeforeClose"
            :close-on-click-modal="true"
            class="panorama-details-box"
        >
            <!-- <iframe src="http://vr.jxpskj.com/JXSFKZQJ/QJ/" style="width: 100%; height: 100%;" frameborder="0"></iframe>-->
            <iframe :src="panoramaVrUrl" style="width: 100%; height: 100%;" frameborder="0" />
        </el-dialog>

        <el-dialog :title="activityTitle" :modal="true" :visible.sync="activityVisible"
            :before-close="activityBeforeClose" :close-on-click-modal="true" class="activity-details-box">
        <el-dialog
            :title="activityTitle"
            :modal="true"
            :visible.sync="activityVisible"
            :before-close="activityBeforeClose"
            :close-on-click-modal="true"
            class="activity-details-box"
        >
            <div class="item">
                <div>活动名称:</div>
                <div>{{ activityDetailArr.activityName }}</div>
@@ -107,8 +159,14 @@
            </div>
        </el-dialog>

        <el-dialog :title="phoneTitle" :modal="true" :visible.sync="phoneVisible" :before-close="phoneBeforeClose"
            :close-on-click-modal="true" class="phone-details-box">
        <el-dialog
            :title="phoneTitle"
            :modal="true"
            :visible.sync="phoneVisible"
            :before-close="phoneBeforeClose"
            :close-on-click-modal="true"
            class="phone-details-box"
        >
            <div class="item">
                <div>责任人：</div>
                <div>{{ phoneDetails.person }}</div>
@@ -127,8 +185,14 @@
            </div>
        </el-dialog>

        <el-dialog :title="peopleTitle" :modal="true" :visible.sync="peopleVisible" :before-close="peopleBeforeClose"
            :close-on-click-modal="true" class="area-details-box">
        <el-dialog
            :title="peopleTitle"
            :modal="true"
            :visible.sync="peopleVisible"
            :before-close="peopleBeforeClose"
            :close-on-click-modal="true"
            class="area-details-box"
        >
            <div class="item">
                <div>责任区负责人：</div>
                <div>王某某</div>
@@ -147,30 +211,58 @@
            </div>
        </el-dialog>

        <el-dialog :title="equimentTitle" :modal="true" :visible.sync="equimentVisible"
            :before-close="equimentBeforeClose" :close-on-click-modal="true" class="equiment-details-box">
        <el-dialog
            :title="equimentTitle"
            :modal="true"
            :visible.sync="equimentVisible"
            :before-close="equimentBeforeClose"
            :close-on-click-modal="true"
            class="equiment-details-box"
        >
            <div class="equiment-detail">
                <div class="left">
                    <el-tree :data="jurisdictionData" :props="defaultProps" @node-click="jurisdictionNodeClick"
                        ref="tree" node-key="id"></el-tree>
                    <el-tree
                        :data="jurisdictionData"
                        :props="defaultProps"
                        @node-click="jurisdictionNodeClick"
                        ref="tree"
                        node-key="id"
                    ></el-tree>
                </div>
                <div class="right">
                    <div class="monitor" v-if="monitorContent">
                        <video src="/video/sp.mp4" autoplay controls width="100%" height="100%" ref="videoElement"
                            style="object-fit: fill"></video>
                        <video
                            src="/video/sp.mp4"
                            autoplay
                            controls
                            width="100%"
                            height="100%"
                            ref="videoElement"
                            style="object-fit: fill"
                        ></video>
                    </div>
                    <div class="others" v-if="othersContent">
                        <el-table :data="showArr.slice((currentPage - 1) * pagesize, currentPage * pagesize)"
                        <el-table
                            :data="showArr.slice((currentPage - 1) * pagesize, currentPage * pagesize)"
                            style="width: 100%"
                            :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
                            :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"
                            :row-class-name="tableRowClassName">
                            :row-class-name="tableRowClassName"
                        >
                            <el-table-column prop="carID" label="车牌号" v-if="carArrShow"></el-table-column>
                            <el-table-column prop="carType" label="车型" v-if="carArrShow"></el-table-column>
                            <el-table-column prop="phoneID" label="手台号" v-if="phoneArrShow"></el-table-column>
                            <el-table-column prop="phoneType" label="手台机型" v-if="phoneArrShow"></el-table-column>
                            <el-table-column prop="recorderID" label="执法记录仪号" v-if="recorderArrShow"></el-table-column>
                            <el-table-column prop="recorderType" label="记录仪机型" v-if="recorderArrShow"></el-table-column>
                            <el-table-column
                                prop="recorderID"
                                label="执法记录仪号"
                                v-if="recorderArrShow"
                            ></el-table-column>
                            <el-table-column
                                prop="recorderType"
                                label="记录仪机型"
                                v-if="recorderArrShow"
                            ></el-table-column>
                            <el-table-column prop="id" label="设备号" v-if="stateArrShow"></el-table-column>
                            <el-table-column prop="equimentType" label="设备类型" v-if="stateArrShow"></el-table-column>
                            <el-table-column prop="policeStation" label="所属派出所"></el-table-column>
@@ -178,20 +270,35 @@
                            <el-table-column prop="state" label="状态"></el-table-column>
                        </el-table>
                        <div class="pages">
                            <el-pagination background layout="prev, pager, next" :total="showArr.length"
                                :page-size="pagesize" pager-count="3" :current-page="currentPage"
                                @current-change="handleCurrentChange"></el-pagination>
                            <el-pagination
                                background
                                layout="prev, pager, next"
                                :total="showArr.length"
                                :page-size="pagesize"
                                pager-count="3"
                                :current-page="currentPage"
                                @current-change="handleCurrentChange"
                            ></el-pagination>
                        </div>
                    </div>
                </div>
            </div>
        </el-dialog>

        <el-dialog :title="landTitle" :modal="true" :visible.sync="landVisible" :before-close="landBeforeClose"
            :close-on-click-modal="true" class="land-details-box">
            <el-table :data="landDetailArr" style="width: 100%"
        <el-dialog
            :title="landTitle"
            :modal="true"
            :visible.sync="landVisible"
            :before-close="landBeforeClose"
            :close-on-click-modal="true"
            class="land-details-box"
        >
            <el-table
                :data="landDetailArr"
                style="width: 100%"
                :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
                :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }">
                :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }"
            >
                <el-table-column prop="housingEastate" label="小区名称" width="100"></el-table-column>
                <el-table-column prop="location" label="位置" width="140"></el-table-column>
                <el-table-column prop="area" label="面积" width="120"></el-table-column>
@@ -200,11 +307,20 @@
            </el-table>
        </el-dialog>

        <el-dialog :title="keyPersonTitle" :modal="true" :visible.sync="keyPersonVisible"
            :before-close="keyPersonBeforeClose" :close-on-click-modal="true" class="keyPerson-details-box">
            <el-table :data="keyPersonDetailArr" style="width: 100%"
        <el-dialog
            :title="keyPersonTitle"
            :modal="true"
            :visible.sync="keyPersonVisible"
            :before-close="keyPersonBeforeClose"
            :close-on-click-modal="true"
            class="keyPerson-details-box"
        >
            <el-table
                :data="keyPersonDetailArr"
                style="width: 100%"
                :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
                :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }">
                :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }"
            >
                <el-table-column prop="type" label="重点人员类型"></el-table-column>
                <el-table-column prop="name" label="姓名"></el-table-column>
                <el-table-column prop="sex" label="性别"></el-table-column>
@@ -215,11 +331,23 @@
            </el-table>
        </el-dialog>

        <el-dialog title="警情信息" :modal="true" :visible.sync="policeSituationVisible"
            :before-close="policeSituationBeforeClose" :close-on-click-modal="true" class="policeSituation-details-box">
        <el-dialog
            title="警情信息"
            :modal="true"
            :visible.sync="policeSituationVisible"
            :before-close="policeSituationBeforeClose"
            :close-on-click-modal="true"
            class="policeSituation-details-box"
        >
            <div class="btn-change">
                <div :class="{ on: policeInformationType == '接警信息' }" @click="policeInformationType = '接警信息'">接警信息</div>
                <div :class="{ on: policeInformationType == '出警信息' }" @click="policeInformationType = '出警信息'">出警信息</div>
                <div
                    :class="{ on: policeInformationType == '接警信息' }"
                    @click="policeInformationType = '接警信息'"
                >接警信息</div>
                <div
                    :class="{ on: policeInformationType == '出警信息' }"
                    @click="policeInformationType = '出警信息'"
                >出警信息</div>
            </div>

            <div v-show="policeInformationType == '接警信息'" class="box">
@@ -1726,7 +1854,9 @@
                background-color: #66b1ff87;
            }

            :deep(.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content) {
            :deep(.el-tree--highlight-current
                    .el-tree-node.is-current
                    > .el-tree-node__content) {
                background: #454545;
            }

@@ -1738,6 +1868,7 @@

        .right {
            width: 70%;
            height: 100%;
            float: left;

            .monitor {

 src/views/house/index.vue

@@ -795,6 +795,7 @@
        // 获取小区楼栋信息
        getResidentialQuartersInfo (areaId, adcode) {
            getResidentialQuartersInfo(areaId, adcode).then(res => {
                this.getHouses(res.data.data.build[1].build_id, '361102')
                this.housingData.name = res.data.data.aoi_name
                this.buildingList = []
                res.data.data.build.forEach(item => {
@@ -803,7 +804,6 @@
                })
                console.log('buildingList', this.buildingList)
                this.buildingChoosed = this.buildingList[1]
                this.getHouses(this.buildingList[1].build_id, '361102')
            })
        },

@@ -850,6 +850,8 @@
        // 楼栋单元楼层户室查询
        getHouses (build_id, adcode) {
            getHouses(build_id, adcode).then(res => {
                console.log(res, 999)
                // 你下面的这些是用来做啥的
                this.unitHouseChoosed = res.data.data.unit[this.unitValue - 1].house
                let houseFloorList = []
                this.unitHouseChoosed.forEach(item => {
@@ -1745,6 +1747,8 @@

    .search-content {
        position: absolute;
        position: fixed;
        z-index: 99;
        left: 760px;
        top: 40px;
        width: 460px;

 src/views/police/index.vue

@@ -1160,6 +1160,8 @@

    .search-content {
        position: absolute;
        position: fixed;
        z-index: 99;
        left: 760px;
        top: 40px;
        width: 460px;

 src/views/video/list.vue

@@ -762,8 +762,10 @@

    .search-content {
        position: absolute;
        position: fixed;
        z-index: 99;
        left: 760px;
        top: 40px;
        top: 120px;
        width: 460px;
        height: 36px;