Merge branch 'master' of http://192.168.0.105:10010/r/srs-police-affairs

guanqb

2022-12-05 d7a488254dd5d65bfb5f24e78e69c95b8142dff9

Merge branch 'master' of http://192.168.0.105:10010/r/srs-police-affairs

 package-lock.json

Diff too large

 package.json

@@ -12,7 +12,7 @@
        "@turf/turf": "^6.5.0",
        "axios": "^0.22.0",
        "core-js": "^3.6.5",
        "echarts": "^5.2.1",
        "echarts": "^4.9.0",
        "element-resize-detector": "^1.2.4",
        "element-ui": "^2.15.6",
        "flv.js": "^1.6.2",
@@ -43,4 +43,4 @@
        "sass-loader": "^8.0.2",
        "vue-template-compiler": "^2.6.11"
    }
}
}

 src/styles/media/index.scss

@@ -2,7 +2,7 @@

    html,
    body {
        font-size: 1.44vh;
        font-size: countSizeVh(16) !important;

        #app {
            width: 100vw;
@@ -14,29 +14,98 @@

                .main-header {
                    width: 100vw;
                    height: countSizeVh(60, 1080);
                    height: countSizeVh(60);
                    line-height: countSizeVh(60);

                    .title {
                        font-size: countSizeVh(24);
                    }


                    .menu-list.left {
                        margin-left: countSizeVh(72);
                    }

                    .menu-list.right {
                        margin-right: countSizeVh(72);
                    }

                    .menu-list {

                        .nav-list {
                            width: countSizeVw(132, 1920);
                            height: countSizeVh(36);
                            font-size: countSizeVh(18);
                        }
                    }
                }

                .main-content {
                    top: countSizeVh(60);
                    height: calc(100% - countSizeVh(60));

                    .left-container,
                    .right-container {
                        top: countSizeVh(60, 1080);
                        top: countSizeVh(60);
                        width: countSizeVw(400, 1920);
                        height: calc(100% - countSizeVh(60, 1080));
                        height: calc(100% - countSizeVh(60));

                        .person-box,
                        .case-box,
                        .land-box,
                        .case-box,
                        .crowd-box {
                            height: countSizeVh(320, 1080);
                            height: countSizeVh(320);
                        }

                        .person-box,
                        .house-box,
                        .land-box,
                        .case-box,
                        .alert-box,
                        .crowd-box {

                            .title {
                                padding: 0 countSizeVw(18, 1920) 0 countSizeVw(18, 1920);
                                height: countSizeVh(54);
                                line-height: countSizeVh(54);
                                font-size: countSizeVh(16);
                            }

                            .sub-title {
                                line-height: countSizeVh(36);
                            }

                            .sub-tab {
                                padding: countSizeVh(10);

                                .tab {

                                    &>div {
                                        height: countSizeVh(22);
                                        line-height: countSizeVh(22);
                                    }
                                }
                            }

                        }

                        .house-box {

                            .title {
                                height: countSizeVh(54);
                                line-height: countSizeVh(54);
                            }
                        }
                    }

                    .bottom-container {
                        left: countSizeVw(400, 1920);
                        width: calc(100% - countSizeVw(400, 1920) * 2);
                        height: countSizeVh(320, 1080);
                        height: countSizeVh(320);
                    }

                    .region-select {
                        top: countSizeVh(20);
                    }
                }
            }
@@ -49,6 +118,8 @@

    html,
    body {
        font-size: 1.44vh !important;

        #app {
            width: 100vw;
            height: 100vh;
@@ -59,29 +130,81 @@

                .main-header {
                    width: 100vw;
                    height: countSizeVh(135, 2432);
                    height: maxCountSizeVh(60);

                    .user-infor {
                        width: maxCountSizeVh(60);
                        height: maxCountSizeVh(60);
                        line-height: maxCountSizeVh(60);
                        font-size: 2.16vh;
                    }
                }

                .main-content {
                    top: maxCountSizeVh(60);
                    height: calc(100% - maxCountSizeVh(60));

                    .left-container,
                    .right-container {
                        top: countSizeVh(135, 2432);
                        top: maxCountSizeVh(60);
                        width: countSizeVw(1520, 7296);
                        height: calc(100% - countSizeVh(135, 2432));
                        height: calc(100% - maxCountSizeVh(60));

                        .person-box,
                        .case-box,
                        .land-box,
                        .case-box,
                        .crowd-box {
                            height: countSizeVh(720, 2432);
                            height: maxCountSizeVh(320);
                        }


                        .person-box,
                        .house-box,
                        .land-box,
                        .case-box,
                        .alert-box,
                        .crowd-box {


                            .title {
                                height: maxCountSizeVh(54);
                                line-height: maxCountSizeVh(54);
                            }

                            .sub-title {
                                line-height: maxCountSizeVh(36);
                            }

                            .sub-tab {
                                padding: maxCountSizeVh(10);

                                .tab {

                                    &>div {
                                        height: maxCountSizeVh(22);
                                        line-height: maxCountSizeVh(22);
                                    }
                                }
                            }
                        }

                        .house-box {

                            .title {
                                height: countSizeVh(54);
                                line-height: countSizeVh(54);
                            }
                        }
                    }

                    .bottom-container {
                        left: countSizeVw(1520, 7296);
                        width: calc(100% - countSizeVw(1520, 7296) * 2);
                        height: countSizeVh(720, 2432);
                        height: maxCountSizeVh(320);
                    }

                    .region-select {
                        top: maxCountSizeVh(20);
                    }
                }
            }

 src/styles/scssFile.scss

