bxztApp/packages/screen/src/views/ServiceStationManagePage/index.vue

<template>
  <DynamicTable
    :dataSource="tableData"
    :columns="columns"
    :toolbar="toolbar"
    :autoHeight="true"
    :pagination="true"
  ></DynamicTable>
</template>
  
<script lang="ts" setup>
import DynamicTable from "../../component/DynamicTable";
import { h, onMounted } from "vue";
import { request } from "@/utils/request";

const tableData = [
  {
    county: "潼南",
    road_code: "G319线",
    mile_code: "2654+000",
    level: "国道",
    monthly_traffic: "5625",
    tec_level: "二级",
    name: "三汇停车区",
    service_station_address: "交通公路部门",
  },
  {
    county: "潼南",
    road_code: "G319线",
    mile_code: "2654+000",
    level: "国道",
    monthly_traffic: "5625",
    tec_level: "二级",
    name: "三汇停车区",
    service_station_address: "交通公路部门",
  },
  {
    county: "潼南",
    road_code: "G319线",
    mile_code: "2654+000",
    level: "国道",
    monthly_traffic: "5625",
    tec_level: "二级",
    name: "三汇停车区",
    service_station_address: "交通公路部门",
  },
  {
    county: "潼南",
    road_code: "G319线",
    mile_code: "2654+000",
    level: "国道",
    monthly_traffic: "5625",
    tec_level: "二级",
    name: "三汇停车区",
    service_station_address: "交通公路部门",
  },
  {
    county: "潼南",
    road_code: "G319线",
    mile_code: "2654+000",
    level: "国道",
    monthly_traffic: "5625",
    tec_level: "二级",
    name: "三汇停车区",
    service_station_address: "交通公路部门",
  },
  {
    county: "潼南",
    road_code: "G319线",
    mile_code: "2654+000",
    level: "国道",
    monthly_traffic: "5625",
    tec_level: "二级",
    name: "三汇停车区",
    service_station_address: "交通公路部门",
  },
  {
    county: "潼南",
    road_code: "G319线",
    mile_code: "2654+000",
    level: "国道",
    monthly_traffic: "5625",
    tec_level: "二级",
    name: "三汇停车区",
    service_station_address: "交通公路部门",
  },
  {
    county: "潼南",
    road_code: "G319线",
    mile_code: "2654+000",
    level: "国道",
    monthly_traffic: "5625",
    tec_level: "二级",
    name: "三汇停车区",
    service_station_address: "交通公路部门",
  },
  {
    county: "潼南",
    road_code: "G319线",
    mile_code: "2654+000",
    level: "国道",
    monthly_traffic: "5625",
    tec_level: "二级",
    name: "三汇停车区",
    service_station_address: "交通公路部门",
  },
  {
    county: "潼南",
    road_code: "G319线",
    mile_code: "2654+000",
    level: "国道",
    monthly_traffic: "5625",
    tec_level: "二级",
    name: "三汇停车区",
    service_station_address: "交通公路部门",
  },
];
const getTableData = async () => {
  try {
    const params = {};
    const res = await request({
      url: "/api/asdsad/asdasd",
      method: "GET",
      params: params,
    });
    
  } catch (error) {}
};
onMounted(() => {
  getTableData();
});
const columns = [
  {
    prop: "county",
    label: "区县",
  },
  {
    prop: "road_code",
    label: "路线编码",
    // minWidth: 160,
  },
  {
    prop: "mile_code",
    label: "里程桩号",
  },
  {
    prop: "level",
    label: "行政等级(仅划分:国道、省道、农村公路三类)",
  },
  {
    prop: "monthly_traffic",
    label: "机动车月交通流量",
  },
  {
    prop: "tec_level",
    label: "技术等级",
  },
  {
    prop: "name",
    label: "服务保障点具体名称",
  },
  {
    prop: "type",
    label: "类型",
  },
  {
    label: "操作",
    fixed: "right",
    width: 100,
    render: (row) => () => h(
      ElButton,
      {
        type: "text",
        onClick: () => {
          console.log(row);
        },
      },
      () => "详情"
    ),
  },
];
</script>
  
  <style lang="scss" scoped>
</style>