From bbe94610a28e72414df1fb2b36a6d11385873e54 Mon Sep 17 00:00:00 2001 From: 疯狂的狮子Li <15040126243@163.com> Date: 星期一, 20 一月 2025 11:30:16 +0800 Subject: [PATCH] update 优化 parseTime 提示报错问题 --- src/views/monitor/logininfor/index.vue | 351 +++++++++++++++++++++++++++------------------------------ 1 files changed, 167 insertions(+), 184 deletions(-) diff --git a/src/views/monitor/logininfor/index.vue b/src/views/monitor/logininfor/index.vue index bd58a5d..d914544 100644 --- a/src/views/monitor/logininfor/index.vue +++ b/src/views/monitor/logininfor/index.vue @@ -1,225 +1,208 @@ <template> - <div class="app-container"> - <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px"> - <el-form-item label="鐧诲綍鍦板潃" prop="ipaddr"> - <el-input - v-model="queryParams.ipaddr" - placeholder="璇疯緭鍏ョ櫥褰曞湴鍧�" - clearable - style="width: 240px;" - @keyup.enter="handleQuery" - /> - </el-form-item> - <el-form-item label="鐢ㄦ埛鍚嶇О" prop="userName"> - <el-input - v-model="queryParams.userName" - placeholder="璇疯緭鍏ョ敤鎴峰悕绉�" - clearable - style="width: 240px;" - @keyup.enter="handleQuery" - /> - </el-form-item> - <el-form-item label="鐘舵��" prop="status"> - <el-select - v-model="queryParams.status" - placeholder="鐧诲綍鐘舵��" - clearable - style="width: 240px" - > - <el-option - v-for="dict in sys_common_status" - :key="dict.value" - :label="dict.label" - :value="dict.value" - /> - </el-select> - </el-form-item> - <el-form-item label="鐧诲綍鏃堕棿" style="width: 308px"> - <el-date-picker - v-model="dateRange" - value-format="YYYY-MM-DD HH:mm:ss" - type="daterange" - range-separator="-" - start-placeholder="寮�濮嬫棩鏈�" - end-placeholder="缁撴潫鏃ユ湡" - :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]" - ></el-date-picker> - </el-form-item> - <el-form-item> - <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button> - <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> - </el-form-item> - </el-form> + <div class="p-2"> + <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave"> + <div v-show="showSearch" class="mb-[10px]"> + <el-card shadow="hover"> + <el-form ref="queryFormRef" :model="queryParams" :inline="true"> + <el-form-item label="鐧诲綍鍦板潃" prop="ipaddr"> + <el-input v-model="queryParams.ipaddr" placeholder="璇疯緭鍏ョ櫥褰曞湴鍧�" clearable @keyup.enter="handleQuery" /> + </el-form-item> + <el-form-item label="鐢ㄦ埛鍚嶇О" prop="userName"> + <el-input v-model="queryParams.userName" placeholder="璇疯緭鍏ョ敤鎴峰悕绉�" clearable @keyup.enter="handleQuery" /> + </el-form-item> + <el-form-item label="鐘舵��" prop="status"> + <el-select v-model="queryParams.status" placeholder="鐧诲綍鐘舵��" clearable> + <el-option v-for="dict in sys_common_status" :key="dict.value" :label="dict.label" :value="dict.value" /> + </el-select> + </el-form-item> + <el-form-item label="鐧诲綍鏃堕棿" style="width: 308px"> + <el-date-picker + v-model="dateRange" + value-format="YYYY-MM-DD HH:mm:ss" + type="daterange" + range-separator="-" + start-placeholder="寮�濮嬫棩鏈�" + end-placeholder="缁撴潫鏃ユ湡" + :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]" + ></el-date-picker> + </el-form-item> + <el-form-item> + <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button> + <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> + </el-form-item> + </el-form> + </el-card> + </div> + </transition> - <el-row :gutter="10" class="mb8"> - <el-col :span="1.5"> - <el-button - type="danger" - plain - icon="Delete" - :disabled="multiple" - @click="handleDelete" - v-hasPermi="['monitor:logininfor:remove']" - >鍒犻櫎</el-button> - </el-col> - <el-col :span="1.5"> - <el-button - type="danger" - plain - icon="Delete" - @click="handleClean" - v-hasPermi="['monitor:logininfor:remove']" - >娓呯┖</el-button> - </el-col> - <el-col :span="1.5"> - <el-button - type="primary" - plain - icon="Unlock" - :disabled="single" - @click="handleUnlock" - v-hasPermi="['monitor:logininfor:unlock']" - >瑙i攣</el-button> - </el-col> - <el-col :span="1.5"> - <el-button - type="warning" - plain - icon="Download" - @click="handleExport" - v-hasPermi="['monitor:logininfor:export']" - >瀵煎嚭</el-button> - </el-col> - <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> - </el-row> + <el-card shadow="hover"> + <template #header> + <el-row :gutter="10" class="mb8"> + <el-col :span="1.5"> + <el-button v-hasPermi="['monitor:logininfor:remove']" type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()"> + 鍒犻櫎 + </el-button> + </el-col> + <el-col :span="1.5"> + <el-button v-hasPermi="['monitor:logininfor:remove']" type="danger" plain icon="Delete" @click="handleClean">娓呯┖</el-button> + </el-col> + <el-col :span="1.5"> + <el-button v-hasPermi="['monitor:logininfor:unlock']" type="primary" plain icon="Unlock" :disabled="single" @click="handleUnlock"> + 瑙i攣 + </el-button> + </el-col> + <el-col :span="1.5"> + <el-button v-hasPermi="['monitor:logininfor:export']" type="warning" plain icon="Download" @click="handleExport">瀵煎嚭</el-button> + </el-col> + <right-toolbar v-model:show-search="showSearch" @query-table="getList"></right-toolbar> + </el-row> + </template> - <el-table ref="logininforRef" v-loading="loading" :data="logininforList" @selection-change="handleSelectionChange" :default-sort="defaultSort" @sort-change="handleSortChange"> - <el-table-column type="selection" width="55" align="center" /> - <el-table-column label="璁块棶缂栧彿" align="center" prop="infoId" /> - <el-table-column label="鐢ㄦ埛鍚嶇О" align="center" prop="userName" :show-overflow-tooltip="true" sortable="custom" :sort-orders="['descending', 'ascending']" /> - <el-table-column label="鍦板潃" align="center" prop="ipaddr" :show-overflow-tooltip="true" /> - <el-table-column label="鐧诲綍鍦扮偣" align="center" prop="loginLocation" :show-overflow-tooltip="true" /> - <el-table-column label="鎿嶄綔绯荤粺" align="center" prop="os" :show-overflow-tooltip="true" /> - <el-table-column label="娴忚鍣�" align="center" prop="browser" :show-overflow-tooltip="true" /> - <el-table-column label="鐧诲綍鐘舵��" align="center" prop="status"> - <template #default="scope"> - <dict-tag :options="sys_common_status" :value="scope.row.status" /> - </template> - </el-table-column> - <el-table-column label="鎻忚堪" align="center" prop="msg" :show-overflow-tooltip="true" /> - <el-table-column label="璁块棶鏃堕棿" align="center" prop="loginTime" sortable="custom" :sort-orders="['descending', 'ascending']" width="180"> - <template #default="scope"> - <span>{{ parseTime(scope.row.loginTime) }}</span> - </template> - </el-table-column> + <el-table + ref="loginInfoTableRef" + v-loading="loading" + :data="loginInfoList" + :default-sort="defaultSort" + @selection-change="handleSelectionChange" + @sort-change="handleSortChange" + > + <el-table-column type="selection" width="55" align="center" /> + <el-table-column label="璁块棶缂栧彿" align="center" prop="infoId" /> + <el-table-column + label="鐢ㄦ埛鍚嶇О" + align="center" + prop="userName" + :show-overflow-tooltip="true" + sortable="custom" + :sort-orders="['descending', 'ascending']" + /> + <el-table-column label="瀹㈡埛绔�" align="center" prop="clientKey" :show-overflow-tooltip="true" /> + <el-table-column label="璁惧绫诲瀷" align="center"> + <template #default="scope"> + <dict-tag :options="sys_device_type" :value="scope.row.deviceType" /> + </template> + </el-table-column> + <el-table-column label="鍦板潃" align="center" prop="ipaddr" :show-overflow-tooltip="true" /> + <el-table-column label="鐧诲綍鍦扮偣" align="center" prop="loginLocation" :show-overflow-tooltip="true" /> + <el-table-column label="鎿嶄綔绯荤粺" align="center" prop="os" :show-overflow-tooltip="true" /> + <el-table-column label="娴忚鍣�" align="center" prop="browser" :show-overflow-tooltip="true" /> + <el-table-column label="鐧诲綍鐘舵��" align="center" prop="status"> + <template #default="scope"> + <dict-tag :options="sys_common_status" :value="scope.row.status" /> + </template> + </el-table-column> + <el-table-column label="鎻忚堪" align="center" prop="msg" :show-overflow-tooltip="true" /> + <el-table-column label="璁块棶鏃堕棿" align="center" prop="loginTime" sortable="custom" :sort-orders="['descending', 'ascending']" width="180"> + <template #default="scope"> + <span>{{ proxy.parseTime(scope.row.loginTime) }}</span> + </template> + </el-table-column> </el-table> - <pagination - v-show="total > 0" - :total="total" - v-model:page="queryParams.pageNum" - v-model:limit="queryParams.pageSize" - @pagination="getList" - /> - </div> + <pagination v-show="total > 0" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" :total="total" @pagination="getList" /> + </el-card> + </div> </template> -<script setup name="Logininfor"> -import { list, delLogininfor, cleanLogininfor, unlockLogininfor } from "@/api/monitor/logininfor"; +<script setup name="Logininfor" lang="ts"> +import { list, delLoginInfo, cleanLoginInfo, unlockLoginInfo } from '@/api/monitor/loginInfo'; +import { LoginInfoQuery, LoginInfoVO } from '@/api/monitor/loginInfo/types'; -const { proxy } = getCurrentInstance(); -const { sys_common_status } = proxy.useDict("sys_common_status"); +const { proxy } = getCurrentInstance() as ComponentInternalInstance; +const { sys_device_type } = toRefs<any>(proxy?.useDict('sys_device_type')); +const { sys_common_status } = toRefs<any>(proxy?.useDict('sys_common_status')); -const logininforList = ref([]); +const loginInfoList = ref<LoginInfoVO[]>([]); const loading = ref(true); const showSearch = ref(true); -const ids = ref([]); +const ids = ref<Array<number | string>>([]); const single = ref(true); const multiple = ref(true); -const selectName = ref(""); +const selectName = ref<Array<string>>([]); const total = ref(0); -const dateRange = ref([]); -const defaultSort = ref({ prop: "loginTime", order: "descending" }); +const dateRange = ref<[DateModelType, DateModelType]>(['', '']); +const defaultSort = ref<any>({ prop: 'loginTime', order: 'descending' }); +const queryFormRef = ref<ElFormInstance>(); +const loginInfoTableRef = ref<ElTableInstance>(); // 鏌ヨ鍙傛暟 -const queryParams = ref({ +const queryParams = ref<LoginInfoQuery>({ pageNum: 1, pageSize: 10, - ipaddr: undefined, - userName: undefined, - status: undefined, - orderByColumn: undefined, - isAsc: undefined + ipaddr: '', + userName: '', + status: '', + orderByColumn: defaultSort.value.prop, + isAsc: defaultSort.value.order }); /** 鏌ヨ鐧诲綍鏃ュ織鍒楄〃 */ -function getList() { +const getList = async () => { loading.value = true; - list(proxy.addDateRange(queryParams.value, dateRange.value)).then(response => { - logininforList.value = response.rows; - total.value = response.total; - loading.value = false; - }); -} + const res = await list(proxy?.addDateRange(queryParams.value, dateRange.value)); + loginInfoList.value = res.rows; + total.value = res.total; + loading.value = false; +}; /** 鎼滅储鎸夐挳鎿嶄綔 */ -function handleQuery() { +const handleQuery = () => { queryParams.value.pageNum = 1; getList(); -} +}; /** 閲嶇疆鎸夐挳鎿嶄綔 */ -function resetQuery() { - dateRange.value = []; - proxy.resetForm("queryRef"); +const resetQuery = () => { + dateRange.value = ['', '']; + queryFormRef.value?.resetFields(); queryParams.value.pageNum = 1; - proxy.$refs["logininforRef"].sort(defaultSort.value.prop, defaultSort.value.order); -} + loginInfoTableRef.value?.sort(defaultSort.value.prop, defaultSort.value.order); +}; /** 澶氶�夋閫変腑鏁版嵁 */ -function handleSelectionChange(selection) { - ids.value = selection.map(item => item.infoId); +const handleSelectionChange = (selection: LoginInfoVO[]) => { + ids.value = selection.map((item) => item.infoId); multiple.value = !selection.length; single.value = selection.length != 1; - selectName.value = selection.map(item => item.userName); -} + selectName.value = selection.map((item) => item.userName); +}; /** 鎺掑簭瑙﹀彂浜嬩欢 */ -function handleSortChange(column, prop, order) { +const handleSortChange = (column: any) => { queryParams.value.orderByColumn = column.prop; queryParams.value.isAsc = column.order; getList(); -} +}; /** 鍒犻櫎鎸夐挳鎿嶄綔 */ -function handleDelete(row) { - const infoIds = row.infoId || ids.value; - proxy.$modal.confirm('鏄惁纭鍒犻櫎璁块棶缂栧彿涓�"' + infoIds + '"鐨勬暟鎹」?').then(function () { - return delLogininfor(infoIds); - }).then(() => { - getList(); - proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛"); - }).catch(() => {}); -} +const handleDelete = async (row?: LoginInfoVO) => { + const infoIds = row?.infoId || ids.value; + await proxy?.$modal.confirm('鏄惁纭鍒犻櫎璁块棶缂栧彿涓�"' + infoIds + '"鐨勬暟鎹」?'); + await delLoginInfo(infoIds); + await getList(); + proxy?.$modal.msgSuccess('鍒犻櫎鎴愬姛'); +}; /** 娓呯┖鎸夐挳鎿嶄綔 */ -function handleClean() { - proxy.$modal.confirm("鏄惁纭娓呯┖鎵�鏈夌櫥褰曟棩蹇楁暟鎹」?").then(function () { - return cleanLogininfor(); - }).then(() => { - getList(); - proxy.$modal.msgSuccess("娓呯┖鎴愬姛"); - }).catch(() => {}); -} +const handleClean = async () => { + await proxy?.$modal.confirm('鏄惁纭娓呯┖鎵�鏈夌櫥褰曟棩蹇楁暟鎹」?'); + await cleanLoginInfo(); + await getList(); + proxy?.$modal.msgSuccess('娓呯┖鎴愬姛'); +}; /** 瑙i攣鎸夐挳鎿嶄綔 */ -function handleUnlock() { +const handleUnlock = async () => { const username = selectName.value; - proxy.$modal.confirm('鏄惁纭瑙i攣鐢ㄦ埛"' + username + '"鏁版嵁椤�?').then(function () { - return unlockLogininfor(username); - }).then(() => { - proxy.$modal.msgSuccess("鐢ㄦ埛" + username + "瑙i攣鎴愬姛"); - }).catch(() => {}); -} + await proxy?.$modal.confirm('鏄惁纭瑙i攣鐢ㄦ埛"' + username + '"鏁版嵁椤�?'); + await unlockLoginInfo(username); + proxy?.$modal.msgSuccess('鐢ㄦ埛' + username + '瑙i攣鎴愬姛'); +}; /** 瀵煎嚭鎸夐挳鎿嶄綔 */ -function handleExport() { - proxy.download("monitor/logininfor/export", { - ...queryParams.value, - }, `config_${new Date().getTime()}.xlsx`); -} +const handleExport = () => { + proxy?.download( + 'monitor/logininfor/export', + { + ...queryParams.value + }, + `logininfor_${new Date().getTime()}.xlsx` + ); +}; -getList(); +onMounted(() => { + getList(); +}); </script> -- Gitblit v1.9.3