暂存导航栏调整

src/views/abnormalWarning/components/NavbarRight.vue

@@ -1,15 +1,11 @@
 <template>
 	<div class="right-msg" :style="blackTitle ? 'color: #000' : 'color: #fff'">
-		<div class="home-icon" v-if="blackTitle">
-			<!-- <svg-icon
-				icon-class="home"
-				style="font-size: 24px; cursor: pointer"
-				@click="toHome" /> -->
+		<!-- <div class="home-icon" v-if="blackTitle">
 			<svg-icon
 				icon-class="alarm"
 				style="font-size: 24px; cursor: pointer"
 				@click="toHome" />
-		</div>
+		</div> -->
 		<!-- <div class="time-msg">
         <div class="line1">{{timeZone}}&nbsp;&nbsp;&nbsp;&nbsp;{{topTime}}</div>
         <div class="line2">{{topDate}}</div>

src/views/abnormalWarning/components/TopNav.vue

@@ -204,6 +204,12 @@ export default {
 </script>
 
 <style lang="scss">
+.warnmenu-container.el-menu.el-menu--horizontal > .el-menu-item.is-active {
+	border-bottom: none !important;
+}
+.warnmenu-container.el-menu.el-menu--horizontal > .el-submenu.is-active {
+	--theme: none !important;
+}
 .warnmenu-container.el-menu--horizontal > .el-menu-item {
 	float: left;
 	height: 84px !important;

src/views/abnormalWarning/index.vue

@@ -2,23 +2,137 @@
 	<div class="warning-page">
 		<navbar />
 		<div class="main-box">
-			<div>异常警告</div>
+			<div class="title">
+				<span></span>
+				异常警告
+				<div class="return-home" @click="toHome">
+					<svg-icon
+						icon-class="alarm-home"
+						style="font-size: 20px; position: relative; top: 2px" />
+					返回首页
+				</div>
+			</div>
+			<search-bar
+				:formConfigs="formConfig"
+				removeBlue
+				ref="searchBarForm"
+				@headBtnClick="buttonClick" />
+			<base-table
+				:page="1"
+				:limit="100000"
+				:table-props="tableProps"
+				:table-data="list"
+				:max-height="tableH" />
 		</div>
 		<div class="footer">
 			<img src="../../assets/img/alarm-bg.png" alt="" />
+			<div>&copy; 中建材智能自动化研究院有限公司</div>
 		</div>
 	</div>
 </template>
 <script>
 import Navbar from './components/Navbar';
+import moment from 'moment';
+import tableHeightMixin from '@/mixins/tableHeightMixin';
 export default {
 	name: 'AbnormalWarning',
+	mixins: [tableHeightMixin],
 	components: { Navbar },
 	data() {
-		return {};
+		return {
+			formConfig: [
+				{
+					type: 'input',
+					label: '报警来源',
+					placeholder: '报警来源',
+					param: 'content',
+				},
+				{
+					type: 'select',
+					label: '时间段',
+					selectOptions: [],
+					labelField: 'name',
+					valueField: 'id',
+					param: 'typeId',
+					filterable: true,
+				},
+				{
+					type: 'select',
+					label: '报警级别',
+					selectOptions: [],
+					labelField: 'name',
+					valueField: 'id',
+					param: 'typeId',
+					filterable: true,
+				},
+				{
+					type: 'button',
+					btnName: '查询',
+					name: 'search',
+					color: 'primary',
+				},
+			],
+			heightNum: 280,
+			tableProps: [
+				{
+					prop: 'createTime',
+					label: '报警时间',
+					width: 180,
+					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
+				},
+				{
+					prop: 'productionLineName1',
+					label: '报警来源',
+					showOverflowtooltip: true,
+				},
+				{
+					prop: 'productionLineName2',
+					label: '报警类型',
+					showOverflowtooltip: true,
+				},
+				{
+					prop: 'productionLineName3',
+					label: '报警级别',
+					showOverflowtooltip: true,
+				},
+				{
+					prop: 'productionLineName4',
+					label: '报警原因',
+					showOverflowtooltip: true,
+				},
+				{
+					prop: 'sectionName5',
+					label: '报警详情',
+					showOverflowtooltip: true,
+				},
+			],
+			list: [
+				{ productionLineName: 1 },
+				{ productionLineName: 1 },
+				{ productionLineName: 1 },
+				{ productionLineName: 1 },
+				{ productionLineName: 1 },
+				{ productionLineName: 1 },
+				{ productionLineName: 1 },
+				{ productionLineName: 1 },
+				{ productionLineName: 1 },
+				{ productionLineName: 1 },
+				{ productionLineName: 1 },
+				{ productionLineName: 1 },
+				{ productionLineName: 1 },
+				{ productionLineName: 1 },
+				{ productionLineName: 1 },
+				{ productionLineName: 1 },
+			],
+		};
 	},
 	created() {},
-	methods: {},
+	methods: {
+		buttonClick(val) {},
+		toHome() {
+			this.$router.push({ path: '/' });
+		},
+	},
 };
 </script>
 <style lang="scss" scoped>
@@ -34,6 +148,29 @@ export default {
 		margin: 16px auto 0;
 		z-index: 10;
 		padding: 24px 32px;
+		.title {
+			font-size: 16px;
+			color: #000000;
+			position: relative;
+			cursor: pointer;
+			span {
+				display: inline-block;
+				float: left;
+				width: 4px;
+				height: 16px;
+				background-color: #0b58ff;
+				border-radius: 1px;
+				margin-right: 8px;
+				margin-top: 4px;
+			}
+			.return-home {
+				position: absolute;
+				color: rgba(0, 0, 0, 0.3);
+				font-size: 14px;
+				right: 0px;
+				top: 0px;
+			}
+		}
 	}
 	.footer {
 		position: fixed;
@@ -44,6 +181,16 @@ export default {
 			width: 100%;
 			height: 220px;
 		}
+		div {
+			width: 100%;
+			color: red;
+			position: absolute;
+			bottom: 10px;
+			text-align: center;
+			font-size: 12px;
+			color: #c7c7c7;
+			letter-spacing: 1px;
+		}
 	}
 }
 </style>