diff --git a/src/option/distribution/VehicleArrivalManagement.js b/src/option/distribution/VehicleArrivalManagement.js
new file mode 100644
index 00000000..7c73a22e
--- /dev/null
+++ b/src/option/distribution/VehicleArrivalManagement.js
@@ -0,0 +1,627 @@
+export const columnList = [
+  {
+    prop: '',
+    label: '复选框',
+    type: 0,
+    width: 55,
+    fixed: true,
+  },
+  {
+    prop: '',
+    label: '序号',
+    type: 12,
+    values: '',
+    width: 55,
+    fixed: true,
+  },
+  {
+    prop: 'billladingCode',
+    label: '批次号',
+    type: 13,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: true,
+    sortable: true,
+    head: false,
+  },
+  {
+    prop: 'carNumber',
+    label: '路线',
+    type: 13,
+    values: '',
+    width: '200',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'driverName',
+    label: '计划装车',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'driverPhone',
+    label: '装车件数',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'warehouseName',
+    label: '在车件数',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'lineNameTitle',
+    label: '卸车件数',
+    type: 1,
+    values: '',
+    width: '180',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'nodeNub',
+    label: '满载率',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'startTime',
+    label: '滞留扫描',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'endTime',
+    label: '直发商家',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'planVolume',
+    label: '类型',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'billladingStatus',
+    label: '车辆状态',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'chargeType',
+    label: '主驾司机',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalFee',
+    label: '主驾司机手机号',
+    type: 2,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'remark',
+    label: '车牌号',
+    type: 2,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'carrierName',
+    label: '起点仓库',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'waybillCount',
+    label: '终点仓库',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalNum',
+    label: '到车时间',
+    type: 4,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '实际发车时间',
+    type: 4,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalVolume',
+    label: '总运输费用',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '现付运输费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    isshowSummary: true,
+    sortable: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '油费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'totalVolume',
+    label: '路桥费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '回付运输费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '到付运输费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '整车信息费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'totalVolume',
+    label: '整车保险费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '整车落地费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '发站装车费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'totalVolume',
+    label: '发站其他费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '到站卸车费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '到站其它费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '经办人',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalVolume',
+    label: '创建时间',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '卸车总收入',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '操作',
+    type: 6,
+    values: '',
+    width: '200',
+    checkarr: [],
+    fixed: 'right',
+    sortable: false,
+  },
+];
+
+/** 装车详情列表 */
+export const detailsColumnList = [
+  {
+    prop: '',
+    label: '复选框',
+    type: 0,
+    width: 55,
+    fixed: true,
+  },
+  {
+    prop: '',
+    label: '序号',
+    type: 12,
+    values: '',
+    width: 55,
+    fixed: true,
+  },
+  {
+    prop: 'orderCode',
+    label: '运单号',
+    type: 13,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: true,
+    sortable: true,
+    head: false,
+  },
+  {
+    prop: 'orderCode',
+    label: '合同号',
+    type: 13,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: true,
+    sortable: true,
+    head: false,
+  },
+  {
+    prop: 'orderPackageCode',
+    label: '包条码',
+    type: 13,
+    values: '',
+    width: '200',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'driverName',
+    label: '计划目的地',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'driverPhone',
+    label: '目的地',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'warehouseName',
+    label: '装卸状态',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'lineNameTitle',
+    label: '订单来源',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'nodeNub',
+    label: '装车仓库',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'startTime',
+    label: '扫码时间',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'endTime',
+    label: '装卸仓库',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'planVolume',
+    label: '卸车时间',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'billladingStatus',
+    label: '装车类型',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'chargeType',
+    label: '是否补录',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalFee',
+    label: '是否齐套',
+    type: 3,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'remark',
+    label: '托盘码',
+    type: 2,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'carrierName',
+    label: '一级品类',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'waybillCount',
+    label: '二级品类',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalNum',
+    label: '三级品类',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '物料名称',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalVolume',
+    label: '装车扫描人',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '卸车人',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '同步状态',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+];
diff --git a/src/option/distribution/VehicleStowage.js b/src/option/distribution/VehicleStowage.js
new file mode 100644
index 00000000..2b341805
--- /dev/null
+++ b/src/option/distribution/VehicleStowage.js
@@ -0,0 +1,627 @@
+export const columnList = [
+  {
+    prop: '',
+    label: '复选框',
+    type: 0,
+    width: 55,
+    fixed: true,
+  },
+  {
+    prop: '',
+    label: '序号',
+    type: 12,
+    values: '',
+    width: 55,
+    fixed: true,
+  },
+  {
+    prop: 'billladingCode',
+    label: '批次号',
+    type: 13,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: true,
+    sortable: true,
+    head: false,
+  },
+  {
+    prop: 'carNumber',
+    label: '路线',
+    type: 13,
+    values: '',
+    width: '180',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'driverName',
+    label: '计划装车',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'driverPhone',
+    label: '装车件数',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'warehouseName',
+    label: '在车件数',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'lineNameTitle',
+    label: '卸车件数',
+    type: 1,
+    values: '',
+    width: '180',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'nodeNub',
+    label: '满载率',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'startTime',
+    label: '滞留扫描',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'endTime',
+    label: '直发商家',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'planVolume',
+    label: '类型',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'billladingStatus',
+    label: '车辆状态',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'chargeType',
+    label: '主驾司机',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalFee',
+    label: '主驾司机手机号',
+    type: 2,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'remark',
+    label: '车牌号',
+    type: 2,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'carrierName',
+    label: '起点仓库',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'waybillCount',
+    label: '终点仓库',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalNum',
+    label: '到车时间',
+    type: 4,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '实际发车时间',
+    type: 4,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalVolume',
+    label: '总运输费用',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '现付运输费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    isshowSummary: true,
+    sortable: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '油费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'totalVolume',
+    label: '路桥费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '回付运输费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '到付运输费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '整车信息费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'totalVolume',
+    label: '整车保险费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '整车落地费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '发站装车费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'totalVolume',
+    label: '发站其他费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '到站卸车费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '到站其它费',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '经办人',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalVolume',
+    label: '创建时间',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '卸车总收入',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isshowSummary: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '操作',
+    type: 6,
+    values: '',
+    width: '400',
+    checkarr: [],
+    fixed: 'right',
+    sortable: false,
+  },
+];
+
+/** 装车详情列表 */
+export const detailsColumnList = [
+  {
+    prop: '',
+    label: '复选框',
+    type: 0,
+    width: 55,
+    fixed: true,
+  },
+  {
+    prop: '',
+    label: '序号',
+    type: 12,
+    values: '',
+    width: 55,
+    fixed: true,
+  },
+  {
+    prop: 'orderCode',
+    label: '运单号',
+    type: 13,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: true,
+    sortable: true,
+    head: false,
+  },
+  {
+    prop: 'orderCode',
+    label: '合同号',
+    type: 13,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: true,
+    sortable: true,
+    head: false,
+  },
+  {
+    prop: 'orderPackageCode',
+    label: '包条码',
+    type: 13,
+    values: '',
+    width: '200',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'driverName',
+    label: '计划目的地',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'driverPhone',
+    label: '目的地',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'warehouseName',
+    label: '装卸状态',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'lineNameTitle',
+    label: '订单来源',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'nodeNub',
+    label: '装车仓库',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'startTime',
+    label: '扫码时间',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'endTime',
+    label: '装卸仓库',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'planVolume',
+    label: '卸车时间',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'billladingStatus',
+    label: '装车类型',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'chargeType',
+    label: '是否补录',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalFee',
+    label: '是否齐套',
+    type: 3,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'remark',
+    label: '托盘码',
+    type: 2,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'carrierName',
+    label: '一级品类',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'waybillCount',
+    label: '二级品类',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalNum',
+    label: '三级品类',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '物料名称',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalVolume',
+    label: '装车扫描人',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '卸车人',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '同步状态',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+];
diff --git a/src/option/distribution/zeroAdditionalRecording.js b/src/option/distribution/zeroAdditionalRecording.js
new file mode 100644
index 00000000..bf33730b
--- /dev/null
+++ b/src/option/distribution/zeroAdditionalRecording.js
@@ -0,0 +1,480 @@
+export const oldColumnList = [
+  {
+    prop: '',
+    label: '复选框',
+    type: 0,
+    width: 55,
+    fixed: true,
+  },
+  {
+    prop: '',
+    label: '序号',
+    type: 12,
+    values: '',
+    width: 55,
+    fixed: true,
+  },
+  {
+    prop: 'orderCode',
+    label: '运单号',
+    type: 13,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: true,
+    sortable: true,
+    head: false,
+  },
+  {
+    prop: 'orderCode',
+    label: '合同号',
+    type: 13,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: true,
+    sortable: true,
+    head: false,
+  },
+  {
+    prop: 'orderPackageCode',
+    label: '包条码',
+    type: 13,
+    values: '',
+    width: '200',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'driverName',
+    label: '计划目的地',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'driverPhone',
+    label: '目的地',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'warehouseName',
+    label: '装卸状态',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'lineNameTitle',
+    label: '订单来源',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'nodeNub',
+    label: '装车仓库',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'startTime',
+    label: '扫码时间',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'endTime',
+    label: '装卸仓库',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'planVolume',
+    label: '卸车时间',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'billladingStatus',
+    label: '装车类型',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'chargeType',
+    label: '是否补录',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalFee',
+    label: '是否齐套',
+    type: 3,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'remark',
+    label: '托盘码',
+    type: 2,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'carrierName',
+    label: '一级品类',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'waybillCount',
+    label: '二级品类',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalNum',
+    label: '三级品类',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '物料名称',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalVolume',
+    label: '装车扫描人',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '卸车人',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '同步状态',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+];
+
+/** 装车详情列表 */
+export const newColumnList = [
+  {
+    prop: '',
+    label: '复选框',
+    type: 0,
+    width: 55,
+    fixed: true,
+  },
+  {
+    prop: '',
+    label: '序号',
+    type: 12,
+    values: '',
+    width: 55,
+    fixed: true,
+  },
+  {
+    prop: 'orderCode',
+    label: '运单号',
+    type: 13,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: true,
+    sortable: true,
+    head: false,
+  },
+  {
+    prop: 'orderCode',
+    label: '合同号',
+    type: 13,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: true,
+    sortable: true,
+    head: false,
+  },
+  {
+    prop: 'orderPackageCode',
+    label: '包条码',
+    type: 13,
+    values: '',
+    width: '200',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'driverName',
+    label: '计划目的地',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'driverPhone',
+    label: '目的地',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'warehouseName',
+    label: '装卸状态',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'lineNameTitle',
+    label: '订单来源',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'nodeNub',
+    label: '装车仓库',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'startTime',
+    label: '扫码时间',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'endTime',
+    label: '装卸仓库',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'planVolume',
+    label: '卸车时间',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'billladingStatus',
+    label: '装车类型',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'chargeType',
+    label: '是否补录',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalFee',
+    label: '是否齐套',
+    type: 3,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'remark',
+    label: '托盘码',
+    type: 2,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'carrierName',
+    label: '一级品类',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'waybillCount',
+    label: '二级品类',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalNum',
+    label: '三级品类',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '物料名称',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalVolume',
+    label: '装车扫描人',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'createUserName',
+    label: '卸车人',
+    type: 2,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'totalWeight',
+    label: '同步状态',
+    type: 3,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+];
diff --git a/src/router/views/index.js b/src/router/views/index.js
index bd6c148b..88db215d 100644
--- a/src/router/views/index.js
+++ b/src/router/views/index.js
@@ -175,6 +175,24 @@ export default [
       },
     ],
   },
+  {
+    path: '/distribution/artery',
+    component: Layout,
+    redirect: '/distribution/artery/zeroAdditionalRecording',
+    children: [
+      {
+        path: 'zeroAdditionalRecording',
+        name: '零担补录',
+        meta: {
+          i18n: 'data',
+        },
+        component: () =>
+          import(
+            /* webpackChunkName: "views" */ '@/views/distribution/artery/zeroAdditionalRecording.vue'
+          ),
+      },
+    ],
+  },
   // {
   //   path: '/basic/pdarecords/basicPdarecords',
   //   name:'pda维修记录',
@@ -226,6 +244,15 @@ export default [
             /* webpackChunkName: "views" */ '@/views/distribution/inventory/arteryDistrilbutionBillLadingListDetails.vue'
           ),
       },
+      {
+        path: '/distribution/inventory/BookingNote',
+        name: '货物托运单',
+        meta: {
+          data: 'data',
+        },
+        component: () =>
+          import(/* webpackChunkName: "views" */ '@/views/distribution/inventory/BookingNote.vue'),
+      },
     ],
   },
   {
@@ -1076,18 +1103,18 @@ export default [
     ],
   },
 
-{
-  path: '/distribution/checkInventoryTask/createTaskTemp',
-  component: Layout,
-  redirect: '/distribution/checkInventoryTask/createTaskTemp',
-  children: [
-    {
-      path: '/distribution/checkInventoryTask/createTaskTemp',
-      name: '盘点重构',
-      component: () => import('@/views/distribution/checkInventoryTask/createTaskTemp.vue'),
-    },
-  ],
-},
+  {
+    path: '/distribution/checkInventoryTask/createTaskTemp',
+    component: Layout,
+    redirect: '/distribution/checkInventoryTask/createTaskTemp',
+    children: [
+      {
+        path: '/distribution/checkInventoryTask/createTaskTemp',
+        name: '盘点重构',
+        component: () => import('@/views/distribution/checkInventoryTask/createTaskTemp.vue'),
+      },
+    ],
+  },
 
   // {
   //   path: '/distribution/turndelivery/devtmp',
diff --git a/src/styles/common.scss b/src/styles/common.scss
index e9fb4f3c..ffbdfa16 100644
--- a/src/styles/common.scss
+++ b/src/styles/common.scss
@@ -9,17 +9,17 @@
     height: 30px !important;
   }
 }
-.basic-container__card{
+.basic-container__card {
   .el-card__body {
-   padding: 5px !important ;
-}
+    padding: 5px !important ;
+  }
 }
 .avue-crud__pagination {
   padding: 0 0;
   padding-top: 5px;
 }
