🎨优化ui

src/views/monitor/logininfor/index.vue

@@ -15,7 +15,6 @@
       <el-form-item label="登录时间">
         <el-date-picker
           v-model="dateRange"
-          style="width: 240px"
           type="daterange"
           range-separator="-"
           start-placeholder="开始日期"
@@ -42,12 +41,17 @@
       <right-toolbar :showSearch="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
-    <el-table v-loading="loading" :data="list" @selection-change="handleSelectionChange">
+    <el-table v-loading="loading" :data="list" border @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="访问编号" align="center" prop="infoId" width="80"/>
+      <el-table-column label="访问编号" align="center" prop="infoId" width="80" />
       <el-table-column label="用户名称" align="center" prop="userName" />
-      <el-table-column label="登录地址" align="center" prop="ipaddr" width="130" :show-overflow-tooltip="true" />
+      <el-table-column label="登录地址" align="center" prop="ipaddr" width="130">
-      <el-table-column label="登录地点" align="center" prop="loginLocation" :show-overflow-tooltip="true" />
+        <template #default="{ row }">
+          <div>{{ row.loginLocation }}</div>
+          <div>{{ row.ipaddr }}</div>
+        </template>
+      </el-table-column>
+      <!-- <el-table-column label="登录地点" align="center" prop="loginLocation"  /> -->
       <el-table-column label="浏览器" align="center" prop="browser" />
       <el-table-column label="操作系统" align="center" prop="os" />
       <el-table-column label="操作状态" align="center" prop="status">
@@ -61,6 +65,11 @@
           <span>{{ scope.row.loginTime }}</span>
         </template>
       </el-table-column>
+      <el-table-column label="操作">
+        <template #default="scope">
+          <el-button type="danger" text plain icon="delete" @click="handleDelete(scope.row)">删除</el-button>
+        </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" />
@@ -92,7 +101,7 @@ const queryParams = reactive({
   pageSize: 10,
   ipaddr: undefined,
   userName: undefined,
-  status: undefined,
+  status: undefined
 })
 
 const { proxy } = getCurrentInstance()
@@ -142,7 +151,7 @@ function handleDelete(row) {
     .$confirm('是否确认删除访问编号为"' + infoIds + '"的数据项?', '警告', {
       confirmButtonText: '确定',
       cancelButtonText: '取消',
-      type: 'warning',
+      type: 'warning'
     })
     .then(function () {
       return delLogininfor(infoIds)
@@ -158,7 +167,7 @@ function handleClean() {
     .$confirm('是否确认清空所有登录日志数据项?', '警告', {
       confirmButtonText: '确定',
       cancelButtonText: '取消',
-      type: 'warning',
+      type: 'warning'
     })
     .then(function () {
       return cleanLogininfor()
@@ -174,7 +183,7 @@ function handleExport() {
     .$confirm('是否确认导出所有操作日志数据项?', '警告', {
       confirmButtonText: '确定',
       cancelButtonText: '取消',
-      type: 'warning',
+      type: 'warning'
     })
     .then(function () {
       return exportLogininfor(queryParams)

src/views/monitor/onlineuser/index.vue

@@ -15,8 +15,12 @@
         </template>
       </el-table-column>
       <el-table-column prop="name" label="用户名" align="center" />
-      <el-table-column prop="userIP" label="用户IP" align="center" />
+      <el-table-column label="登录地点" align="center">
-      <el-table-column prop="location" label="登录地点" align="center" />
+        <template #default="{ row }">
+          <div>{{ row.location }}</div>
+          <div>{{ row.userIP }}</div>
+        </template>
+      </el-table-column>
       <el-table-column prop="browser" label="登录浏览器"></el-table-column>
       <el-table-column prop="loginTime" label="登录时间">
         <template #default="scope">

src/views/monitor/operlog/index.vue

@@ -62,13 +62,13 @@
       </el-table-column>
       <el-table-column label="请求方法" align="center" prop="requestMethod" v-if="columns.showColumn('requestMethod')" />
       <el-table-column label="操作人员" align="center" prop="operName" v-if="columns.showColumn('operName')" />
-      <el-table-column label="主机" align="center" prop="operIp" width="130" :show-overflow-tooltip="true" v-if="columns.showColumn('operIP')" />
+
-      <el-table-column
+      <el-table-column label="操作地址" align="center" prop="operIp" width="120">
-        label="操作地点"
+        <template #default="{ row }">
-        align="center"
+          <div>{{ row.operLocation }}</div>
-        prop="operLocation"
+          <div>{{ row.operIp }}</div>
-        :show-overflow-tooltip="true"
+        </template>
-        v-if="columns.showColumn('operLocation')" />
+      </el-table-column>
       <el-table-column label="操作状态" align="center" prop="status" v-if="columns.showColumn('status')">
         <template #default="{ row }">
           <dict-tag :options="options.statusOptions" :value="row.status"></dict-tag>
@@ -96,6 +96,7 @@
           <el-button size="small" text icon="view" @click="handleView(scope.row, scope.index)" v-hasPermi="['monitor:operlog:query']">
             详细
           </el-button>
+          <el-button size="small" text icon="delete" @click="handleDelete(scope.row)" v-hasPermi="['monitor:operlog:remove']"> 删除 </el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -143,7 +144,9 @@
             </el-form-item>
           </el-col>
           <el-col :lg="24">
-            <el-form-item label="异常信息：" v-if="form.status === 1">{{ form.errorMsg }}</el-form-item>
+            <el-form-item label="异常信息：" v-if="form.status === 1">
+              <div class="text-danger">{{ form.errorMsg }}</div>
+            </el-form-item>
           </el-col>
         </el-row>
       </el-form>
@@ -205,9 +208,9 @@ const columns = ref([
   { visible: true, prop: 'operName', label: '操作人员' },
   // { visible: true, prop: 'deptName', label: '部门' },
   // { visible: true, prop: 'operUrl', label: '请求地址' },
-  { visible: true, prop: 'operIP', label: '请求IP' },
+  // { visible: true, prop: 'operIP', label: '请求IP' },
   { visible: true, prop: 'status', label: '操作状态' },
-  { visible: true, prop: 'operLocation', label: '操作人地址' },
+  // { visible: true, prop: 'operLocation', label: '操作人地址' },
   { visible: true, prop: 'operTime', label: '操作时间' },
   { visible: false, prop: 'method', label: '操作方法' },
   { visible: false, prop: 'operParam', label: '请求参数' },