北斗启航科技教育平台管理系统
This commit is contained in:
750
src/components/mainPage/insiders.vue
Normal file
750
src/components/mainPage/insiders.vue
Normal file
@@ -0,0 +1,750 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- 表格 -->
|
||||
<el-card>
|
||||
<div class="flex justify-center flex-wrap">
|
||||
<TabelTools @showTools="showTools" :dialogObj="insidersMsgActive" />
|
||||
<AddNewData newDataLabel="新增公司员工" @showAddForm="showAddForm" />
|
||||
<el-table
|
||||
ref="tableRef"
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
max-height="50rem"
|
||||
table-layout="auto"
|
||||
scrollbar-always-on
|
||||
@selection-change="handleSelectionChange"
|
||||
>
|
||||
<el-table-column
|
||||
v-if="dialogOperationVisible"
|
||||
fixed="left"
|
||||
type="selection"
|
||||
width="40"
|
||||
column-key="selection"
|
||||
/>
|
||||
<TabelSelect
|
||||
v-if="dialogOperationVisible"
|
||||
ref="EditSelectRef"
|
||||
:holderText="editSelectHold"
|
||||
singleColor="primary"
|
||||
multipleColor="warning"
|
||||
allColor="danger"
|
||||
singleSize="small"
|
||||
multipleSize="small"
|
||||
allSize="small"
|
||||
:singlePlain="true"
|
||||
:multiplePlain="false"
|
||||
:allPlain="false"
|
||||
operateType="edit"
|
||||
@showComfirmDialog="showComfirmDialog"
|
||||
/>
|
||||
<TabelSelect
|
||||
v-if="dialogOperationVisible"
|
||||
ref="DelSelectRef"
|
||||
:holderText="delSelectHold"
|
||||
singleColor="danger"
|
||||
multipleColor="warning"
|
||||
allColor="danger"
|
||||
singleSize="small"
|
||||
multipleSize="small"
|
||||
allSize="small"
|
||||
:singlePlain="true"
|
||||
:multiplePlain="false"
|
||||
:allPlain="false"
|
||||
operateType="del"
|
||||
@showComfirmDialog="showComfirmDialog"
|
||||
/>
|
||||
<el-table-column min-width="140" column-key="uid">
|
||||
<template #header>
|
||||
<div>
|
||||
<SearchKey
|
||||
v-if="dialogSearchVisible"
|
||||
ref="SearchUidKeyRef"
|
||||
holderText="输入员工uid以搜索相关数据"
|
||||
@search="insidersMsg"
|
||||
/>
|
||||
<div>
|
||||
<el-text class="mx-1"> 员工uid </el-text>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<div class="flex justify-start items-center text-base">
|
||||
{{ scope.row.uid }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="100" column-key="status">
|
||||
<template #header>
|
||||
<SelectSearch
|
||||
v-if="dialogSearchVisible"
|
||||
ref="SelectStatusSearchRef"
|
||||
holderText="选择账号状态以搜索相关数据"
|
||||
:options="statusOptions"
|
||||
@search="insidersMsg"
|
||||
/>
|
||||
<div>
|
||||
<el-text class="mx-1"> 账号状态 </el-text>
|
||||
</div>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<div
|
||||
:style="styleShunt(statusOptions, scope.row.status)"
|
||||
class="flex justify-start items-center text-base"
|
||||
>
|
||||
{{ labelShunt(statusOptions, scope.row.status) }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="100" column-key="role">
|
||||
<template #header>
|
||||
<SelectSearch
|
||||
v-if="dialogSearchVisible"
|
||||
ref="SelectRoleSearchRef"
|
||||
holderText="选择账号角色以搜索相关数据"
|
||||
:options="roleOptions"
|
||||
@search="insidersMsg"
|
||||
/>
|
||||
<div>
|
||||
<el-text class="mx-1"> 账号角色 </el-text>
|
||||
</div>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<div
|
||||
:style="styleShunt(roleOptions, scope.row.role)"
|
||||
class="flex justify-start items-center text-base"
|
||||
>
|
||||
{{ labelShunt(roleOptions, scope.row.role) }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="100" column-key="name">
|
||||
<template #header>
|
||||
<div>
|
||||
<SearchKey
|
||||
v-if="dialogSearchVisible"
|
||||
ref="SearchNameKeyRef"
|
||||
holderText="输入员工姓名以搜索相关数据"
|
||||
@search="insidersMsg"
|
||||
/>
|
||||
<div>
|
||||
<el-text class="mx-1"> 员工姓名 </el-text>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<div class="flex justify-start items-center text-base">
|
||||
{{ scope.row.name }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="120" column-key="department">
|
||||
<template #header>
|
||||
<div>
|
||||
<SearchKey
|
||||
v-if="dialogSearchVisible"
|
||||
ref="SearchDepartmentKeyRef"
|
||||
holderText="输入所属部门以搜索相关数据"
|
||||
@search="insidersMsg"
|
||||
/>
|
||||
<div>
|
||||
<el-text class="mx-1"> 所属部门 </el-text>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<div class="flex justify-start items-center text-base">
|
||||
{{ scope.row.department }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="200" column-key="change">
|
||||
<template #header>
|
||||
<div>
|
||||
<SearchKey
|
||||
v-if="dialogSearchVisible"
|
||||
ref="SearchChangeKeyRef"
|
||||
holderText="输入信息变更描述以搜索相关数据"
|
||||
@search="insidersMsg"
|
||||
/>
|
||||
<div>
|
||||
<el-text class="mx-1"> 信息变更描述 </el-text>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<div class="flex justify-start items-center text-base">
|
||||
{{ scope.row.change }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="200" column-key="created_at">
|
||||
<template #header>
|
||||
<DateTimePicker
|
||||
v-if="dialogSearchVisible"
|
||||
ref="createdDateTimePickerRef"
|
||||
DateTimePicker="createdDateTimePicker"
|
||||
@search="insidersMsg"
|
||||
/>
|
||||
<div>
|
||||
<el-text class="mx-1"> 注册时间 </el-text>
|
||||
<SortSearch
|
||||
v-if="dialogSortVisible"
|
||||
ref="createdSortDateTimeRef"
|
||||
activeText="顺序"
|
||||
inactiveText="倒序"
|
||||
@search="insidersMsg"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<div class="flex justify-start items-center text-base">
|
||||
{{ scope.row.created_at }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="200" column-key="updated_at">
|
||||
<template #header>
|
||||
<DateTimePicker
|
||||
v-if="dialogSearchVisible"
|
||||
ref="updatedDateTimePickerRef"
|
||||
DateTimePicker="updatedMsgDateTimePicker"
|
||||
@search="insidersMsg"
|
||||
/>
|
||||
<div>
|
||||
<el-text class="mx-1"> 信息变更时间 </el-text>
|
||||
<SortSearch
|
||||
v-if="dialogSortVisible"
|
||||
ref="updatedSortDateTimeRef"
|
||||
activeText="顺序"
|
||||
inactiveText="倒序"
|
||||
@search="insidersMsg"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<div class="flex justify-start items-center text-base">
|
||||
{{ scope.row.updated_at }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="200" column-key="login_at">
|
||||
<template #header>
|
||||
<DateTimePicker
|
||||
v-if="dialogSearchVisible"
|
||||
ref="loginDateTimePickerRef"
|
||||
DateTimePicker="loginMsgDateTimePicker"
|
||||
@search="insidersMsg"
|
||||
/>
|
||||
<div>
|
||||
<el-text class="mx-1"> 上次登录时间 </el-text>
|
||||
<SortSearch
|
||||
v-if="dialogSortVisible"
|
||||
ref="loginSortDateTimeRef"
|
||||
activeText="顺序"
|
||||
inactiveText="倒序"
|
||||
@search="insidersMsg"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<div class="flex justify-start items-center text-base">
|
||||
{{ scope.row.login_at }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="100" column-key="login_status">
|
||||
<template #header>
|
||||
<SelectSearch
|
||||
v-if="dialogSearchVisible"
|
||||
ref="SelectLoginStatusSearchRef"
|
||||
holderText="选择登录状态以搜索相关数据"
|
||||
:options="loginStatusOptions"
|
||||
@search="insidersMsg"
|
||||
/>
|
||||
<div>
|
||||
<el-text class="mx-1"> 登录状态 </el-text>
|
||||
</div>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<div
|
||||
:style="styleShunt(loginStatusOptions, scope.row.login_status)"
|
||||
class="flex justify-start items-center text-base"
|
||||
>
|
||||
{{ labelShunt(loginStatusOptions, scope.row.login_status) }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 表格 -->
|
||||
<Pagination
|
||||
ref="PaginationRef"
|
||||
:active="insidersMsgActive"
|
||||
@sizeChangeBack="changePage"
|
||||
@search="insidersMsg"
|
||||
/>
|
||||
</div>
|
||||
</el-card>
|
||||
<AddInsidersForm
|
||||
ref="addInsidersFormRef"
|
||||
title="新增公司员工"
|
||||
:addData="addData"
|
||||
@reloadData="insidersMsg"
|
||||
/>
|
||||
<EditInsidersForm
|
||||
ref="editInsidersFormRef"
|
||||
operateLabel="编辑公司员工"
|
||||
:editData="editData"
|
||||
@requestOperate="requestOperate"
|
||||
/>
|
||||
<PasswordOauth
|
||||
ref="delPasswordOauthRef"
|
||||
operateLabel="删除公司员工"
|
||||
@requestOperate="requestOperate"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, watch, onMounted, nextTick } from "vue";
|
||||
import { ElMessage } from "element-plus";
|
||||
|
||||
import TabelTools from "../operate/tabelTools.vue";
|
||||
import AddNewData from "../operate/addNewData.vue";
|
||||
import TabelSelect from "../operate/tabelSelect.vue";
|
||||
import SearchKey from "../search/searchKey.vue";
|
||||
import SortSearch from "../search/sortSearch.vue";
|
||||
import SelectSearch from "../search/selectSearch.vue";
|
||||
import DateTimePicker from "../search/dateTimePicker.vue";
|
||||
import Pagination from "../search/pagination.vue";
|
||||
import AddInsidersForm from "../addNewData/insidersForm/insidersForm.vue";
|
||||
import EditInsidersForm from "../editData/insidersForm.vue";
|
||||
import PasswordOauth from "../operate/passwordOauth.vue";
|
||||
|
||||
import insidersActiveStore from "../../stores/insiders";
|
||||
|
||||
import moment from "moment";
|
||||
|
||||
import $http from "../../api/index";
|
||||
import $url from "../../api/url";
|
||||
|
||||
import { encrypt } from "../../utils/aes";
|
||||
import { judgment } from "../../utils/judgment.js";
|
||||
import { hasNullOrEmptyPropertyWithTypeof } from "../../utils/hasNullOrEmptyPropertyWithTypeof.js";
|
||||
|
||||
const insidersMsgActive = insidersActiveStore();
|
||||
|
||||
const editSelectHold = {
|
||||
single: "编辑",
|
||||
multiple: "编辑选中",
|
||||
all: "编辑所有",
|
||||
label: "编辑公司员工",
|
||||
};
|
||||
|
||||
const delSelectHold = {
|
||||
single: "删除",
|
||||
multiple: "删除选中",
|
||||
all: "删除所有",
|
||||
label: "删除公司员工",
|
||||
};
|
||||
const EditSelectRef = ref(null);
|
||||
const DelSelectRef = ref(null);
|
||||
const SearchUidKeyRef = ref(null);
|
||||
const SelectStatusSearchRef = ref(null);
|
||||
const SelectRoleSearchRef = ref(null);
|
||||
const SearchNameKeyRef = ref(null);
|
||||
const SearchDepartmentKeyRef = ref(null);
|
||||
const SearchChangeKeyRef = ref(null);
|
||||
const createdDateTimePickerRef = ref(null);
|
||||
const updatedDateTimePickerRef = ref(null);
|
||||
const loginDateTimePickerRef = ref(null);
|
||||
const SelectLoginStatusSearchRef = ref(null);
|
||||
const createdSortDateTimeRef = ref(null);
|
||||
const updatedSortDateTimeRef = ref(null);
|
||||
const loginSortDateTimeRef = ref(null);
|
||||
const PaginationRef = ref(null);
|
||||
const addInsidersFormRef = ref(null);
|
||||
const editInsidersFormRef = ref(null);
|
||||
const delPasswordOauthRef = ref(null);
|
||||
const dialogSearchVisible = ref(false);
|
||||
const dialogSortVisible = ref(false);
|
||||
const dialogOperationVisible = ref(false);
|
||||
const tableRef = ref();
|
||||
const offsetOff = ref(true);
|
||||
const pageCount = ref(0);
|
||||
const operate = ref("edit");
|
||||
const searchOptions = reactive({
|
||||
uid: "",
|
||||
status: "",
|
||||
role: "",
|
||||
name: "",
|
||||
department: "",
|
||||
change: "",
|
||||
created_at: "",
|
||||
updated_at: "",
|
||||
login_at: "",
|
||||
login_status: "",
|
||||
});
|
||||
const sortOptions = reactive({
|
||||
created_at: false,
|
||||
updated_at: false,
|
||||
login_at: false,
|
||||
});
|
||||
const tableData = ref([]);
|
||||
const statusOptions = [
|
||||
{
|
||||
value: "0",
|
||||
label: "默认",
|
||||
style: "color: rgb(56, 188, 248);background-color: rgba(56, 188, 248, 0.1);padding: 0;",
|
||||
},
|
||||
{
|
||||
value: "1",
|
||||
label: "正在使用",
|
||||
style: "color: rgb(16, 184, 130);background-color: rgba(16, 184, 130, 0.1);padding: 0;",
|
||||
},
|
||||
{
|
||||
value: "2",
|
||||
label: "已弃用",
|
||||
style: "color: rgb(240, 70, 70);background-color: rgba(240, 70, 70, 0.1);padding: 0;",
|
||||
},
|
||||
];
|
||||
const roleOptions = [
|
||||
{
|
||||
value: "0",
|
||||
label: "临时员工",
|
||||
style: "color: rgb(255, 100, 180);background-color: rgba(255, 100, 180, 0.1);padding: 0;",
|
||||
},
|
||||
{
|
||||
value: "3",
|
||||
label: "普通员工",
|
||||
style: "color: rgb(255, 120, 20);background-color: rgba(255, 120, 20, 0.1);padding: 0;",
|
||||
},
|
||||
{
|
||||
value: "6",
|
||||
label: "普通管理员",
|
||||
style: "color: rgb(255, 200, 0);background-color: rgba(255, 200, 0, 0.1);padding: 0;",
|
||||
},
|
||||
{
|
||||
value: "9",
|
||||
label: "高级管理员",
|
||||
style: "color: rgb(240, 70, 70);background-color: rgba(240, 70, 70, 0.1);padding: 0;",
|
||||
},
|
||||
];
|
||||
const loginStatusOptions = [
|
||||
{
|
||||
value: "0",
|
||||
label: "未登录",
|
||||
style: "color: rgb(56, 188, 248);background-color: rgba(56, 188, 248, 0.1);padding: 0;",
|
||||
},
|
||||
{
|
||||
value: "1",
|
||||
label: "已登录",
|
||||
style: "color: rgb(16, 184, 130);background-color: rgba(16, 184, 130, 0.1);padding: 0;",
|
||||
},
|
||||
];
|
||||
let singleData = reactive({});
|
||||
let operateData = reactive({});
|
||||
let operateDataClone = reactive({});
|
||||
const addData = reactive({
|
||||
roleOptions,
|
||||
});
|
||||
const editData = reactive({
|
||||
statusOptions,
|
||||
roleOptions,
|
||||
});
|
||||
|
||||
const showAddForm = () => {
|
||||
addInsidersFormRef.value.dialogVisible = true;
|
||||
};
|
||||
|
||||
const styleShunt = (options, data) => {
|
||||
let nowStyle;
|
||||
options.forEach((item) => {
|
||||
if (data == item.value) {
|
||||
nowStyle = item.style;
|
||||
}
|
||||
});
|
||||
return nowStyle;
|
||||
};
|
||||
|
||||
const labelShunt = (options, data) => {
|
||||
let nowLabel;
|
||||
options.forEach((item) => {
|
||||
if (data == item.value) {
|
||||
nowLabel = item.label;
|
||||
}
|
||||
});
|
||||
return nowLabel;
|
||||
};
|
||||
|
||||
const showTools = (operateType) => {
|
||||
switch (operateType) {
|
||||
case "search":
|
||||
dialogSearchVisible.value = !dialogSearchVisible.value;
|
||||
insidersMsgActive.dialogSearchVisible = dialogSearchVisible.value;
|
||||
break;
|
||||
case "sort":
|
||||
dialogSortVisible.value = !dialogSortVisible.value;
|
||||
insidersMsgActive.dialogSortVisible = dialogSortVisible.value;
|
||||
break;
|
||||
case "operation":
|
||||
dialogOperationVisible.value = !dialogOperationVisible.value;
|
||||
insidersMsgActive.dialogOperationVisible = dialogOperationVisible.value;
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
const resetOffset = () => {
|
||||
if (hasNullOrEmptyPropertyWithTypeof(searchOptions)) {
|
||||
if (PaginationRef.value.offset !== 1 && offsetOff.value) {
|
||||
PaginationRef.value.handleCurrentChange(1);
|
||||
offsetOff.value = false;
|
||||
}
|
||||
} else {
|
||||
offsetOff.value = true;
|
||||
}
|
||||
};
|
||||
|
||||
const insidersMsg = () => {
|
||||
judgment(searchOptions, "uid", SearchUidKeyRef.value, "searchMsg");
|
||||
judgment(searchOptions, "status", SelectStatusSearchRef.value, "searchMsg");
|
||||
judgment(searchOptions, "role", SelectRoleSearchRef.value, "searchMsg");
|
||||
judgment(searchOptions, "name", SearchNameKeyRef.value, "searchMsg");
|
||||
judgment(searchOptions, "department", SearchDepartmentKeyRef.value, "searchMsg");
|
||||
judgment(searchOptions, "change", SearchChangeKeyRef.value, "searchMsg");
|
||||
judgment(searchOptions, "created_at", createdDateTimePickerRef.value, "searchMsg");
|
||||
judgment(searchOptions, "updated_at", updatedDateTimePickerRef.value, "searchMsg");
|
||||
judgment(searchOptions, "login_at", loginDateTimePickerRef.value, "searchMsg");
|
||||
judgment(sortOptions, "created_at", createdSortDateTimeRef.value, "searchMsg");
|
||||
judgment(sortOptions, "updated_at", updatedSortDateTimeRef.value, "searchMsg");
|
||||
judgment(sortOptions, "login_at", loginSortDateTimeRef.value, "searchMsg");
|
||||
resetOffset();
|
||||
const data = {
|
||||
uid: localStorage.data,
|
||||
offset: PaginationRef.value == null ? 1 : PaginationRef.value.offset,
|
||||
limit: PaginationRef.value == null ? 10 : PaginationRef.value.limit,
|
||||
searchOptions: searchOptions,
|
||||
sortOptions: sortOptions,
|
||||
};
|
||||
$http.post($url.showInsiders, data).then((res) => {
|
||||
if (res.data.code === 200) {
|
||||
tableData.value = res.data.InsidersMsg;
|
||||
tableData.value.forEach((item) => {
|
||||
item.origin_createdAt = item.created_at;
|
||||
item.created_at = moment
|
||||
.utc(item.created_at)
|
||||
.add(8, "hours")
|
||||
.format("YYYY-MM-DD-HH:mm:ss");
|
||||
item.origin_updatedAt = item.updated_at;
|
||||
item.updated_at = moment
|
||||
.utc(item.updated_at)
|
||||
.add(8, "hours")
|
||||
.format("YYYY-MM-DD-HH:mm:ss");
|
||||
item.origin_loginAt = item.login_at;
|
||||
item.login_at = moment
|
||||
.utc(item.login_at)
|
||||
.add(8, "hours")
|
||||
.format("YYYY-MM-DD-HH:mm:ss");
|
||||
});
|
||||
PaginationRef.value.dataCount = res.data.count;
|
||||
insidersMsgActive.dataCount = PaginationRef.value.dataCount;
|
||||
pageCount.value = Math.ceil(
|
||||
PaginationRef.value.dataCount / PaginationRef.value.limit
|
||||
);
|
||||
insidersMsgActive.pageCount = pageCount.value;
|
||||
if (!operateData[PaginationRef.value.offset]) return;
|
||||
operateData[PaginationRef.value.offset].forEach((element) => {
|
||||
tableData.value.forEach((item) => {
|
||||
if (item.created_at == element.created_at) {
|
||||
nextTick(() => {
|
||||
tableRef.value.toggleRowSelection(item, true);
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
} else {
|
||||
tableData.value = [];
|
||||
ElMessage.error("未查找到相关数据！");
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const changePage = (val) => {
|
||||
pageCount.value = Math.ceil(PaginationRef.value.dataCount / val);
|
||||
operateData = {};
|
||||
for (let i = 0; i < pageCount.value; i++) {
|
||||
operateData[i + 1] = [];
|
||||
for (const key in operateDataClone) {
|
||||
operateDataClone[key].forEach((element) => {
|
||||
// 判断数据在第几页
|
||||
if (Math.ceil(element.location / PaginationRef.value.limit) == i + 1) {
|
||||
operateData[i + 1].push(element);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const handleSelectionChange = (val) => {
|
||||
operateData[PaginationRef.value.offset] = val;
|
||||
tableData.value.forEach((item, index) => {
|
||||
operateData[PaginationRef.value.offset].forEach((element) => {
|
||||
if (item.created_at == element.created_at) {
|
||||
// 数据在表格中的位置
|
||||
element.location =
|
||||
(PaginationRef.value.offset - 1) * PaginationRef.value.limit + (index + 1);
|
||||
}
|
||||
});
|
||||
});
|
||||
operateDataClone = JSON.parse(JSON.stringify(operateData));
|
||||
for (const key in operateDataClone) {
|
||||
operateDataClone[key].forEach((item) => {
|
||||
if (item.origin_createdAt) {
|
||||
item.created_at = item.origin_createdAt;
|
||||
}
|
||||
if (item.origin_updatedAt) {
|
||||
item.created_at = item.origin_updatedAt;
|
||||
}
|
||||
if (item.origin_loginAt) {
|
||||
item.created_at = item.origin_loginAt;
|
||||
}
|
||||
delete item.origin_createdAt;
|
||||
delete item.origin_updatedAt;
|
||||
delete item.origin_loginAt;
|
||||
delete item.location;
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const showComfirmDialog = (singleMsg) => {
|
||||
singleData = { ...singleMsg.data };
|
||||
singleData.created_at = singleData.origin_createdAt;
|
||||
singleData.updated_at = singleData.origin_updatedAt;
|
||||
singleData.login_at = singleData.origin_loginAt;
|
||||
delete singleData.origin_createdAt;
|
||||
delete singleData.origin_updatedAt;
|
||||
delete singleData.origin_loginAt;
|
||||
operate.value = singleMsg.operateType;
|
||||
if (singleMsg.operateType == "edit") {
|
||||
editInsidersFormRef.value.operateDialogVisible = true;
|
||||
editInsidersFormRef.value.model = EditSelectRef.value.model;
|
||||
}
|
||||
if (singleMsg.operateType == "del") {
|
||||
delPasswordOauthRef.value.operateDialogVisible = true;
|
||||
}
|
||||
};
|
||||
|
||||
const requestOperate = () => {
|
||||
let operateType, url, model, password;
|
||||
if (operate.value == "edit") {
|
||||
operateType = "编辑";
|
||||
url = $url.editInsiders;
|
||||
model = EditSelectRef.value.model;
|
||||
password = editInsidersFormRef.value.password;
|
||||
} else if (operate.value == "del") {
|
||||
operateType = "删除";
|
||||
url = $url.deleteInsiders;
|
||||
model = DelSelectRef.value.model;
|
||||
password = delPasswordOauthRef.value.ruleForm.password;
|
||||
}
|
||||
const data = {
|
||||
uid: localStorage.data,
|
||||
model: encrypt(model),
|
||||
password: encrypt(password),
|
||||
requestMsg:
|
||||
model == "single" ? singleData : model == "multiple" ? operateDataClone : "",
|
||||
};
|
||||
if (operate.value == "edit") {
|
||||
data.updateMsg = { ...editInsidersFormRef.value.ruleForm };
|
||||
for (const element in data.updateMsg) {
|
||||
if (data.updateMsg[element] == "") {
|
||||
delete data.updateMsg[element];
|
||||
}
|
||||
}
|
||||
}
|
||||
$http.post(url, data).then((res) => {
|
||||
if (res.data.code === 200) {
|
||||
tableRef.value.clearSelection();
|
||||
operateData = {};
|
||||
operateDataClone = {};
|
||||
ElMessage({
|
||||
message: `${operateType}成功！`,
|
||||
type: "success",
|
||||
});
|
||||
insidersMsg();
|
||||
} else {
|
||||
ElMessage.error(`${operateType}失败！`);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
defineExpose({ insidersMsg });
|
||||
|
||||
watch(searchOptions, (value) => {
|
||||
insidersMsgActive.searchOptions = value;
|
||||
});
|
||||
|
||||
watch(sortOptions, (value) => {
|
||||
insidersMsgActive.sortOptions = value;
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
pageCount.value = insidersMsgActive.pageCount;
|
||||
dialogSearchVisible.value = insidersMsgActive.dialogSearchVisible;
|
||||
dialogSortVisible.value = insidersMsgActive.dialogSortVisible;
|
||||
dialogOperationVisible.value = insidersMsgActive.dialogOperationVisible;
|
||||
|
||||
if (dialogSearchVisible.value) {
|
||||
searchOptions.uid = insidersMsgActive.searchOptions.uid;
|
||||
searchOptions.status = insidersMsgActive.searchOptions.status;
|
||||
searchOptions.role = insidersMsgActive.searchOptions.role;
|
||||
searchOptions.name = insidersMsgActive.searchOptions.name;
|
||||
searchOptions.department = insidersMsgActive.searchOptions.department;
|
||||
searchOptions.change = insidersMsgActive.searchOptions.change;
|
||||
searchOptions.created_at = insidersMsgActive.searchOptions.created_at;
|
||||
searchOptions.updated_at = insidersMsgActive.searchOptions.updated_at;
|
||||
searchOptions.login_at = insidersMsgActive.searchOptions.login_at;
|
||||
}
|
||||
|
||||
if (dialogSortVisible.value) {
|
||||
sortOptions.created_at = insidersMsgActive.sortOptions.created_at;
|
||||
sortOptions.updated_at = insidersMsgActive.sortOptions.updated_at;
|
||||
sortOptions.login_at = insidersMsgActive.sortOptions.login_at;
|
||||
}
|
||||
|
||||
if (dialogOperationVisible.value) {
|
||||
}
|
||||
|
||||
setTimeout(() => {
|
||||
insidersMsg();
|
||||
}, 200);
|
||||
|
||||
setTimeout(() => {
|
||||
if (dialogSearchVisible.value) {
|
||||
SearchUidKeyRef.value.searchMsg = insidersMsgActive.searchOptions.uid;
|
||||
SelectStatusSearchRef.value.searchMsg = insidersMsgActive.searchOptions.status;
|
||||
SelectRoleSearchRef.value.searchMsg = insidersMsgActive.searchOptions.role;
|
||||
SearchNameKeyRef.value.searchMsg = insidersMsgActive.searchOptions.name;
|
||||
SearchDepartmentKeyRef.value.searchMsg = insidersMsgActive.searchOptions.department;
|
||||
SearchChangeKeyRef.value.searchMsg = insidersMsgActive.searchOptions.change;
|
||||
createdDateTimePickerRef.value.created_at =
|
||||
insidersMsgActive.searchOptions.created_at;
|
||||
updatedDateTimePickerRef.value.updated_at =
|
||||
insidersMsgActive.searchOptions.updated_at;
|
||||
loginDateTimePickerRef.value.login_at = insidersMsgActive.searchOptions.login_at;
|
||||
}
|
||||
|
||||
if (dialogSortVisible.value) {
|
||||
createdSortDateTimeRef.value.searchMsg = insidersMsgActive.sortOptions.created_at;
|
||||
updatedSortDateTimeRef.value.searchMsg = insidersMsgActive.sortOptions.updated_at;
|
||||
loginSortDateTimeRef.value.searchMsg = insidersMsgActive.sortOptions.login_at;
|
||||
}
|
||||
|
||||
if (dialogOperationVisible.value) {
|
||||
}
|
||||
}, 0);
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
Reference in New Issue
Block a user