@arkxos/arkos-system 0.1.0

package/src/views/collect/taskLog.vue

@@ -0,0 +1,238 @@
+<template>
+  <div class="page-container">
+    <!--表格内容栏-->
+    <ac-table
+      ref="dataTable"
+      pkName="id"
+      :filters="filters"
+      :filterFields="filterFields"
+      :columns="columns"
+      @handleCellOperator="handleCellOperator"
+    />
+
+    <!--新增/编辑/查看界面-->
+    <el-dialog
+      v-model="dialogVisible"
+      class="no-padding"
+      :title="dialogTitle"
+      :close-on-click-modal="false"
+      destroy-on-close
+      draggable
+      fullscreen
+    >
+      <div class="page-container">
+        <el-form
+          :model="formData"
+          ref="dataForm"
+          label-width="120px"
+          label-position="right"
+          :disabled="!dialogEdit"
+          :hide-required-asterisk="!dialogEdit"
+        >
+          <el-row>
+            <el-col :span="8">
+              <el-form-item label="任务名称" prop="taskName">
+                <el-input v-model="formData.taskName"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="开始时间" prop="startTime">
+                <el-input v-model="formData.startTime"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="执行时间" prop="executeTime">
+                <el-input v-model="formData.executeTime"></el-input>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="8">
+              <el-form-item label="执行状态" prop="executeStatus">
+                <el-input v-model="formData.executeStatus"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="新增总数量" prop="addCount">
+                <el-input v-model="formData.addCount"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="更新总数量" prop="updateCount">
+                <el-input v-model="formData.updateCount"></el-input>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="24">
+              <!--表格栏-->
+              <el-table
+                ref="collectTable"
+                width="100%"
+                border
+                :data="formData.tableLogList"
+              >
+                <el-table-column
+                  header-align="center"
+                  align="center"
+                  prop="originTable"
+                  label="来源表"
+                  min-width="120"
+                />
+                <el-table-column
+                  header-align="center"
+                  align="center"
+                  prop="targetTable"
+                  label="目标表"
+                  min-width="120"
+                />
+                <el-table-column
+                  header-align="center"
+                  align="center"
+                  prop="startTime"
+                  label="开始时间"
+                  width="160"
+                >
+                  <template #default="{row}">
+                    {{date.formatLongDate(row.startTime)}}
+                  </template>
+                </el-table-column>
+                <el-table-column
+                  header-align="center"
+                  align="center"
+                  prop="endTime"
+                  label="结束时间"
+                  width="160"
+                >
+                  <template #default="{row}">
+                    {{date.formatLongDate(row.endTime)}}
+                  </template>
+                </el-table-column>
+                <el-table-column
+                  header-align="center"
+                  align="right"
+                  prop="executeTime"
+                  label="执行时间"
+                  width="200"
+                >
+                  <template #default="{row}">
+                    {{row.executeTime ? tool.formatTime(row.executeTime) : ''}}
+                  </template>
+                </el-table-column>
+                <el-table-column
+                  header-align="center"
+                  align="center"
+                  prop="executeStatus"
+                  label="执行状态"
+                  width="100"
+                />
+                <el-table-column
+                  header-align="center"
+                  align="right"
+                  prop="originDataCount"
+                  label="来源数量"
+                  width="120"
+                />
+                <el-table-column
+                  header-align="center"
+                  align="right"
+                  prop="addCount"
+                  label="新增数量"
+                  width="120"
+                />
+                <el-table-column
+                  header-align="center"
+                  align="right"
+                  prop="updateCount"
+                  label="更新数量"
+                  width="120"
+                />
+                <el-table-column
+                  header-align="center"
+                  align="center"
+                  prop="errorMessage"
+                  label="错误信息"
+                  min-width="100"
+                />
+              </el-table>
+            </el-col>
+          </el-row>
+        </el-form>
+      </div>
+      <template #footer>
+        <el-button
+          v-if="dialogEdit"
+          size="default"
+          type="info"
+          @click="dialogVisible=false"
+        >取消</el-button>
+        <el-button
+          v-if="!dialogEdit"
+          size="default"
+          type="info"
+          @click="dialogVisible=false"
+        >关闭</el-button>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { ref, nextTick } from 'vue';
+import api from '@/http/api';
+import tool from '@/utils/tool';
+import date from '@/utils/date';
+
+const filters = ref({
+  name: ''
+});
+
+const filterFields = ref([
+  { prop: 'name', label: '任务名称' },
+  { prop: 'executeStatus', label: '执行状态', type: 'select', options: '执行中,执行成功,执行失败' },
+]);
+
+const columns = ref([
+  { prop: 'taskName', label: '任务名称', minWidth: 120, click: true },
+  { prop: 'startTime', label: '开始时间', width: 160, type: 'datetime' },
+  { prop: 'endTime', label: '结束时间', width: 160, type: 'datetime' },
+  {
+    prop: 'executeTime',
+    label: '执行时间',
+    width: 200,
+    align: 'right',
+    formatter: (prop, value) => {
+      return value ? tool.formatTime(value) : '';
+    }
+  },
+  { prop: 'executeStatus', label: '执行状态', width: 120 },
+  { prop: 'addCount', label: '新增总数量', width: 120, align: 'right', type: 'number' },
+  { prop: 'updateCount', label: '更新总数量', width: 120, align: 'right', type: 'number' },
+  { prop: 'createTime', label: '创建时间', width: 160, type: 'datetime' },
+]);
+
+const dataTable = ref();
+const dataForm = ref();
+const formData = ref({});
+const dialogTitle = ref('');
+const dialogVisible = ref(false);
+const dialogEdit = ref(false);
+
+const handleCellOperator = async(property, value, row) => {
+  formData.value = Object.assign({}, await loadData(row.id));
+  formData.value.startTime = date.formatLongDate(formData.value.startTime);
+  formData.value.executeTime = tool.formatTime(formData.value.executeTime);
+  dialogVisible.value = true;
+  dialogEdit.value = false;
+  dialogTitle.value = '查看';
+
+  await nextTick(() => {
+    dataForm.value && dataForm.value.clearValidate();
+  });
+};
+
+const loadData = async(id) => {
+  const res = await api.post('/system/collectTaskLog/queryBy', { id: id });
+  return res.data || {};
+};
+</script>