优化任务ui&任务新增网络请求方式

src/views/monitor/job/index.vue

@@ -41,7 +41,7 @@
     </el-row>
     <el-row>
       <el-table ref="tasks" v-loading="loading" :data="dataTasks" border="" row-key="id" @sort-change="handleSortable">
-        <el-table-column type="index" :index="handleIndexCalc" label="#" align="center" />
+        <!-- <el-table-column type="index" :index="handleIndexCalc" label="#" align="center" /> -->
         <el-table-column prop="id" label="id" align="center" :show-overflow-tooltip="true" v-if="columns.showColumn('id')" />
         <el-table-column prop="name" label="任务名称" width="100" />
         <el-table-column prop="taskType" label="任务类型" align="center" v-if="columns.showColumn('taskType')">
@@ -72,7 +72,7 @@
           label="程序集名称"
           v-if="columns.showColumn('assemblyName')"
           :show-overflow-tooltip="true" />
-        <el-table-column prop="className" align="center" label="任务类名" v-if="columns.showColumn('className')" :show-overflow-tooltip="true" />
+        <el-table-column prop="className" align="center" label="任务类名" v-if="columns.showColumn('className')" />
         <el-table-column prop="runTimes" align="center" label="运行次数" width="80" />
         <el-table-column prop="intervalSecond" align="center" label="执行间隔(s)" v-if="columns.showColumn('intervalSecond')" width="90" />
         <el-table-column prop="cron" align="center" label="运行表达式" v-if="columns.showColumn('cron')" :show-overflow-tooltip="true" />
@@ -96,7 +96,6 @@
             <el-link
               size="small"
               class="ml10"
-              type="primary"
               v-if="scope.row.isStart"
               v-hasPermi="['monitor:job:run']"
               icon="remove"
@@ -105,7 +104,6 @@
               {{ $t('btn.run') }}
             </el-link>
             <el-link
-              type="warning"
               size="small"
               class="ml10"
               v-if="scope.row.isStart"
@@ -118,7 +116,6 @@
             </el-link>
 
             <el-link
-              type="primary"
               size="small"
               class="ml10"
               v-if="!scope.row.isStart"
@@ -131,7 +128,6 @@
             <el-link
               class="ml10"
               size="small"
-              type="info"
               v-if="!scope.row.isStart"
               v-hasPermi="['monitor:job:edit']"
               icon="edit"
@@ -141,7 +137,6 @@
             </el-link>
 
             <el-link
-              type="danger"
               class="ml10"
               size="small"
               v-if="!scope.row.isStart"
@@ -201,7 +196,12 @@
           <el-col :lg="24" v-if="form.taskType == 2">
             <el-form-item label="apiUrl" prop="apiUrl">
               <el-input v-model="form.apiUrl" placeholder="远程调用接口url">
-                <template #prepend>http://</template>
+                <template #prepend>
+                  <el-select v-model="form.requestMethod" placeholder="请选择请求方式" style="width: 125px">
+                    <el-option label="GET" value="GET" />
+                    <el-option label="POST" value="POST" />
+                  </el-select>
+                </template>
               </el-input>
             </el-form-item>
           </el-col>
@@ -383,7 +383,7 @@ const queryRef = ref(null)
 // 任务状态字典
 const isStartOptions = ref([
   { dictLabel: '运行中', dictValue: 'true', listClass: 'success' },
-  { dictLabel: '已停止', dictValue: 'false' }
+  { dictLabel: '已停止', dictValue: 'false', listClass: 'danger' }
 ])
 // 任务组名字典
 const jobGroupOptions = ref([])
@@ -402,7 +402,8 @@ const state = reactive({
     beginTime: [{ required: false, message: '请选择开始日期', trigger: 'blur' }],
     endTime: [{ required: false, message: '请选择结束日期', trigger: 'blur' }],
     intervalSecond: [{ message: '请设置执行间隔', type: 'number', trigger: 'blur' }],
-    sqlText: [{ required: true, message: '请输入sql语句', trigger: 'blur' }]
+    sqlText: [{ required: true, message: '请输入sql语句', trigger: 'blur' }],
+    requestMethod: [{ required: true, message: '请选择请求方式', trigger: 'blur' }]
   },
   options: {
     // 触发器类型
@@ -412,8 +413,8 @@ const state = reactive({
     ],
     taskTypeOptions: [
       { dictLabel: '程序集', dictValue: '1' },
-      { dictLabel: 'api请求', dictValue: '2' },
+      { dictLabel: 'api请求', dictValue: '2', listClass: 'primary' },
-      { dictLabel: 'sql脚本', dictValue: '3' }
+      { dictLabel: 'sql脚本', dictValue: '3', listClass: 'info' }
     ]
   }
 })