@@ -26,11 +26,17 @@


@function countSizeVw($size, $vw) {
    @return $size / $vw * 100vw
    @return calc($size / $vw * 100vw)
}

;

@function countSizeVh($size, $vh) {
    @return $size / $vh * 100vh
@function countSizeVh($size) {
    @return calc($size / 1080 * 100vh)
}

;

@function maxCountSizeVh($size) {
    @return calc($size / 1080 * 100vh)
}

 src/views/lyout/index.vue

@@ -13,23 +13,13 @@
        <div class="main-header">
            <!-- <div class="title"></div> -->
            <div class="menu-list left">
                <div
                    @mouseenter="item.childrenFlag = true"
                    @mouseleave="item.childrenFlag = false"
                    class="nav-list"
                    @click="goToPath(item)"
                    v-for="(item, index) in menuLeftList"
                    :key="index"
                >
                <div @mouseenter="item.childrenFlag = true" @mouseleave="item.childrenFlag = false" class="nav-list"
                    @click="goToPath(item)" v-for="(item, index) in menuLeftList" :key="index">
                    <span :class="{ on: currentUrl.indexOf(item.path) != -1 }">{{ item.menuName }}</span>
                    <div class="sub-nav-list" v-show="item.children && item.childrenFlag">
                        <div
                            v-for="(subItem, subIndex) in item.children"
                            :key="subIndex"
                            @click="goToPath(subItem)"
                        >
                        <div v-for="(subItem, subIndex) in item.children" :key="subIndex" @click="goToPath(subItem)">
                            {{
                            subItem.menuName
                                    subItem.menuName
                            }}
                        </div>
                    </div>
@@ -43,23 +33,13 @@

            <!-- 菜单导航 -->
            <div class="menu-list right">
                <div
                    @mouseenter="item.childrenFlag = true"
                    @mouseleave="item.childrenFlag = false"
                    class="nav-list"
                    @click="goToPath(item)"
                    v-for="(item, index) in menuRightList"
                    :key="index"
                >
                <div @mouseenter="item.childrenFlag = true" @mouseleave="item.childrenFlag = false" class="nav-list"
                    @click="goToPath(item)" v-for="(item, index) in menuRightList" :key="index">
                    <span :class="{ on: currentUrl.indexOf(item.path) != -1 }">{{ item.menuName }}</span>
                    <div class="sub-nav-list" v-show="item.children && item.childrenFlag">
                        <div
                            v-for="(subItem, subIndex) in item.children"
                            :key="subIndex"
                            @click="goToPath(subItem)"
                        >
                        <div v-for="(subItem, subIndex) in item.children" :key="subIndex" @click="goToPath(subItem)">
                            {{
                            subItem.menuName
                                    subItem.menuName
                            }}
                        </div>
                    </div>
@@ -79,23 +59,15 @@
            <mapBox ref="modalForm" />

            <!-- 主体内容区域 -->
            <div
                class="main-content"
                id="MainContent"
                :class="{ 'spread': leftShow && show, 'take-back': leftShow && !show }"
            >
            <div class="main-content" id="MainContent"
                :class="{ 'spread': leftShow && show, 'take-back': leftShow && !show }">
                <router-view ref="target-name"></router-view>
            </div>

            <el-button
                v-show="leftShow"
                class="flexible-btn"
            <el-button v-show="leftShow" class="flexible-btn"
                :class="{ 'spread': leftShow && show, 'take-back': leftShow && !show }"
                :icon="show ? 'el-icon-arrow-left' : 'el-icon-arrow-right'"
                id="FlexibleBtn"
                type="primary"
                @click="flexibelClick"
            ></el-button>
                :icon="show ? 'el-icon-arrow-left' : 'el-icon-arrow-right'" id="FlexibleBtn" type="primary"
                @click="flexibelClick"></el-button>
        </div>
    </div>
</template>
@@ -308,7 +280,7 @@
            overflow: hidden;
            letter-spacing: 6px;

            & > img {
            &>img {
                // width: 100%;
                height: 80%;
                margin: 0 10px 0 10px;
@@ -324,7 +296,7 @@
                // border-radius: 10px 16px 10px 16px;
                transform: skew(58deg);

                & > span {
                &>span {
                    transform: skew(-58deg);
                }
            }
@@ -338,7 +310,7 @@
                // border-radius: 16px 10px 16px 10px;
                transform: skew(-58deg);

                & > span {
                &>span {
                    transform: skew(58deg);
                }
            }
@@ -348,10 +320,11 @@
            display: flex;
            align-items: center;

            & > .nav-list {
            &>.nav-list {

                // color: rgba(32, 106, 181, 1);
                // border-bottom: 2px solid #409eff;
                & > span.on {
                &>span.on {
                    color: rgba(252, 189, 86, 1);
                }
            }
@@ -397,6 +370,7 @@
                    div:last-child {
                        padding-bottom: 10px;
                    }

                    div:hover {
                        text-shadow: 0px 1px 1px #fff;
                    }