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/blackwhiteList.vue | 493 ++++++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 403 insertions(+), 90 deletions(-) diff --git a/src/views/maintenance/blackwhiteList.vue b/src/views/maintenance/blackwhiteList.vue index c646894..65e64f6 100644 --- a/src/views/maintenance/blackwhiteList.vue +++ b/src/views/maintenance/blackwhiteList.vue @@ -59,29 +59,42 @@ :placeholder="$t('operatManage.BWL.interceptionNumber')" /> </el-form-item> + <el-form-item> - <el-button @click="onSubmit">{{ - $t("operatManage.BWL.change") + <el-button + ><i class="el-icon-search"></i> {{ + $t('operatManage.BWL.search') + }}</el-button + > + </el-form-item> + <el-form-item> + <el-button + ><i class="el-icon-delete"></i> {{ + $t('operatManage.BWL.reset') + }}</el-button + > + </el-form-item> + <el-form-item> + <el-button v-if="menuStatus.insert" @click="showInsertdialog(1)">{{ + $t('common.append') }}</el-button> </el-form-item> <el-form-item> - <el-button @click="onSubmit" - ><i class="el-icon-search"></i> {{ - $t("operatManage.BWL.search") - }}</el-button - > - </el-form-item> - <el-form-item> - <el-button @click="onSubmit" - ><i class="el-icon-delete"></i> {{ - $t("operatManage.BWL.reset") - }}</el-button - > + <el-button v-if="menuStatus.delete" @click="delBWList">{{ + $t('common.delete') + }}</el-button> </el-form-item> </el-form> </div> <div class="table_box"> - <el-table :data="tableData" stripe style="width: 100%" height="99%"> + <el-table + :data="BTableData" + stripe + @selection-change="blackSelectionChange" + style="width: 100%" + height="85%" + > + <el-table-column type="selection" width="55" /> <el-table-column align="center" type="index" @@ -89,56 +102,61 @@ width="70px" /> <el-table-column - align="center" - prop="serviceName" - :label="$t('operatManage.BWL.serviceName')" + prop="ip" + :label="$t('operatManage.BWL.whiteListIP')" /> <el-table-column - align="center" - prop="accessSourceSystem" - :label="$t('operatManage.BWL.accessSourceSystem')" + prop="visit" + :label="$t('operatManage.BWL.PageView')" /> <el-table-column - align="center" - prop="IPRequest" - :label="$t('operatManage.BWL.IPRequest')" + prop="descr" + :label="$t('operatManage.BWL.description')" /> <el-table-column - align="center" - prop="servicesRequestUrl" - :label="$t('operatManage.BWL.servicesRequestUrl')" - /> - - <el-table-column - align="center" - prop="resourceIDRequest" - :label="$t('operatManage.BWL.resourceIDRequest')" + prop="createName" + :label="$t('operatManage.BWL.creator')" /> <el-table-column - align="center" - prop="serviceSystemRequest" - :label="$t('operatManage.BWL.serviceSystemRequest')" + :formatter="formatData" + prop="createTime" + :label="$t('operatManage.BWL.creationTime')" /> <el-table-column - align="center" - prop="blackListStatus" - :label="$t('operatManage.BWL.blackListStatus')" + prop="updateName" + :label="$t('operatManage.BWL.update')" /> <el-table-column - align="center" - prop="operate" - :label="$t('operatManage.BWL.operate')" + :formatter="formatData" + prop="updateTime" + :label="$t('operatManage.BWL.UpdateTime')" /> + <el-table-column + v-if="menuStatus.update" + :label="$t('operatManage.tokentoolObj.operation')" + width="320" + align="center" + > + <template slot-scope="scope"> + <el-button + @click="handleEdit(scope.$index, scope.row)" + type="warning" + plain + size="small" + >{{ $t('common.update') }}</el-button + > + </template> + </el-table-column> </el-table> <div style="margin-top: 40px" class="pagination_box"> <el-pagination - @size-change="handleSizeChange" - @current-change="handleCurrentChange" - :current-page="currentPage" + @size-change="BhandleSizeChange" + @current-change="BhandleCurrentChange" + :current-page="BListData.pageIndex" :page-sizes="[10, 20, 30, 40]" - :page-size="10" + :page-size="BListData.pageSize" layout="total, sizes, prev, pager, next, jumper" - :total="0" + :total="Bcount" > </el-pagination> </div> @@ -172,21 +190,32 @@ <el-form-item> <el-button @click="onSubmit" ><i class="el-icon-search"></i> {{ - $t("operatManage.BWL.search") + $t('operatManage.BWL.search') }}</el-button > </el-form-item> <el-form-item> <el-button @click="onSubmit" ><i class="el-icon-delete"></i> {{ - $t("operatManage.BWL.reset") + $t('operatManage.BWL.reset') }}</el-button > + </el-form-item> + <el-form-item> + <el-button v-if="menuStatus.insert" @click="showInsertdialog(2)">{{ + $t('common.append') + }}</el-button> + </el-form-item> + <el-form-item> + <el-button v-if="menuStatus.delete" @click="delBWList">{{ + $t('common.delete') + }}</el-button> </el-form-item> </el-form> </div> <div class="table_box"> - <el-table :data="tableData" stripe style="width: 100%" height="99%"> + <el-table :data="WTableData" stripe @selection-change="blackSelectionChange" style="width: 100%" height="85%"> + <el-table-column type="selection" width="55" /> <el-table-column align="center" type="index" @@ -194,56 +223,149 @@ width="70px" /> <el-table-column - align="center" - prop="whiteListIP" + prop="ip" :label="$t('operatManage.BWL.whiteListIP')" /> <el-table-column - align="center" - prop="effectiveDate" - :label="$t('operatManage.BWL.effectiveDate')" + prop="visit" + :label="$t('operatManage.BWL.PageView')" /> <el-table-column - align="center" - prop="requestUser" - :label="$t('operatManage.BWL.requestUser')" + prop="descr" + :label="$t('operatManage.BWL.description')" /> <el-table-column - align="center" - prop="tokenInfo" - :label="$t('operatManage.BWL.tokenInfo')" + prop="createName" + :label="$t('operatManage.BWL.creator')" /> <el-table-column - align="center" - prop="whiteListStatus" - :label="$t('operatManage.BWL.whiteListStatus')" + :formatter="formatData" + prop="createTime" + :label="$t('operatManage.BWL.creationTime')" /> <el-table-column - align="center" - prop="operate" - :label="$t('operatManage.BWL.operate')" + prop="updateName" + :label="$t('operatManage.BWL.update')" /> + <el-table-column + :formatter="formatData" + prop="updateTime" + :label="$t('operatManage.BWL.UpdateTime')" + /> + <el-table-column + v-if="menuStatus.update" + :label="$t('operatManage.tokentoolObj.operation')" + width="320" + align="center" + > + <template slot-scope="scope"> + <el-button + @click="handleEdit(scope.$index, scope.row)" + type="warning" + plain + size="small" + >{{ $t('common.update') }}</el-button + > + </template> + </el-table-column> + </el-table> </el-table> <div style="margin-top: 40px" class="pagination_box"> <el-pagination - @size-change="handleSizeChange" - @current-change="handleCurrentChange" - :current-page="currentPage" + @size-change="WhandleSizeChange" + @current-change="WhandleCurrentChange" + :current-page="WListData.pageIndex" :page-sizes="[10, 20, 30, 40]" - :page-size="10" + :page-size="WListData.pageSize" layout="total, sizes, prev, pager, next, jumper" - :total="0" + :total="Wcount" > </el-pagination> </div></div ></el-tab-pane> </el-tabs> + <el-dialog + :title="$t('common.append')" + style="overflow: hidden" + :visible.sync="InsertFormdialog" + width="30%" + > + <el-form ref="insertform" :model="insertform"> + <el-form-item :label-width="formLabelWidth" label="IP鍦板潃"> + <el-input + v-model="insertform.ip" + :placeholder="$t('common.pleaseInput')" + /> + </el-form-item> + <el-form-item :label-width="formLabelWidth" label="璁块棶娆℃暟"> + <el-input + v-model="insertform.visit" + :placeholder="$t('common.pleaseInput')" + /> + </el-form-item> + <el-form-item :label-width="formLabelWidth" label="鎻忚堪"> + <el-input + v-model="insertform.descr" + :placeholder="$t('common.pleaseInput')" + /> + </el-form-item> + </el-form> + <div slot="footer" class="dialog-footer"> + <el-button @click="insertFromDataClose">{{ + $t('common.close') + }}</el-button> + <el-button @click="insertFromData" type="primary">{{ + $t('common.confirm') + }}</el-button> + </div> + </el-dialog> + <el-dialog + :title="$t('common.update')" + style="overflow: hidden" + :visible.sync="updateFormdialog" + width="30%" + > + <el-form ref="editfrom" :model="editfrom"> + <el-form-item :label-width="formLabelWidth" label="IP鍦板潃"> + <el-input + v-model="editfrom.ip" + :placeholder="$t('common.pleaseInput')" + /> + </el-form-item> + <el-form-item :label-width="formLabelWidth" label="璁块棶娆℃暟"> + <el-input + v-model="editfrom.visit" + :placeholder="$t('common.pleaseInput')" + /> + </el-form-item> + <el-form-item :label-width="formLabelWidth" label="鎻忚堪"> + <el-input + v-model="editfrom.descr" + :placeholder="$t('common.pleaseInput')" + /> + </el-form-item> + </el-form> + <div slot="footer" class="dialog-footer"> + <el-button @click="editFromDataClose">{{ + $t('common.close') + }}</el-button> + <el-button @click="editFromData" type="primary">{{ + $t('common.confirm') + }}</el-button> + </div> + </el-dialog> </div> </template> - - <script> -import MyBread from "../../components/MyBread.vue"; +<script> +import MyBread from '../../components/MyBread.vue'; +import { + blacklistSelectByPageAndCount, + blacklistAppend, + deletelacklist, + updateblacklist, + blacklistSelectCount, +} from '../../api/api'; export default { //import寮曞叆鐨勭粍浠堕渶瑕佹敞鍏ュ埌瀵硅薄涓墠鑳戒娇鐢� components: { @@ -252,39 +374,226 @@ data() { return { - activeName: "first", + menuStatus: { + delete: false, + insert: false, + update: false, + }, + updateFormdialog: false, + multipleSelection: [], + formLabelWidth: '100px', + insertform: {}, + editfrom: {}, + InsertFormdialog: false, + activeName: 'first', currentPage: 1, form: { - blackListIP: "", - IPState: "", - interceptionCycle: "", - unit: "", - interceptionNumber: "", + blackListIP: '', + IPState: '', + interceptionCycle: '', + unit: '', + interceptionNumber: '', }, - tableData: [], + BTableData: [], + WTableData: [], + BListData: { + pageIndex: 1, + pageSize: 10, + type: 1, + }, + WListData: { + pageIndex: 1, + pageSize: 10, + type: 2, + }, + Wcount: 0, + Bcount: 0, }; }, methods: { + editFromDataClose() { + this.updateFormdialog = false; + this.editfrom = {}; + }, + async editFromData() { + var data = await updateblacklist(this.editfrom); + if (data.code == 200) { + this.updateFormdialog = false; + this.editfrom = {}; + this.$message({ + message: '淇敼鎴愬姛锛�', + type: 'success', + }); + this.BGetList(); + this.WGetList(); + } else { + this.$message({ + message: '淇敼澶辫触锛�', + type: 'warning', + }); + } + }, + handleEdit(index, row) { + this.editfrom = row; + this.updateFormdialog = true; + }, + + async delBWList() { + var std = []; + for (var i in this.multipleSelection) { + std.push(this.multipleSelection[i].id); + } + //deletes + const data = await deletelacklist({ ids: std.toString() }); + if (data.code == 200) { + this.$message({ + message: '鍒犻櫎鎴愬姛锛�', + type: 'success', + }); + this.BGetList(); + this.WGetList(); + } else { + this.$message({ + message: '鍒犻櫎澶辫触锛�', + type: 'warning', + }); + } + }, + blackSelectionChange(val) { + this.multipleSelection = val; + }, + showInsertdialog(res) { + this.insertform.type = res; + this.InsertFormdialog = true; + }, + insertFromDataClose() { + this.InsertFormdialog = false; + this.insertform = {}; + }, + async insertFromData() { + var count = await blacklistSelectCount(this.insertform); + if (parseInt(count.result) != 0) return; + + var data = await blacklistAppend(this.insertform); + if (data.code == 200) { + this.InsertFormdialog = false; + this.insertform = {}; + this.$message({ + message: '娣诲姞鎴愬姛锛�', + type: 'success', + }); + this.BGetList(); + this.WGetList(); + } else { + this.$message({ + message: '娣诲姞澶辫触锛�', + type: 'warning', + }); + } + }, + //鏍煎紡鍖栨椂闂� + 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); + }, handleClick(tab, event) { console.log(tab, event); }, - handleSizeChange(val) { - console.log(`姣忛〉 ${val} 鏉); + WhandleSizeChange(val) { + this.WListData.pageSize = val; + this.getList(); }, - handleCurrentChange(val) { - console.log(`褰撳墠椤�: ${val}`); + WhandleCurrentChange(val) { + this.WListData.pageIndex = val; + this.getList(); + }, + BhandleSizeChange(val) { + this.BListData.pageSize = val; + this.getList(); + }, + BhandleCurrentChange(val) { + this.BListData.pageIndex = val; + this.getList(); }, onSubmit() { - console.log("submit!"); + console.log('submit!'); }, resetForm(formName) { this.$refs[formName].resetFields(); }, + async WGetList() { + const data = await blacklistSelectByPageAndCount(this.WListData); + + if (data.code != 200) { + return this.$message.error('鍒楄〃璋冪敤澶辫触'); + } + this.WTableData = data.result; + this.Wcount = data.count; + }, + async BGetList() { + const data = await blacklistSelectByPageAndCount(this.BListData); + if (data.code != 200) { + return this.$message.error('鍒楄〃璋冪敤澶辫触'); + } + + this.BTableData = data.result; + this.Bcount = data.count; + }, + showPermsMenu(res) { + switch (res.tag) { + case '/delete': + this.menuStatus.delete = true; + break; + case '/insert': + this.menuStatus.insert = true; + break; + case '/update': + this.menuStatus.update = true; + break; + } + }, }, - 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]); + } + } + this.BGetList(); + this.WGetList(); + }, }; </script> - <style lang="less" scoped> +<style lang="less" scoped> //@import url(); 寮曞叆鍏叡css绫� .logLog_box { background: rgb(240, 242, 245); @@ -308,10 +617,14 @@ background: #fff; border-radius: 5px; border: 1px solid rgb(202, 201, 204); + overflow: auto; + height: 70%; } .text-center { text-align: center; } + .el-tab-pane { + height: 82vh; + } } </style> - \ No newline at end of file -- Gitblit v1.9.3