|
@@ -3,59 +3,33 @@
|
|
|
<div class="interfaceLog_head flex">
|
|
|
<div class="interfaceLog_head_time flex-wrap">
|
|
|
<div class="interfaceLog_head_time_start mr10">
|
|
|
- <el-date-picker
|
|
|
- v-model="timeStart"
|
|
|
- size="default"
|
|
|
- type="datetime"
|
|
|
- placeholder="选择开始日期时间"
|
|
|
- format="YYYY-MM-DD HH:mm:ss"
|
|
|
- value-format="YYYY-MM-DD HH:mm:ss"
|
|
|
- :clearable="false"
|
|
|
- @change="timeSelectHandler"
|
|
|
- />
|
|
|
+ <el-date-picker v-model="timeStart" size="default" type="datetime" placeholder="选择开始日期时间" format="YYYY-MM-DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss" :clearable="false" @change="timeSelectHandler" />
|
|
|
</div>
|
|
|
- <div class="interfaceLog_head_time_end">
|
|
|
- <el-date-picker
|
|
|
- v-model="timeEnd"
|
|
|
- size="default"
|
|
|
- type="datetime"
|
|
|
- placeholder="选择结束日期时间"
|
|
|
- format="YYYY-MM-DD HH:mm:ss"
|
|
|
- value-format="YYYY-MM-DD HH:mm:ss"
|
|
|
- :clearable="false"
|
|
|
- @change="timeSelectHandler"
|
|
|
- />
|
|
|
+ <div class="interfaceLog_head_time_end mr10">
|
|
|
+ <el-date-picker v-model="timeEnd" size="default" type="datetime" placeholder="选择结束日期时间" format="YYYY-MM-DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss" :clearable="false" @change="timeSelectHandler" />
|
|
|
+ </div>
|
|
|
+ <div class="interfaceLog_head_select">
|
|
|
+ <el-select v-model="selMsg" size="medium" @change="timeSelectHandler" placeholder="请选择">
|
|
|
+ <el-option v-for="item in selOptions" :key="item.value" :label="item.label" :value="item.value">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="interfaceLog_head_btn">
|
|
|
- <Search
|
|
|
- v-permission="['log_management_search_button']"
|
|
|
- :is-title="false"
|
|
|
- @get-search-data="getSearchData"
|
|
|
- @clear-search-data="clearSearchData"
|
|
|
- />
|
|
|
+ <Search v-permission="['log_management_search_button']" :is-title="false" @get-search-data="getSearchData" @clear-search-data="clearSearchData" />
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="interfaceLog_content">
|
|
|
<el-row :gutter="24">
|
|
|
<el-col :span="19">
|
|
|
<div class="app-containers">
|
|
|
- <DataTable
|
|
|
- :table-header="tableColumns"
|
|
|
- :table-data="tableData"
|
|
|
- :table-property="{ rowKey: 'ID' }"
|
|
|
- @load="load"
|
|
|
- @row-click="rowClickHandler"
|
|
|
- />
|
|
|
+ <DataTable :table-header="tableColumns" :table-data="tableData" :table-property="{ rowKey: 'ID' }" @load="load" @row-click="rowClickHandler" />
|
|
|
</div>
|
|
|
</el-col>
|
|
|
<el-col :span="5">
|
|
|
<div class="interfaceLog_content_progress">
|
|
|
<el-timeline>
|
|
|
- <el-timeline-item
|
|
|
- v-for="(item, index) in progressList"
|
|
|
- :key="index"
|
|
|
- >
|
|
|
+ <el-timeline-item v-for="(item, index) in progressList" :key="index">
|
|
|
<div class="list">
|
|
|
<div class="list_status"></div>
|
|
|
<div class="list_title">{{ item.logType }}</div>
|
|
@@ -72,117 +46,132 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
<script setup lang="ts">
|
|
|
-import DataTable from '@/components/tableTemp/index.vue'
|
|
|
-import { ElMessage } from 'element-plus'
|
|
|
-import { Query } from '@/api/webApi'
|
|
|
-import { CommonTableColumn } from '~/common';
|
|
|
+import DataTable from "@/components/tableTemp/index.vue";
|
|
|
+import { ElMessage } from "element-plus";
|
|
|
+import { Query } from "@/api/webApi";
|
|
|
+import { CommonTableColumn } from "~/common";
|
|
|
|
|
|
type TableColumn = {
|
|
|
- label: string
|
|
|
- key: string
|
|
|
-}
|
|
|
+ label: string;
|
|
|
+ key: string;
|
|
|
+};
|
|
|
type progressItem = {
|
|
|
- logType: string
|
|
|
- resultCode: string
|
|
|
- logTime: string
|
|
|
- resultDetails?: string
|
|
|
-}
|
|
|
+ logType: string;
|
|
|
+ resultCode: string;
|
|
|
+ logTime: string;
|
|
|
+ resultDetails?: string;
|
|
|
+};
|
|
|
|
|
|
const getSearchData = (text: string) => {
|
|
|
- console.log(text)
|
|
|
-}
|
|
|
-const clearSearchData = () => {}
|
|
|
+ console.log(text);
|
|
|
+};
|
|
|
+const clearSearchData = () => {};
|
|
|
|
|
|
-let page = 0
|
|
|
-const loading = ref(false)
|
|
|
-const noMore = ref(false)
|
|
|
-const loadDisabled = computed(() => loading.value || noMore.value)
|
|
|
+let page = 0;
|
|
|
+const loading = ref(false);
|
|
|
+const noMore = ref(false);
|
|
|
+const loadDisabled = computed(() => loading.value || noMore.value);
|
|
|
//表头
|
|
|
-const tableColumns = ref<CommonTableColumn[]>([])
|
|
|
+const tableColumns = ref<CommonTableColumn[]>([]);
|
|
|
//列表
|
|
|
-const tableData = ref<any[]>([])
|
|
|
+const tableData = ref<any[]>([]);
|
|
|
const resetTable = () => {
|
|
|
- page = 0
|
|
|
- loading.value = false
|
|
|
- noMore.value = false
|
|
|
- tableData.value = []
|
|
|
-}
|
|
|
+ page = 0;
|
|
|
+ loading.value = false;
|
|
|
+ noMore.value = false;
|
|
|
+ tableData.value = [];
|
|
|
+};
|
|
|
onMounted(() => {
|
|
|
- getToday()
|
|
|
- getTableData()
|
|
|
-})
|
|
|
+ getToday();
|
|
|
+ getTableData();
|
|
|
+});
|
|
|
const getTableData = async () => {
|
|
|
try {
|
|
|
- loading.value = true
|
|
|
+ loading.value = true;
|
|
|
const {
|
|
|
code,
|
|
|
returnData: { columnSet, listValues },
|
|
|
} = await Query({
|
|
|
id: DATACONTENT_ID.sysLogTable,
|
|
|
needPage: ++page,
|
|
|
- dataContent: [timeStart.value, timeEnd.value],
|
|
|
- })
|
|
|
+ dataContent: [timeStart.value, timeEnd.value, selMsg.value],
|
|
|
+ });
|
|
|
if (Number(code) === 0) {
|
|
|
- tableColumns.value = columnSet.map(column => ({
|
|
|
+ tableColumns.value = columnSet.map((column) => ({
|
|
|
label: column.columnLabel,
|
|
|
key: column.columnName,
|
|
|
...column,
|
|
|
- }))
|
|
|
+ }));
|
|
|
if (listValues.length === 0) {
|
|
|
- page--
|
|
|
- noMore.value = true
|
|
|
+ page--;
|
|
|
+ noMore.value = true;
|
|
|
}
|
|
|
- tableData.value.push(...listValues)
|
|
|
- loading.value = false
|
|
|
+ tableData.value.push(...listValues);
|
|
|
+ loading.value = false;
|
|
|
} else {
|
|
|
- throw new Error('获取数据失败')
|
|
|
+ throw new Error("获取数据失败");
|
|
|
}
|
|
|
} catch (error: any) {
|
|
|
- page--
|
|
|
- loading.value = false
|
|
|
- ElMessage.error(error.message)
|
|
|
+ page--;
|
|
|
+ loading.value = false;
|
|
|
+ ElMessage.error(error.message);
|
|
|
}
|
|
|
-}
|
|
|
+};
|
|
|
const load = () => {
|
|
|
if (loadDisabled.value) {
|
|
|
- return
|
|
|
+ return;
|
|
|
}
|
|
|
- getTableData()
|
|
|
-}
|
|
|
+ getTableData();
|
|
|
+};
|
|
|
|
|
|
-const timeStart = ref('')
|
|
|
-const timeEnd = ref('')
|
|
|
+const timeStart = ref("");
|
|
|
+const timeEnd = ref("");
|
|
|
+const selMsg = ref("全部");
|
|
|
+const selOptions = ref([
|
|
|
+ {
|
|
|
+ value: "全部",
|
|
|
+ label: "全部",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: "系统",
|
|
|
+ label: "系统",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: "用户",
|
|
|
+ label: "用户",
|
|
|
+ },
|
|
|
+]);
|
|
|
const getToday = () => {
|
|
|
function numberFormat(number) {
|
|
|
- const string = '0' + number
|
|
|
- return string.slice(-2)
|
|
|
+ const string = "0" + number;
|
|
|
+ return string.slice(-2);
|
|
|
}
|
|
|
- const now = new Date()
|
|
|
- const year = now.getFullYear()
|
|
|
- const month = now.getMonth() + 1
|
|
|
- const date = now.getDate()
|
|
|
- const today = `${year}-${numberFormat(month)}-${numberFormat(date)}`
|
|
|
- timeStart.value = `${today} 00:00:00`
|
|
|
- timeEnd.value = `${today} 23:59:59`
|
|
|
-}
|
|
|
+ const now = new Date();
|
|
|
+ const year = now.getFullYear();
|
|
|
+ const month = now.getMonth() + 1;
|
|
|
+ const date = now.getDate();
|
|
|
+ const today = `${year}-${numberFormat(month)}-${numberFormat(date)}`;
|
|
|
+ timeStart.value = `${today} 00:00:00`;
|
|
|
+ timeEnd.value = `${today} 23:59:59`;
|
|
|
+};
|
|
|
const timeSelectHandler = () => {
|
|
|
- const startTime = new Date(timeStart.value).getTime()
|
|
|
- const endTime = new Date(timeEnd.value).getTime()
|
|
|
+ const startTime = new Date(timeStart.value).getTime();
|
|
|
+ const endTime = new Date(timeEnd.value).getTime();
|
|
|
if (startTime > endTime) {
|
|
|
- ElMessage.error('开始时间不能大于结束时间')
|
|
|
- timeEnd.value = ''
|
|
|
- return
|
|
|
+ ElMessage.error("开始时间不能大于结束时间");
|
|
|
+ timeEnd.value = "";
|
|
|
+ return;
|
|
|
}
|
|
|
if (startTime < endTime - (3 * 24 * 60 * 60 - 1) * 1000) {
|
|
|
- ElMessage.error('间隔时间不能大于三天')
|
|
|
- timeEnd.value = ''
|
|
|
- return
|
|
|
+ ElMessage.error("间隔时间不能大于三天");
|
|
|
+ timeEnd.value = "";
|
|
|
+ return;
|
|
|
}
|
|
|
- resetTable()
|
|
|
- getTableData()
|
|
|
-}
|
|
|
+ resetTable();
|
|
|
+ getTableData();
|
|
|
+};
|
|
|
|
|
|
-const progressList = ref<progressItem[]>([])
|
|
|
+const progressList = ref<progressItem[]>([]);
|
|
|
// progressList.value.push(
|
|
|
// ...Array.from({ length: 3 }).map(() => ({
|
|
|
// logType: '更新 Github 模板',
|
|
@@ -191,17 +180,17 @@ const progressList = ref<progressItem[]>([])
|
|
|
// }))
|
|
|
// )
|
|
|
const rowClickHandler = (row, column, event) => {
|
|
|
- progressList.value = []
|
|
|
+ progressList.value = [];
|
|
|
if (row.logObject) {
|
|
|
- tableData.value.forEach(record => {
|
|
|
+ tableData.value.forEach((record) => {
|
|
|
if (record.logObject == row.logObject) {
|
|
|
- progressList.value.push(record)
|
|
|
+ progressList.value.push(record);
|
|
|
}
|
|
|
- })
|
|
|
+ });
|
|
|
} else {
|
|
|
- progressList.value.push(row)
|
|
|
+ progressList.value.push(row);
|
|
|
}
|
|
|
-}
|
|
|
+};
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
.interfaceLog {
|
|
@@ -250,7 +239,7 @@ const rowClickHandler = (row, column, event) => {
|
|
|
position: relative;
|
|
|
&::after {
|
|
|
position: absolute;
|
|
|
- content: '';
|
|
|
+ content: "";
|
|
|
height: 1px;
|
|
|
width: calc(100% + 4px);
|
|
|
background-color: #dfe3ea;
|