-.el-card__body{
-  .el-card__body{
+.el-card__body {
+  .el-card__body {
     padding: 0px !important;
   }
 }
@@ -148,6 +148,10 @@ a {
   justify-content: space-between;
 }
 
+.mt10 {
+  margin-top: 10px;
+}
+
 // ele样式覆盖
 @import './element-ui.scss';
 // 顶部右侧显示
diff --git a/src/views/distribution/artery/TripartiteTransfer.vue b/src/views/distribution/artery/TripartiteTransfer.vue
new file mode 100644
index 00000000..a5792d6f
--- /dev/null
+++ b/src/views/distribution/artery/TripartiteTransfer.vue
@@ -0,0 +1,588 @@
+<template>
+  <basic-container>
+    <div class="avue-crud">
+      <!-- 搜索模块 -->
+      <el-row v-if="!search">
+        <!-- 查询模块 -->
+        <el-form :inline="true" :model="query" class="el-fr-d">
+          <el-form-item label="网点:">
+            <el-input v-model="query.serviceNumber" placeholder="请选择网点" clearable></el-input>
+          </el-form-item>
+
+          <el-form-item label="承运时间:" class="el-times">
+            <el-date-picker
+              v-model="stockupDate"
+              type="daterange"
+              unlink-panels
+              range-separator="至"
+              start-placeholder="开始时间"
+              end-placeholder="结束时间"
+              :shortcuts="shortcuts"
+              clearable
+            />
+          </el-form-item>
+
+          <el-form-item label="发车时间:" class="el-times">
+            <el-date-picker
+              v-model="stockupDate"
+              type="daterange"
+              unlink-panels
+              range-separator="至"
+              start-placeholder="开始时间"
+              end-placeholder="结束时间"
+              :shortcuts="shortcuts"
+              clearable
+            />
+          </el-form-item>
+
+          <el-form-item label="创建时间:" class="el-times">
+            <el-date-picker
+              v-model="stockupDate"
+              type="daterange"
+              unlink-panels
+              range-separator="至"
+              start-placeholder="开始时间"
+              end-placeholder="结束时间"
+              :shortcuts="shortcuts"
+              clearable
+            />
+          </el-form-item>
+
+          <el-form-item label="签收时间:" class="el-times">
+            <el-date-picker
+              v-model="stockupDate"
+              type="daterange"
+              unlink-panels
+              range-separator="至"
+              start-placeholder="开始时间"
+              end-placeholder="结束时间"
+              :shortcuts="shortcuts"
+              clearable
+            />
+          </el-form-item>
+
+          <el-form-item label="车次号:" class="el-times">
+            <el-input v-model="query.stockupArea" placeholder="请输入车次号"></el-input>
+          </el-form-item>
+
+          <!-- 查询按钮 -->
+          <el-form-item class="el-btn">
+            <el-button type="primary" icon="el-icon-search" @click="searchChange">搜 索</el-button>
+            <el-button icon="el-icon-delete" @click="searchReset()">清 空</el-button>
+          </el-form-item>
+        </el-form>
+      </el-row>
+
+      <!-- 控件模块 -->
+      <el-row>
+        <div class="avue-crud__header">
+          <!-- 头部左侧按钮模块 -->
+          <div class="avue-crud__left">
+            <el-button type="primary" icon="Plus" @click="searchChange">新增中转 </el-button>
+            <el-button type="primary" icon="Printer" @click="searchReset()">装载清单</el-button>
+            <el-button type="primary" icon="Printer" @click="searchReset()"
+              >装载卸车清单(财务)</el-button
+            >
+            <el-button type="primary" icon="Van" @click="searchReset()">发 车</el-button>
+            <el-button type="primary" icon="Delete" @click="searchReset()">取消发车</el-button>
+            <el-button type="primary" icon="Delete" @click="searchReset()">取消装车</el-button>
+            <el-button type="primary" icon="CircleCheck" @click="searchReset()">到 达</el-button>
+            <el-button type="primary" icon="Edit" @click="searchReset()">修 改</el-button>
+          </div>
+          <!-- 头部右侧按钮模块 -->
+          <div class="avue-crud__right">
+            <el-button icon="el-icon-refresh" @click="searchChange" circle></el-button>
+            <el-button icon="Operation" @click="showdrawer(true)" circle></el-button>
+            <el-button icon="el-icon-search" @click="searchHide" circle></el-button>
+          </div>
+        </div>
+      </el-row>
+
+      <!-- 表格 -->
+      <el-row>
+        <!-- 列表模块 -->
+        <tablecmt
+          :columnList="details.columnList"
+          :tableData="data"
+          :loading="loadingObj.list"
+          @inputTxt="inputsc"
+          @timeCheck="timesc"
+          @btnCheck="btnsc"
+          @selectCheck="selectsc"
+          @selection="selectionChange"
+        >
+          <template #default="slotProps">
+            <template v-if="slotProps.scope.column.label === '批次号'">
+              <el-text>123</el-text>
+            </template>
+
+            <template v-if="slotProps.scope.column.label === '操作'">
+              <el-button type="text" @click="handleShowzeroAdditionalRecording(slotProps.scope)">
+                删除
+              </el-button>
+              <el-button type="text" @click="handleShowzeroAdditionalRecording(slotProps.scope)">
+                文员签收
+              </el-button>
+              <el-button type="text" @click="handleShowzeroAdditionalRecording(slotProps.scope)">
+                结算
+              </el-button>
+              <el-button type="text" @click="handleShowTruckLoadingDetails(slotProps.scope)"
+                >装车明细</el-button
+              >
+            </template>
+          </template>
+        </tablecmt>
+      </el-row>
+
+      <!-- 统计 -->
+      <el-row>
+        <div>选择数: , 运单数: , 件数: , 重量: , 体积: , 提货费: ,</div>
+        <div>总计: 总数: , 运单数: , 件数: , 重量: , 体积: , 提货费: ,</div>
+      </el-row>
+
+      <!-- 分页模块 -->
+      <el-row class="el-fy">
+        <div class="avue-crud__pagination flex-c-sb" style="width: 100%">
+          <div style="font-size: 14px">勾选数量: {{ selectionList.length }}</div>
+          <!-- 分页模块 -->
+          <el-pagination
+            align="right"
+            background
+            @size-change="sizeChange"
+            @current-change="currentChange"
+            :current-page="page.currentPage"
+            :page-sizes="[30, 50, 80, 120]"
+            :page-size="page.pageSize"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="page.total"
+          >
+          </el-pagination>
+        </div>
+      </el-row>
+    </div>
+  </basic-container>
+
+  <!-- 编辑弹窗 -->
+  <el-dialog
+    title="装车明细"
+    v-model="details.popUpShow.truckLoadingDetailVisited"
+    width="80%"
+    :before-close="beforeClose"
+    append-to-body
+    class="truckLoadingDetailPopUp"
+  >
+    <el-form :inline="true" :model="query" class="el-fr-d">
+      <div class="fo-fl">
+        <el-form-item label="预计发车:" class="el-times">
+          <!--            <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>-->
+          <el-date-picker
+            v-model="stockupDate"
+            type="daterange"
+            unlink-panels
+            range-separator="-"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            :shortcuts="shortcuts"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item label="实际发车:" class="el-times">
+          <!--            <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>-->
+          <el-date-picker
+            v-model="stockupDate"
+            type="daterange"
+            unlink-panels
+            range-separator="-"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            :shortcuts="shortcuts"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-van" @click="searchChange">批量卸车</el-button>
+          <el-button type="primary" icon="el-icon-search" @click="searchReset()">搜 索</el-button>
+          <el-button icon="el-icon-printer" @click="searchReset()">二维码</el-button>
+        </el-form-item>
+      </div>
+    </el-form>
+    <tablecmt
+      :columnList="details.detailsColumnList"
+      :tableData="data"
+      :loading="loadingObj.list"
+      @inputTxt="inputsc"
+      @timeCheck="timesc"
+      @btnCheck="btnsc"
+      @selectCheck="selectsc"
+      @selection="selectionChange"
+    >
+      <template #default="slotProps"> </template>
+    </tablecmt>
+
+    <!-- 分页模块 -->
+    <el-pagination
+      align="right"
+      background
+      @size-change="sizeChange"
+      @current-change="currentChange"
+      :current-page="trickleLoadingPage.currentPage"
+      :page-sizes="[30, 50, 80, 120]"
+      :page-size="trickleLoadingPage.pageSize"
+      layout="total, sizes, prev, pager, next, jumper"
+      :total="trickleLoadingPage.total"
+    >
+    </el-pagination>
+
+    <!-- 表单按钮 -->
+    <!--     <template #footer>
+      <div v-if="!view" class="dialog-footer">
+        <el-button type="primary" icon="el-icon-circle-check" @click="handleEditSubmit"
+          >提 交</el-button
+        >
+        <el-button icon="el-icon-circle-close" @click="box = false">取 消</el-button>
+      </div>
+    </template> -->
+  </el-dialog>
+
+  <!-- 列表配置显示 -->
+  <edittablehead
+    @setcolum="setnewcolum"
+    @closce="showdrawer"
+    :drawerShow="drawerShow"
+    :columnList="columnList"
+  ></edittablehead>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, toRefs, computed, onMounted, nextTick } from 'vue';
+import functions from '@/utils/functions';
+import dayjs from 'dayjs';
+import { mapGetters } from 'vuex';
+/** 获取字典 */
+import { getDictionaryBiz } from '@/api/system/dict';
+import { downloadXls } from '@/utils/util';
+import { columnList, detailsColumnList } from '@/option/distribution/VehicleStowage';
+import { useRouter } from 'vue-router';
+
+// 获取路由实例
+const $router = useRouter();
+
+const details = reactive<any>({
+  /** 是否开启搜索 */
+  search: true,
+  /** 表格搜索条件 */
+  query: {},
+  /** 时间快捷选择设置 */
+  shortcuts: [
+    {
+      text: '最近一周',
+      value: () => {
+        const end = new Date();
+        const start = new Date();
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+        return [start, end];
+      },
+    },
+    {
+      text: '最近一个月',
+      value: () => {
+        const end = new Date();
+        const start = new Date();
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+        return [start, end];
+      },
+    },
+    {
+      text: '最近三个月',
+      value: () => {
+        const end = new Date();
+        const start = new Date();
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+        return [start, end];
+      },
+    },
+  ],
+  /** 时间选择器数据 */
+  stockupDate: [],
+  /** 列表 */
+  columnList,
+  detailsColumnList,
+  /** 列表数据 */
+  data: [{}],
+  /** 页面loading */
+  loadingObj: {
+    /** 列表加载loading */
+    list: false,
+    oldListLoading: false,
+  },
+  /** 列表复选框选中的数据 */
+  selectionList: [],
+  /** 是否显示设置表格 */
+  drawerShow: false,
+  /** 分页参数 */
+  page: {
+    currentPage: 1,
+    pageSize: 30,
+    total: 0,
+  },
+  /** 装车明细分页参数 */
+  trickleLoadingPage: {
+    currentPage: 1,
+    pageSize: 30,
+    total: 0,
+  },
+  /** 弹出层显示 */
+  popUpShow: {
+    /** 装车详情 */
+    truckLoadingDetailVisited: false,
+    /** 零担补录 */
+    zeroAdditionalRecordingVisited: false,
+  },
+  /** 列表Dom节点 */
+  listNode: '',
+  form: {},
+  /** 零担补录信息 */
+  zeroAdditionalRecordingInfo: {
+    oldPage: {
+      pageSize: 30,
+      currentPage: 1,
+      total: 0,
+    },
+  },
+});
+
+const {
+  search,
+  query,
+  shortcuts,
+  stockupDate,
+  data,
+  loadingObj,
+  selectionList,
+  drawerShow,
+  page,
+  trickleLoadingPage,
+  zeroAdditionalRecordingInfo,
+  popUpShow,
+} = toRefs(details);
+
+/** vuex */
+const permission = computed(() => mapGetters(['permission', 'tagWel', 'tagList']));
+console.log('permission :>> ', permission);
+
+onMounted(() => {
+  const timer = setTimeout(() => {
+    details.listNode = document.querySelector('.maboxhi');
+    details.listNode.style.transition = 'all .5s ease-out';
+    console.log('details.listNode :>> ', details.listNode);
+    clearTimeout(timer);
+  }, 100);
+});
+
+/** 请求页面数据 */
+const onLoad = (page: any) => {};
+
+/** 搜索 */
+const searchChange = () => {
+  onLoad(details.page);
+};
+
+/** 清空表单 */
+const searchReset = () => {
+  details.query = {};
+  details.stockupDate = [];
+  details.page.currentPage = 1;
+  onLoad(details.page);
+};
+
+/** 展开列表控件 */
+const showdrawer = (_flag?: boolean) => {
+  details.drawerShow = _flag;
+};
+
+/** 是否开启搜索区 */
+const searchHide = () => {
+  function getWinHight() {
+    var windowHight = 0;
+    if (document.body.clientHeight && document.documentElement.clientHeight) {
+      windowHight =
+        document.body.clientHeight < document.documentElement.clientHeight
+          ? document.body.clientHeight
+          : document.documentElement.clientHeight;
+    } else {
+    }
+    return document.documentElement.clientHeight;
+  }
+  details.search = !details.search;
+  const timer = setTimeout(() => {
+    details.listNode.style.height =
+      getWinHight() - details.listNode.getBoundingClientRect().top - 70 + 'px';
+    clearTimeout(timer);
+  }, 10);
+};
+
+/** 表格表头输入框搜索 */
+const inputsc = (index, row) => {
+  details.query[row.prop] = index;
+  onLoad(details.page);
+};
+
+/** 表格表头时间选择 */
+const timesc = (index, row) => {
+  console.log(index, row);
+  if (!!index) {
+    index = dayjs(index).format('YYYY-MM-DD');
+  }
+  details.query[row.prop] = index;
+  if (!index) {
+    delete details.query[row.prop];
+  }
+  onLoad(details.page);
+};
+
+/** 表格表头输入框搜索 */
+const btnsc = () => {};
+
+/** 表格表头下拉框选择 */
+const selectsc = (index, row) => {
+  details.query[row.prop] = index;
+  if (!index) delete details.query[row.prop];
+  if (row.prop === 'certificateTypeName') {
+    details.query['certificateType'] = index;
+    if (!index) delete details.query['certificateType'];
+  }
+  onLoad(details.page);
+};
+
+/** 表格表头复选框选择 */
+const selectionChange = (list: any) => {
+  details.selectionList = list;
+};
+
+/** 每页数量改变执行的回调 */
+const sizeChange = (pageSize: number) => {
+  details.page.pageSize = pageSize;
+  onLoad(details.page);
+};
+
+/** 页码改变执行的回调 */
+const currentChange = () => {};
+
+/**
+ * 设置列表 -- 固定函数
+ * 弹窗的勾选回调，用于更改头部数组
+ * 固定搭配，只需要更换   columnList
+ *  */
+const setnewcolum = (newarr, headarr, type) => {
+  if (type == 1) {
+    details.columnList = newarr;
+    functions.setStorage(window.location.pathname + 'checkList', headarr);
+  } else if (type == 2) {
+    details.columnList = newarr;
+    functions.setStorage(window.location.pathname + 'flexList', headarr);
+  } else if (type == 3) {
+    details.columnList = newarr;
+    functions.setStorage(window.location.pathname + 'sortlist', headarr);
+  }
+};
+
+/** 弹出层开启前清除数据 */
+const beforeClose = done => {
+  done();
+  details.form = {};
+  details.view = false;
+};
+
+/** 显示装车详情 */
+const handleShowTruckLoadingDetails = ({ row }) => {
+  details.popUpShow.truckLoadingDetailVisited = true;
+
+  nextTick(() => {
+    // 获取弹窗内表格元素节点, 并设置高度
+    const _node = document.querySelector('.truckLoadingDetailPopUp .maboxhi');
+    _node.style.height = '550px';
+    console.log('_node :>> ', _node);
+  });
+};
+
+/** 显示零担补录 */
+const handleShowzeroAdditionalRecording = ({ row }) => {
+  // 跳转到零担补录页面
+  $router.push('/distribution/artery/zeroAdditionalRecording');
+};
+</script>
+
+<style scoped lang="scss">
+.fo-fl {
+  display: flex;
+  flex-wrap: wrap;
+  zoom: 0.9;
+}
+
+// 日期选择器
+:deep(.el-date-editor.el-input) {
+  height: 100% !important;
+  width: 100% !important;
+}
+
+:deep(.el-range-editor.el-input__wrapper) {
+  height: 100% !important;
+}
+
+// 新增行
+.add_row {
+  display: flex;
+  justify-content: space-between;
+}
+
+.add_row_title {
+  text-align: center;
+  margin-bottom: 10px;
+  font-size: 18px;
+  font-weight: bold;
+}
+
+// 统计行
+.statistics_row {
+  margin: 10px 0;
+  font-size: 14px;
+  zoom: 0.9;
+  display: flex;
+
+  > div {
+    margin-right: 20px;
+  }
+}
+
+// 卡片容器
+.crad_container {
+  display: flex;
+
+  .card_container_item {
+    flex: 1;
+    // padding: 10px;
+    border-radius: 5px;
+    box-shadow: 0 0 5px #ccc;
+
+    &:first-child {
+      margin-right: 20px;
+    }
+
+    .card_container_item_title {
+      padding: 10px;
+      border-bottom: 1px solid #ccc;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+    }
+
+    .card_container_item_box {
+      padding: 10px;
+    }
+  }
+}
+
+.pointer {
+  cursor: pointer;
+}
+</style>
diff --git a/src/views/distribution/artery/VehicleArrivalManagement.vue b/src/views/distribution/artery/VehicleArrivalManagement.vue
new file mode 100644
index 00000000..9a84eb32
--- /dev/null
+++ b/src/views/distribution/artery/VehicleArrivalManagement.vue
@@ -0,0 +1,518 @@
+<template>
+  <basic-container>
+    <div class="avue-crud">
+      <!-- 搜索模块 -->
+      <el-row v-if="search">
+        <!-- 查询模块 -->
+        <el-form :inline="true" :model="query" class="el-fr-d">
+          <div class="fo-fl">
+            <el-form-item label="车次号:">
+              <el-input
+                v-model="query.serviceNumber"
+                placeholder="请输入车次号"
+                clearable
+              ></el-input>
+            </el-form-item>
+            <el-form-item label="预计发车:" class="el-times">
+              <!--            <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>-->
+              <el-date-picker
+                v-model="stockupDate"
+                type="daterange"
+                unlink-panels
+                range-separator="-"
+                start-placeholder="开始时间"
+                end-placeholder="结束时间"
+                :shortcuts="shortcuts"
+                clearable
+              />
+            </el-form-item>
+            <el-form-item label="实际发车:" class="el-times">
+              <!--            <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>-->
+              <el-date-picker
+                v-model="stockupDate"
+                type="daterange"
+                unlink-panels
+                range-separator="-"
+                start-placeholder="开始时间"
+                end-placeholder="结束时间"
+                :shortcuts="shortcuts"
+                clearable
+              />
+            </el-form-item>
+            <el-form-item label="到车时间:" class="el-times">
+              <!--            <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>-->
+              <el-date-picker
+                v-model="stockupDate"
+                type="daterange"
+                unlink-panels
+                range-separator="-"
+                start-placeholder="开始时间"
+                end-placeholder="结束时间"
+                :shortcuts="shortcuts"
+                clearable
+              />
+            </el-form-item>
+          </div>
+          <div class="fo-fl">
+            <el-form-item label="创建时间:" class="el-times">
+              <!--            <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>-->
+              <el-date-picker
+                v-model="stockupDate"
+                type="daterange"
+                unlink-panels
+                range-separator="-"
+                start-placeholder="开始时间"
+                end-placeholder="结束时间"
+                :shortcuts="shortcuts"
+                clearable
+              />
+            </el-form-item>
+            <!-- 查询按钮 -->
+            <el-form-item class="el-btn">
+              <el-button type="primary" icon="el-icon-search" @click="searchChange"
+                >搜 索</el-button
+              >
+              <el-button icon="el-icon-delete" @click="searchReset()">清 空</el-button>
+            </el-form-item>
+          </div>
+        </el-form>
+      </el-row>
+
+      <!-- 控件模块 -->
+      <el-row>
+        <div class="avue-crud__header">
+          <!-- 头部左侧按钮模块 -->
+          <div class="avue-crud__left">
+            <el-button type="primary" icon="el-icon-van" @click="searchChange">发车 </el-button>
+            <el-button type="primary" icon="el-icon-close" @click="searchReset()"
+              >网点取消发车</el-button
+            >
+            <el-button type="primary" icon="el-icon-printer" @click="searchReset()"
+              >装载清单</el-button
+            >
+            <el-button type="primary" icon="el-icon-printer" @click="searchReset()">到达</el-button>
+            <el-button type="primary" icon="el-icon-delete" @click="searchReset()">
+              中途到达卸车
+            </el-button>
+            <el-button type="primary" icon="el-icon-delete" @click="searchReset()">
+              对比报表
+            </el-button>
+            <el-button type="primary" icon="el-icon-document" @click="searchReset()">
+              终点到达卸车
+            </el-button>
+            <el-button type="primary" icon="el-icon-document" @click="searchReset()">
+              卸车报告
+            </el-button>
+            <el-button type="primary" icon="el-icon-document" @click="searchReset()">
+              欧派TIMS数据关联
+            </el-button>
+          </div>
+          <!-- 头部右侧按钮模块 -->
+          <div class="avue-crud__right">
+            <el-button icon="el-icon-refresh" @click="searchChange" circle></el-button>
+            <el-button icon="Operation" @click="showdrawer(true)" circle></el-button>
+            <el-button icon="el-icon-search" @click="searchHide" circle></el-button>
+          </div>
+        </div>
+      </el-row>
+
+      <!-- 表格 -->
+      <el-row>
+        <!-- 列表模块 -->
+        <tablecmt
+          :columnList="details.columnList"
+          :tableData="data"
+          :loading="loadingObj.list"
+          @inputTxt="inputsc"
+          @timeCheck="timesc"
+          @btnCheck="btnsc"
+          @selectCheck="selectsc"
+          @selection="selectionChange"
+        >
+          <template #default="slotProps">
+            <template v-if="slotProps.scope.column.label === '批次号'">
+              <el-text>123</el-text>
+            </template>
+
+            <template v-if="slotProps.scope.column.label === '操作'">
+              <el-text @click="handleShowTruckLoadingDetails">装车明细</el-text>
+              <el-text>编辑</el-text>
+            </template>
+          </template>
+        </tablecmt>
+      </el-row>
+
+      <!-- 统计 -->
+      <el-row>
+        <div>选择数: , 运单数: , 件数: , 重量: , 体积: , 提货费: ,</div>
+        <div>总计: 总数: , 运单数: , 件数: , 重量: , 体积: , 提货费: ,</div>
+      </el-row>
+
+      <!-- 分页模块 -->
+      <el-row class="el-fy">
+        <div class="avue-crud__pagination flex-c-sb" style="width: 100%">
+          <div style="font-size: 14px">勾选数量: {{ selectionList.length }}</div>
+          <!-- 分页模块 -->
+          <el-pagination
+            align="right"
+            background
+            @size-change="sizeChange"
+            @current-change="currentChange"
+            :current-page="page.currentPage"
+            :page-sizes="[30, 50, 80, 120]"
+            :page-size="page.pageSize"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="page.total"
+          >
+          </el-pagination>
+        </div>
+      </el-row>
+    </div>
+  </basic-container>
+
+  <!-- 装车详情弹窗 -->
+  <el-dialog
+    title="装车明细"
+    v-model="details.popUpShow.truckLoadingDetailVisited"
+    width="80%"
+    :before-close="beforeClose"
+    append-to-body
+    class="truckLoadingDetailPopUp"
+  >
+    <el-form :inline="true" :model="query" class="el-fr-d">
+      <div class="fo-fl">
+        <el-form-item label="预计发车:" class="el-times">
+          <!--            <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>-->
+          <el-date-picker
+            v-model="stockupDate"
+            type="daterange"
+            unlink-panels
+            range-separator="-"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            :shortcuts="shortcuts"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item label="实际发车:" class="el-times">
+          <!--            <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>-->
+          <el-date-picker
+            v-model="stockupDate"
+            type="daterange"
+            unlink-panels
+            range-separator="-"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            :shortcuts="shortcuts"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-van" @click="searchChange">批量卸车</el-button>
+          <el-button type="primary" icon="el-icon-search" @click="searchReset()">搜 索</el-button>
+          <el-button icon="el-icon-printer" @click="searchReset()">二维码</el-button>
+        </el-form-item>
+      </div>
+    </el-form>
+    <tablecmt
+      :columnList="details.detailsColumnList"
+      :tableData="data"
+      :loading="loadingObj.list"
+      @inputTxt="inputsc"
+      @timeCheck="timesc"
+      @btnCheck="btnsc"
+      @selectCheck="selectsc"
+      @selection="selectionChange"
+    >
+      <template #default="slotProps"> </template>
+    </tablecmt>
+
+    <!-- 分页模块 -->
+    <el-pagination
+      align="right"
+      background
+      @size-change="sizeChange"
+      @current-change="currentChange"
+      :current-page="trickleLoadingPage.currentPage"
+      :page-sizes="[30, 50, 80, 120]"
+      :page-size="trickleLoadingPage.pageSize"
+      layout="total, sizes, prev, pager, next, jumper"
+      :total="trickleLoadingPage.total"
+    >
+    </el-pagination>
+
+    <!-- 表单按钮 -->
+    <!--     <template #footer>
+      <div v-if="!view" class="dialog-footer">
+        <el-button type="primary" icon="el-icon-circle-check" @click="handleEditSubmit"
+          >提 交</el-button
+        >
+        <el-button icon="el-icon-circle-close" @click="box = false">取 消</el-button>
+      </div>
+    </template> -->
+  </el-dialog>
+
+  <!-- 列表配置显示 -->
+  <edittablehead
+    @setcolum="setnewcolum"
+    @closce="showdrawer"
+    :drawerShow="drawerShow"
+    :columnList="columnList"
+  ></edittablehead>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, toRefs, computed, onMounted, nextTick } from 'vue';
+import functions from '@/utils/functions';
+import dayjs from 'dayjs';
+import { mapGetters } from 'vuex';
+/** 获取字典 */
+import { getDictionaryBiz } from '@/api/system/dict';
+import { downloadXls } from '@/utils/util';
+import { columnList, detailsColumnList } from '@/option/distribution/VehicleArrivalManagement';
+
+const details = reactive({
+  /** 是否开启搜索 */
+  search: false,
+  /** 表格搜索条件 */
+  query: {},
+  /** 时间快捷选择设置 */
+  shortcuts: [
+    {
+      text: '最近一周',
+      value: () => {
+        const end = new Date();
+        const start = new Date();
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+        return [start, end];
+      },
+    },
+    {
+      text: '最近一个月',
+      value: () => {
+        const end = new Date();
+        const start = new Date();
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+        return [start, end];
+      },
+    },
+    {
+      text: '最近三个月',
+      value: () => {
+        const end = new Date();
+        const start = new Date();
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+        return [start, end];
+      },
+    },
+  ],
+  /** 时间选择器数据 */
+  stockupDate: [],
+  /** 列表 */
+  columnList,
+  detailsColumnList,
+  /** 列表数据 */
+  data: [{}],
+  /** 页面loading */
+  loadingObj: {
+    /** 列表加载loading */
+    list: false,
+  },
+  /** 列表复选框选中的数据 */
+  selectionList: [],
+  /** 是否显示设置表格 */
+  drawerShow: false,
+  /** 分页参数 */
+  page: {
+    currentPage: 1,
+    pageSize: 30,
+    total: 0,
+  },
+  /** 装车明细分页参数 */
+  trickleLoadingPage: {
+    currentPage: 1,
+    pageSize: 30,
+    total: 0,
+  },
+  /** 列表Dom节点 */
+  listNode: '',
+  /** 弹出层显示 */
+  popUpShow: {
+    /** 装车详情 */
+    truckLoadingDetailVisited: false,
+  },
+  /** 弹出层表单 */
+  form: {},
+  /** 是否为查看模式 */
+  view: false,
+});
+
+const {
+  search,
+  query,
+  shortcuts,
+  stockupDate,
+  data,
+  loadingObj,
+  selectionList,
+  drawerShow,
+  page,
+  trickleLoadingPage,
+} = toRefs(details);
+
+/** vuex */
+const permission = computed(() => mapGetters(['permission', 'tagWel', 'tagList']));
+console.log('permission :>> ', permission);
+
+onMounted(() => {
+  const timer = setTimeout(() => {
+    details.listNode = document.querySelector('.maboxhi') as any;
+    details.listNode.style.transition = 'all .5s ease-out';
+    console.log('details.listNode :>> ', details.listNode);
+    clearTimeout(timer);
+  }, 100);
+});
+
+/** 请求页面数据 */
+const onLoad = (page: any) => {};
+
+/** 搜索 */
+const searchChange = () => {
+  onLoad(details.page);
+};
+
+/** 清空表单 */
+const searchReset = () => {
+  details.query = {};
+  details.stockupDate = [];
+  details.page.currentPage = 1;
+  onLoad(details.page);
+};
+
+/** 展开列表控件 */
+const showdrawer = (_flag?: boolean) => {
+  details.drawerShow = _flag;
+};
+
+/** 获取可视区高度 */
+function getWinHight() {
+  var windowHight = 0;
+  if (document.body.clientHeight && document.documentElement.clientHeight) {
+    windowHight =
+      document.body.clientHeight < document.documentElement.clientHeight
+        ? document.body.clientHeight
+        : document.documentElement.clientHeight;
+  } else {
+  }
+  return document.documentElement.clientHeight;
+}
+
+/** 是否开启搜索区 */
+const searchHide = () => {
+  details.search = !details.search;
+  const timer = setTimeout(() => {
+    details.listNode.style.height =
+      getWinHight() - details.listNode.getBoundingClientRect().top - 70 + 'px';
+    clearTimeout(timer);
+  }, 10);
+};
+
+/** 表格表头输入框搜索 */
+const inputsc = (index, row) => {
+  details.query[row.prop] = index;
+  onLoad(details.page);
+};
+
+/** 表格表头时间选择 */
+const timesc = (index, row) => {
+  console.log(index, row);
+  if (!!index) {
+    index = dayjs(index).format('YYYY-MM-DD');
+  }
+  details.query[row.prop] = index;
+  if (!index) {
+    delete details.query[row.prop];
+  }
+  onLoad(details.page);
+};
+
+/** 表格表头输入框搜索 */
+const btnsc = () => {};
+
+/** 表格表头下拉框选择 */
+const selectsc = (index, row) => {
+  details.query[row.prop] = index;
+  if (!index) delete details.query[row.prop];
+  if (row.prop === 'certificateTypeName') {
+    details.query['certificateType'] = index;
+    if (!index) delete details.query['certificateType'];
+  }
+  onLoad(details.page);
+};
+
+/** 表格表头复选框选择 */
+const selectionChange = (list: any) => {
+  details.selectionList = list;
+};
+
+/** 每页数量改变执行的回调 */
+const sizeChange = (pageSize: number) => {
+  details.page.pageSize = pageSize;
+  onLoad(details.page);
+};
+
+/** 页码改变执行的回调 */
+const currentChange = () => {};
+
+/**
+ * 设置列表 -- 固定函数
+ * 弹窗的勾选回调，用于更改头部数组
+ * 固定搭配，只需要更换   columnList
+ *  */
+const setnewcolum = (newarr, headarr, type) => {
+  if (type == 1) {
+    details.columnList = newarr;
+    functions.setStorage(window.location.pathname + 'checkList', headarr);
+  } else if (type == 2) {
+    details.columnList = newarr;
+    functions.setStorage(window.location.pathname + 'flexList', headarr);
+  } else if (type == 3) {
+    details.columnList = newarr;
+    functions.setStorage(window.location.pathname + 'sortlist', headarr);
+  }
+};
+
+/** 弹出层开启前清除数据 */
+const beforeClose = done => {
+  done();
+  details.form = {};
+  details.view = false;
+};
+
+/** 显示装车详情 */
+const handleShowTruckLoadingDetails = ({ row }) => {
+  details.popUpShow.truckLoadingDetailVisited = true;
+
+  nextTick(() => {
+    // 获取弹窗内表格元素节点, 并设置高度
+    const _node = document.querySelector('.truckLoadingDetailPopUp .maboxhi');
+    _node.style.height = '550px';
+  });
+};
+</script>
+
+<style scoped lang="scss">
+.fo-fl {
+  display: flex;
+}
+
+// 日期选择器
+:deep(.el-date-editor.el-input) {
+  height: 100% !important;
+  width: 100% !important;
+}
+
+:deep(.el-range-editor.el-input__wrapper) {
+  height: 100% !important;
+}
+</style>
diff --git a/src/views/distribution/artery/VehicleStowage.vue b/src/views/distribution/artery/VehicleStowage.vue
new file mode 100644
index 00000000..fe58f3b2
--- /dev/null
+++ b/src/views/distribution/artery/VehicleStowage.vue
@@ -0,0 +1,588 @@
+<template>
+  <basic-container>
+    <div class="avue-crud">
+      <!-- 搜索模块 -->
+      <el-row v-if="!search">
+        <!-- 查询模块 -->
+        <el-form :inline="true" :model="query" class="el-fr-d">
+          <div class="fo-fl">
+            <el-form-item label="车次号:">
+              <el-input
+                v-model="query.serviceNumber"
+                placeholder="请输入车次号"
+                clearable
+              ></el-input>
+            </el-form-item>
+            <el-form-item label="提货时间:" class="el-times">
+              <!--            <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>-->
+              <el-date-picker
+                v-model="stockupDate"
+                type="daterange"
+                unlink-panels
+                range-separator="至"
+                start-placeholder="开始时间"
+                end-placeholder="结束时间"
+                :shortcuts="shortcuts"
+                clearable
+              />
+            </el-form-item>
+            <el-form-item label="实际发车:" class="el-times">
+              <!--            <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>-->
+              <el-date-picker
+                v-model="stockupDate"
+                type="daterange"
+                unlink-panels
+                range-separator="至"
+                start-placeholder="开始时间"
+                end-placeholder="结束时间"
+                :shortcuts="shortcuts"
+                clearable
+              />
+            </el-form-item>
+            <el-form-item label="创建时间:" class="el-times">
+              <!--            <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>-->
+              <el-date-picker
+                v-model="stockupDate"
+                type="daterange"
+                unlink-panels
+                range-separator="至"
+                start-placeholder="开始时间"
+                end-placeholder="结束时间"
+                :shortcuts="shortcuts"
+                clearable
+              />
+            </el-form-item>
+          </div>
+          <!-- 查询按钮 -->
+          <el-form-item class="el-btn">
+            <el-button type="primary" icon="el-icon-search" @click="searchChange">搜 索</el-button>
+            <el-button icon="el-icon-delete" @click="searchReset()">清 空</el-button>
+          </el-form-item>
+        </el-form>
+      </el-row>
+
+      <!-- 控件模块 -->
+      <el-row>
+        <div class="avue-crud__header">
+          <!-- 头部左侧按钮模块 -->
+          <div class="avue-crud__left">
+            <el-button type="primary" icon="el-icon-plus" @click="searchChange"
+              >新增配载
+            </el-button>
+            <el-button type="primary" icon="el-icon-printer" @click="searchReset()"
+              >打 印</el-button
+            >
+            <el-button type="primary" icon="el-icon-printer" @click="searchReset()"
+              >装载清单</el-button
+            >
+            <el-button type="primary" icon="el-icon-printer" @click="searchReset()"
+              >装载卸车清单(财务)</el-button
+            >
+            <el-button type="primary" icon="el-icon-van" @click="searchReset()">发 车</el-button>
+            <el-button type="primary" icon="el-icon-delete" @click="searchReset()"
+              >取消发车</el-button
+            >
+            <el-button type="primary" icon="el-icon-delete" @click="searchReset()"
+              >取消装车</el-button
+            >
+            <el-button type="primary" icon="el-icon-document" @click="searchReset()"
+              >对比报表</el-button
+            >
+            <el-button type="primary" icon="el-icon-document" @click="searchReset()"
+              >卸车报告</el-button
+            >
+          </div>
+          <!-- 头部右侧按钮模块 -->
+          <div class="avue-crud__right">
+            <el-button icon="el-icon-refresh" @click="searchChange" circle></el-button>
+            <el-button icon="Operation" @click="showdrawer(true)" circle></el-button>
+            <el-button icon="el-icon-search" @click="searchHide" circle></el-button>
+          </div>
+        </div>
+      </el-row>
+
+      <!-- 表格 -->
+      <el-row>
+        <!-- 列表模块 -->
+        <tablecmt
+          :columnList="details.columnList"
+          :tableData="data"
+          :loading="loadingObj.list"
+          @inputTxt="inputsc"
+          @timeCheck="timesc"
+          @btnCheck="btnsc"
+          @selectCheck="selectsc"
+          @selection="selectionChange"
+        >
+          <template #default="slotProps">
+            <template v-if="slotProps.scope.column.label === '批次号'">
+              <el-text>123</el-text>
+            </template>
+
+            <template v-if="slotProps.scope.column.label === '操作'">
+              <el-text @click="handleShowzeroAdditionalRecording(slotProps.scope)">
+                零担补录
+              </el-text>
+              <el-text @click="handleShowTruckLoadingDetails(slotProps.scope)">装车明细</el-text>
+              <el-text>编辑</el-text>
+              <el-text>数据同步</el-text>
+              <el-text>批量装车</el-text>
+              <el-text>手动装车</el-text>
+              <el-text>节点费用</el-text>
+            </template>
+          </template>
+        </tablecmt>
+      </el-row>
+
+      <!-- 统计 -->
+      <el-row>
+        <div>选择数: , 运单数: , 件数: , 重量: , 体积: , 提货费: ,</div>
+        <div>总计: 总数: , 运单数: , 件数: , 重量: , 体积: , 提货费: ,</div>
+      </el-row>
+
+      <!-- 分页模块 -->
+      <el-row class="el-fy">
+        <div class="avue-crud__pagination flex-c-sb" style="width: 100%">
+          <div style="font-size: 14px">勾选数量: {{ selectionList.length }}</div>
+          <!-- 分页模块 -->
+          <el-pagination
+            align="right"
+            background
+            @size-change="sizeChange"
+            @current-change="currentChange"
+            :current-page="page.currentPage"
+            :page-sizes="[30, 50, 80, 120]"
+            :page-size="page.pageSize"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="page.total"
+          >
+          </el-pagination>
+        </div>
+      </el-row>
+    </div>
+  </basic-container>
+
+  <!-- 编辑弹窗 -->
+  <el-dialog
+    title="装车明细"
+    v-model="details.popUpShow.truckLoadingDetailVisited"
+    width="80%"
+    :before-close="beforeClose"
+    append-to-body
+    class="truckLoadingDetailPopUp"
+  >
+    <el-form :inline="true" :model="query" class="el-fr-d">
+      <div class="fo-fl">
+        <el-form-item label="预计发车:" class="el-times">
+          <!--            <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>-->
+          <el-date-picker
+            v-model="stockupDate"
+            type="daterange"
+            unlink-panels
+            range-separator="-"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            :shortcuts="shortcuts"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item label="实际发车:" class="el-times">
+          <!--            <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>-->
+          <el-date-picker
+            v-model="stockupDate"
+            type="daterange"
+            unlink-panels
+            range-separator="-"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            :shortcuts="shortcuts"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-van" @click="searchChange">批量卸车</el-button>
+          <el-button type="primary" icon="el-icon-search" @click="searchReset()">搜 索</el-button>
+          <el-button icon="el-icon-printer" @click="searchReset()">二维码</el-button>
+        </el-form-item>
+      </div>
+    </el-form>
+    <tablecmt
+      :columnList="details.detailsColumnList"
+      :tableData="data"
+      :loading="loadingObj.list"
+      @inputTxt="inputsc"
+      @timeCheck="timesc"
+      @btnCheck="btnsc"
+      @selectCheck="selectsc"
+      @selection="selectionChange"
+    >
+      <template #default="slotProps"> </template>
+    </tablecmt>
+
+    <!-- 分页模块 -->
+    <el-pagination
+      align="right"
+      background
+      @size-change="sizeChange"
+      @current-change="currentChange"
+      :current-page="trickleLoadingPage.currentPage"
+      :page-sizes="[30, 50, 80, 120]"
+      :page-size="trickleLoadingPage.pageSize"
+      layout="total, sizes, prev, pager, next, jumper"
+      :total="trickleLoadingPage.total"
+    >
+    </el-pagination>
+
+    <!-- 表单按钮 -->
+    <!--     <template #footer>
+      <div v-if="!view" class="dialog-footer">
+        <el-button type="primary" icon="el-icon-circle-check" @click="handleEditSubmit"
+          >提 交</el-button
+        >
+        <el-button icon="el-icon-circle-close" @click="box = false">取 消</el-button>
+      </div>
+    </template> -->
+  </el-dialog>
+
+  <!-- 列表配置显示 -->
+  <edittablehead
+    @setcolum="setnewcolum"
+    @closce="showdrawer"
+    :drawerShow="drawerShow"
+    :columnList="columnList"
+  ></edittablehead>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, toRefs, computed, onMounted, nextTick } from 'vue';
+import functions from '@/utils/functions';
+import dayjs from 'dayjs';
+import { mapGetters } from 'vuex';
+/** 获取字典 */
+import { getDictionaryBiz } from '@/api/system/dict';
+import { downloadXls } from '@/utils/util';
+import { columnList, detailsColumnList } from '@/option/distribution/VehicleStowage';
+import { useRouter } from 'vue-router';
+
+// 获取路由实例
+const $router = useRouter();
+
+const details = reactive<any>({
+  /** 是否开启搜索 */
+  search: true,
+  /** 表格搜索条件 */
+  query: {},
+  /** 时间快捷选择设置 */
+  shortcuts: [
+    {
+      text: '最近一周',
+      value: () => {
+        const end = new Date();
+        const start = new Date();
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+        return [start, end];
+      },
+    },
+    {
+      text: '最近一个月',
+      value: () => {
+        const end = new Date();
+        const start = new Date();
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+        return [start, end];
+      },
+    },
+    {
+      text: '最近三个月',
+      value: () => {
+        const end = new Date();
+        const start = new Date();
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+        return [start, end];
+      },
+    },
+  ],
+  /** 时间选择器数据 */
+  stockupDate: [],
+  /** 列表 */
+  columnList,
+  detailsColumnList,
+  /** 列表数据 */
+  data: [{}],
+  /** 页面loading */
+  loadingObj: {
+    /** 列表加载loading */
+    list: false,
+    oldListLoading: false,
+  },
+  /** 列表复选框选中的数据 */
+  selectionList: [],
+  /** 是否显示设置表格 */
+  drawerShow: false,
+  /** 分页参数 */
+  page: {
+    currentPage: 1,
+    pageSize: 30,
+    total: 0,
+  },
+  /** 装车明细分页参数 */
+  trickleLoadingPage: {
+    currentPage: 1,
+    pageSize: 30,
+    total: 0,
+  },
+  /** 弹出层显示 */
+  popUpShow: {
+    /** 装车详情 */
+    truckLoadingDetailVisited: false,
+    /** 零担补录 */
+    zeroAdditionalRecordingVisited: false,
+  },
+  /** 列表Dom节点 */
+  listNode: '',
+  form: {},
+  /** 零担补录信息 */
+  zeroAdditionalRecordingInfo: {
+    oldPage: {
+      pageSize: 30,
+      currentPage: 1,
+      total: 0,
+    },
+  },
+});
+
+const {
+  search,
+  query,
+  shortcuts,
+  stockupDate,
+  data,
+  loadingObj,
+  selectionList,
+  drawerShow,
+  page,
+  trickleLoadingPage,
+  zeroAdditionalRecordingInfo,
+  popUpShow,
+} = toRefs(details);
+
+/** vuex */
+const permission = computed(() => mapGetters(['permission', 'tagWel', 'tagList']));
+console.log('permission :>> ', permission);
+
+onMounted(() => {
+  const timer = setTimeout(() => {
+    details.listNode = document.querySelector('.maboxhi');
+    details.listNode.style.transition = 'all .5s ease-out';
+    console.log('details.listNode :>> ', details.listNode);
+    clearTimeout(timer);
+  }, 100);
+});
+
+/** 请求页面数据 */
+const onLoad = (page: any) => {};
+
+/** 搜索 */
+const searchChange = () => {
+  onLoad(details.page);
+};
+
+/** 清空表单 */
+const searchReset = () => {
+  details.query = {};
+  details.stockupDate = [];
+  details.page.currentPage = 1;
+  onLoad(details.page);
+};
+
+/** 展开列表控件 */
+const showdrawer = (_flag?: boolean) => {
+  details.drawerShow = _flag;
+};
+
+/** 是否开启搜索区 */
+const searchHide = () => {
+  function getWinHight() {
+    var windowHight = 0;
+    if (document.body.clientHeight && document.documentElement.clientHeight) {
+      windowHight =
+        document.body.clientHeight < document.documentElement.clientHeight
+          ? document.body.clientHeight
+          : document.documentElement.clientHeight;
+    } else {
+    }
+    return document.documentElement.clientHeight;
+  }
+  details.search = !details.search;
+  const timer = setTimeout(() => {
+    details.listNode.style.height =
+      getWinHight() - details.listNode.getBoundingClientRect().top - 70 + 'px';
+    clearTimeout(timer);
+  }, 10);
+};
+
+/** 表格表头输入框搜索 */
+const inputsc = (index, row) => {
+  details.query[row.prop] = index;
+  onLoad(details.page);
+};
+
+/** 表格表头时间选择 */
+const timesc = (index, row) => {
+  console.log(index, row);
+  if (!!index) {
+    index = dayjs(index).format('YYYY-MM-DD');
+  }
+  details.query[row.prop] = index;
+  if (!index) {
+    delete details.query[row.prop];
+  }
+  onLoad(details.page);
+};
+
+/** 表格表头输入框搜索 */
+const btnsc = () => {};
+
+/** 表格表头下拉框选择 */
+const selectsc = (index, row) => {
+  details.query[row.prop] = index;
+  if (!index) delete details.query[row.prop];
+  if (row.prop === 'certificateTypeName') {
+    details.query['certificateType'] = index;
+    if (!index) delete details.query['certificateType'];
+  }
+  onLoad(details.page);
+};
+
+/** 表格表头复选框选择 */
+const selectionChange = (list: any) => {
+  details.selectionList = list;
+};
+
+/** 每页数量改变执行的回调 */
+const sizeChange = (pageSize: number) => {
+  details.page.pageSize = pageSize;
+  onLoad(details.page);
+};
+
+/** 页码改变执行的回调 */
+const currentChange = () => {};
+
+/**
+ * 设置列表 -- 固定函数
+ * 弹窗的勾选回调，用于更改头部数组
+ * 固定搭配，只需要更换   columnList
+ *  */
+const setnewcolum = (newarr, headarr, type) => {
+  if (type == 1) {
+    details.columnList = newarr;
+    functions.setStorage(window.location.pathname + 'checkList', headarr);
+  } else if (type == 2) {
+    details.columnList = newarr;
+    functions.setStorage(window.location.pathname + 'flexList', headarr);
+  } else if (type == 3) {
+    details.columnList = newarr;
+    functions.setStorage(window.location.pathname + 'sortlist', headarr);
+  }
+};
+
+/** 弹出层开启前清除数据 */
+const beforeClose = done => {
+  done();
+  details.form = {};
+  details.view = false;
+};
+
+/** 显示装车详情 */
+const handleShowTruckLoadingDetails = ({ row }) => {
+  details.popUpShow.truckLoadingDetailVisited = true;
+
+  nextTick(() => {
+    // 获取弹窗内表格元素节点, 并设置高度
+    const _node = document.querySelector('.truckLoadingDetailPopUp .maboxhi');
+    _node.style.height = '550px';
+    console.log('_node :>> ', _node);
+  });
+};
+
+/** 显示零担补录 */
+const handleShowzeroAdditionalRecording = ({ row }) => {
+  // 跳转到零担补录页面
+  $router.push('/distribution/artery/zeroAdditionalRecording');
+};
+</script>
+
+<style scoped lang="scss">
+.fo-fl {
+  display: flex;
+  flex-wrap: wrap;
+  zoom: 0.9;
+}
+
+// 日期选择器
+:deep(.el-date-editor.el-input) {
+  height: 100% !important;
+  width: 100% !important;
+}
+
+:deep(.el-range-editor.el-input__wrapper) {
+  height: 100% !important;
+}
+
+// 新增行
+.add_row {
+  display: flex;
+  justify-content: space-between;
+}
+
+.add_row_title {
+  text-align: center;
+  margin-bottom: 10px;
+  font-size: 18px;
+  font-weight: bold;
+}
+
+// 统计行
+.statistics_row {
+  margin: 10px 0;
+  font-size: 14px;
+  zoom: 0.9;
+  display: flex;
+
+  > div {
+    margin-right: 20px;
+  }
+}
+
+// 卡片容器
+.crad_container {
+  display: flex;
+
+  .card_container_item {
+    flex: 1;
+    // padding: 10px;
+    border-radius: 5px;
+    box-shadow: 0 0 5px #ccc;
+
+    &:first-child {
+      margin-right: 20px;
+    }
+
+    .card_container_item_title {
+      padding: 10px;
+      border-bottom: 1px solid #ccc;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+    }
+
+    .card_container_item_box {
+      padding: 10px;
+    }
+  }
+}
+
+.pointer {
+  cursor: pointer;
+}
+</style>
diff --git a/src/views/distribution/artery/zeroAdditionalRecording.vue b/src/views/distribution/artery/zeroAdditionalRecording.vue
new file mode 100644
index 00000000..e82a8e65
--- /dev/null
+++ b/src/views/distribution/artery/zeroAdditionalRecording.vue
@@ -0,0 +1,593 @@
+<template>
+  <basic-container>
+    <div class="avue-crud">
+      <div class="title">发车批次: LQGX</div>
+      <!-- <div class="add_row">发车批次: LQGX</div> -->
+      <div class="add_row">
+        <!-- 列表模块 -->
+        <div style="width: 47%">
+          <div class="add_row_title">运单池</div>
+          <div v-if="!search">
+            <el-form :inline="true" label-width="80px" :model="details.oldQuery" class="el-fr-d">
+              <div class="fo-fl">
+                <el-form-item label="关键词" class="el-times">
+                  <el-input></el-input>
+                </el-form-item>
+                <el-form-item label="目的网点" class="el-times">
+                  <el-input></el-input>
+                </el-form-item>
+                <el-form-item label="到站" class="el-times">
+                  <el-input></el-input>
+                </el-form-item>
+                <el-form-item label="目标品类" class="el-times">
+                  <el-input></el-input>
+                </el-form-item>
+                <el-form-item label="备注" class="el-times">
+                  <el-input></el-input>
+                </el-form-item>
+                <el-form-item label="托盘码" class="el-times">
+                  <el-input></el-input>
+                </el-form-item>
+                <el-form-item label="开单时间" class="el-times">
+                  <!--            <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>-->
+                  <el-date-picker
+                    v-model="stockupDate"
+                    type="daterange"
+                    unlink-panels
+                    range-separator="-"
+                    start-placeholder="开始时间"
+                    end-placeholder="结束时间"
+                    :shortcuts="shortcuts"
+                    clearable
+                  />
+                </el-form-item>
+                <el-form-item>
+                  <el-button type="primary" icon="el-icon-search" @click="searchReset()"
+                    >搜 索</el-button
+                  >
+                  <el-button icon="el-icon-delete" @click="searchReset()">重置</el-button>
+                </el-form-item>
+              </div>
+            </el-form>
+          </div>
+
+          <div style="margin-bottom: 10px" class="flex-c-sb">
+            <!-- 控件 -->
+            <div class="avue-crud__right">
+              <el-button icon="el-icon-refresh" @click="searchChange" circle></el-button>
+              <el-button icon="Operation" @click="showdrawer(true, 1)" circle></el-button>
+              <el-button icon="el-icon-search" @click="searchHide" circle></el-button>
+            </div>
+
+            <el-button type="text" style="cursor: pointer" @click="handleAddWaybill">
+              加入调度池
+              <el-icon><CaretRight /></el-icon>
+            </el-button>
+          </div>
+          <tablecmt
+            :columnList="details.oldColumnList"
+            :tableData="details.oldData"
+            :loading="loadingObj.oldListLoading"
+            @inputTxt="inputsc"
+            @timeCheck="timesc"
+            @btnCheck="btnsc"
+            @selectCheck="selectsc"
+            @selection="selectionChange"
+          >
+          </tablecmt>
+          <!-- 统计行 -->
+          <div class="statistics_row">
+            <!--           <div>合计: 选择数: {{ addInfo.oldSelectionList.length }}，</div>
+          <div>件数: {{ selectionList.length }}，</div>
+          <div>重量: {{ selectionList.length }}，</div>
+          <div>体积: {{ selectionList.length }}</div> -->
+          </div>
+
+          <div class="avue-crud__pagination flex-c-sb" style="width: 100%">
+            <!-- 分页模块 -->
+            <el-pagination
+              style="zoom: 0.9"
+              align="right"
+              background
+              @size-change="sizeChange"
+              @current-change="currentChange"
+              :current-page="zeroAdditionalRecordingInfo.oldPage.currentPage"
+              :page-sizes="[30, 50, 80, 120]"
+              :page-size="zeroAdditionalRecordingInfo.oldPage.pageSize"
+              layout="total, sizes, prev, pager, next, jumper"
+              :total="zeroAdditionalRecordingInfo.oldPage.total"
+            >
+            </el-pagination>
+          </div>
+        </div>
+
+        <!-- 列表模块 -->
+        <div style="width: 47%">
+          <div class="add_row_title">调度池</div>
+          <div v-if="!search">
+            <el-form :inline="true" label-width="80px" :model="details.newQuery" class="el-fr-d">
+              <div class="fo-fl">
+                <el-form-item label="关键词" class="el-times">
+                  <el-input></el-input>
+                </el-form-item>
+                <el-form-item label="目的网点" class="el-times">
+                  <el-input></el-input>
+                </el-form-item>
+                <el-form-item label="到站" class="el-times">
+                  <el-input></el-input>
+                </el-form-item>
+                <el-form-item label="目标品类" class="el-times">
+                  <el-input></el-input>
+                </el-form-item>
+                <el-form-item label="备注" class="el-times">
+                  <el-input></el-input>
+                </el-form-item>
+                <el-form-item label="托盘码" class="el-times">
+                  <el-input></el-input>
+                </el-form-item>
+                <el-form-item label="开单时间" class="el-times">
+                  <!--            <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>-->
+                  <el-date-picker
+                    v-model="stockupDate"
+                    type="daterange"
+                    unlink-panels
+                    range-separator="-"
+                    start-placeholder="开始时间"
+                    end-placeholder="结束时间"
+                    :shortcuts="shortcuts"
+                    clearable
+                  />
+                </el-form-item>
+                <el-form-item>
+                  <el-button type="primary" icon="el-icon-search" @click="searchReset()"
+                    >搜 索</el-button
+                  >
+                  <el-button icon="el-icon-delete" @click="searchReset()">重置</el-button>
+                </el-form-item>
+              </div>
+            </el-form>
+          </div>
+
+          <div style="margin-bottom: 10px" class="flex-c-sb">
+            <el-button type="text" class="pointer" @click="handleRemoveWaybill">
+              <el-icon><CaretLeft /></el-icon>
+              移除调度池
+            </el-button>
+
+            <!-- 控件 -->
+            <div class="avue-crud__right">
+              <el-button icon="el-icon-refresh" @click="searchChange" circle></el-button>
+              <el-button icon="Operation" @click="showdrawer(true, 2)" circle></el-button>
+              <el-button icon="el-icon-search" @click="searchHide" circle></el-button>
+            </div>
+          </div>
+          <tablecmt
+            :columnList="details.newColumnList"
+            :tableData="details.newData"
+            :loading="loadingObj.newListLoading"
+            @inputTxt="newInputsc"
+            @timeCheck="newTimesc"
+            @btnCheck="newBtnsc"
+            @selectCheck="newSelectsc"
+            @selection="newSelectionChange"
+          >
+          </tablecmt>
+          <div class="statistics_row">
+            <!--           <div>合计: 选择数: {{ addInfo.oldSelectionList.length }}，</div>
+          <div>件数: {{ selectionList.length }}，</div>
+          <div>重量: {{ selectionList.length }}，</div>
+          <div>体积: {{ selectionList.length }}</div> -->
+          </div>
+        </div>
+      </div>
+    </div>
+  </basic-container>
+
+  <!-- 提交按钮 -->
+  <el-button
+    type="primary"
+    class="submitBtn"
+    icon="el-icon-circle-check"
+    @click="handleEditZeroSubmit"
+    >提 交</el-button
+  >
+
+  <!-- 列表配置显示 -->
+  <edittablehead
+    @setcolum="setnewcolum"
+    @closce="showdrawer"
+    :drawerShow="drawerShow"
+    :columnList="details.columnList"
+  ></edittablehead>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, toRefs, computed, onMounted, nextTick } from 'vue';
+import functions from '@/utils/functions';
+import dayjs from 'dayjs';
+import { mapGetters } from 'vuex';
+/** 获取字典 */
+import { getDictionaryBiz } from '@/api/system/dict';
+import { downloadXls } from '@/utils/util';
+import { oldColumnList, newColumnList } from '@/option/distribution/zeroAdditionalRecording';
+
+const details = reactive<any>({
+  /** 是否开启搜索 */
+  search: true,
+  /** 运单池搜索条件 */
+  oldQuery: {},
+  /** 调度池搜索条件 */
+  newQuery: {},
+  /** 时间快捷选择设置 */
+  shortcuts: [
+    {
+      text: '最近一周',
+      value: () => {
+        const end = new Date();
+        const start = new Date();
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+        return [start, end];
+      },
+    },
+    {
+      text: '最近一个月',
+      value: () => {
+        const end = new Date();
+        const start = new Date();
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+        return [start, end];
+      },
+    },
+    {
+      text: '最近三个月',
+      value: () => {
+        const end = new Date();
+        const start = new Date();
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+        return [start, end];
+      },
+    },
+  ],
+  /** 时间选择器数据 */
+  stockupDate: [],
+  /** 列表 */
+  columnList: [],
+  oldColumnList,
+  newColumnList,
+  /** 订单池数据 */
+  oldData: [{}],
+  /** 调度池数据 */
+  newData: [],
+  /** 页面loading */
+  loadingObj: {
+    /** 列表加载loading */
+    list: false,
+    newListLoading: false,
+  },
+  /** 订单池列表复选框选中的数据 */
+  oldSelectionList: [],
+  /** 调度池复选框选中数据 */
+  newSelectionList: [],
+  /** 是否显示设置表格 */
+  drawerShow: false,
+  /** 分页参数 */
+  page: {
+    currentPage: 1,
+    pageSize: 30,
+    total: 0,
+  },
+  /** 装车明细分页参数 */
+  trickleLoadingPage: {
+    currentPage: 1,
+    pageSize: 30,
+    total: 0,
+  },
+  /** 弹出层显示 */
+  popUpShow: {
+    /** 装车详情 */
+    truckLoadingDetailVisited: false,
+    /** 零担补录 */
+    zeroAdditionalRecordingVisited: false,
+  },
+  /** 列表Dom节点 */
+  listNode: '',
+  form: {},
+  /** 零担补录信息 */
+  zeroAdditionalRecordingInfo: {
+    oldPage: {
+      pageSize: 30,
+      currentPage: 1,
+      total: 0,
+    },
+  },
+});
+
+const {
+  search,
+  query,
+  shortcuts,
+  stockupDate,
+  loadingObj,
+  selectionList,
+  drawerShow,
+  page,
+  trickleLoadingPage,
+  zeroAdditionalRecordingInfo,
+  popUpShow,
+} = toRefs(details);
+
+/** vuex */
+const permission = computed(() => mapGetters(['permission', 'tagWel', 'tagList']));
+console.log('permission :>> ', permission);
+
+onMounted(() => {
+  const timer = setTimeout(() => {
+    details.listNodeList = document.querySelectorAll('.maboxhi');
+    details.listNodeList.forEach(_node => {
+      _node.style.transition = 'all .5s ease-out';
+    });
+    clearTimeout(timer);
+  }, 100);
+});
+
+/** 请求页面数据 */
+const onLoad = (page: any) => {};
+
+/** 搜索 */
+const searchChange = () => {
+  onLoad(details.page);
+};
+
+/** 清空表单 */
+const searchReset = () => {
+  details.query = {};
+  details.stockupDate = [];
+  details.page.currentPage = 1;
+  onLoad(details.page);
+};
+
+/** 展开列表控件 */
+const showdrawer = (_flag?: boolean, _type?: number) => {
+  switch (_type) {
+    case 1:
+      details.columnList = oldColumnList;
+      break;
+    case 2:
+      details.columnList = newColumnList;
+      break;
+  }
+  console.log('details.columnList :>> ', details.columnList);
+  details.drawerShow = _flag;
+};
+
+/** 是否开启搜索区 */
+const searchHide = () => {
+  function getWinHight() {
+    var windowHight = 0;
+    if (document.body.clientHeight && document.documentElement.clientHeight) {
+      windowHight =
+        document.body.clientHeight < document.documentElement.clientHeight
+          ? document.body.clientHeight
+          : document.documentElement.clientHeight;
+    } else {
+    }
+    return document.documentElement.clientHeight;
+  }
+  details.search = !details.search;
+  const timer = setTimeout(() => {
+    details.listNodeList.forEach(_node => {
+      console.log('_node :>> ', _node);
+      _node.style.height = getWinHight() - _node.getBoundingClientRect().top - 70 + 'px';
+    });
+    clearTimeout(timer);
+  }, 10);
+};
+
+/** 表格表头输入框搜索 */
+const inputsc = (index, row) => {
+  details.query[row.prop] = index;
+  onLoad(details.page);
+};
+
+/** 表格表头时间选择 */
+const timesc = (index, row) => {
+  console.log(index, row);
+  if (!!index) {
+    index = dayjs(index).format('YYYY-MM-DD');
+  }
+  details.query[row.prop] = index;
+  if (!index) {
+    delete details.query[row.prop];
+  }
+  onLoad(details.page);
+};
+
+/** 表格表头输入框搜索 */
+const btnsc = () => {};
+
+/** 表格表头下拉框选择 */
+const selectsc = (index, row) => {
+  details.query[row.prop] = index;
+  if (!index) delete details.query[row.prop];
+  if (row.prop === 'certificateTypeName') {
+    details.query['certificateType'] = index;
+    if (!index) delete details.query['certificateType'];
+  }
+  onLoad(details.page);
+};
+
+/** 表格表头复选框选择 */
+const selectionChange = (list: any) => {
+  details.selectionList = list;
+};
+
+/** 表格表头输入框搜索 */
+const newInputsc = (index, row) => {
+  details.newQuery[row.prop] = index;
+  onLoad(details.page);
+};
+
+/** 表格表头时间选择 */
+const newTimesc = (index, row) => {
+  console.log(index, row);
+  if (!!index) {
+    index = dayjs(index).format('YYYY-MM-DD');
+  }
+  details.newQuery[row.prop] = index;
+  if (!index) {
+    delete details.newQuery[row.prop];
+  }
+  onLoad(details.page);
+};
+
+/** 表格表头输入框搜索 */
+const newBtnsc = () => {};
+
+/** 表格表头下拉框选择 */
+const newSelectsc = (index, row) => {
+  details.newQuery[row.prop] = index;
+  if (!index) delete details.newQuery[row.prop];
+  if (row.prop === 'certificateTypeName') {
+    details.newQuery['certificateType'] = index;
+    if (!index) delete details.newQuery['certificateType'];
+  }
+  onLoad(details.page);
+};
+
+/** 表格表头复选框选择 */
+const newSelectionChange = (list: any) => {
+  details.newSelectionList = list;
+};
+
+/** 每页数量改变执行的回调 */
+const sizeChange = (pageSize: number) => {
+  details.page.pageSize = pageSize;
+  onLoad(details.page);
+};
+
+/** 页码改变执行的回调 */
+const currentChange = () => {};
+
+/**
+ * 设置列表 -- 固定函数
+ * 弹窗的勾选回调，用于更改头部数组
+ * 固定搭配，只需要更换   columnList
+ *  */
+const setnewcolum = (newarr, headarr, type) => {
+  if (type == 1) {
+    details.columnList = newarr;
+    functions.setStorage(window.location.pathname + 'checkList', headarr);
+  } else if (type == 2) {
+    details.columnList = newarr;
+    functions.setStorage(window.location.pathname + 'flexList', headarr);
+  } else if (type == 3) {
+    details.columnList = newarr;
+    functions.setStorage(window.location.pathname + 'sortlist', headarr);
+  }
+};
+
+/** 添加运单 */
+const handleAddWaybill = () => {
+  //   if (this.addInfo.oldSelectionList.length === 0) return this.$message.warning('最少选择一条运单');
+  //   this.addInfo.newData = [...this.addInfo.newData, ...this.addInfo.oldSelectionList];
+  //   this.addInfo.haveIds = this.addInfo.map(val => val.id);
+};
+/** 移除运单 */
+const handleRemoveWaybill = () => {
+  //   if (this.addInfo.newSelectionList.length === 0) return this.$message.warning('最少选择一条运单');
+  //   this.addInfo.newData = [...this.addInfo.newData, ...this.addInfo.oldSelectionList];
+  //   this.addInfo.haveIds = this.addInfo.map(val => val.id);
+};
+
+/** 零担补录提交 */
+const handleEditZeroSubmit = () => {
+  details.popUpShow.zeroAdditionalRecordingVisited = false;
+};
+</script>
+
+<style scoped lang="scss">
+.fo-fl {
+  display: flex;
+  flex-wrap: wrap;
+  zoom: 0.9;
+}
+
+// 日期选择器
+:deep(.el-date-editor.el-input) {
+  height: 100% !important;
+  width: 100% !important;
+}
+
+:deep(.el-range-editor.el-input__wrapper) {
+  height: 100% !important;
+}
+
+:deep(.el-form--inline .el-form-item) {
+  margin-right: 0;
+}
+
+// 新增行
+.add_row {
+  display: flex;
+  justify-content: space-between;
+}
+
+.add_row_title {
+  text-align: center;
+  margin-bottom: 10px;
+  font-size: 18px;
+  font-weight: bold;
+}
+
+// 统计行
+.statistics_row {
+  margin: 10px 0;
+  font-size: 14px;
+  zoom: 0.9;
+  display: flex;
+
+  > div {
+    margin-right: 20px;
+  }
+}
+
+// 卡片容器
+.crad_container {
+  display: flex;
+
+  .card_container_item {
+    flex: 1;
+    // padding: 10px;
+    border-radius: 5px;
+    box-shadow: 0 0 5px #ccc;
+
+    &:first-child {
+      margin-right: 20px;
+    }
+
+    .card_container_item_title {
+      padding: 10px;
+      border-bottom: 1px solid #ccc;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+    }
+
+    .card_container_item_box {
+      padding: 10px;
+    }
+  }
+}
+
+.pointer {
+  cursor: pointer;
+}
+
+// 提交按钮
+.submitBtn {
+  position: fixed;
+  bottom: 20px;
+  left: 50%;
+  transform: translateX(-50%);
+}
+</style>
diff --git a/src/views/distribution/inventory/BookingNote.vue b/src/views/distribution/inventory/BookingNote.vue
new file mode 100644
index 00000000..92f4da2b
--- /dev/null
+++ b/src/views/distribution/inventory/BookingNote.vue
@@ -0,0 +1,1075 @@
+<template>
+  <basic-container>
+    <div class="avue-crud">
+      <el-tabs type="border-card" v-model="activeTab">
+        <el-tab-pane label="详 情 信 息" name="tab1">
+          <el-divider style="font-size: 28px">货物托运单</el-divider>
+
+          <el-form :inline="true" :model="query" class="el-fr-d" label-width="100px">
+            <!-- 顶部 -->
+            <div class="flex-c-sb">
+              <div>
+                <div>品牌: 欧派</div>
+                <di>运单号: LQ23060003</di>
+              </div>
+
+              <div>admin 1997-01-01 12:00:00</div>
+            </div>
+
+            <!-- 第一排 -->
+            <div class="table-row">
+              <el-form-item label="发站仓:" class="el-times">
+                <el-select v-model="query.serviceNumber" class="m-2" placeholder="Select">
+                  <el-option
+                    v-for="item in details.options"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+              </el-form-item>
+
+              <el-form-item label="到站:">
+                <el-input v-model="query.serviceNumber" placeholder="请输入服务号"></el-input>
+              </el-form-item>
+
+              <el-form-item label="目的仓:" class="el-times">
+                <el-select v-model="query.serviceNumber" class="m-2" placeholder="Select">
+                  <el-option
+                    v-for="item in details.options"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+              </el-form-item>
+
+              <el-form-item label="货号:">
+                <el-input v-model="query.serviceNumber" disabled placeholder="货号"></el-input>
+              </el-form-item>
+            </div>
+
+            <!-- 订单自编号 -->
+            <div class="table-row">
+              <el-form-item label="订单自编号:" class="el-times">
+                <el-input
+                  v-model="query.serviceNumber"
+                  type="textarea"
+                  disabled
+                  placeholder="订单自编号"
+                ></el-input>
+              </el-form-item>
+            </div>
+
+            <!-- 发货方 && 收货方 -->
+            <div class="table-row">
+              <div style="margin-right: 10px">
+                <div class="flex-c table-row-title">发货方</div>
+                <div>
+                  <el-row>
+                    <el-form-item label="发货单位:">
+                      <el-input
+                        v-model="query.serviceNumber"
+                        disabled
+                        placeholder="发货单位"
+                      ></el-input>
+                    </el-form-item>
+
+                    <el-form-item label="发货人:">
+                      <el-input
+                        v-model="query.serviceNumber"
+                        disabled
+                        placeholder="发货人"
+                      ></el-input>
+                    </el-form-item>
+                  </el-row>
+
+                  <el-row>
+                    <el-form-item label="手机号码:">
+                      <el-input
+                        v-model="query.serviceNumber"
+                        disabled
+                        placeholder="手机号码"
+                      ></el-input>
+                    </el-form-item>
+                  </el-row>
+
+                  <el-row>
+                    <el-form-item label="发货地址:">
+                      <el-input
+                        v-model="query.serviceNumber"
+                        disabled
+                        placeholder="发货地址"
+                      ></el-input>
+                    </el-form-item>
+                  </el-row>
+                </div>
+              </div>
+              <div>
+                <div class="flex-c table-row-title">收货方</div>
+                <div>
+                  <el-row>
+                    <el-form-item label="收货单位:">
+                      <el-input
+                        v-model="query.serviceNumber"
+                        disabled
+                        placeholder="收货单位"
+                      ></el-input>
+                    </el-form-item>
+
+                    <el-form-item label="收货人:">
+                      <el-input
+                        v-model="query.serviceNumber"
+                        disabled
+                        placeholder="收货人"
+                      ></el-input>
+                    </el-form-item>
+                  </el-row>
+
+                  <el-row>
+                    <el-form-item label="手机号码:">
+                      <el-input
+                        v-model="query.serviceNumber"
+                        disabled
+                        placeholder="手机号码"
+                      ></el-input>
+                    </el-form-item>
+                  </el-row>
+
+                  <el-row>
+                    <el-form-item label="收货地址:">
+                      <el-input
+                        v-model="query.serviceNumber"
+                        disabled
+                        placeholder="收货地址"
+                      ></el-input>
+                    </el-form-item>
+                  </el-row>
+                </div>
+              </div>
+            </div>
+
+            <!-- 订单自编号 -->
+            <div class="table-row">
+              <el-form-item label="订单自编号:" class="el-times">
+                <el-input
+                  v-model="query.serviceNumber"
+                  type="textarea"
+                  disabled
+                  placeholder="订单自编号"
+                ></el-input>
+              </el-form-item>
+            </div>
+
+            <!-- 计价方式行 -->
+            <div class="table-row table_row_number">
+              <div style="width: 230px; flex: none">
+                <el-form-item label="计价方式:" label-width="fit-content" class="el-times">
+                  <el-radio-group v-model="query.serviceNumber" style="display: flex">
+                    <el-radio :label="3">方</el-radio>
+                    <el-radio :label="6">件</el-radio>
+                    <el-radio :label="9">公斤</el-radio>
+                  </el-radio-group>
+                </el-form-item>
+              </div>
+
+              <el-form-item label="货物名称:" label-width="fit-content" class="el-times">
+                <el-select v-model="query.serviceNumber" class="m-2" placeholder="Select">
+                  <el-option
+                    v-for="item in details.options"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+              </el-form-item>
+
+              <el-form-item label="件数:" label-width="fit-content" class="el-times">
+                <el-input-number
+                  v-model="query.serviceNumber"
+                  controls-position="right"
+                  :precision="0"
+                  :step="0.1"
+                />
+              </el-form-item>
+
+              <el-form-item label="重量(kg):" label-width="fit-content" class="el-times">
+                <el-input-number
+                  v-model="query.serviceNumber"
+                  controls-position="right"
+                  :precision="3"
+                  :step="0.1"
+                />
+              </el-form-item>
+
+              <el-form-item label="体积(方):" label-width="fit-content" class="el-times">
+                <el-input-number
+                  v-model="query.serviceNumber"
+                  controls-position="right"
+                  :precision="4"
+                  :step="0.1"
+                />
+              </el-form-item>
+
+              <el-form-item label="单价:" label-width="fit-content" class="el-times">
+                <el-input-number
+                  v-model="query.serviceNumber"
+                  controls-position="right"
+                  :precision="2"
+                  :step="0.1"
+                />
+              </el-form-item>
+
+              <el-form-item label="运费小计:" label-width="fit-content" class="el-times">
+                <el-input-number
+                  v-model="query.serviceNumber"
+                  controls-position="right"
+                  :precision="2"
+                  :step="0.1"
+                />
+              </el-form-item>
+            </div>
+
+            <!-- 合计行 -->
+            <div class="table-row table_row_number table_row_total">
+              <div style="width: 230px; flex: none">合计</div>
+              <div></div>
+              <div></div>
+              <div></div>
+              <div></div>
+              <div></div>
+              <div></div>
+            </div>
+
+            <!-- 合计运费 && 支付方式 -->
+            <div class="table-row">
+              <!-- 合计运费 -->
+              <div style="margin-right: 10px; width: 60%; flex: none">
+                <div style="flex: 1">
+                  <div class="table-row-title" style="margin-bottom: 10px">合计费用</div>
+                  <div>
+                    <el-form label-width="fit-content">
+                      <el-row>
+                        <el-form-item label="发货单位:">
+                          <el-input v-model="query.serviceNumber" disabled></el-input>
+                        </el-form-item>
+
+                        <el-form-item label="发货人:">
+                          <el-input v-model="query.serviceNumber" disabled></el-input>
+                        </el-form-item>
+
+                        <el-form-item label="发货人:">
+                          <el-input v-model="query.serviceNumber" disabled></el-input>
+                        </el-form-item>
+
+                        <el-form-item label="发货人:">
+                          <el-input v-model="query.serviceNumber" disabled></el-input>
+                        </el-form-item>
+
+                        <el-form-item label="发货人:">
+                          <el-input v-model="query.serviceNumber" disabled></el-input>
+                        </el-form-item>
+                      </el-row>
+
+                      <el-row>
+                        <el-form-item label="装卸费:">
+                          <el-input v-model="query.serviceNumber" disabled></el-input>
+                        </el-form-item>
+                        <el-form-item label="其它费用:">
+                          <el-input v-model="query.serviceNumber" disabled></el-input>
+                        </el-form-item>
+                        <el-form-item label="保价费:">
+                          <el-input v-model="query.serviceNumber" disabled></el-input>
+                        </el-form-item>
+                        <el-form-item label="申明价值:">
+                          <el-input v-model="query.serviceNumber" disabled></el-input>
+                        </el-form-item>
+                      </el-row>
+                    </el-form>
+                  </div>
+                </div>
+              </div>
+
+              <!-- 付款方式 -->
+              <div>
+                <div style="flex: 1">
+                  <div class="table-row-title" style="margin-bottom: 10px">合计费用</div>
+                  <div>
+                    <el-form label-width="fit-content">
+                      <el-row>
+                        <el-form-item label="支付方式:">
+                          <el-input v-model="query.serviceNumber" disabled></el-input>
+                        </el-form-item>
+
+                        <el-form-item label="付款方式:">
+                          <el-input v-model="query.serviceNumber" disabled></el-input>
+                        </el-form-item>
+
+                        <el-form-item label="现付:">
+                          <el-input v-model="query.serviceNumber" disabled></el-input>
+                        </el-form-item>
+                      </el-row>
+
+                      <el-row>
+                        <el-form-item label="到付:">
+                          <el-input v-model="query.serviceNumber" disabled></el-input>
+                        </el-form-item>
+
+                        <el-form-item label="月结:">
+                          <el-input v-model="query.serviceNumber" disabled></el-input>
+                        </el-form-item>
+
+                        <el-form-item label="回付:">
+                          <el-input v-model="query.serviceNumber" disabled></el-input>
+                        </el-form-item>
+                      </el-row>
+                    </el-form>
+                  </div>
+                </div>
+              </div>
+            </div>
+
+            <!-- 计价方式行 -->
+            <div class="table-row table_row_number">
+              <div>
+                <el-form-item label="开单人:" label-width="fit-content" class="el-times">
+                  <el-input />
+                </el-form-item>
+              </div>
+
+              <el-form-item label="三方操作费:" label-width="fit-content" class="el-times">
+                <el-input-number
+                  v-model="query.serviceNumber"
+                  controls-position="right"
+                  :precision="0"
+                  :step="0.1"
+                />
+              </el-form-item>
+
+              <el-form-item label="送货方式:" label-width="fit-content" class="el-times">
+                <el-select v-model="query.serviceNumber" class="m-2" placeholder="Select">
+                  <el-option
+                    v-for="item in details.options"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+              </el-form-item>
+
+              <el-form-item label="紧急度:" label-width="fit-content" class="el-times">
+                <el-select v-model="query.serviceNumber" class="m-2" placeholder="Select">
+                  <el-option
+                    v-for="item in details.options"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+              </el-form-item>
+
+              <el-form-item label="回单" label-width="fit-content" class="el-times">
+                <el-input-number
+                  v-model="query.serviceNumber"
+                  controls-position="right"
+                  :precision="0"
+                  :step="1"
+                />
+              </el-form-item>
+
+              <el-form-item label="回单要求:" label-width="fit-content" class="el-times">
+                <el-select v-model="query.serviceNumber" class="m-2" placeholder="Select">
+                  <el-option
+                    v-for="item in details.options"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+              </el-form-item>
+
+              <el-form-item label="运输方式:" label-width="fit-content" class="el-times">
+                <el-select v-model="query.serviceNumber" class="m-2" placeholder="Select">
+                  <el-option
+                    v-for="item in details.options"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+              </el-form-item>
+            </div>
+
+            <!-- 订单自编号 -->
+            <div class="table-row">
+              <el-form-item label="备注:" class="el-times">
+                <el-input
+                  v-model="query.serviceNumber"
+                  type="textarea"
+                  disabled
+                  placeholder="订单自编号"
+                ></el-input>
+              </el-form-item>
+            </div>
+          </el-form>
+
+          <el-tabs
+            type="border-card"
+            class="mt10"
+            @tab-click="handleTabItemClick"
+            v-model="activeTabItem"
+          >
+            <!-- 支出费用 -->
+            <el-tab-pane label="支 出 费 用" name="tabItem1"></el-tab-pane>
+            <!-- 配载信息 -->
+            <el-tab-pane label="配 载 信 息" name="tabItem2">
+              <!-- 列表模块 -->
+              <tablecmt
+                class="StowageInfo"
+                :columnList="details.columnList"
+                :tableData="data"
+                :loading="loadingObj.stowageLoading"
+                @inputTxt="inputsc"
+                @timeCheck="timesc"
+                @btnCheck="btnsc"
+                @selectCheck="selectsc"
+                @selection="selectionChange"
+              >
+                <template #default="slotProps">
+                  <template v-if="slotProps.scope.column.label === '批次号'">
+                    <el-text>123</el-text>
+                  </template>
+
+                  <template v-if="slotProps.scope.column.label === '操作'">
+                    <el-text @click="handleShowTruckLoadingDetails">装车明细</el-text>
+                    <el-text>编辑</el-text>
+                  </template>
+                </template>
+              </tablecmt>
+
+              <el-pagination
+                align="right"
+                background
+                @size-change="sizeChange"
+                @current-change="currentChange"
+                :current-page="details.stowagePage.currentPage"
+                :page-sizes="[30, 50, 80, 120]"
+                :page-size="details.stowagePage.pageSize"
+                layout="total, sizes, prev, pager, next, jumper"
+                :total="details.stowagePage.total"
+              >
+              </el-pagination>
+            </el-tab-pane>
+            <el-tab-pane label="中 转 信 息" name="tabItem3"></el-tab-pane>
+          </el-tabs>
+
+          <!-- 提交按钮 -->
+          <div class="submitDataContainer">
+            <el-button type="primary" icon="el-icon-position" @click="searchReset()">
+              审 核</el-button
+            >
+            <el-button type="primary" icon="el-icon-edit" @click="searchReset()"> 修 改</el-button>
+            <el-button type="primary" icon="el-icon-printer" @click="searchReset()">
+              打 印</el-button
+            >
+            <el-button type="primary" icon="el-icon-close" @click="searchReset()"> 关 闭</el-button>
+          </div>
+
+          <!-- 底部顶位的容器 -->
+          <div class="footer"></div>
+        </el-tab-pane>
+
+        <el-tab-pane label="运 单 跟 踪" name="tab2">
+          <!-- 列表模块 -->
+          <tablecmt
+            class="StowageInfo"
+            :columnList="details.columnList"
+            :tableData="data"
+            :loading="loadingObj.stowageLoading"
+            @inputTxt="inputsc"
+            @timeCheck="timesc"
+            @btnCheck="btnsc"
+            @selectCheck="selectsc"
+            @selection="selectionChange"
+          >
+            <template #default="slotProps">
+              <template v-if="slotProps.scope.column.label === '批次号'">
+                <el-text>123</el-text>
+              </template>
+
+              <template v-if="slotProps.scope.column.label === '操作'">
+                <el-text @click="handleShowTruckLoadingDetails">装车明细</el-text>
+                <el-text>编辑</el-text>
+              </template>
+            </template>
+          </tablecmt>
+
+          <el-pagination
+            align="right"
+            background
+            @size-change="sizeChange"
+            @current-change="currentChange"
+            :current-page="details.stowagePage.currentPage"
+            :page-sizes="[30, 50, 80, 120]"
+            :page-size="details.stowagePage.pageSize"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="details.stowagePage.total"
+          >
+          </el-pagination>
+        </el-tab-pane>
+
+        <el-tab-pane label="财 务 记 录" name="tab3">
+          <!-- 列表模块 -->
+          <tablecmt
+            class="StowageInfo"
+            :columnList="details.columnList"
+            :tableData="data"
+            :loading="loadingObj.stowageLoading"
+            @inputTxt="inputsc"
+            @timeCheck="timesc"
+            @btnCheck="btnsc"
+            @selectCheck="selectsc"
+            @selection="selectionChange"
+          >
+            <template #default="slotProps">
+              <template v-if="slotProps.scope.column.label === '批次号'">
+                <el-text>123</el-text>
+              </template>
+
+              <template v-if="slotProps.scope.column.label === '操作'">
+                <el-text @click="handleShowTruckLoadingDetails">装车明细</el-text>
+                <el-text>编辑</el-text>
+              </template>
+            </template>
+          </tablecmt>
+
+          <el-pagination
+            align="right"
+            background
+            @size-change="sizeChange"
+            @current-change="currentChange"
+            :current-page="details.stowagePage.currentPage"
+            :page-sizes="[30, 50, 80, 120]"
+            :page-size="details.stowagePage.pageSize"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="details.stowagePage.total"
+          >
+          </el-pagination>
+        </el-tab-pane>
+
+        <el-tab-pane label="改 单 记 录" name="tab4">
+          <!-- 列表模块 -->
+          <tablecmt
+            class="StowageInfo"
+            :columnList="details.columnList"
+            :tableData="data"
+            :loading="loadingObj.stowageLoading"
+            @inputTxt="inputsc"
+            @timeCheck="timesc"
+            @btnCheck="btnsc"
+            @selectCheck="selectsc"
+            @selection="selectionChange"
+          >
+            <template #default="slotProps">
+              <template v-if="slotProps.scope.column.label === '批次号'">
+                <el-text>123</el-text>
+              </template>
+
+              <template v-if="slotProps.scope.column.label === '操作'">
+                <el-text @click="handleShowTruckLoadingDetails">装车明细</el-text>
+                <el-text>编辑</el-text>
+              </template>
+            </template>
+          </tablecmt>
+
+          <el-pagination
+            align="right"
+            background
+            @size-change="sizeChange"
+            @current-change="currentChange"
+            :current-page="details.stowagePage.currentPage"
+            :page-sizes="[30, 50, 80, 120]"
+            :page-size="details.stowagePage.pageSize"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="details.stowagePage.total"
+          >
+          </el-pagination>
+        </el-tab-pane>
+
+        <el-tab-pane label="回 单 跟 踪" name="tab15">
+          <!-- 列表模块 -->
+          <tablecmt
+            class="StowageInfo"
+            :columnList="details.columnList"
+            :tableData="data"
+            :loading="loadingObj.stowageLoading"
+            @inputTxt="inputsc"
+            @timeCheck="timesc"
+            @btnCheck="btnsc"
+            @selectCheck="selectsc"
+            @selection="selectionChange"
+          >
+            <template #default="slotProps">
+              <template v-if="slotProps.scope.column.label === '批次号'">
+                <el-text>123</el-text>
+              </template>
+
+              <template v-if="slotProps.scope.column.label === '操作'">
+                <el-text @click="handleShowTruckLoadingDetails">装车明细</el-text>
+                <el-text>编辑</el-text>
+              </template>
+            </template>
+          </tablecmt>
+
+          <el-pagination
+            align="right"
+            background
+            @size-change="sizeChange"
+            @current-change="currentChange"
+            :current-page="details.stowagePage.currentPage"
+            :page-sizes="[30, 50, 80, 120]"
+            :page-size="details.stowagePage.pageSize"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="details.stowagePage.total"
+          >
+          </el-pagination>
+        </el-tab-pane>
+
+        <el-tab-pane label="异 动 记 录" name="tab6">
+          <!-- 列表模块 -->
+          <tablecmt
+            class="StowageInfo"
+            :columnList="details.columnList"
+            :tableData="data"
+            :loading="loadingObj.stowageLoading"
+            @inputTxt="inputsc"
+            @timeCheck="timesc"
+            @btnCheck="btnsc"
+            @selectCheck="selectsc"
+            @selection="selectionChange"
+          >
+            <template #default="slotProps">
+              <template v-if="slotProps.scope.column.label === '批次号'">
+                <el-text>123</el-text>
+              </template>
+
+              <template v-if="slotProps.scope.column.label === '操作'">
+                <el-text @click="handleShowTruckLoadingDetails">装车明细</el-text>
+                <el-text>编辑</el-text>
+              </template>
+            </template>
+          </tablecmt>
+
+          <el-pagination
+            align="right"
+            background
+            @size-change="sizeChange"
+            @current-change="currentChange"
+            :current-page="details.stowagePage.currentPage"
+            :page-sizes="[30, 50, 80, 120]"
+            :page-size="details.stowagePage.pageSize"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="details.stowagePage.total"
+          >
+          </el-pagination>
+        </el-tab-pane>
+
+        <el-tab-pane label="运单订单记录" name="tab7">
+          <!-- 列表模块 -->
+          <tablecmt
+            class="StowageInfo"
+            :columnList="details.columnList"
+            :tableData="data"
+            :loading="loadingObj.stowageLoading"
+            @inputTxt="inputsc"
+            @timeCheck="timesc"
+            @btnCheck="btnsc"
+            @selectCheck="selectsc"
+            @selection="selectionChange"
+          >
+            <template #default="slotProps">
+              <template v-if="slotProps.scope.column.label === '批次号'">
+                <el-text>123</el-text>
+              </template>
+
+              <template v-if="slotProps.scope.column.label === '操作'">
+                <el-text @click="handleShowTruckLoadingDetails">装车明细</el-text>
+                <el-text>编辑</el-text>
+              </template>
+            </template>
+          </tablecmt>
+
+          <el-pagination
+            align="right"
+            background
+            @size-change="sizeChange"
+            @current-change="currentChange"
+            :current-page="details.stowagePage.currentPage"
+            :page-sizes="[30, 50, 80, 120]"
+            :page-size="details.stowagePage.pageSize"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="details.stowagePage.total"
+          >
+          </el-pagination>
+        </el-tab-pane>
+      </el-tabs>
+    </div>
+  </basic-container>
+  <edittablehead
+    @setcolum="setnewcolum"
+    @closce="showdrawer"
+    :drawerShow="drawerShow"
+    :columnList="columnList"
+  >
+  </edittablehead>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, toRefs, computed, onMounted, nextTick } from 'vue';
+import functions from '@/utils/functions';
+import dayjs from 'dayjs';
+import { mapGetters } from 'vuex';
+/** 获取字典 */
+import { getDictionaryBiz } from '@/api/system/dict';
+import { downloadXls } from '@/utils/util';
+import { columnList, detailsColumnList } from '@/option/distribution/VehicleStowage';
+import { useRouter } from 'vue-router';
+
+// 获取路由实例
+const $router = useRouter();
+
+const details = reactive<any>({
+  /** 是否开启搜索 */
+  search: true,
+  /** 表格搜索条件 */
+  query: {},
+  options: [],
+  /** 时间快捷选择设置 */
+  shortcuts: [
+    {
+      text: '最近一周',
+      value: () => {
+        const end = new Date();
+        const start = new Date();
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+        return [start, end];
+      },
+    },
+    {
+      text: '最近一个月',
+      value: () => {
+        const end = new Date();
+        const start = new Date();
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+        return [start, end];
+      },
+    },
+    {
+      text: '最近三个月',
+      value: () => {
+        const end = new Date();
+        const start = new Date();
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+        return [start, end];
+      },
+    },
+  ],
+  /** 时间选择器数据 */
+  stockupDate: [],
+  /** 列表 */
+  columnList,
+  detailsColumnList,
+  /** 列表数据 */
+  data: [{}],
+  /** 页面loading */
+  loadingObj: {
+    /** 配载信息loading */
+    stowageLoading: false,
+  },
+  /** 列表复选框选中的数据 */
+  selectionList: [],
+  /** 是否显示设置表格 */
+  drawerShow: false,
+  /** 分页参数 */
+  page: {
+    currentPage: 1,
+    pageSize: 30,
+    total: 0,
+  },
+  /** 配载信息分页数据 */
+  stowagePage: {
+    currentPage: 1,
+    pageSize: 30,
+    total: 0,
+  },
+  /** 弹出层显示 */
+  popUpShow: {
+    /** 装车详情 */
+    truckLoadingDetailVisited: false,
+  },
+  /** 列表Dom节点 */
+  listNode: '',
+  form: {},
+  activeTab: 'tab1',
+  activeTabItem: 'tabItem1',
+});
+
+const {
+  search,
+  query,
+  shortcuts,
+  stockupDate,
+  data,
+  drawerShow,
+  page,
+  activeTab,
+  activeTabItem,
+  loadingObj,
+} = toRefs(details);
+
+/** vuex */
+const permission = computed(() => mapGetters(['permission', 'tagWel', 'tagList']));
+console.log('permission :>> ', permission);
+
+onMounted(() => {
+  /*   const timer = setTimeout(() => {
+    details.listNode = document.querySelector('.maboxhi');
+    details.listNode.style.transition = 'all .5s ease-out';
+    console.log('details.listNode :>> ', details.listNode);
+    clearTimeout(timer);
+  }, 100); */
+});
+
+/** 请求页面数据 */
+const onLoad = (page: any) => {};
+
+/** 搜索 */
+const searchChange = () => {
+  onLoad(details.page);
+};
+
+/** 清空表单 */
+const searchReset = () => {
+  details.query = {};
+  details.stockupDate = [];
+  details.page.currentPage = 1;
+  onLoad(details.page);
+};
+
+/** 展开列表控件 */
+const showdrawer = (_flag?: boolean) => {
+  details.drawerShow = _flag;
+};
+
+/** 是否开启搜索区 */
+const searchHide = () => {
+  function getWinHight() {
+    var windowHight = 0;
+    if (document.body.clientHeight && document.documentElement.clientHeight) {
+      windowHight =
+        document.body.clientHeight < document.documentElement.clientHeight
+          ? document.body.clientHeight
+          : document.documentElement.clientHeight;
+    } else {
+    }
+    return document.documentElement.clientHeight;
+  }
+  details.search = !details.search;
+  const timer = setTimeout(() => {
+    details.listNode.style.height =
+      getWinHight() - details.listNode.getBoundingClientRect().top - 70 + 'px';
+    clearTimeout(timer);
+  }, 10);
+};
+
+/** 表格表头输入框搜索 */
+const inputsc = (index, row) => {
+  details.query[row.prop] = index;
+  onLoad(details.page);
+};
+
+/** 表格表头时间选择 */
+const timesc = (index, row) => {
+  console.log(index, row);
+  if (!!index) {
+    index = dayjs(index).format('YYYY-MM-DD');
+  }
+  details.query[row.prop] = index;
+  if (!index) {
+    delete details.query[row.prop];
+  }
+  onLoad(details.page);
+};
+
+/** 表格表头输入框搜索 */
+const btnsc = () => {};
+
+/** 表格表头下拉框选择 */
+const selectsc = (index, row) => {
+  details.query[row.prop] = index;
+  if (!index) delete details.query[row.prop];
+  if (row.prop === 'certificateTypeName') {
+    details.query['certificateType'] = index;
+    if (!index) delete details.query['certificateType'];
+  }
+  onLoad(details.page);
+};
+
+/** 表格表头复选框选择 */
+const selectionChange = (list: any) => {
+  details.selectionList = list;
+};
+
+/** 每页数量改变执行的回调 */
+const sizeChange = (pageSize: number) => {
+  details.page.pageSize = pageSize;
+  onLoad(details.page);
+};
+
+/** 页码改变执行的回调 */
+const currentChange = () => {};
+
+/**
+ * 设置列表 -- 固定函数
+ * 弹窗的勾选回调，用于更改头部数组
+ * 固定搭配，只需要更换   columnList
+ *  */
+const setnewcolum = (newarr, headarr, type) => {
+  if (type == 1) {
+    details.columnList = newarr;
+    functions.setStorage(window.location.pathname + 'checkList', headarr);
+  } else if (type == 2) {
+    details.columnList = newarr;
+    functions.setStorage(window.location.pathname + 'flexList', headarr);
+  } else if (type == 3) {
+    details.columnList = newarr;
+    functions.setStorage(window.location.pathname + 'sortlist', headarr);
+  }
+};
+
+/** 切换tabber -- 支出费用 */
+const getIncurExpenseInfo = () => {};
+/** 切换tabber -- 配载信息 */
+const getStowageInfo = () => {
+  const _node = document.querySelector('.StowageInfo');
+  _node.style.height = '400px';
+  console.log('_node :>> ', _node);
+};
+/** 切换tabber -- 中转信息 */
+const getTransferInfo = () => {};
+
+/** 详情信息页面tabber切换时执行的回调 */
+const handleTabItemClick = tab => {
+  console.log('tab :>> ', tab);
+  const { name } = tab.props;
+  console.log('name :>> ', name);
+  switch (name) {
+    // 费用支出
+    case 'tabItem1':
+      getIncurExpenseInfo();
+      break;
+    // 配载信息
+    case 'tabItem2':
+      getStowageInfo();
+      break;
+    // 中转信息
+    case 'tabItem3':
+      getTransferInfo();
+      break;
+  }
+};
+</script>
+
+<style scoped lang="scss">
+// 页面字体大小
+.avue-crud {
+  font-size: 12px !important;
+}
+
+.table-row {
+  width: 100%;
+  display: flex;
+  // border: 1px solid #ddd;
+  border-bottom: none;
+
+  &:last-child {
+    // border: 1px solid #ddd;
+  }
+
+  > div {
+    flex: 1;
+    padding: 5px;
+    border: 1px solid #ddd;
+    display: inline-flex;
+    box-sizing: border-box;
+  }
+}
+
+.table-row-title {
+  background: #f5f7fa;
+  margin-right: 10px;
+  padding: 10px;
+
+  & + div {
+    flex: 1;
+
+    :deep(.el-form-item) {
+      flex: 1;
+      margin-right: 10px;
+    }
+
+    :deep(.el-row) {
+      margin-bottom: 10px;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
+  }
+}
+
+.table_row_number {
+  > div {
+    flex-grow: 1;
+    justify-content: center;
+  }
+}
+
+.table_row_total {
+  line-height: 32px;
+  text-align: center;
+  background: #efefef;
+}
+
+.flex-c {
+  display: flex;
+  align-items: center;
+}
+
+:deep(.el-select.m-2) {
+  width: 100%;
+}
+
+:deep(.el-form-item) {
+  flex: 1;
+  margin: 0;
+}
+
+:deep(.el-radio) {
+  margin: 0;
+}
+
+// 底部
+.footer {
+  height: 80px;
+}
+
+// 提交按钮容器
+.submitDataContainer {
+  width: 80%;
+  position: fixed;
+  bottom: 20px;
+  z-index: 999;
+  text-align: center;
+}
+</style>
diff --git a/src/views/distribution/inventory/arteryDistrilbutionBillLadingList.vue b/src/views/distribution/inventory/arteryDistrilbutionBillLadingList.vue
index 6c3812fc..877e8454 100644
--- a/src/views/distribution/inventory/arteryDistrilbutionBillLadingList.vue
+++ b/src/views/distribution/inventory/arteryDistrilbutionBillLadingList.vue
@@ -584,7 +584,7 @@
         </template>
       </el-dialog>
 
-      <!-- 新增线路 -->
+      <!-- 新增节点 -->
       <el-dialog
         title="新增节点"
         v-model="popUpShow.addNewNodeVisited"