@@ -569,14 +570,12 @@ function reset() {
     endTime: undefined,
     intervalSecond: 1,
     cron: undefined,
-    taskType: 1
+    taskType: 1,
+    requestMethod: 'GET'
   }
   proxy.resetForm('formRef')
 }
-// 自动计算分页 Id
+
-function handleIndexCalc(index) {
-  return (queryParams.PageNum - 1) * queryParams.pageSize + index + 1
-}
 // 取消按钮
 function cancel() {
   open.value = false

src/views/monitor/job/log.vue

@@ -53,7 +53,11 @@
       <el-table-column label="任务组名" align="center" prop="jobGroup" :formatter="jobGroupFormat" :show-overflow-tooltip="true" />
       <el-table-column label="调用目标字符串" align="center" prop="invokeTarget" :show-overflow-tooltip="true" />
       <el-table-column label="日志信息" align="center" prop="jobMessage" :show-overflow-tooltip="true" />
-      <el-table-column label="执行状态" align="center" prop="status" :formatter="statusFormat" />
+      <el-table-column label="执行状态" align="center" prop="status">
+        <template #default="scope">
+          <dict-tag :options="statusOptions" :value="scope.row.status" />
+        </template>
+      </el-table-column>
       <el-table-column label="作业用时" align="center" prop="elapsed">
         <template #default="scope">
           <span :style="scope.row.elapsed < 1000 ? 'color:green' : scope.row.elapsed < 3000 ? 'color:orange' : 'color:red'">
@@ -162,10 +166,6 @@ function getList() {
   })
 }
 
