Browse Source

摄像机日志

master
yx 2 years ago
parent
commit
422e92fe13
  1. 10
      src/views/data/currdata/index.vue
  2. 423
      src/views/web/camera/index.vue

10
src/views/data/currdata/index.vue

@ -49,8 +49,8 @@
<pagination <pagination
v-show="total" v-show="total"
:total="total" :total="total"
:page.sync="queryParams.pageNum" :page.sync="queryParams.page"
:limit.sync="queryParams.pageSize" :limit.sync="queryParams.limit"
@pagination="getList" @pagination="getList"
/> />
@ -120,8 +120,8 @@ export default {
open: false, open: false,
// //
queryParams: { queryParams: {
pageNum: 1, page: 1,
pageSize: 10, limit: 10,
stnmId: null, stnmId: null,
stnm: null, stnm: null,
mainType: null, mainType: null,
@ -218,7 +218,7 @@ export default {
}, },
/** 搜索按钮操作 */ /** 搜索按钮操作 */
handleQuery() { handleQuery() {
this.queryParams.pageNum = 1; this.queryParams.page = 1;
this.getList(); this.getList();
}, },
/** 重置按钮操作 */ /** 重置按钮操作 */

423
src/views/web/camera/index.vue

@ -2,20 +2,10 @@
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="设备名" prop="name"> <el-form-item label="设备名" prop="name">
<el-input <el-input v-model="queryParams.name" placeholder="请输入设备名" clearable @keyup.enter.native="handleQuery" />
v-model="queryParams.name"
placeholder="请输入设备名"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item> </el-form-item>
<el-form-item label="序列号" prop="devsn"> <el-form-item label="序列号" prop="devsn">
<el-input <el-input v-model="queryParams.devsn" placeholder="请输入设备序列号" clearable @keyup.enter.native="handleQuery" />
v-model="queryParams.devsn"
placeholder="请输入设备序列号"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
@ -25,35 +15,16 @@
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
type="danger" v-hasPermi="['web:camera:remove']">删除</el-button>
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['web:camera:remove']"
>删除</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
type="warning" v-hasPermi="['web:camera:export']">导出</el-button>
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['web:camera:export']"
>导出</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button type="success" plain icon="el-icon-refresh" size="mini" @click="register"
type="success" v-hasPermi="['web:camera:reboot']">重启服务</el-button>
plain
icon="el-icon-refresh"
size="mini"
@click="register"
v-hasPermi="['web:camera:reboot']"
>重启服务</el-button>
</el-col> </el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
@ -62,7 +33,7 @@
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column min-width="60" align="center" label="序号"> <el-table-column min-width="60" align="center" label="序号">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span> <span>{{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="设备名" align="center" prop="name" /> <el-table-column label="设备名" align="center" prop="name" />
@ -73,8 +44,12 @@
<el-table-column label="4G强度" align="center" prop="rssiLevel" /> <el-table-column label="4G强度" align="center" prop="rssiLevel" />
<el-table-column label="状态" align="center" prop="status"> <el-table-column label="状态" align="center" prop="status">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.status == 1"><el-tag type="success">在线</el-tag></span> <span v-if="scope.row.status == 1">
<span v-if="scope.row.status == 0"><el-tag type="info">离线</el-tag></span> <el-tag type="success">在线</el-tag>
</span>
<span v-if="scope.row.status == 0">
<el-tag type="info">离线</el-tag>
</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
@ -93,13 +68,8 @@
@click="showVideo(scope.row)" @click="showVideo(scope.row)"
v-hasPermi="['web:camera:remove']" v-hasPermi="['web:camera:remove']"
>查看视频</el-button> --> >查看视频</el-button> -->
<el-button <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
size="mini" v-hasPermi="['web:camera:edit']">修改</el-button>
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['web:camera:edit']"
>修改</el-button>
<!-- <el-button <!-- <el-button
size="mini" size="mini"
type="text" type="text"
@ -108,46 +78,41 @@
v-hasPermi="['web:camera:remove']" v-hasPermi="['web:camera:remove']"
v-loading.fullscreen.lock="fullscreenLoading" v-loading.fullscreen.lock="fullscreenLoading"
>重启</el-button> --> >重启</el-button> -->
<el-button <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
size="mini" v-hasPermi="['web:camera:remove']">删除</el-button>
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['web:camera:remove']"
>删除</el-button>
<el-dropdown size="mini" @command="(command) => handleCommand(command, scope.row)" v-hasPermi="['web:camera:remove']"> <el-dropdown size="mini" @command="(command) => handleCommand(command, scope.row)"
v-hasPermi="['web:camera:remove']">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
<i class="el-icon-d-arrow-right el-icon--right"></i>更多 <i class="el-icon-d-arrow-right el-icon--right"></i>更多
</span> </span>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item command="refreshRssi" icon="el-icon-s-operation" <el-dropdown-item command="refreshRssi" icon="el-icon-s-operation" v-hasPermi="['web:camera:remove']">
v-hasPermi="['web:camera:remove']">刷新4G信号</el-dropdown-item> 刷新4G信号</el-dropdown-item>
<el-dropdown-item command="openFtpCfg" icon="el-icon-setting" <el-dropdown-item command="openFtpCfg" icon="el-icon-setting" v-hasPermi="['web:camera:remove']">FTP配置
v-hasPermi="['web:camera:remove']">FTP配置</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item command="showVideo" icon="el-icon-view" <el-dropdown-item command="showVideo" icon="el-icon-view" v-hasPermi="['web:camera:remove']">查看视频
v-hasPermi="['web:camera:remove']">查看视频</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item command="reboot" icon="el-icon-refresh" <el-dropdown-item command="showLog" icon="el-icon-view" v-hasPermi="['web:camera:remove']">查看日志
v-hasPermi="['web:camera:remove']">重启</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item command="reboot" icon="el-icon-refresh" v-hasPermi="['web:camera:remove']">重启
</el-dropdown-item>
<el-dropdown-item command="autocfg" icon="el-icon-refresh" v-hasPermi="['web:camera:remove']">自动重启配置
</el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<pagination <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
v-show="total>0" @pagination="getList" />
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改摄像机对话框 --> <!-- 添加或修改摄像机对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body> <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> <el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="序列号" prop="devsn"> <el-form-item label="序列号" prop="devsn">
<el-input v-model="form.devsn" placeholder="" :disabled="true"/> <el-input v-model="form.devsn" placeholder="" :disabled="true" />
</el-form-item> </el-form-item>
<el-form-item label="设备名" prop="name"> <el-form-item label="设备名" prop="name">
<el-input v-model="form.name" placeholder="请输入设备名" /> <el-input v-model="form.name" placeholder="请输入设备名" />
@ -181,7 +146,7 @@
<el-input v-model="ftp.form.password"></el-input> <el-input v-model="ftp.form.password"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="FTP图片路径"> <el-form-item label="FTP图片路径">
<el-input v-model="ftp.form.pathRule" type="textarea" :rows="3" ></el-input> <el-input v-model="ftp.form.pathRule" type="textarea" :rows="3"></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
@ -218,10 +183,71 @@
<el-button type="primary" @click="ftpConfirm"> </el-button> <el-button type="primary" @click="ftpConfirm"> </el-button>
</div> </div>
</el-dialog> </el-dialog>
<!-- 自动重启配置对话框 -->
<el-dialog title="自动重启配置" :visible.sync="restartcfg.open">
<div class="container">
<!-- 表单 -->
<div class="restartcfgform">
<el-form>
<el-form-item label="启用">
<el-switch v-model="restartcfg.run"></el-switch>
</el-form-item>
<el-select v-model="restartcfg.form.uWeekDay" placeholder="选择星期">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="parseInt(item.value)">
</el-option>
</el-select>
<el-time-select v-model="restartcfg.form.uHour" :picker-options="{
start: '00:00',
step: '01:00',
end: '23:00'
}" placeholder="选择时间">
</el-time-select>
</el-form>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="restartcfg.open = false"> </el-button>
<el-button type="primary" @click="restartcfgConfirm"> </el-button>
</div>
</el-dialog>
<!-- 日志详情对话框 -->
<el-dialog title="日志查询" :visible.sync="logform.open">
<div class="container">
<!-- 表单 -->
<el-form :model="logform.queryForm" ref="queryForm" size="small" :inline="true" label-width="68px">
<el-date-picker v-model="timeStage" type="datetimerange" range-separator="" start-placeholder="开始日期"
end-placeholder="结束日期" @change="chooseTimeRange" :picker-options="setDateRange">
</el-date-picker>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button>
</el-form-item>
</el-form>
<el-table :data="logInfoList" stripe style="width: 100%">
<el-table-column label="记录时间" align="center" prop="clogTime" />
<el-table-column label="用户名" align="center" prop="coperUserName" />
<el-table-column label="主类型" align="center" prop="cmainType" />
<el-table-column label="次类型" align="center" prop="csubType" />
<el-table-column label="远程IP" align="center" prop="cremoteIP" />
<el-table-column label="客户端类型" align="center" prop="cclientType" />
</el-table>
</div>
</el-dialog>
</div> </div>
</template> </template>
<script> <script>
import { formatDate } from "../../../utils/common";
export default { export default {
name: "Camera", name: "Camera",
data() { data() {
@ -275,9 +301,85 @@ export default {
isEnable: '', isEnable: '',
devsn: '' devsn: ''
}, },
run: false,
width: '100px' width: '100px'
},
//
restartcfg: {
open: false,
form: {
id: '',
bEnable: '',
uHour: '',
uWeekDay: '',
},
run: false,
},
//
logform: {
open: false,
queryForm: {
id: '',
startTime: '',
endTime: ''
},
run: false,
},
logInfoList: [],
options: [{
value: '0',
label: '星期日'
}, {
value: '1',
label: '星期一'
}, {
value: '2',
label: '星期二'
}, {
value: '3',
label: '星期三'
}, {
value: '4',
label: '星期四'
}, {
value: '5',
label: '星期五'
}, {
value: '6',
label: '星期六'
}],
timeStage: [],
// *** data ***
setDateRange: {
//
onPick: ({
maxDate,
minDate
}) => {
if (minDate) { //
this.choiceDate0 = minDate.getTime();
} else { //
this.choiceDate0 = new Date();
}
if (maxDate) {
this.choiceDate0 = '';
}
},
disabledDate: (time) => {
let choiceDateTime = new Date(this.choiceDate0).getTime(); //
if (this.choiceDate0) {
//1514---
//1414*24*3600*1000=1209600000
return (time.getTime() > (choiceDateTime + 86400000)) || (time.getTime() < (choiceDateTime - 86400000));
} }
},
},
}; };
}, },
created() { created() {
@ -287,8 +389,8 @@ export default {
/** 查询摄像机列表 */ /** 查询摄像机列表 */
async getList() { async getList() {
this.loading = true; this.loading = true;
let res = await this.$axiosGet('/web/camera/list',this.queryParams); let res = await this.$axiosGet('/web/camera/list', this.queryParams);
if(res.code === 0){ if (res.code === 0) {
this.cameraList = res.data; this.cameraList = res.data;
this.total = res.count; this.total = res.count;
} }
@ -339,7 +441,7 @@ export default {
// //
handleSelectionChange(selection) { handleSelectionChange(selection) {
this.ids = selection.map(item => item.id) this.ids = selection.map(item => item.id)
this.single = selection.length!==1 this.single = selection.length !== 1
this.multiple = !selection.length this.multiple = !selection.length
}, },
/** 新增按钮操作 */ /** 新增按钮操作 */
@ -360,9 +462,15 @@ export default {
case "showVideo": case "showVideo":
this.showVideo(row); this.showVideo(row);
break; break;
case "showLog":
this.showLog(row);
break;
case "reboot": case "reboot":
this.reboot(row); this.reboot(row);
break; break;
case "autocfg":
this.autocfg(row);
break;
default: default:
break; break;
} }
@ -371,36 +479,36 @@ export default {
async handleUpdate(row) { async handleUpdate(row) {
this.reset(); this.reset();
const id = row.id || this.ids const id = row.id || this.ids
let res = await this.$axiosGet('/web/camera/info/'+id); let res = await this.$axiosGet('/web/camera/info/' + id);
if(res.code === 0){ if (res.code === 0) {
this.form = res.data; this.form = res.data;
this.open = true; this.open = true;
this.title = "修改"; this.title = "修改";
} }
}, },
async refreshRssi(row){ async refreshRssi(row) {
const id = row.id; const id = row.id;
const status = row.status; const status = row.status;
if(status != 1){ if (status != 1) {
this.$modal.msg("设备未在线"); this.$modal.msg("设备未在线");
return; return;
} }
let res = await this.$axiosGet('/web/camera/refreshRssi/'+id); let res = await this.$axiosGet('/web/camera/refreshRssi/' + id);
if(res.code === 0){ if (res.code === 0) {
this.$modal.msgSuccess("执行成功"); this.$modal.msgSuccess("执行成功");
this.getList(); this.getList();
} }
}, },
async openFtpCfg(row){ async openFtpCfg(row) {
this.ftpCfgReset(); this.ftpCfgReset();
const id = row.id; const id = row.id;
const status = row.status; const status = row.status;
if(status != 1){ if (status != 1) {
this.$modal.msg("设备未在线"); this.$modal.msg("设备未在线");
return; return;
} }
let res = await this.$axiosGet('/camera/ftp/getNetCfg',{'cameraId': id}); let res = await this.$axiosGet('/camera/ftp/getNetCfg', { 'cameraId': id });
if(res.code === 0){ if (res.code === 0) {
this.ftp.form = res.data; this.ftp.form = res.data;
this.ftp.run = this.ftp.form.isEnable == 1; this.ftp.run = this.ftp.form.isEnable == 1;
this.ftp.open = true; this.ftp.open = true;
@ -409,24 +517,57 @@ export default {
// ftp // ftp
async ftpConfirm() { async ftpConfirm() {
this.ftp.form.isEnable = this.ftp.run ? 1 : 0; this.ftp.form.isEnable = this.ftp.run ? 1 : 0;
let res = await this.$axiosPost('/camera/ftp/editNetCfg',this.ftp.form); let res = await this.$axiosPost('/camera/ftp/editNetCfg', this.ftp.form);
if(res.code === 0){ if (res.code === 0) {
this.$modal.msgSuccess("修改成功"); this.$modal.msgSuccess("修改成功");
this.ftp.open = false; this.ftp.open = false;
} }
}, },
//
async autocfg(row) {
this.restartcfg.form.id = row.id;
const status = row.status;
if (status != 1) {
this.$modal.msg("设备未在线");
return;
}
let res = await this.$axiosGet('/web/camera/getautocfg/' + this.restartcfg.form.id);
if (res.code === 0) {
this.restartcfg.form = res.data;
this.restartcfg.form.id = row.id;
this.restartcfg.run = this.restartcfg.form.bEnable == 1;
this.restartcfg.open = true;
}
},
//
async restartcfgConfirm() {
console.log(this.restartcfg.form)
this.restartcfg.form.bEnable = this.restartcfg.run ? 1 : 0;
this.restartcfg.form.uHour = this.restartcfg.form.uHour.substring(0, 2)
let res = await this.$axiosPost('/web/camera/setautocfg', this.restartcfg.form);
if (res.code === 0) {
this.$modal.msgSuccess("修改成功");
this.restartcfg.open = false;
}
},
reboot(row) { reboot(row) {
const id = row.id; const id = row.id;
const status = row.status; const status = row.status;
if(status != 1){ if (status != 1) {
this.$modal.msg("设备未在线"); this.$modal.msg("设备未在线");
return; return;
} }
this.$modal.confirm('是否确认重启?').then(() => { this.$modal.confirm('是否确认重启?').then(() => {
this.exeReboot(id) this.exeReboot(id)
}).catch(() => {}); }).catch(() => { });
}, },
async exeReboot(id){ async exeReboot(id) {
const loading = this.$loading({ const loading = this.$loading({
lock: true, lock: true,
text: 'Loading', text: 'Loading',
@ -434,8 +575,8 @@ export default {
background: 'rgba(0, 0, 0, 0.7)' background: 'rgba(0, 0, 0, 0.7)'
}); });
// this.fullscreenLoading = true; // this.fullscreenLoading = true;
let res = await this.$axiosGet('/web/camera/reboot/'+id); let res = await this.$axiosGet('/web/camera/reboot/' + id);
if(res.code === 0){ if (res.code === 0) {
// this.fullscreenLoading = false; // this.fullscreenLoading = false;
loading.close(); loading.close();
this.$modal.msgSuccess("执行成功,请稍等几分钟后继续操作"); this.$modal.msgSuccess("执行成功,请稍等几分钟后继续操作");
@ -445,32 +586,60 @@ export default {
async showVideo(row) { async showVideo(row) {
const id = row.id const id = row.id
const status = row.status; const status = row.status;
if(status != 1){ if (status != 1) {
this.$modal.msg("设备未在线"); this.$modal.msg("设备未在线");
return; return;
} }
let res = await this.$axiosGet('/web/camera/showVideo/'+id); let res = await this.$axiosGet('/web/camera/showVideo/' + id);
if(res.code === 500){ if (res.code === 500) {
this.$modal.msg(res.msg); this.$modal.msg(res.msg);
} }
}, },
async showLog(row) {
this.logform.queryForm.id = row.id
const status = row.status;
if (status != 1) {
this.$modal.msg("设备未在线");
return;
}
this.logform.open = true;
},
chooseTimeRange() {
if (this.timeStage != null) {
this.logform.queryForm.startTime = formatDate(this.timeStage[0], 'yyyy-MM-dd hh:mm:ss');
this.logform.queryForm.endTime = formatDate(this.timeStage[1], 'yyyy-MM-dd hh:mm:ss');
}
},
async handleQuery() {
let res = await this.$axiosGet('/web/camera/getloginfo', this.logform.queryForm);
if (res.code === 0) {
this.logInfoList = res.data;
console.log(this.logInfoList)
}
},
async register() { async register() {
let res = await this.$axiosGet('/web/camera/register'); let res = await this.$axiosGet('/web/camera/register');
if(res.code === 0){ if (res.code === 0) {
this.$modal.msgSuccess("执行成功"); this.$modal.msgSuccess("执行成功");
} }
}, },
async addMethod(){ async addMethod() {
let res = await this.$axiosPost('/web/camera/add',this.form); let res = await this.$axiosPost('/web/camera/add', this.form);
if(res.code === 0){ if (res.code === 0) {
this.$modal.msgSuccess("新增成功"); this.$modal.msgSuccess("新增成功");
this.open = false; this.open = false;
this.getList(); this.getList();
} }
}, },
async editMethod(){ async editMethod() {
let res = await this.$axiosPost('/web/camera/edit',this.form); let res = await this.$axiosPost('/web/camera/edit', this.form);
if(res.code === 0){ if (res.code === 0) {
this.$modal.msgSuccess("修改成功"); this.$modal.msgSuccess("修改成功");
this.open = false; this.open = false;
this.getList(); this.getList();
@ -491,8 +660,8 @@ export default {
/** 删除按钮操作 */ /** 删除按钮操作 */
async handleDelete(row) { async handleDelete(row) {
const ids = row.id || this.ids; const ids = row.id || this.ids;
let res = await this.$axiosDelete('/web/camera/delete/'+ids); let res = await this.$axiosDelete('/web/camera/delete/' + ids);
if(res.code === 0){ if (res.code === 0) {
this.$modal.msgSuccess("删除成功"); this.$modal.msgSuccess("删除成功");
this.getList(); this.getList();
} }
@ -508,20 +677,24 @@ export default {
</script> </script>
<style scoped> <style scoped>
.container { .container {
display: flex; display: flex;
} }
.ftpform {
.ftpform {
width: 300px; width: 300px;
margin-right: 50px; margin-right: 50px;
} }
.ftpform .el-form {
.ftpform .el-form {
width: 100%; width: 100%;
} }
.table {
.table {
flex: 1; flex: 1;
} }
.head {
.head {
font-size: 24px; font-size: 24px;
line-height: 36px; line-height: 36px;
text-align: center; text-align: center;
@ -532,20 +705,24 @@ export default {
1px 1px 2px hsla(200, 88%, 55%, .22), 1px 1px 2px hsla(200, 88%, 55%, .22),
inset -2px -2px 2px hsla(200, 88%, 55%, .22), inset -2px -2px 2px hsla(200, 88%, 55%, .22),
inset 0 0 1px hsla(200, 88%, 55%, .22); inset 0 0 1px hsla(200, 88%, 55%, .22);
} }
.tips {
.tips {
margin: 10px 0; margin: 10px 0;
} }
.tips span {
.tips span {
display: grid; display: grid;
grid: 1fr/1fr 10px; grid: 1fr/1fr 10px;
} }
.notice {
.notice {
color: #f33; color: #f33;
padding-right: 20px; padding-right: 20px;
display: flex; display: flex;
} }
.notice div:first-child {
.notice div:first-child {
width: 80px; width: 80px;
} }
</style> </style>

Loading…
Cancel
Save