diff --git a/src/api/distribution/VehicleArrivalManagement.js b/src/api/distribution/VehicleArrivalManagement.js
index 07990ed1..78e92d13 100644
--- a/src/api/distribution/VehicleArrivalManagement.js
+++ b/src/api/distribution/VehicleArrivalManagement.js
@@ -70,4 +70,15 @@ export const postUnloadByLoadIdBefore = (page, params) => {
   });
 };
 
+/**
+ * 查询配载图片
+ */
+export const postFindLinePhoto = data => {
+  return request({
+    url: '/api/logpm-trunkline/carsLoad/findLinePhoto',
+    method: 'post',
+    data,
+  });
+};
+
 // /logpm-trunkline/carsLoad/unloadByLoadId
diff --git a/src/option/distribution/VehicleArrivalManagement.js b/src/option/distribution/VehicleArrivalManagement.js
index aedea67b..0dae89cd 100644
--- a/src/option/distribution/VehicleArrivalManagement.js
+++ b/src/option/distribution/VehicleArrivalManagement.js
@@ -125,7 +125,7 @@ export const columnList = [
   {
     prop: 'loadStatusName',
     label: '车辆状态',
-    type: 14,
+    type: 3,
     values: '',
     width: '130',
     checkarr: [
diff --git a/src/option/distribution/VehicleStowage.js b/src/option/distribution/VehicleStowage.js
index 144eca68..7cb52d17 100644
--- a/src/option/distribution/VehicleStowage.js
+++ b/src/option/distribution/VehicleStowage.js
@@ -125,7 +125,7 @@ export const columnList = [
   {
     prop: 'loadStatusName',
     label: '车辆状态',
-    type: 14,
+    type: 3,
     values: '',
     width: '130',
     checkarr: [
diff --git a/src/router/views/index.js b/src/router/views/index.js
index aec5fed6..2361f021 100644
--- a/src/router/views/index.js
+++ b/src/router/views/index.js
@@ -202,6 +202,16 @@ export default [
             /* webpackChunkName: "views" */ '@/views/distribution/artery/AddVehicleStowage.vue'
           ),
       },
+      {
+        path: 'VehicleNodeImgs',
+        name: '配载节点图片',
+        meta: {
+          i18n: 'data',
+          keepAlive: true,
+        },
+        component: () =>
+          import(/* webpackChunkName: "views" */ '@/views/distribution/artery/VehicleNodeImgs.vue'),
+      },
       {
         path: 'truckLoadingDetails',
         name: '装车明细',
diff --git a/src/views/distribution/artery/TripartiteTransfer.vue b/src/views/distribution/artery/TripartiteTransfer.vue
index 65aa515b..ea3cdfc5 100644
--- a/src/views/distribution/artery/TripartiteTransfer.vue
+++ b/src/views/distribution/artery/TripartiteTransfer.vue
@@ -232,7 +232,10 @@
             </el-text>
 
             <el-text
-              v-if="Number(slotProps.scope.row.loadStatus) === 0"
+              v-if="
+                Number(slotProps.scope.row.loadStatus) === 0 &&
+                permissionObj.TripartiteTransfer_ZeroLoading
+              "
               @click="handleZeroLoading(slotProps.scope)"
             >
               零担装车
@@ -748,6 +751,10 @@ const permissionObj = reactive({
   TripartiteTransfer_loadingDetail: computed(() => {
     return $store.getters.permission.TripartiteTransfer_loadingDetail;
   }),
+  /** 零担装车 */
+  TripartiteTransfer_ZeroLoading: computed(
+    () => $store.getters.permission.TripartiteTransfer_ZeroLoading
+  ),
 });
 
 /** 转换码值 */
diff --git a/src/views/distribution/artery/VehicleArrivalManagement.vue b/src/views/distribution/artery/VehicleArrivalManagement.vue
index d54c2467..addc8cce 100644
--- a/src/views/distribution/artery/VehicleArrivalManagement.vue
+++ b/src/views/distribution/artery/VehicleArrivalManagement.vue
@@ -240,10 +240,6 @@
             </span>
           </template>
 
-          <template v-else-if="slotProps.scope.column.label === '车辆状态'">
-            <el-tag type="danger">{{ slotProps.scope.row.loadStatusName }}</el-tag>
-          </template>
-
           <template v-else-if="slotProps.scope.column.label === '是否直发商家'">
             <el-tag
               v-if="slotProps.scope.row.isCustomer"
@@ -327,6 +323,11 @@
                   >
                     <el-text @click="handleZeroLoading(slotProps.scope)"> 零担装车 </el-text>
                   </el-dropdown-item>
+
+                  <!-- 配载图片 -->
+                  <!-- <el-dropdown-item>
+                    <el-text @click="handleShowVehicleImgs(slotProps.scope)"> 配载图片 </el-text>
+                  </el-dropdown-item> -->
                 </el-dropdown-menu>
               </template>
             </el-dropdown>
@@ -335,24 +336,22 @@
       </tablecmt>
 
       <!-- 分页模块 -->
-      <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.pageNum"
-            :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 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.pageNum"
+          :page-sizes="[30, 50, 80, 120]"
+          :page-size="page.pageSize"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="page.total"
+        >
+        </el-pagination>
+      </div>
     </div>
   </basic-container>
 
@@ -1536,6 +1535,9 @@ const handlePrint = () => {
 
   print(nodeList);
 };
+
+/** 配载图片显示 */
+const handleShowVehicleImgs = async ({ row }) => {};
 </script>
 
 <style scoped lang="scss">
@@ -1616,4 +1618,10 @@ const handlePrint = () => {
 .mr0 {
   margin-right: 0 !important;
 }
+
+.my-header {
+  :deep(.el-icon) {
+    font-size: 20px;
+  }
+}
 </style>
diff --git a/src/views/distribution/artery/VehicleNodeImgs.vue b/src/views/distribution/artery/VehicleNodeImgs.vue
new file mode 100644
index 00000000..0195d700
--- /dev/null
+++ b/src/views/distribution/artery/VehicleNodeImgs.vue
@@ -0,0 +1,321 @@
+<template>
+  <basic-container>
+    <div class="avue-crud" v-loading="details.loadingObj.pageLoading">
+      <!-- 线路标题 -->
+      <div class="VehicleLineImgs_title">路 线</div>
+
+      <div class="VehicleLineImgs_line">
+        <div
+          :class="{
+            VehicleLineNode_item: true,
+            notActive: false,
+            choose: false,
+          }"
+        >
+          <div class="VehicleLineNode_item_container">
+            <!-- <el-icon size="20px" color=""><Box /></el-icon> -->
+            <el-icon size="20px"><CircleCheck /></el-icon>
+            <span class="VehicleLineNode_item_title">龙泉仓</span>
+          </div>
+
+          <el-icon><ArrowRight /></el-icon>
+        </div>
+
+        <div
+          :class="{
+            VehicleLineNode_item: true,
+            notActive: false,
+            choose: true,
+          }"
+        >
+          <div class="VehicleLineNode_item_container">
+            <el-icon size="20px" color=""><Box /></el-icon>
+
+            <span class="VehicleLineNode_item_title">龙泉仓</span>
+          </div>
+        </div>
+      </div>
+
+      <!-- 节点图片 -->
+      <div class="VehicleLineImgs_title">
+        <span> 图 片 </span>
+      </div>
+
+      <!-- 图片容器 -->
+      <div class="VehicleLineImgs_container">
+        <div class="VehicleLineImgs_container_title">发车前图片</div>
+        <div
+          class="VehicleLineImgs_container_list"
+          v-for="(item, index) in details.beforeLoadImgArr"
+          :key="item.type + '-' + item.position"
+        >
+          <div class="title">{{ item.title }}</div>
+
+          <div class="item">
+            <el-image
+              v-for="(value, i) in item.imgArr"
+              :key="value.url"
+              style="width: 150px; height: 150px; margin: 5px; border-radius: 5px"
+              :src="value.url"
+              :zoom-rate="1.2"
+              :max-scale="7"
+              :min-scale="0.2"
+              :preview-src-list="item.imgArr.map(val => val.url)"
+              :initial-index="index"
+              fit="cover"
+            />
+          </div>
+        </div>
+
+        <div class="VehicleLineImgs_container_title">发车前图片</div>
+        <div class="VehicleLineImgs_container_list">
+          <div class="VehicleLineImgs_container_list_item"></div>
+        </div>
+
+        <div class="VehicleLineImgs_container_title">发车前图片</div>
+        <div class="VehicleLineImgs_container_list">
+          <div class="VehicleLineImgs_container_list_item"></div>
+        </div>
+      </div>
+    </div>
+  </basic-container>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, toRefs, computed, onMounted, nextTick } from 'vue';
+/** 获取字典 */
+import { getDictionaryBiz } from '@/api/system/dict';
+import { deepClone, getObjType, ChecksWhetherTheWarehouseIsSelected } from '@/utils/util';
+import { postFindLinePhoto } from '@/api/distribution/VehicleArrivalManagement';
+import { useStore } from 'vuex';
+import { useRouter, useRoute } from 'vue-router';
+import { ElMessage, ElMessageBox } from 'element-plus';
+
+const $route = useRoute();
+const $router = useRouter();
+const $store = useStore();
+
+type ImgArr =
+  | [
+      {
+        // 分类标题
+        title: string;
+        // 类型
+        type: string;
+        // 位置
+        position: string;
+        // 图片数组
+        imgArr:
+          | [
+              {
+                url: string;
+              }
+            ]
+          | [];
+      }
+    ]
+  | [];
+
+const details = reactive({
+  loadingObj: {
+    pageLoading: false,
+  },
+  nodeImgArr: [],
+  /** 装车前图片 */
+  beforeLoadImgArr: [
+    {
+      title: '123',
+      type: '1',
+      position: '2',
+      imgArr: [
+        {
+          url: '',
+        },
+      ],
+    },
+  ] as ImgArr,
+  /** 发车前图片 */
+  boforeStartImgArr: [] as ImgArr,
+  /** 卸车完成图片 */
+  confirmUnloadImgArr: [] as ImgArr,
+});
+
+/** 配载图片显示 */
+const initImgList = async () => {
+  try {
+    details.loadingObj.pageLoading = true;
+    const res = await postFindLinePhoto({ loadId: $route.query.loadId });
+    const { code, data } = res.data;
+    if (code !== 200 || getObjType(data) !== 'array') return;
+
+    for (let i = 0; i < data.length; i++) {
+      const value = data[i];
+      const { loadingObject, startObject, unloadObject } = value;
+
+      // 装车前
+      if (getObjType(loadingObject) === 'object') {
+      } else details.beforeLoadImgArr = [];
+
+      // 发车前
+      if (getObjType(startObject) === 'object') {
+      } else details.beforeLoadImgArr = [];
+
+      // 卸车前
+      if (getObjType(unloadObject) === 'object') {
+      } else details.beforeLoadImgArr = [];
+    }
+  } catch (error) {
+    console.log('error :>> ', error);
+  } finally {
+    details.loadingObj.pageLoading = false;
+  }
+};
+
+initImgList();
+</script>
+
+<style lang="scss" scoped>
+.VehicleLineImgs_title {
+  font-size: 18px;
+  font-weight: bold;
+  display: flex;
+  align-items: center;
+  color: var(--el-color-primary);
+
+  &::before {
+    content: '';
+    width: 3px;
+    height: 20px;
+    background-color: var(--el-color-primary);
+    margin-right: 10px;
+  }
+
+  &::after {
+    content: '';
+    height: 1px;
+    flex: 1;
+    background-color: var(--el-color-primary);
+    margin-left: 10px;
+  }
+}
+
+// 路线
+.VehicleLineImgs_line {
+  width: 100%;
+  display: flex;
+  flex-wrap: wrap;
+
+  // 节点
+  .VehicleLineNode_item {
+    $transition: all 0.3s;
+    $activeColor: #0bc80b;
+    $disabled: #808080 !important ;
+
+    display: flex;
+    align-items: center;
+    width: fit-content;
+    flex: none;
+    margin: 5px 0;
+    background-color: #f5f7fa;
+
+    // 未激活状态
+    &.notActive {
+      :deep(.el-icon) {
+        color: $disabled;
+      }
+      .VehicleLineNode_item_title {
+        color: $disabled;
+      }
+
+      .VehicleLineNode_item_container {
+        background-color: #fff !important;
+        cursor: no-drop;
+      }
+    }
+
+    // 选中状态
+    &.choose {
+      .VehicleLineNode_item_container {
+        :deep(.el-icon) {
+          color: $activeColor !important;
+        }
+        .VehicleLineNode_item_title {
+          color: $activeColor !important;
+        }
+      }
+    }
+
+    // 节点容器
+    .VehicleLineNode_item_container {
+      transition: $transition;
+      padding: 10px 60px;
+      border-radius: 5px;
+      display: flex;
+      align-items: center;
+      cursor: pointer;
+      border-radius: 10px;
+
+      &:hover {
+        background-color: #daffda;
+        border-color: #0bc80b;
+
+        :deep(.el-icon) {
+          color: #0bc80b;
+        }
+        .VehicleLineNode_item_title {
+          color: #0bc80b;
+        }
+      }
+
+      :deep(.el-icon) {
+        color: var(--el-color-primary);
+        transition: $transition;
+      }
+
+      .VehicleLineNode_item_title {
+        margin-left: 5px;
+        font-size: 16px;
+        color: var(--el-color-primary);
+        transition: $transition;
+      }
+    }
+  }
+}
+
+// 图片
+.VehicleLineImgs_container {
+  padding-left: 20px;
+}
+
+// 图片节点标题
+.VehicleLineImgs_container_title {
+  @extend .VehicleLineImgs_title;
+  font-size: 16px;
+
+  &:first-child {
+    margin-top: 20px;
+  }
+
+  &::after {
+    flex: none;
+    width: 0;
+  }
+}
+
+.VehicleLineImgs_container_list {
+  padding: 20px;
+
+  .title {
+    @extend .VehicleLineImgs_container_title;
+
+    &:first-child {
+      margin-top: 0px;
+    }
+  }
+
+  .item {
+    display: flex;
+    flex-wrap: wrap;
+  }
+}
+</style>
diff --git a/src/views/distribution/artery/VehicleStowage.vue b/src/views/distribution/artery/VehicleStowage.vue
index 1d952df3..ac2b9a44 100644
--- a/src/views/distribution/artery/VehicleStowage.vue
+++ b/src/views/distribution/artery/VehicleStowage.vue
@@ -219,10 +219,6 @@
             >
           </template>
 
-          <template v-if="slotProps.scope.column.label === '车辆状态'">
-            <el-tag type="danger">{{ slotProps.scope.row.loadStatusName }}</el-tag>
-          </template>
-
           <template
             v-if="
               slotProps.scope.column.label === '操作' &&
@@ -325,12 +321,18 @@
                     <!-- 零担装车 -->
                     <el-dropdown-item
                       v-if="
+                        permissionObj.VehicleStowage_ZeroLoading &&
                         Mydata.id === slotProps.scope.row.nowWarehouseId &&
                         Number(slotProps.scope.row.loadStatus) === 0
                       "
                     >
                       <el-text @click="handleZeroLoading(slotProps.scope)"> 零担装车 </el-text>
                     </el-dropdown-item>
+
+                    <!-- 配载图片 -->
+                    <!-- <el-dropdown-item>
+                      <el-text @click="handleShowVehicleImgs(slotProps.scope)"> 配载图片 </el-text>
+                    </el-dropdown-item> -->
                   </el-dropdown-menu>
                 </template>
               </el-dropdown>
@@ -762,6 +764,8 @@ const permissionObj = reactive({
   VehicleStowage_ManualLoading: computed(() => {
     return $store.getters.permission.VehicleStowage_ManualLoading;
   }),
+  /** 零担装车 */
+  VehicleStowage_ZeroLoading: computed(() => $store.getters.permission.VehicleStowage_ZeroLoading),
 });
 
 onMounted(() => {
@@ -1446,6 +1450,17 @@ const handlePrint = () => {
 
   print(nodeList);
 };
+
+/** 配载图片显示 */
+const handleShowVehicleImgs = async ({ row }) => {
+  $router.push({
+    path: '/distribution/artery/VehicleNodeImgs',
+    query: {
+      name: `${row.carsNo} - 配载图片`,
+      loadId: row.id,
+    },
+  });
+};
 </script>
 
 <style scoped lang="scss">
@@ -1551,4 +1566,10 @@ const handlePrint = () => {
     font-weight: bold;
   }
 }
+
+.my-header {
+  :deep(.el-icon) {
+    font-size: 20px;
+  }
+}
 </style>