From 4aac1609c95a097de0e8da843a9ed2f211303d4e Mon Sep 17 00:00:00 2001 From: Surpriseplus <845948745@qq.com> Date: 星期四, 27 十月 2022 14:21:37 +0800 Subject: [PATCH] 黑白名单,系统配置,综合展示权限管理添加 --- src/views/maintenance/logLog.vue | 254 +++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 198 insertions(+), 56 deletions(-) diff --git a/src/views/maintenance/logLog.vue b/src/views/maintenance/logLog.vue index baa9b9e..ce2b45a 100644 --- a/src/views/maintenance/logLog.vue +++ b/src/views/maintenance/logLog.vue @@ -8,79 +8,114 @@ ></My-bread> <el-divider /> <div class="inquire"> + <div class="herder_box"> + {{ $t('operatManage.operationLogObj.queryRegion') }} + </div> <el-form ref="formData1" :model="form" :inline="true"> - <!-- 鐢ㄦ埛鍚� --> - <el-form-item :label="$t('common.username')" prop="name"> + <el-form-item + :label="$t('operatManage.operationLogObj.username')" + prop="uname" + > <el-input - style="width: 300px" - v-model="form.name" - :placeholder="$t('common.pleaseInput')" + v-model="form.uname" + :placeholder="$t('operatManage.operationLogObj.pleaseInput')" /> </el-form-item> - <!-- 鎵�灞炵郴缁� --> - <el-form-item :label="$t('loglog.systematic')" prop="region"> - <el-select v-model="form.region" :placeholder="$t('common.choose')"> - <el-option label="Zone one" value="shanghai" /> - <el-option label="Zone two" value="beijing" /> + + <el-form-item + :label="$t('operatManage.operationLogObj.operationType')" + prop="type" + > + <el-select + clearable + v-model="form.type" + :placeholder="$t('operatManage.operationLogObj.pleaseSelect')" + > + <el-option :label="$t('loglog.login')" value="1" /> + <el-option :label="$t('loglog.checkout')" value="2" /> + <el-option :label="$t('loglog.logout')" value="3" /> </el-select> </el-form-item> - <!-- 鎿嶄綔鏃堕棿 --> - <el-form-item :label="$t('loglog.operationtime')"> - <el-col :span="11"> - <el-date-picker - type="date" - :placeholder="$t('common.selectdate')" - v-model="form.date1" - style="width: 100%" - ></el-date-picker> - </el-col> - <el-col class="line text-center" :span="2">-</el-col> - <el-col :span="11"> - <el-date-picker - type="date" - :placeholder="$t('common.selectdate')" - v-model="form.date2" - style="width: 100%" - ></el-date-picker> - </el-col> + <el-form-item + prop="start" + :label="$t('operatManage.operationLogObj.startTime')" + > + <el-date-picker + format="yyyy-MM-dd HH:mm:ss" + value-format="yyyy-MM-dd HH:mm:ss" + v-model="form.start" + style="width: 100%" + type="datetime" + :placeholder="$t('operatManage.operationLogObj.optionDate')" + > + </el-date-picker> </el-form-item> - <!-- 鏌ヨ 娓呯┖ --> + <el-form-item + prop="end" + :label="$t('operatManage.operationLogObj.endTime')" + > + <el-date-picker + format="yyyy-MM-dd HH:mm:ss" + value-format="yyyy-MM-dd HH:mm:ss" + v-model="form.end" + style="width: 100%" + type="datetime" + :placeholder="$t('operatManage.operationLogObj.optionDate')" + > + </el-date-picker> + </el-form-item> <el-form-item> - <el-button @click="onSubmit">{{ $t("common.iquery") }}</el-button> - <el-button @click="onEmpty('formData1')">{{ - $t("common.empty") + <el-button @click="onSubmit" icon="el-icon-search">{{ + $t('operatManage.operationLogObj.inquire') + }}</el-button> + <el-button @click="onEmpty('formData1')" icon="el-icon-delete">{{ + $t('operatManage.operationLogObj.empty') }}</el-button> </el-form-item> </el-form> </div> <!-- 琛ㄦ牸鏄剧ず --> <div class="table_box"> - <el-table :data="tableData" stripe style="width: 100%"> + <el-table :data="tableData" stripe style="width: 100%" height="85%"> <el-table-column width="150" type="index" :label="$t('loglog.serialnumber')" /> - <el-table-column prop="name" :label="$t('loglog.coverage')" /> - <el-table-column prop="ip" :label="$t('loglog.systematic')" /> - <el-table-column prop="loginaddress" :label="$t('loglog.ipadress')" /> - <el-table-column prop="browser" :label="$t('loglog.operationtime')" /> + <el-table-column prop="uname" :label="$t('loglog.username')" /> <el-table-column - prop="operatingsystem" + prop="appid" + :label="$t('loglog.applicationProgram')" + :formatter="formatAppid" + /> + <el-table-column prop="ip" :label="$t('loglog.ipadress')" /> + <el-table-column prop="descr" :label="$t('loglog.describe')" /> + <el-table-column + prop="optime" + :formatter="formatData" + :label="$t('loglog.operationtime')" + /> + <el-table-column + prop="type" + :formatter="formatType" :label="$t('loglog.operationtype')" /> - <el-table-column prop="state" :label="$t('loglog.operationStatus')" /> + <el-table-column + prop="status" + :formatter="formatStatus" + :label="$t('loglog.operationStatus')" + /> </el-table> <!-- 鍒嗛〉 --> <div style="margin-top: 40px" class="pagination_box"> <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" - :current-page="currentPage4" + :current-page="listData.pageIndex" :page-sizes="[10, 20, 30, 40]" - :page-size="10" + :page-size="listData.pageSize" layout="total, sizes, prev, pager, next, jumper" - :total="9" + :total="count" > </el-pagination> </div> @@ -89,8 +124,8 @@ </template> <script> -import MyBread from "../../components/MyBread.vue"; - +import MyBread from '../../components/MyBread.vue'; +import { loginSelectByPageAndCount } from '../../api/api'; export default { //import寮曞叆鐨勭粍浠堕渶瑕佹敞鍏ュ埌瀵硅薄涓墠鑳戒娇鐢� components: { @@ -100,29 +135,128 @@ data() { return { currentPage4: 1, - form: { - name: "", - region: "", - jurisdiction: "", - }, + form: {}, tableData: [], + listData: { + pageIndex: 1, + pageSize: 10, + }, + count: 0, }; }, methods: { + //鏍煎紡鍖栧垪琛� + formatType(row, column) { + let data; + switch (row[column.property]) { + case 1: + data = '鐧诲綍'; + break; + case 2: + data = '鏍¢獙'; + break; + case 3: + data = '鐧诲嚭'; + break; + } + return data; + }, + formatStatus(row, column) { + let data; + switch (row[column.property]) { + case 1: + data = '鎴愬姛'; + break; + case 0: + data = '澶辫触'; + break; + } + return data; + }, + formatAppid(row, column) { + let data; + switch (row[column.property]) { + case 1: + data = '绠¢亾鍩虹澶ф暟鎹钩鍙�'; + break; + case 2: + data = '澶栭儴绯荤粺闆嗘垚'; + break; + } + return data; + }, + //鏍煎紡鍖栨椂闂� + add0(m) { + return m < 10 ? '0' + m : m; + }, + //鏍煎紡鍖栨椂闂� + format(shijianchuo) { + //shijianchuo鏄暣鏁帮紝鍚﹀垯瑕乸arseInt杞崲 + var time = new Date(shijianchuo); + var y = time.getFullYear(); + var m = time.getMonth() + 1; + var d = time.getDate(); + var h = time.getHours(); + var mm = time.getMinutes(); + var s = time.getSeconds(); + return ( + y + '-' + this.add0(m) + '-' + this.add0(d) + // " " + + // this.add0(h) + + // ":" + + // this.add0(mm) + + // ":" + + // this.add0(s) + ); + }, + //鏍煎紡鍖栧垪琛� + formatData(row, column) { + let data = row[column.property]; + if (data == null) { + return data; + } + return this.format(data); + }, handleSizeChange(val) { - console.log(`姣忛〉 ${val} 鏉); + this.listData.pageSize = val; + this.getList(); }, handleCurrentChange(val) { - console.log(`褰撳墠椤�: ${val}`); + this.listData.pageIndex = val; + this.getList(); }, onSubmit() { - console.log("submit!"); + this.listData = { ...this.listData, ...this.form }; + // console.log(this.listData) + this.getList(); }, onEmpty(formData1) { - this.$refs[formData1].resetFields()//閲嶇疆琛ㄥ崟鏁版嵁 - } + this.$refs[formData1].resetFields(); //閲嶇疆琛ㄥ崟鏁版嵁 + // this.form = {}; + this.form.start = null; + this.form.end = null; + }, + async getList() { + const data = await loginSelectByPageAndCount(this.listData); + + if (data.code != 200) { + return this.$message.error('鍒楄〃璋冪敤澶辫触'); + } + this.tableData = data.result; + this.count = data.count; + }, }, - created() { }, + created() { + var val = this.$store.state.currentPerms; + var permsEntity = this.$store.state.permsEntity; + for (var i = 0; i < permsEntity.length; i++) { + if (permsEntity[i].perms == val) { + // this.showPermsMenu(permsEntity[i]); + console.log(permsEntity[i].tag); + } + } + this.getList(); + }, }; </script> <style lang="less" scoped> @@ -140,12 +274,20 @@ border-radius: 5px; border: 1px solid rgb(202, 201, 204); margin-bottom: 20px; + .herder_box { + padding: 10px; + border-bottom: 1px solid #ccc; + margin-bottom: 20px; + font-size: 14px; + } } .table_box { padding: 10px; background: #fff; border-radius: 5px; border: 1px solid rgb(202, 201, 204); + overflow: auto; + height: 70%; } .text-center { text-align: center; -- Gitblit v1.9.3