forked from srs-police-affairs
| src/styles/base/index.scss | ●●●●● patch | view | raw | blame | history | |
| src/styles/dc/index.scss | ●●●●● patch | view | raw | blame | history | |
| src/views/home/components/leftContainer.vue | ●●●●● patch | view | raw | blame | history | |
| src/views/home/components/rightContainer.vue | ●●●●● patch | view | raw | blame | history | |
| src/views/home/index.vue | ●●●●● patch | view | raw | blame | history | |
| src/views/lyout/index.vue | ●●●●● patch | view | raw | blame | history |
src/styles/base/index.scss
@@ -10,6 +10,7 @@ body { width: 100%; height: 100%; font-size: 16px; } ul { @@ -460,7 +461,8 @@ justify-content: center; width: 100%; height: 100%; flex-wrap:wrap; flex-wrap: wrap; input { width: 90%; height: 30px; @@ -478,6 +480,7 @@ input::-webkit-input-placeholder { color: rgba(238, 238, 238, 0.7); } button { width: 60px; height: 30px; @@ -491,7 +494,7 @@ } } .choose-police-box{ .choose-police-box { .el-dialog { margin: 0 !important; display: flex; src/styles/dc/index.scss
@@ -47,12 +47,12 @@ } .dc-location-bar.homebottom { bottom: 370px !important; bottom: 378px !important; } .dc-zoom-controller.homebottom { left: 410px !important; bottom: 366px !important; left: 402px !important; bottom: 362px !important; } .screen-full-btn { @@ -83,8 +83,8 @@ } .screen-full-btn.homebottom { left: 410px !important; bottom: 320px; left: 402px !important; bottom: 318px; } .dc-zoom-controller.shrink-btn { @@ -114,8 +114,8 @@ } .image-switch-icon-btn.iconbottom { left: 410px; bottom: 486px; left: 402px; bottom: 476px; } .image-switch-icon-btn.shrink-btn { @@ -171,7 +171,7 @@ .image-switch-img-btn.imgbottom { left: 446px; bottom: 490px; bottom: 452px; } .image-switch-img-btn.shrink-btn { src/views/home/components/leftContainer.vue
@@ -3,16 +3,9 @@ <div class="person-box"> <div class="title"> <div> <span class="peopleTap" :class="{ choosed: peopletype == 0 }" @click="peopleTabClick(0)" >现有人员</span>/ <span class="peopleTap" :class="{ choosed: peopletype == 1 }" @click="peopleTabClick(1)" >重点人员</span> <span class="peopleTap" :class="{ choosed: peopletype == 0 }" @click="peopleTabClick(0)">现有人员</span>/ <span class="peopleTap" :class="{ choosed: peopletype == 1 }" @click="peopleTabClick(1)">重点人员</span> </div> <div> 共 @@ -35,12 +28,7 @@ </div> </div> <div id="PersonEcharts" class="echarts-box"></div> <div class="back" title="返回上一级" v-show="dataDeep == 2 && peopletype == 0" @click="backBegin" ></div> <div class="back" title="返回上一级" v-show="dataDeep == 2 && peopletype == 0" @click="backBegin"></div> </div> <div class="house-box"> <div class="title">现有房屋</div> @@ -835,7 +823,7 @@ height: 100%; .person-box { height: 35%; height: 300px; .peopleTap { color: rgb(98, 95, 95); @@ -881,19 +869,17 @@ } } .house-box { flex: 1; } .land-box { height: 310px; height: 300px; } .person-box, .house-box, .land-box { margin: 8px; display: flex; flex-direction: column; background: $bg-color; .title::after { content: ''; @@ -914,7 +900,7 @@ text-align: left; height: 40px; line-height: 40px; font-size: 20px; font-size: 16px; display: flex; justify-content: space-between; background-image: linear-gradient(to right, #2e4aba, #010d3e); @@ -923,7 +909,7 @@ color: #fff; } & > div:nth-of-type(2) { &>div:nth-of-type(2) { font-size: 14px; } } @@ -945,7 +931,7 @@ border: 1px solid rgba(20, 50, 123, 1); cursor: pointer; & > div { &>div { height: 26px; line-height: 26px; } @@ -963,6 +949,12 @@ } } .house-box { flex: 1; margin-top: 0; margin-bottom: 0; } :deep(.el-table__body-wrapper) { overflow-x: hidden !important; } src/views/home/components/rightContainer.vue
@@ -1,48 +1,29 @@ <template> <div class="container"> <div class="case-box"> <div class="container" ref="Container"> <div class="case-box" ref="caseBox"> <div class="title"> 案件统计 <div class="timer"> <el-date-picker v-model="eventTime" type="daterange" align="right" unlink-panels range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions" ></el-date-picker> <el-date-picker v-model="eventTime" type="daterange" align="right" unlink-panels range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions"> </el-date-picker> </div> </div> <div id="EventChangeEcharts" class="echarts-box"></div> </div> <div class="alert-box"> <div class="title"> <div class="alert-box" ref="alertBox"> <div class="title" ref="alertBoxTitle"> <span style="margin-right:130px">安保活动</span> <span class="activity" :class="{ choosed: acttype == 0 }" @click="actTabClick(0)" >正在进行</span> <span class="activity" :class="{ choosed: acttype == 0 }" @click="actTabClick(0)">正在进行</span> <span>/</span> <span class="activity" :class="{ choosed: acttype == 1 }" @click="actTabClick(1)" >历史活动</span> <span class="activity" :class="{ choosed: acttype == 1 }" @click="actTabClick(1)">历史活动</span> </div> <div id="peopleList" class="echarts-box"> <el-table :data="acttype == 0 ? underwayArr : historyArr" style="width: 100%" <el-table :height="tableHeight" :data="acttype == 0 ? underwayArr : historyArr" 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" ref="activityTable" @row-click="activityRowClick" > :row-class-name="tableRowClassName" ref="activityTable" @row-click="activityRowClick"> <el-table-column prop="activityName" label="活动名称"></el-table-column> <el-table-column prop="startTime" label="开始时间"></el-table-column> <el-table-column prop="endTime" label="结束时间"></el-table-column> @@ -50,20 +31,13 @@ </el-table> </div> </div> <div class="crowd-box"> <div class="crowd-box" ref="crowdBox"> <div class="title"> <span style="margin-right:130px">现有设备</span> <span class="equiment" :class="{ choosed: linetype == 0 }" @click="lineTabClick(0)" >设备种类</span> <span class="equiment" :class="{ choosed: linetype == 0 }" @click="lineTabClick(0)">设备种类</span> <span>/</span> <span class="activity" :class="{ choosed: linetype == 1 }" @click="lineTabClick(1)" >设备状态</span> <span class="activity" :class="{ choosed: linetype == 1 }" @click="lineTabClick(1)">设备状态</span> </div> <div style="overflow: hidden;" id="EquipmentEcharts" class="echarts-box"></div> </div> @@ -130,6 +104,7 @@ spareNewArr: [], overhaulNewArr: [], disableNewArr: [], tableHeight: 0 } }, created () { @@ -145,8 +120,12 @@ this.clickEquimentChart() this.historyArr = historyArr this.underwayArr = underwayArr this.$nextTick(() => { window.addEventListener("resize", this.echartsResize) this.tableHeight = this.$refs.Container.offsetHeight - this.$refs.caseBox.offsetHeight - this.$refs.crowdBox.offsetHeight - this.$refs.alertBoxTitle.offsetHeight - 52 console.log(this.tableHeight, this.$refs.Container.offsetHeight, this.$refs.caseBox.offsetHeight, this.$refs.crowdBox.offsetHeight, this.$refs.alertBoxTitle.offsetHeight, 32) }) this.equipmentEchartsCarousel() }, @@ -674,32 +653,20 @@ width: 100%; .case-box { height: 30%; } .alert-box, .crowd-box { height: 35%; .echarts-box { overflow-x: hidden; overflow-y: auto; } } .alert-box { flex: 1; height: 300px; } .crowd-box { height: 310px; height: 300px; } .case-box, .alert-box, .crowd-box { margin: 8px; display: flex; flex-direction: column; background: $bg-color; .title::after { content: ''; @@ -720,7 +687,7 @@ text-align: left; height: 40px; line-height: 40px; font-size: 20px; font-size: 16px; background-image: linear-gradient(to right, #2e4aba, #010d3e); .timer { @@ -766,7 +733,7 @@ border: 1px solid rgba(20, 50, 123, 1); cursor: pointer; & > div { &>div { height: 26px; line-height: 26px; } @@ -786,5 +753,16 @@ height: 100%; } } .alert-box { flex: 1; margin-top: 0; margin-bottom: 0; .echarts-box { overflow-x: hidden; overflow-y: auto; } } } </style> src/views/home/index.vue
@@ -2,7 +2,7 @@ * @Author: shuishen 1109946754@qq.com * @Date: 2022-08-18 16:18:17 * @LastEditors: shuishen 1109946754@qq.com * @LastEditTime: 2022-11-12 14:12:25 * @LastEditTime: 2022-11-26 14:53:59 * @FilePath: \srs-police-affairs\src\views\home\index.vue * @Description: 小区-栋-层-房屋 * @@ -11,31 +11,18 @@ <template> <div class="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> @policeSituationChange="policeSituationChange" @policeSituationSiteClick="policeSituationSiteClick"> </bottom-container> <div class="center-container"> <div class="layers-control-btn house"> @@ -62,72 +49,29 @@ </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" > <iframe src="http://vr.jxpskj.com/JXSFKZQJ/QJ/" style="width: 100%; height: 100%;" frameborder="0" ></iframe> <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> </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> @@ -162,14 +106,8 @@ </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> @@ -188,14 +126,8 @@ </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> @@ -214,58 +146,30 @@ </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> @@ -273,35 +177,20 @@ <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> @@ -310,20 +199,11 @@ </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> @@ -334,14 +214,8 @@ </el-table> </el-dialog> <el-dialog :title="policeSituationTitle" :modal="true" :visible.sync="policeSituationVisible" :before-close="policeSituationBeforeClose" :close-on-click-modal="true" class="policeSituation-details-box" > <el-dialog :title="policeSituationTitle" :modal="true" :visible.sync="policeSituationVisible" :before-close="policeSituationBeforeClose" :close-on-click-modal="true" class="policeSituation-details-box"> <div class="item"> <div>所属派出所:</div> <div>{{ policeSituationDetailArr.policeName }}</div> @@ -1529,11 +1403,10 @@ display: flex; flex-direction: column; position: fixed; top: 80px; top: 60px; left: 0; width: 400px; height: calc(100% - 80px); background: $bg-color; height: calc(100% - 60px); z-index: 90; } @@ -1541,11 +1414,11 @@ display: flex; flex-direction: column; position: fixed; top: 80px; top: 60px; right: 0; width: 400px; height: calc(100% - 80px); background: $bg-color; height: calc(100% - 60px); z-index: 90; } @@ -1553,7 +1426,7 @@ display: flex; position: fixed; left: 50%; bottom: 320px; bottom: 318px; transform: translate(-50%, 0); z-index: 90; @@ -1674,8 +1547,8 @@ .bottom-container { position: fixed; left: 400px; bottom: 0px; height: 310px; bottom: 8px; height: 300px; width: calc(100% - 800px); background-color: $bg-color; box-sizing: border-box; @@ -1717,9 +1590,7 @@ 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; }
@@ -2,7 +2,7 @@ * @Author: shuishen 1109946754@qq.com * @Date: 2022-08-18 16:18:24 * @LastEditors: shuishen 1109946754@qq.com * @LastEditTime: 2022-11-18 10:39:09 * @LastEditTime: 2022-11-26 10:45:02 * @FilePath: \srs-police-affairs\src\views\lyout\index.vue * @Description: * @@ -19,28 +19,22 @@ <!-- 菜单导航 --> <div class="menu-list"> <div @mouseenter="item.childrenFlag = true" @mouseleave="item.childrenFlag = false" class="nav-list" :class="{ on: currentUrl.indexOf(item.path) != -1 }" @click="goToPath(item)" v-for="(item, index) in menuList" :key="index" > <div @mouseenter="item.childrenFlag = true" @mouseleave="item.childrenFlag = false" class="nav-list" :class="{ on: currentUrl.indexOf(item.path) != -1 }" @click="goToPath(item)" v-for="(item, index) in menuList" :key="index"> {{ item.menuName }} <div class="sub-nav-list" v-show="item.children && item.childrenFlag"> <div v-for="(subItem, subIndex) in item.children" :key="subIndex" @click="goToPath(subItem)" >{{ subItem.menuName }}</div> <div v-for="(subItem, subIndex) in item.children" :key="subIndex" @click="goToPath(subItem)">{{ subItem.menuName }}</div> </div> </div> </div> <!-- 用户登录展示的 --> <!-- <div class="user-infor"></div> --> <div class="user-infor"> <i class="el-icon-user-solid"></i> </div> </div> <div class="main-container"> @@ -48,23 +42,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> @@ -106,6 +92,11 @@ menuName: '安保活动', path: '/lyout/activity' }, { menuName: '运维管理', openExternal: true, path: 'http://192.168.0.105:8081/#/login' } ], show: true, @@ -155,6 +146,11 @@ * @return {*} 没有返回值 */ goToPath (params) { if (params.openExternal) { window.open(params.path) return } if (params.children && params.children.length > 0) return if (params.path) { @@ -227,8 +223,8 @@ justify-content: space-between; position: absolute; width: 100%; height: 80px; line-height: 80px; height: 60px; line-height: 60px; text-align: left; font-size: 44px; font-weight: bold; @@ -240,12 +236,12 @@ display: flex; align-items: center; width: 450px; font-size: 38px; font-size: 24px; // text-align: center; overflow: hidden; letter-spacing: 6px; & > img { &>img { // width: 100%; height: 80%; margin: 0 10px 0 10px; @@ -254,13 +250,13 @@ } .menu-list { margin-right: 10px; margin-right: 60px; display: flex; align-items: center; .nav-list.on { // color: rgba(32, 106, 181, 1); border-bottom: 3px solid #409eff; border-bottom: 2px solid #409eff; box-sizing: border-box; } @@ -270,8 +266,8 @@ display: flex; align-items: center; justify-content: center; height: 60px; font-size: 32px; height: 40px; font-size: 18px; font-weight: 400; cursor: pointer; border-bottom: 3px solid transparent; @@ -279,7 +275,7 @@ .sub-nav-list { border-top: 14px solid transparent; position: absolute; top: 60px; top: 40px; width: 100%; cursor: default; z-index: 999; @@ -304,6 +300,17 @@ } } } .user-infor { position: absolute; top: 0; right: 0; width: 60px; height: 60px; line-height: 60px; text-align: center; font-size: 24px; } } .main-container { @@ -313,8 +320,8 @@ .main-content { position: absolute; top: 80px; height: calc(100% - 80px); top: 60px; height: calc(100% - 60px); } .main-content.spread {