-// 执行状态字典翻译
-function statusFormat(row, column) {
-  return proxy.selectDictLabel(statusOptions.value, row.status)
-}
 // 任务组名字典翻译
 function jobGroupFormat(row, column) {
   return proxy.selectDictLabel(jobGroupOptions.value, row.jobGroup)

src/views/monitor/logininfor/index.vue

@@ -44,7 +44,7 @@
 
     <el-table v-loading="loading" :data="list" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="访问编号" align="center" prop="infoId" />
+      <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="loginLocation" :show-overflow-tooltip="true" />

src/views/monitor/operlog/index.vue

@@ -7,14 +7,14 @@
       <el-form-item label="操作人员" prop="operName">
         <el-input v-model="queryParams.operName" placeholder="请输入操作人员" clearable @keyup.enter="handleQuery" />
       </el-form-item>
-      <el-form-item label="类型" prop="businessType">
+      <el-form-item label="业务类型" prop="businessType">
         <el-select v-model="queryParams.businessType" placeholder="操作类型" clearable>
-          <el-option v-for="dict in businessTypeOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue" />
+          <el-option v-for="dict in options.businessTypeOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue" />
         </el-select>
       </el-form-item>
-      <el-form-item label="状态" prop="status">
+      <el-form-item label="操作状态" prop="status">
         <el-select v-model="queryParams.status" placeholder="操作状态" clearable>
-          <el-option v-for="dict in statusOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue" />
+          <el-option v-for="dict in options.statusOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue" />
         </el-select>
       </el-form-item>
       <el-form-item label="操作时间">
@@ -23,7 +23,8 @@
           type="daterange"
           range-separator="-"
           start-placeholder="开始日期"
-          end-placeholder="结束日期"></el-date-picker>
+          end-placeholder="结束日期"
+          :shortcuts="dateOptions"></el-date-picker>
       </el-form-item>
       <el-form-item>
         <el-button type="primary" icon="search" @click="handleQuery">搜索</el-button>
@@ -52,7 +53,7 @@
       <el-table-column label="系统模块" align="center" prop="title" :show-overflow-tooltip="true" />
       <el-table-column prop="businessType" label="业务类型" align="center">
         <template #default="scope">
-          <dict-tag :options="businessTypeOptions" :value="scope.row.businessType" />
+          <dict-tag :options="options.businessTypeOptions" :value="scope.row.businessType" />
         </template>
       </el-table-column>
       <el-table-column label="请求方式" align="center" prop="requestMethod" />
@@ -61,7 +62,7 @@
       <el-table-column label="操作地点" align="center" prop="operLocation" :show-overflow-tooltip="true" />
       <el-table-column label="操作状态" align="center" prop="status">
         <template #default="{ row }">
-          <dict-tag :options="statusOptions" :value="row.status"></dict-tag>
+          <dict-tag :options="options.statusOptions" :value="row.status"></dict-tag>
         </template>
       </el-table-column>
       <el-table-column label="用时" align="center" prop="elapsed">
@@ -105,20 +106,22 @@
           </el-col>
           <el-col :lg="12">
             <el-form-item label="操作类型：">
-              <dict-tag :options="businessTypeOptions" :value="form.businessType" />
+              <dict-tag :options="options.businessTypeOptions" :value="form.businessType" />
             </el-form-item>
           </el-col>
           <el-col :lg="24">
-            <el-form-item label="请求参数：">{{ form.operParam }}</el-form-item>
+            <el-form-item label="请求参数：">
+              <el-input type="textarea" disabled rows="5" v-model="form.operParam"> </el-input>
+            </el-form-item>
           </el-col>
           <el-col :lg="24">
             <el-form-item label="返回结果：">
-              {{ form.jsonResult }}
+              <el-input type="textarea" disabled rows="5" v-model="form.jsonResult"> </el-input>
             </el-form-item>
           </el-col>
           <el-col :lg="12">
             <el-form-item label="操作状态：">
-              <dict-tag :options="statusOptions" :value="form.status"></dict-tag>
+              <dict-tag :options="options.statusOptions" :value="form.status"></dict-tag>
             </el-form-item>
           </el-col>
           <el-col :lg="12">
@@ -169,17 +172,22 @@ const state = reactive({
     title: undefined,
     operName: undefined,
     businessType: undefined,
-    status: undefined,
+    status: undefined
   },
+  options: {
+    //业务类型（0其它 1新增 2修改 3删除）选项列表 格式 eg:{ dictLabel: '标签', dictValue: '0'}
+    businessTypeOptions: [],
+    statusOptions: []
+  }
 })
-const { form, queryParams } = toRefs(state)
+const { form, queryParams, options } = toRefs(state)
 var dictParams = [
   { dictType: 'sys_oper_type', columnName: 'businessTypeOptions' },
-  { dictType: 'sys_common_status', columnName: 'statusOptions' },
+  { dictType: 'sys_common_status', columnName: 'statusOptions' }
 ]
 proxy.getDicts(dictParams).then((response) => {
   response.data.forEach((element) => {
-    proxy[element.columnName] = element.list
+    state.options[element.columnName] = element.list
   })
 })
 /** 查询登录日志 */
@@ -235,7 +243,7 @@ function reset() {
     status: 0,
     errorMsg: undefined,
     operTime: undefined,
-    elapsed: 0,
+    elapsed: 0
   }
   proxy.resetForm('formRef')
 }
@@ -252,7 +260,7 @@ function handleDelete(row) {
     .$confirm('是否确认删除日志编号为"' + operIds + '"的数据项?', '警告', {
       confirmButtonText: '确定',
       cancelButtonText: '取消',
-      type: 'warning',
+      type: 'warning'
     })
     .then(function () {
       return delOperlog(operIds)
@@ -268,7 +276,7 @@ function handleClean() {
     .$confirm('是否确认清空所有操作日志数据项?', '警告', {
       confirmButtonText: '确定',
       cancelButtonText: '取消',
-      type: 'warning',
+      type: 'warning'
     })
     .then(function () {
       return cleanOperlog()
@@ -284,7 +292,7 @@ function handleExport() {
     .$confirm('是否确认导出所有操作日志?', '警告', {
       confirmButtonText: '确定',
       cancelButtonText: '取消',
-      type: 'warning',
+      type: 'warning'
     })
     .then(() => {
       exportOperlog(queryParams.value).then((response) => {