Commit f4a77a56 authored by 李鹏 's avatar 李鹏

admin interface

parent 50614499
......@@ -12,7 +12,7 @@ module.exports = {
htmlWhitespaceSensitivity: "css",
insertPragma: false,
jsxSingleQuote: false,
printWidth: 120, // 如果属性过多需要换行,减少该值
printWidth: 100, // 如果属性过多需要换行,减少该值
proseWrap: "preserve",
quoteProps: "as-needed",
requirePragma: false,
......
......@@ -1573,7 +1573,7 @@ border-radius:8px;
}
.forget_psd {
font-size: 14px;
color: #3759be;
color: #3759be;
cursor: pointer;
}
......
......@@ -50,9 +50,17 @@
</template>
<script setup>
import { watch, ref } from "vue";
import { watch, ref, nextTick } from "vue";
import { selectTableMixin } from "./hook/mixin-select-table";
let { nowSelectData, allSelectData, selectData, initSelectTableData, runPage, dealSelectData } = selectTableMixin();
const {
nowSelectData,
allSelectData,
initAllSelectData,
selectData,
initSelectTableData,
runPage,
dealSelectData,
} = selectTableMixin();
const props = defineProps({
height: {
......@@ -71,9 +79,6 @@ const props = defineProps({
type: Boolean,
default: false,
},
// selectable: {
// type: Function,
// },
isIndex: {
type: Boolean,
default: false,
......@@ -95,14 +100,30 @@ const props = defineProps({
default: false,
}, // 多选框是否禁用
canEditFlag: {
typr: Boolean,
type: String,
default: "",
}, // 决定多选框是否禁用的字段
//初始表格选中数据
originSelectedData: {
type: Array,
default: () => [],
},
});
const table = ref(null);
const emit = defineEmits(["selectAc", "select"]);
watch(
() => props.originSelectedData,
(val) => {
if (val.length) {
initAllSelectData(props.originSelectedData);
}
},
{
immediate: true,
}
);
watch(
() => props.rows,
(n, o) => {
......@@ -116,6 +137,9 @@ watch(
}
});
}
},
{
immediate: true,
}
);
......@@ -123,14 +147,19 @@ const toggleRowSelection = (row, flag = true) => {
table.value.toggleRowSelection(row, flag);
};
const selectAction = (selection) => {
emit("selectAc", { allLength: Object.keys(allSelectData).length + nowSelectData.length, selection });
nextTick(() => {
emit("selectAc", {
allLength: Object.keys(allSelectData.value).length + nowSelectData.value.length,
selection,
});
});
};
const clearSelection = () => {
table.value.clearSelection();
emit("select", { allLength: Object.keys(allSelectData).length + nowSelectData.length, selection: [] });
};
const setSelectedRow = (row) => {
toggleRowSelection(row);
emit("select", {
allLength: Object.keys(allSelectData.value).length + nowSelectData.value.length,
selection: [],
});
};
const toggleRowArrSelection = (arr, flag = true) => {
arr.forEach((e) => {
......@@ -139,16 +168,22 @@ const toggleRowArrSelection = (arr, flag = true) => {
};
const selectActionRow = (selection, row) => {
selectData(selection);
emit("select", { allLength: Object.keys(allSelectData).length + nowSelectData.length, selection });
emit("select", {
allLength: Object.keys(allSelectData.value).length + nowSelectData.value.length,
selection,
});
};
const selectActionAll = (selection) => {
selectData(selection);
emit("select", { allLength: Object.keys(allSelectData).length + nowSelectData.length, selection });
emit("select", {
allLength: Object.keys(allSelectData.value).length + nowSelectData.value.length,
selection,
});
};
const clearTable = () => {
//清除选中数据,在页面状态更新时使用
allSelectData = {};
nowSelectData = [];
allSelectData.value = {};
nowSelectData.value = [];
clearSelection();
};
const tableRowClassName = ({ row, rowIndex }) => {
......@@ -172,5 +207,6 @@ const selectable = (row, index) => {
defineExpose({
clearTable,
toggleRowSelection,
dealSelectData,
});
</script>
import { reactive, toRefs,useAttrs } from 'vue'
export function selectTableMixin(){
import { reactive, toRefs, useAttrs } from "vue";
export function selectTableMixin() {
const state = reactive({
nowSelectData:[],
allSelectData:{}
})
const attrs = useAttrs()
// const nowSelectData = reactive([])
// const allSelectData = reactive({})
nowSelectData: [],
allSelectData: {},
});
const selectData = (val)=>{
console.log(val);
state.nowSelectData = val
console.log('allSelectData');
console.log(state.allSelectData);
console.log(Object.keys(state.allSelectData).length);
}
const attrs = useAttrs();
// const nowSelectData = reactive([])
// const allSelectData = reactive({})
const initSelectTableData = (data)=>{
return new Promise((reslove,reject)=>{
data.forEach(e => {
if(state.allSelectData[e[attrs.rowKey||'id']]){
delete state.allSelectData[e[attrs.rowKey||'id']]
state.nowSelectData.push(e)
}
const selectData = (val) => {
state.nowSelectData = val;
};
//当某些表格有原始的选中数据时,初始化allSelectData
const initAllSelectData = (list) => {
list.forEach((e) => {
state.allSelectData[e[attrs.rowKey || "id"]] = e;
});
console.log(state.nowSelectData);
reslove(state.nowSelectData)
})
}
const runPage=()=>{//翻页数据推进
state.nowSelectData.forEach(e => {
state.allSelectData[e[attrs.rowKey||'id']] = e
});
state.nowSelectData = []
}
};
const initSelectTableData = (data) => {
return new Promise((reslove, reject) => {
data.forEach((e) => {
if (state.allSelectData[e[attrs.rowKey || "id"]]) {
delete state.allSelectData[e[attrs.rowKey || "id"]];
state.nowSelectData.push(e);
}
});
reslove(state.nowSelectData);
});
};
const clearTable=()=>{//清除选中数据,在页面状态更新时使用
state.allSelectData={}
state.nowSelectData=[]
clearSelection();
}
const runPage = () => {
//翻页数据推进
state.nowSelectData.forEach((e) => {
state.allSelectData[e[attrs.rowKey || "id"]] = e;
});
state.nowSelectData = [];
};
const dealSelectData=()=>{//最后提交处理数据
state.nowSelectData.forEach(e => {
state.allSelectData[e[attrs.rowKey||'id']] = e
});
return state.allSelectData
}
// const clearTable = () => {
// //清除选中数据,在页面状态更新时使用
// state.allSelectData = {};
// state.nowSelectData = [];
// clearSelection();
// };
const { nowSelectData, allSelectData } = toRefs(state)
const dealSelectData = () => {
//最后提交处理数据
const submitData = { ...state.allSelectData };
state.nowSelectData.forEach((e) => {
submitData[e[attrs.rowKey || "id"]] = e;
});
return submitData;
};
return{
nowSelectData,
allSelectData,
selectData,
initSelectTableData,
runPage,
clearTable,
dealSelectData
}
const { nowSelectData, allSelectData } = toRefs(state);
return {
nowSelectData,
allSelectData,
initAllSelectData,
selectData,
initSelectTableData,
runPage,
// clearTable,
dealSelectData,
};
}
// export const selectTableMixin = {
......@@ -88,7 +91,7 @@ return{
// this.nowSelectData.push(e)
// }
// });
// console.log(this.nowSelectData);
// if(this.nowSelectData.length){
// setTimeout(()=>{
......@@ -115,4 +118,4 @@ return{
// return this.allSelectData
// }
// },
// }
\ No newline at end of file
// }
This diff is collapsed.
This diff is collapsed.
......@@ -2,15 +2,23 @@
<div class="page_container">
<bg-breadcrumb></bg-breadcrumb>
<div class="main_container">
<bg-filter-group @search="changeSearch" v-model="filter.search" placeholder="请输入规则名称或规则">
<bg-filter-group
@search="changeSearch"
v-model="filter.search"
placeholder="请输入规则名称或规则">
<template v-slot:left_action>
<div class="apaas_button">
<el-button type="primary" @click="addRule">
<bg-icon style="font-size: 12px; color: #fff; margin-right: 8px" icon="#bg-ic-add"></bg-icon>
<bg-icon
style="font-size: 12px; color: #fff; margin-right: 8px"
icon="#bg-ic-add"></bg-icon>
新增
</el-button>
<el-button @click="deleteBatch"> 批量删除 </el-button>
<span class="sleceted_tip">已选<span class="num">{{selection.length}}</span></span>
<el-button @click="openDeleteDialog(2)"> 批量删除 </el-button>
<span class="sleceted_tip"
>已选<span class="num">{{ selectedNum }}</span
></span
>
<span class="clean" @click="cleanSelected">清空</span>
</div>
</template>
......@@ -36,13 +44,22 @@
</template>
</bg-filter-group>
<div class="table_container">
<bg-table ref="rulesTable" :headers="headers" :rows="tableRows" :stripe="true" select @selectAc="selectRows" canEdit
canEditFlag="state">
<bg-table
ref="rulesTable"
:headers="headers"
:rows="tableRows"
:stripe="true"
select
@selectAc="selectRows"
canEdit
canEditFlag="state">
<template v-slot:rule_type="{ row }">
<span>{{ ["", "IP"][row.rule_type] }}</span>
</template>
<template v-slot:num_user="{ row }">
<span class="can_click_text under_line" @click="openUserDialog(row)">{{ row.num_user }}</span>
<span class="can_click_text under_line" @click="openUserDialog(row)">{{
row.num_user
}}</span>
</template>
<template v-slot:state="{ row }">
<bg-switch
......@@ -58,7 +75,9 @@
<template v-slot:action="{ row }">
<bg-table-btns2 :limit="3" :key="row.id">
<bg-table-btn @click="edit(row)">编辑</bg-table-btn>
<bg-table-btn :disabled="row.state == 1" @click="deleteCurrent(row)">删除</bg-table-btn>
<bg-table-btn :disabled="row.state == 1" @click="openDeleteDialog(1, row)"
>删除</bg-table-btn
>
</bg-table-btns2>
</template>
</bg-table>
......@@ -76,7 +95,10 @@
<div class="content_detail">
<div class="form_filter">
<div class="left">
<el-select v-model="userFilter.isAdmin" placeholder="请选择" style="width: 200px; margin-left: 16px">
<el-select
v-model="userFilter.isAdmin"
placeholder="请选择"
style="width: 200px; margin-left: 16px">
<el-option
v-for="(item, index) in userTypeList"
:key="'pushOptions' + index"
......@@ -116,7 +138,12 @@
</div>
<div class="table_content">
<bg-table ref="bgUserTable" :headers="userHeaders" :rows="userTableRows" height="430" :stripe="true">
<bg-table
ref="bgUserTable"
:headers="userHeaders"
:rows="userTableRows"
height="430"
:stripe="true">
<template v-slot:isAdmin="{ row }">
<span>{{ ["", "业务系统用户", "组织管理员", "平台用户"][row.isAdmin] }}</span>
</template>
......@@ -131,11 +158,26 @@
</div>
</div>
</el-dialog>
<el-dialog
class="dialog_box"
:title="deleteDialogConfig.title"
v-model="dialogDelete"
width="400px">
<div style="text-align: center">
{{ deleteDialogConfig.tips }}
</div>
<template v-slot:footer>
<div class="apaas_button">
<el-button type="default" @click="dialogDelete = false">取 消</el-button>
<el-button type="primary" @click="confimDelete">确 定</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup>
import { reactive, toRefs, computed, onBeforeMount ,ref} from "vue";
import { reactive, toRefs, computed, onBeforeMount, ref } from "vue";
import { Search } from "@element-plus/icons-vue";
import { useRouter } from "vue-router";
import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
......@@ -146,7 +188,7 @@ import { dateStringTransform } from "@/services/helper.js";
const router = useRouter();
const rulesTable = ref(null)
const rulesTable = ref(null);
const state = reactive({
filter: {
search: "",
......@@ -189,6 +231,7 @@ const state = reactive({
],
tableRows: [],
tableTotal: 0,
selectedNum: 0,
actionRow: {},
dialogDetail: false,
userFilter: {
......@@ -239,6 +282,12 @@ const state = reactive({
userTableRows: [],
userTableTotal: 0,
selection: [],
dialogDelete: false,
deleteDialogConfig: {
title: "删除",
ruleId: [],
tips: "确定要删除当前行数据吗?",
},
});
const getOrgList = () => {
......@@ -295,43 +344,46 @@ const getTableRows = () => {
}; // 获取表格数据
const selectRows = (data) => {
state.selectedNum = data.allLength;
state.selection = data.selection;
}
};
// 新增规则跳转
const addRule = () => {
// 新增规则跳转
}; //新增
const deleteBatch = () => {
console.log(state.selection)
}; //批量删除
router.push("/config/accessRule/add");
};
const cleanSelected = () => {
rulesTable.value.clearTable();
}; //清空
// 改变规则状态
const stateChange = (row) => {
axios.put(`/apaas/system/v5/accessRule/updateState?id=${row.id}&state=${row.state}`).then((res) => {
if (res.data.code == 200) {
ElMessage.success(res.data.msg);
changePage(1);
} else {
ElMessage.error(res.data.data);
row.state = row.state == 0 ? 1 : 0;
}
});
}; // 改变规则状态
axios
.put(`/apaas/system/v5/accessRule/updateState?id=${row.id}&state=${row.state}`)
.then((res) => {
if (res.data.code == 200) {
ElMessage.success(res.data.msg);
changePage(1);
} else {
ElMessage.error(res.data.data);
row.state = row.state == 0 ? 1 : 0;
}
});
};
// 打开用户弹窗
const openUserDialog = (row) => {
state.dialogDetail = true;
state.actionRow = row;
clearAction();
}; // 打开用户弹窗
};
const searchUsers = () => {
changeUserPage(1);
}; // 用户弹窗查询
// 用户弹窗重置
const clearAction = () => {
state.userFilter = {
page: 1,
......@@ -342,18 +394,20 @@ const clearAction = () => {
disp: 0,
};
changeUserPage(1);
}; // 用户弹窗重置
};
// 用户详情改变分页
const changeUserPage = (page) => {
state.userFilter.page = page;
getUserTableRows();
}; // 用户详情改变分页
};
const changeUserSize = (size) => {
state.userFilter.limit = size;
changeUserPage(1);
};
// 用户详情弹窗数据
const getUserTableRows = () => {
let params = {
...state.userFilter,
......@@ -367,16 +421,60 @@ const getUserTableRows = () => {
ElMessage.error(res.data.data);
}
});
}; // 用户详情弹窗数据
};
const edit = (row) => {
// state.dialogDetail = true;
// router.push(`/develop/account/add`);
router.push({
path: "/config/accessRule/edit",
query: {
id: row.id,
ruleId: row.rule_id,
ruleName: row.rule_name,
state: row.state,
ruleType: row.rule_type,
ruleDetail: row.rule_detail,
},
});
}; //编辑
const deleteCurrent = (row) => {
}; //删除
//打开删除弹窗
const openDeleteDialog = (type, row) => {
if (type === 2) {
const res = rulesTable.value.dealSelectData();
const list = Object.values(res);
if (list.length === 0) return ElMessage.warning("请选择要删除的数据");
state.dialogDelete = true;
const ruleId = list.map((item) => item.rule_id);
state.deleteDialogConfig = { title: "批量删除", ruleId, tips: "确定要删除所选数据吗?" };
return;
}
state.dialogDelete = true;
state.deleteDialogConfig = {
title: "删除",
ruleId: [row.rule_id],
tips: "确定要删除当前行数据吗?",
};
};
//确定删除
const confimDelete = () => {
axios
.delete("/apaas/system/v5/accessRule/delAccessRule", {
data: {
ruleId: state.deleteDialogConfig.ruleId,
},
})
.then((res) => {
if (res.data.code == 200) {
ElMessage.success("删除成功");
changePage(1);
} else {
ElMessage.error(res.data.data);
}
})
.finally(() => {
state.dialogDelete = false;
});
};
const {
filter,
......@@ -384,6 +482,7 @@ const {
userHeaders,
tableRows,
tableTotal,
selectedNum,
dialogDetail,
userTableRows,
userTableTotal,
......@@ -391,6 +490,8 @@ const {
userTypeList,
orgList,
selection,
dialogDelete,
deleteDialogConfig,
} = toRefs(state);
onBeforeMount(() => {
......
......@@ -69,11 +69,9 @@
</template>
<script setup>
import { Search } from "@element-plus/icons-vue";
import { reactive, toRefs, ref, onBeforeMount, nextTick } from "vue";
import axios from "../../../../request/http.js";
import { ElMessage } from "element-plus";
import { useRouter } from "vue-router";
import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
import { validateLink } from "@/services/rules.js";
import store from "../../../../store";
......@@ -116,39 +114,39 @@ const save = () => {
refForm.value.validate((valid) => {
if (valid) {
let params = {
...state.formData
}
params.logoUrl = JSON.stringify(params.logoUrl)
params.backgroundUrl = JSON.stringify(params.backgroundUrl)
axios.put(`/apaas/system/v5/login/updateLogin`,params).then(res => {
...state.formData,
};
params.logoUrl = JSON.stringify(params.logoUrl);
params.backgroundUrl = JSON.stringify(params.backgroundUrl);
axios.put(`/apaas/system/v5/login/updateLogin`, params).then((res) => {
if (res.data.code == 200) {
ElMessage.success(res.data.msg)
getLoginPageConfig()
}else {
ElMessage.error(res.data.data)
ElMessage.success(res.data.msg);
getLoginPageConfig();
} else {
ElMessage.error(res.data.data);
}
})
});
} else {
ElMessage.error("请先将表单填写完整");
}
});
};
const getLoginPageConfig = () => {
axios.get(`/apaas/system/v5/login/loginDetail`).then(res => {
axios.get(`/apaas/system/v5/login/loginDetail`).then((res) => {
if (res.data.code == 200) {
let data = res.data.data
let data = res.data.data;
store.commit("setSystemLogo", data.logoUrl);
data.logoUrl = data.logoUrl ? JSON.parse(data.logoUrl) : []
data.backgroundUrl = data.backgroundUrl ? JSON.parse(data.backgroundUrl) : []
Object.assign(state.formData,data)
}else {
ElMessage.error(res.data.data)
data.logoUrl = data.logoUrl ? JSON.parse(data.logoUrl) : [];
data.backgroundUrl = data.backgroundUrl ? JSON.parse(data.backgroundUrl) : [];
Object.assign(state.formData, data);
} else {
ElMessage.error(res.data.data);
}
})
}
});
};
onBeforeMount(() => {
getLoginPageConfig()
})
getLoginPageConfig();
});
const { formData, rules } = toRefs(state);
</script>
......
This diff is collapsed.
This diff is collapsed.
<template>
<div class="page_container">
<bg-breadcrumb></bg-breadcrumb>
<div class="page_content">
<bg-form-gap title="详情"></bg-form-gap>
<bg-detail-table2 class="detail_info" :list="instanceData.detailInfo"> </bg-detail-table2>
</div>
</div>
</template>
<script setup>
import { reactive, onBeforeMount } from "vue";
import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
import { useRoute } from "vue-router";
import axios from "@/request/http.js";
import { ElMessage } from "element-plus";
const route = useRoute();
const instanceData = reactive({
detailInfo: [
{
key: "system_account",
label: "账号",
value: "",
// slot: "approvalStatus",
},
{
key: "phone",
label: "手机号",
value: "",
},
{
key: "user_type",
label: "用户类型",
value: "",
},
{
key: "org_name",
label: "所属机构",
value: "",
},
{
key: "system_module",
label: "系统模块",
value: "",
},
{
key: "created_time",
label: "操作时间",
value: "",
},
{
key: "operate_type",
label: "操作类型",
value: "",
},
{
key: "req_method_str",
label: "请求方式",
value: "",
},
{
key: "operate_status_str",
label: "操作状态",
value: "",
},
{
key: "operate_ip",
label: "操作地址",
value: "",
},
{
key: "operate_addr",
label: "操作地点",
value: "",
width: "100%",
},
{
key: "req_url",
label: "请求地址",
value: "",
width: "100%",
},
{
key: "req_param",
label: "请求参数",
value: "",
},
{
key: "operate_method",
label: "操作方法",
value: "",
},
{
key: "res_fields",
label: "返回参数",
value: "",
},
],
});
onBeforeMount(() => {
getDetailInfo();
});
const getDetailInfo = () => {
axios
.get(`/apaas/system/v5/log/userBehavior/detail/${route.query.id}`)
.then((res) => {
if (res.data.code == 200) {
const result = res.data.data || {};
instanceData.detailInfo.forEach((item) => {
item.value = result[item.key];
});
} else {
ElMessage.error(res.data.data);
}
})
.catch((err) => {
ElMessage.error(err);
});
};
</script>
<style lang="scss" scoped>
.page_content {
position: relative;
padding: 24px 0 68px 24px;
.detail_info,
.approve_info {
margin-bottom: 24px;
width: 960px;
}
}
</style>
This diff is collapsed.
//操作类型
export const operateTypeList = [
{ label: "全部", value: "" },
{
label: "新建",
value: "新建",
},
{
label: "编辑",
value: "编辑",
},
{
label: "上移",
value: "上移",
},
{
label: "下移",
value: "下移",
},
{
label: "导入",
value: "导入",
},
{
label: "导出",
value: "导出",
},
{
label: "删除",
value: "删除",
},
{
label: "批量启用",
value: "批量启用",
},
{
label: "批量禁用",
value: "批量禁用",
},
{
label: "批量删除",
value: "批量删除",
},
{
label: "分配角色",
value: "分配角色",
},
{
label: "默认角色管理",
value: "默认角色管理",
},
{
label: "分配用户",
value: "分配用户",
},
{
label: "置顶/取消置顶",
value: "置顶/取消置顶",
},
{
label: "预览",
value: "预览",
},
{
label: "发布",
value: "发布",
},
{
label: "重置",
value: "重置",
},
{
label: "对接记录",
value: "对接记录",
},
{
label: "置顶",
value: "置顶",
},
{
label: "强制修改密码",
value: "强制修改密码",
},
{
label: "清空",
value: "清空",
},
{
label: "详情",
value: "详情",
},
{
label: "移出",
value: "移出",
},
{
label: "查看",
value: "查看",
},
];
export const reqMethodList = [
{ label: "全部", value: "" },
{
label: "HEAD",
value: 88,
},
{
label: "PUT",
value: 89,
},
{
label: "DELETE",
value: 90,
},
{
label: "CONNECT",
value: 91,
},
{
label: "OPTIONS",
value: 92,
},
{
label: "TRACE",
value: 93,
},
{
label: "POST",
value: 87,
},
{
label: "GET",
value: 86,
},
];
This diff is collapsed.
......@@ -14,11 +14,20 @@ const store = createStore({
msgUnreadNum: 0,
systemLogo: "",
whiteList: [],
userTypeConfig: {
1: "业务系统账号",
2: "组织管理员账号",
3: "平台用户账号",
4: "超级管理员",
},
},
getters: {
count(state) {
return state.userInfo;
},
getUserTypeConfig(state) {
return state.userTypeConfig;
},
},
mutations: {
setUserInfo(state, info) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment