docking-vue/src/views/data_directory/basic/index.vue

<template>
  <div>
    <app-search
      v-model="searchForm"
      :options
      label-width="150px"
      @submit="resetPagination"
    />
    <app-table ref="tableRef" v-model:pagination="pagination" :data="list">
      <el-table-column prop="servicePlatformName" label="服务平台名称" />
      <el-table-column prop="companyName" label="企业名称" />
      <el-table-column prop="sectorName" label="所属行业" />
      <el-table-column prop="thirdPlatformName" label="上级平台名称">
      </el-table-column>
      <el-table-column prop="pushCount" label="推送记录" />
      <el-table-column prop="receiveStatus" label="服务平台接口状态">
        <template #default="{ row }">
          {{ translationStatus(row.receiveStatus, receiveOptions) }}
        </template>
      </el-table-column>
      <el-table-column prop="pushStatus" label="上级平台接口状态">
        <template #default="{ row }">
          {{ translationStatus(row.pushStatus, pushOptions) }}
        </template>
      </el-table-column>
      <el-table-column label="操作" width="240">
        <template #default="{ row }">
          <el-button
            type="primary"
            text
            link
            @click="
              router.push({
                path: `${route.path}/records`,
                query: {
                  thirdPlatformId: row.thirdPlatformId,
                  companyId: row.companyId,
                  servicePlatformId: row.servicePlatformId,
                  dataType: dataType,
                },
              })
            "
          >
            推进记录信息
          </el-button>
        </template>
      </el-table-column>
    </app-table>
  </div>
</template>

<script setup>
import { getDataList } from "@/request/data_directory.js";
import useListData from "@/hooks/useListData.js";
import AppSearch from "@/components/search/index.vue";
import AppTable from "@/components/table/index.vue";
import { translationStatus } from "@/assets/js/utils.js";
import { useRouter, useRoute } from "vue-router";
// import { reqMapArr } from "./reqMap.js";
const router = useRouter();
const route = useRoute();
const dataType = defineModel("dataType", {
  type: Number,
  required: true,
  default: 1,
});
const { list, pagination, searchForm, resetPagination, tableRef } = useListData(
  getDataList,
  {
    params: () => ({
      dataType: dataType.value,
    }),
  }
);
const pushOptions = [
  { id: 1, name: "未推送" },
  { id: 2, name: "定时推送" },
  { id: 3, name: "推送成功" },
  { id: 4, name: "重试中" },
  { id: 5, name: "推送失败" },
];
const receiveOptions = [
  { id: 1, name: "接收正常" },
  { id: 2, name: "接收异常" },
];
const options = [
  {
    key: "thirdPlatformName",
    label: "上级平台名称",
  },
  {
    key: "servicePlatformName",
    label: "服务平台名称",
  },
  {
    key: "companyName",
    label: "企业名称",
  },
  {
    key: "receiveStatus",
    label: "接收状态",
    type: "select",
    options: receiveOptions,
  },
  {
    key: "pushStatus",
    label: "推送状态",
    type: "select",
    options: pushOptions,
  },
];
</script>

<style scoped lang="scss"></style>