hotline-web/src/views/dataShare/taskDetail.vue

<template>
  <div class="dataShare-taskDetail-container layout-pd">
    <el-card shadow="never">
      <ProTable
        ref="proTableRef"
        :columns="columns"
        :data="state.tableData"
        @updateTable="queryList"
        :loading="state.loading"
        :total="state.total"
        v-model:page-index="state.queryParams.PageIndex"
        v-model:page-size="state.queryParams.PageSize"
        border
      >
      </ProTable>
    </el-card>
  </div>
</template>
<script setup lang="tsx" name="dataShareTaskDetail">
import { onMounted, reactive, ref } from 'vue';
import { getPushTaskDetail } from "@/api/dataShare";
import { useRoute } from "vue-router";
import { formatDate } from "@/utils/formatTime";
const proTableRef = ref<RefType>(); // 表格ref
// 表格配置项
const columns = ref<any[]>([
  {
    prop: 'isSuccess',
    label: '推送状态',
    align: 'center',
    render: (scope) => {
      return <span>{scope.row.isSuccess ? '成功' : '失败'}</span>;
    },
  },
  { prop: 'result', label: '返回数据', align: 'center' },
  { prop: 'requestInfo', label: '其他平台返回数据', align: 'center' },
  {
    prop: 'creationTime',
    label: '创建时间',
    align: 'center',
    width: 170,
    render: (scope) => {
      return <span>{formatDate(scope.row.creationTime, 'YYYY-mm-dd HH:MM:SS')}</span>;
    },
  },
]);
// 定义变量内容
const ruleFormRef = ref<RefType>(); // 表单ref
const state = reactive({
  queryParams: {
    // 查询条件
    PageIndex: 1,
    PageSize: 10,
  },
  tableData: [], //表单
  loading: false, // 加载
  total: 0, // 总数
});
/** 获取列表 */
const historyParams = history.state;
const route = useRoute();
const queryList = () => {
  state.loading = true;
  const request = {
    PageIndex: state.queryParams.PageIndex,
    PageSize: state.queryParams.PageSize,
    StartTime: historyParams.StartTime,
    EndTime: historyParams.EndTime,
    IsSuccess: historyParams.IsSuccess,
    Id: route.params.id
  }
  getPushTaskDetail(request)
    .then((res: any) => {
      state.tableData = res.result?.items ?? [];
      state.total = res.result?.total ?? 0;
      state.loading = false;
    })
    .catch(() => {
      state.loading = false;
    });
};
onMounted(() => {
  queryList();
});
</script>