diff --git a/src/pages/Middle/transport/TrainNumber/TrainNumber/Detail.vue b/src/pages/Middle/transport/TrainNumber/TrainNumber/Detail.vue
index 7a1bc1b..cd31d12 100644
--- a/src/pages/Middle/transport/TrainNumber/TrainNumber/Detail.vue
+++ b/src/pages/Middle/transport/TrainNumber/TrainNumber/Detail.vue
@@ -1,5 +1,213 @@
 <template>
-  <div>
-    1
+  <div class="detail">
+    <div class="detail-container">
+      <a-descriptions
+        size="small"
+        title="车辆信息"
+        layout="vertical"
+        :column="4"
+        bordered
+    >
+      <a-descriptions-item label="车次单号" >
+        {{ data.code }}
+      </a-descriptions-item>
+      <a-descriptions-item label="车辆名称" >
+        {{ data.truck_name }}
+      </a-descriptions-item>
+      <a-descriptions-item label="司机" >
+        {{ data.driver_name }}
+      </a-descriptions-item>
+      <a-descriptions-item label="司机名称" >
+        {{ data.driver_salary }}
+      </a-descriptions-item>
+      <a-descriptions-item label="出车日期">
+        {{ data.outbound_date | formatDate}}
+      </a-descriptions-item>
+      <a-descriptions-item label="回车日期">
+        {{ data.return_date | formatDate}}
+      </a-descriptions-item>
+      <a-descriptions-item label="当前公里数">
+        {{ data.current_distance }}
+      </a-descriptions-item>
+      <a-descriptions-item label="结束公里数">
+        {{ data.end_mileage }}
+      </a-descriptions-item>
+      <!-- <a-descriptions-item label="维修次数">
+        {{ data.repair_count }}
+      </a-descriptions-item>
+      <a-descriptions-item label="更换轮胎次数">
+        {{ data.change_tyre_count }}
+      </a-descriptions-item> -->
+      <!-- <a-descriptions-item label="加油次数">
+        {{ data.add_oil_count }}
+      </a-descriptions-item>
+      <a-descriptions-item label="加油总升数">
+        {{ data.add_oil_litre }}
+      </a-descriptions-item> -->
+      <a-descriptions-item label="车辆备注">
+        {{ data.remark || '无' }}
+      </a-descriptions-item>
+     </a-descriptions>
+    </div>
+    <div class="detail-container">
+      <a-descriptions
+        size="small"
+        title="司机工资补贴"
+        layout="vertical"
+        :column="3"
+        bordered
+    >
+      <a-descriptions-item label="司机工资" >
+        {{ data.driver_salary }}
+      </a-descriptions-item>
+      <a-descriptions-item label="补贴" >
+        {{ data.driver_subsidy }}
+      </a-descriptions-item>
+      <a-descriptions-item label="补贴备注" >
+        {{ data.driver_subsidy_remark }}
+      </a-descriptions-item>
+     </a-descriptions>
+    </div>
+    <div class="detail-container">
+      <a-descriptions
+        size="small"
+        title="基本信息"
+        layout="vertical"
+        :column="6"
+        bordered
+    >
+      <a-descriptions-item label="客户" span="1.5">
+        {{ data.custom_name }}
+      </a-descriptions-item>
+      <a-descriptions-item label="供应商" span="1.5">
+        {{ data.supplier_name }}
+      </a-descriptions-item>
+      <a-descriptions-item label="运输物品" span="3">
+        {{ data.soil_quality_material }}
+      </a-descriptions-item>
+      <a-descriptions-item label="供应商出库吨位" >
+        {{ data.supplier_outbound_tonnage }}
+      </a-descriptions-item>
+      <a-descriptions-item label="购入单价" >
+        {{ data.buy_unit_price }}
+      </a-descriptions-item>
+      <a-descriptions-item label="购入总价" >
+        {{ data.buy_total_price }}
+      </a-descriptions-item>
+      <a-descriptions-item label="客户入库吨位" >
+        {{ data.customer_warehousing_tonnage }}
+      </a-descriptions-item>
+      <a-descriptions-item label="单价" >
+        {{ data.unit_price }}
+      </a-descriptions-item>
+      <a-descriptions-item label="总价" >
+        {{ data.total_price }}
+      </a-descriptions-item>
+     </a-descriptions>
+    </div>
   </div>
-</template>
\ No newline at end of file
+</template>
+
+<script>  
+  import BASE_URL from '@/services/Middle/transport/TrainNumber/api.js';
+  import XEUtils from 'xe-utils'  // 加载xe-utils 
+  export default {
+    name: 'Detail',
+    data() {
+      return {
+        actions: {
+        // =============================== 接口地址 自动生成 Start ===============================
+        TrainNumberList: `${BASE_URL.BASE_URL}/TrainNumber/v1/train/number/list`, // 车次列表
+        TrainNumberSearch: `${BASE_URL.BASE_URL}/TrainNumber/v1/train/number/search`, // 车次搜索
+        TrainNumberDetail: `${BASE_URL.BASE_URL}/TrainNumber/v1/train/number/detail`, // 车次详情
+        TrainNumberCreate: `${BASE_URL.BASE_URL}/TrainNumber/v1/train/number/create`, // 创建车次
+        TrainNumberUpdate: `${BASE_URL.BASE_URL}/TrainNumber/v1/train/number/update`, // 更新车次
+        TrainNumberDelete: `${BASE_URL.BASE_URL}/TrainNumber/v1/train/number/detele`, // 删除车次
+        TrainNumberBatchDelete: `${BASE_URL.BASE_URL}/TrainNumber/v1/train/number/batchDelete`, // 批量删除车次
+
+        // =============================== 接口地址 自动生成 End ===============================
+      },
+      FieldName:'train_number',
+      // 车辆信息    
+      data: {}
+      }
+    },
+    created() {
+      // 获取路由的id参数
+      let dataId = this.getDataId();
+      this.initDetailData(dataId)
+    },
+    filters: {
+    formatDate: function (value) {
+      if (!value) {
+            return '';
+        }
+        if (typeof (value) == "number") {
+          value = new Date(value * 1000);
+        }
+        return XEUtils.toDateString(value, 'yyyy-MM-dd')
+    },
+    // 格式化状态
+    formatStatus: function (value) {
+      if (value === 1) {
+        return "正常";
+
+        // return "success";
+      } else if (value === 0) {
+        return "停用";
+        // return "error";
+      } else {
+        return "未知";
+        // return "warning";
+      }
+    },
+  },
+    methods: {
+       // 获取路由的id参数
+      getDataId() {
+        let dataId = this.dataId;
+        if (this.$route.params.id) {
+          dataId = this.$route.params.id;
+        }
+        if (!dataId) {
+          dataId = 0;
+        }
+        return dataId;
+      },
+      // 获取车辆信息
+       initDetailData(ID) {
+      // this.dataId 转换为bigint
+      let dataId = this.$mk.toBigInt(ID);
+      this.$zk.post({
+        url: this.actions.TrainNumberDetail,
+        data: {
+          id: dataId
+        },
+        loading: "加载中...",
+        useBigInt: true,
+        config: {
+          headers: {
+            'Content-Type': 'application/json'
+          }
+        }
+      }).then(a => {
+        this.data = a.data[this.FieldName];
+      }).catch((a) => {
+        this.$mk.error(a.msg, "aaa");
+      });
+    },
+    }
+  }
+
+</script>
+<style scoped>
+.detail-container {
+  padding: 20px;
+  background: #fff;
+  color: #000;
+  margin-bottom: 20px;
+}
+
+
+
+</style>
\ No newline at end of file