web/apsDashboard-1.git

New file
			@@ -0,0 +1,190 @@
			<template>
			<div class="s-log-management">
			<div class="top">
			<b>日志类型:</b>
			<el-select v-model="logValue" placeholder="请选择" size="small">
			<el-option
			v-for="item in logOptions"
			:key="item.value"
			:label="item.label"
			:value="item.value"
			></el-option>
			</el-select>
			<b>时间:</b>
			<el-date-picker
			v-model="timeValue"
			type="datetimerange"
			size="small"
			range-separator="至"
			start-placeholder="开始日期"
			end-placeholder="结束日期"
			></el-date-picker>
			<el-input
			v-model="searchValue"
			placeholder="请输入内容"
			clearable
			style="width: 150px;margin: 0px 10px;"
			size="small"
			></el-input>
			<el-button type="primary" size="small">搜索</el-button>
			<el-button type="danger" size="small" @click="delSelected">批量删除</el-button>
			<el-button type="text" size="small" style="font-size: 13px;font-weight: 600;">导出</el-button>
			</div>
			<div class="foot-table s-table">
			<el-table
			ref="multipleTable"
			highlight-current-row
			:data="tableData"
			style="width: 100%"
			:header-cell-style="{background:'#f8f8f8',color:'#222222'}"
			@selection-change="handleSelectionChange"
			>
			<el-table-column type="selection" width="55"></el-table-column>
			<el-table-column :align="'center'" sortable prop="index" label="序号"></el-table-column>
			<el-table-column :align="'center'" sortable prop="logtype" label="日志类型"></el-table-column>
			<el-table-column :align="'center'" sortable prop="username" label="用户名"></el-table-column>
			<el-table-column :align="'center'" sortable prop="ipaddress" label="IP地址"></el-table-column>
			<el-table-column :align="'center'" sortable prop="operation" label="操作功能"></el-table-column>
			<el-table-column :align="'center'" sortable prop="operatetime" label="操作时间"></el-table-column>
			<el-table-column :align="'center'" sortable prop="operateinfo" label="操作信息"></el-table-column>
			<el-table-column label="操作" :align="'center'">
			<template slot-scope="scope">
			<el-button
			type="text"
			style="color: red;font-size:16px"
			@click="handleDelete(scope.$index, scope.row)"
			icon="el-icon-delete"
			></el-button>
			</template>
			</el-table-column>
			</el-table>
			</div>
			</div>
			</template>

			<script>
			export default {
			data() {
			return {
			tableData: [
			{
			index: "1",
			logtype: "异常",
			username: "admin",
			ipaddress: "192.168.10.110",
			operation: "添加摄像机",
			operatetime: "2019-5-31 16:38:21",
			operateinfo: "添加操作"
			},
			{
			index: "2",
			logtype: "信息",
			username: "admin",
			ipaddress: "192.168.10.108",
			operation: "删除摄像机",
			operatetime: "2019-5-31 16:38:21",
			operateinfo: "添加操作"
			},
			{
			index: "3",
			logtype: "操作",
			username: "admin",
			ipaddress: "192.168.10.110",
			operation: "添加摄像机",
			operatetime: "2019-5-31 16:38:21",
			operateinfo: "添加操作"
			},
			{
			index: "4",
			logtype: "异常",
			username: "admin",
			ipaddress: "192.168.10.110",
			operation: "添加摄像机",
			operatetime: "2019-5-31 16:38:21",
			operateinfo: "添加操作"
			},
			{
			index: "5",
			logtype: "异常",
			username: "admin",
			ipaddress: "192.168.10.110",
			operation: "删除摄像机",
			operatetime: "2019-5-31 16:38:21",
			operateinfo: "添加操作"
			},
			{
			index: "6",
			logtype: "异常",
			username: "admin",
			ipaddress: "192.168.10.110",
			operation: "添加摄像机",
			operatetime: "2019-5-31 16:38:21",
			operateinfo: "添加操作"
			}
			],
			multipleSelection: [],
			logOptions: [
			{
			value: "全部类型",
			label: "全部类型"
			},
			{
			value: "其他类型",
			label: "其他类型"
			}
			],
			logValue: "全部类型",
			timeValue: [
			new Date(2000, 10, 10, 10, 10),
			new Date(2000, 10, 11, 10, 10)
			],
			searchValue: ""
			};
			},
			methods: {
			handleDelete(index, row) {
			console.log(index, row);
			},
			handleSelectionChange(val) {
			this.multipleSelection = val;
			},
			delSelected() {
			console.log(this.multipleSelection);
			}
			}
			};
			</script>
			<style lang="scss">
			.s-log-management {
			height: 100%;
			width: 100%;
			.top {
			width: 100%;
			margin-top: 10px;
			margin-bottom: 20px;
			overflow-y: auto;
			min-width: 1156px;
			height: 40px;
			text-align: left;
			b {
			padding: 0px 10px;
			}
			}
			.export {
			display: inline-block;
			padding-right: 10px;
			box-sizing: border-box;
			margin-top: 20px;
			b:hover {
			color: #2249b4;
			}
			}
			.clear-searching {
			cursor: pointer;
			text-decoration: underline;
			width: 40px;
			font-size: 13px;
			color: #3d68e1;
			}
			}
			</style>