diff --git a/src/option/waybill/orderDetails.js b/src/option/waybill/orderDetails.js
new file mode 100644
index 00000000..a33c2f1f
--- /dev/null
+++ b/src/option/waybill/orderDetails.js
@@ -0,0 +1,79 @@
+/** 包件明细表头 */
+export const packageListColumnList = [
+  {
+    prop: '',
+    label: '复选框',
+    type: 0,
+    width: 55,
+    fixed: true,
+  },
+  {
+    prop: '',
+    label: '序号',
+    type: 12,
+    values: '',
+    width: 55,
+    fixed: true,
+  },
+  {
+    prop: 'billladingCode',
+    label: '运单号',
+    type: 1,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: true,
+    sortable: true,
+    head: false,
+  },
+  {
+    prop: 'carNumber',
+    label: '订单自编号',
+    type: 1,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'orderPackageCode',
+    label: '包条码',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'driverPhone',
+    label: '总件数',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'warehouseName',
+    label: '创建时间',
+    type: 1,
+    values: '',
+    width: '130',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+  {
+    prop: 'lineNameTitle',
+    label: '操作',
+    type: 6,
+    values: '',
+    width: '180',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+  },
+];
diff --git a/src/router/views/index.js b/src/router/views/index.js
index 9eb9d47d..b790d565 100644
--- a/src/router/views/index.js
+++ b/src/router/views/index.js
@@ -359,6 +359,7 @@ export default [
       // 包明细
       {
         path: 'orderPackageListDetails',
+        name: '包明细',
         meta: {
           data: 'data',
           keepAlive: true,
@@ -382,6 +383,14 @@ export default [
         },
         component: () => import('@/views/waybill/ComparativeStatement.vue'),
       },
+      {
+        path: 'orderDetails',
+        name: '查看订单',
+        meta: {
+          data: 'data',
+        },
+        component: () => import('@/views/waybill/orderDetails.vue'),
+      },
     ],
   },
   {
@@ -1314,7 +1323,6 @@ export default [
     ],
   },
 
-
   {
     path: '/aftersales/aftersalesWorkOrderInfoEnxt',
     component: Layout,
diff --git a/src/views/waybill/WaybillOrderList.vue b/src/views/waybill/WaybillOrderList.vue
index 0d9ad4d3..00049354 100644
--- a/src/views/waybill/WaybillOrderList.vue
+++ b/src/views/waybill/WaybillOrderList.vue
@@ -120,7 +120,7 @@
               <el-button type="text" @click="handleShowPackageOrderList(slotProps.scope)">
                 上传回单
               </el-button>
-              <el-button type="text" @click="handleShowPackageOrderList(slotProps.scope)">
+              <el-button type="text" @click="handleViewOrderDetails(slotProps.scope)">
                 查看订单
               </el-button>
               <!-- <el-button type="text" @click="handleShowPackageOrderList(slotProps.scope)">
@@ -451,6 +451,13 @@ const handleShowPackageOrderList = ({ row }) => {
   });
 };
 
+const handleViewOrderDetails = ({ row }) => {
+  $router.push({
+    path: '/waybill/orderDetails',
+    query: { id: row.id, name: `${row.waybillNo} -- 订单详情` },
+  });
+};
+
 /**
  * 是否开启全屏
  * @params(_type) 开启或关闭
diff --git a/src/views/waybill/orderDetails.vue b/src/views/waybill/orderDetails.vue
new file mode 100644
index 00000000..a88c6bde
--- /dev/null
+++ b/src/views/waybill/orderDetails.vue
@@ -0,0 +1,820 @@
+<template>
+  <basic-container>
+    <div class="avue-crud">
+      <!-- 搜索模块 -->
+      <div v-h5uShow="!search">
+        <!-- 查询模块 -->
+        <el-form :inline="true" :model="query" class="header_search" label-width="100px">
+          <el-form-item label="是否入库">
+            <el-input v-model="query.trainNumber" placeholder="请输入运单号" clearable></el-input>
+          </el-form-item>
+
+          <el-form-item label="是否干仓配">
+            <el-input v-model="query.trainNumber" placeholder="请输入运单号" clearable></el-input>
+          </el-form-item>
+
+          <el-form-item label="运单号">
+            <el-input v-model="query.trainNumber" placeholder="请输入运单号" clearable></el-input>
+          </el-form-item>
+
+          <el-form-item label="订单自编号">
+            <el-input v-model="query.trainNumber" placeholder="请输入运单号" clearable></el-input>
+          </el-form-item>
+
+          <el-form-item label="订单来源">
+            <el-input v-model="query.trainNumber" placeholder="请输入运单号" clearable></el-input>
+          </el-form-item>
+
+          <el-form-item label="二级品类">
+            <el-input v-model="query.trainNumber" placeholder="请输入运单号" clearable></el-input>
+          </el-form-item>
+
+          <el-form-item label="三级品类">
+            <el-input v-model="query.trainNumber" placeholder="请输入运单号" clearable></el-input>
+          </el-form-item>
+
+          <el-form-item label="包条码">
+            <el-input v-model="query.trainNumber" placeholder="请输入运单号" clearable></el-input>
+          </el-form-item>
+
+          <el-form-item label="发货基地">
+            <el-input v-model="query.trainNumber" placeholder="请输入运单号" clearable></el-input>
+          </el-form-item>
+
+          <el-form-item label="客户车次号">
+            <el-input v-model="query.trainNumber" placeholder="请输入运单号" clearable></el-input>
+          </el-form-item>
+
+          <el-form-item label="服务号">
+            <el-input v-model="query.trainNumber" placeholder="请输入运单号" clearable></el-input>
+          </el-form-item>
+
+          <el-form-item label="汇通车次号">
+            <el-input v-model="query.trainNumber" placeholder="请输入运单号" clearable></el-input>
+          </el-form-item>
+
+          <el-form-item label="当前所在仓">
+            <el-input v-model="query.trainNumber" placeholder="请输入运单号" clearable></el-input>
+          </el-form-item>
+
+          <el-form-item label="创建人">
+            <el-input v-model="query.trainNumber" placeholder="请输入运单号" clearable></el-input>
+          </el-form-item>
+
+          <el-form-item label="发货日期">
+            <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="创建时间">
+            <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>
+        </el-form>
+      </div>
+
+      <!-- 控件模块 -->
+      <el-row>
+        <div class="avue-crud__header">
+          <!-- 头部左侧按钮模块 -->
+          <div class="avue-crud__left"></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="Search" @click="searchHide" circle></el-button>
+          </div>
+        </div>
+      </el-row>
+
+      <!-- 表格 -->
+      <el-row>
+        <!-- 列表模块 -->
+        <tablecmt
+          :columnList="details.packageListColumnList"
+          :tableData="details.packageListData"
+          :loading="loadingObj.packageListLoading"
+          @inputTxt="inputsc"
+          @timeCheck="timesc"
+          @btnCheck="btnsc"
+          @selectCheck="selectsc"
+          @selection="selectionChange"
+        >
+          <template #default="slotProps">
+            <template v-if="slotProps.scope.column.label === '操作'">
+              <el-button type="text" @click="handleShowPackageOrderList(slotProps.scope)">
+                查看详情
+              </el-button>
+              <el-button type="text" @click="handleShowFlowNode(slotProps.scope)">
+                在库明细
+              </el-button>
+            </template>
+          </template>
+        </tablecmt>
+      </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
+    class="el-dialog-QRCode"
+    title="修改客户信息"
+    :visible.sync="details.popUpShow.editClientInfoVisible"
+    width="780px"
+    v-model="details.popUpShow.editClientInfoVisible"
+  >
+    <div>
+      <el-divider style="font-size: 28px">修改订单自编号（）客户信息</el-divider>
+    </div>
+
+    <el-form>
+      <el-form-item label="客户姓名">
+        <el-input />
+      </el-form-item>
+
+      <el-form-item label="联系电话">
+        <el-input />
+      </el-form-item>
+
+      <el-form-item label="用户地址">
+        <el-input />
+      </el-form-item>
+    </el-form>
+
+    <template #footer>
+      <div class="flex-c-c dialog-footer">
+        <el-button icon="Position" type="primary" @click="printTemplate">提 交</el-button>
+        <el-button icon="Refresh" type="primary" @click="printTemplate">重 置</el-button>
+        <el-button icon="Close" @click="details.popUpShow.editClientInfoVisible = false">
+          取 消
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
+
+  <!-- 包内产品 -->
+  <el-dialog
+    title="包内产品"
+    v-model="details.popUpShow.packageDetailColumnListVisited"
+    width="80%"
+    :before-close="beforeClose"
+    append-to-body
+    :fullscreen="details.fullscreenObj.packageDetailColumnListVisited"
+    :show-close="false"
+    class="packageDetailColumnListVisited"
+  >
+    <template #header="{ close, titleId, titleClass }">
+      <div class="my-header flex-c-sb">
+        <h4 :id="titleId" :class="titleClass">包内产品</h4>
+        <div class="flex-c-c">
+          <!-- 全屏显示按钮 -->
+          <el-button type="text" v-if="!details.fullscreenObj.packageDetailColumnListVisited">
+            <el-icon class="" @click="handleFullScrean('open', 'packageDetailColumnListVisited')"
+              ><FullScreen
+            /></el-icon>
+          </el-button>
+          <el-button type="text" v-else>
+            <el-icon class="" @click="handleFullScrean('close', 'packageDetailColumnListVisited')"
+              ><CopyDocument
+            /></el-icon>
+          </el-button>
+
+          <!-- 弹窗关闭按钮 -->
+          <el-button type="text">
+            <el-icon class="" @click="close"><Close /></el-icon>
+          </el-button>
+        </div>
+      </div>
+    </template>
+    <tablecmt
+      :columnList="details.packageDetailColumnList"
+      :tableData="details.packageDetailData"
+      :loading="loadingObj.packageListLoading"
+      @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="details.packageListPage.currentPage"
+      :page-sizes="[30, 50, 80, 120]"
+      :page-size="details.packageListPage.pageSize"
+      layout="total, sizes, prev, pager, next, jumper"
+      :total="details.packageListPage.total"
+    >
+    </el-pagination>
+  </el-dialog>
+
+  <!-- 流转节点 -->
+  <el-dialog
+    title="流转节点"
+    v-model="details.popUpShow.flowNodeColumnListVisited"
+    width="80%"
+    :before-close="beforeClose"
+    append-to-body
+    :fullscreen="details.fullscreenObj.flowNodeColumnListVisited"
+    :show-close="false"
+    class="flowNodeColumnListVisited"
+  >
+    <template #header="{ close, titleId, titleClass }">
+      <div class="my-header flex-c-sb">
+        <h4 :id="titleId" :class="titleClass">流转节点</h4>
+        <div class="flex-c-c">
+          <!-- 全屏显示按钮 -->
+          <el-button type="text" v-if="!details.fullscreenObj.flowNodeColumnListVisited">
+            <el-icon class="" @click="handleFullScrean('open', 'flowNodeColumnListVisited')"
+              ><FullScreen
+            /></el-icon>
+          </el-button>
+          <el-button type="text" v-else>
+            <el-icon class="" @click="handleFullScrean('close', 'flowNodeColumnListVisited')"
+              ><CopyDocument
+            /></el-icon>
+          </el-button>
+
+          <!-- 弹窗关闭按钮 -->
+          <el-button type="text">
+            <el-icon class="" @click="close"><Close /></el-icon>
+          </el-button>
+        </div>
+      </div>
+    </template>
+    <tablecmt
+      :columnList="details.flowNodeColumnList"
+      :tableData="details.flowNodeData"
+      :loading="loadingObj.packageListLoading"
+      @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="details.packageListPage.currentPage"
+      :page-sizes="[30, 50, 80, 120]"
+      :page-size="details.packageListPage.pageSize"
+      layout="total, sizes, prev, pager, next, jumper"
+      :total="details.packageListPage.total"
+    >
+    </el-pagination>
+  </el-dialog>
+
+  <!-- 打印二维码 -->
+  <el-dialog
+    class="el-dialog-QRCode"
+    title="二维码"
+    :visible.sync="details.popUpShow.QRCodeVisible"
+    width="780px"
+    v-model="details.popUpShow.QRCodeVisible"
+  >
+    <div>
+      <div v-html="html"></div>
+    </div>
+    <span slot="footer" class="dialog-footer">
+      <!--    <el-button type="primary" @click="ddd">导 出</el-button>-->
+      <el-button type="primary" @click="printTemplate">打 印</el-button>
+      <el-button @click="details.popUpShow.QRCodeVisible = false">取 消</el-button>
+    </span>
+  </el-dialog>
+
+  <!-- 列表配置显示 -->
+  <edittablehead
+    @setcolum="setnewcolum"
+    @closce="showdrawer"
+    :drawerShow="drawerShow"
+    :columnList="details.packageListColumnList"
+  ></edittablehead>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, toRefs, computed, onMounted, nextTick } from 'vue';
+import functions from '@/utils/functions.js';
+import dayjs from 'dayjs';
+import { mapGetters } from 'vuex';
+/** 获取字典 */
+import { getDictionaryBiz } from '@/api/system/dict';
+import { getopenOrderAdvancePageList } from '@/api/waybill/TemporaryStorageList';
+import { showOrderPackgeCode } from '@/api/distribution/distributionStockArticle';
+import { downloadXls, setNodeHeight, getHtmls } from '@/utils/util';
+import { packageDetailColumnList, flowNodeColumnList } from '@/option/waybill/orderPackageList';
+import { packageListColumnList } from '@/option/waybill/orderDetails';
+import { useRouter } from 'vue-router';
+import print from '@/utils/print';
+import { ElMessage, ElMessageBox } from 'element-plus';
+
+// 获取路由实例
+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: [],
+  /** 包明细表头 */
+  packageListColumnList,
+  /** 包明细数据 */
+  packageListData: [{}],
+  /** 包内产品表头 */
+  packageDetailColumnList,
+  /** 包内产品数据 */
+  packageDetailData: [{}],
+  /** 流转节点表头 */
+  flowNodeColumnList,
+  /** 流转节点数据 */
+  flowNodeData: [{}],
+  /** 页面loading */
+  loadingObj: {
+    /** 列表加载loading */
+    list: false,
+    packageListLoading: false,
+  },
+  /** 列表复选框选中的数据 */
+  selectionList: [],
+  /** 是否显示设置表格 */
+  drawerShow: false,
+  /** 分页参数 */
+  page: {
+    currentPage: 1,
+    pageSize: 30,
+    total: 0,
+  },
+  /** 包明细分页参数 */
+  packageListPage: {
+    currentPage: 1,
+    pageSize: 30,
+    total: 0,
+  },
+  /** 弹出层显示 */
+  popUpShow: {
+    /** 流转节点 */
+    flowNodeColumnListVisited: false,
+    /** 二维码 */
+    QRCodeVisible: false,
+    /** 包内产品 */
+    packageDetailColumnListVisited: false,
+  },
+  /** 全屏 */
+  fullscreenObj: {
+    /** 流转节点 */
+    flowNodeColumnListVisited: false,
+    /** 包内产品 */
+    packageDetailColumnListVisited: false,
+  },
+  /** 列表Dom节点 */
+  listNode: '',
+  form: {},
+  html: '',
+});
+
+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');
+    console.log('details.listNode :>> ', details.listNode);
+    details.listNode.style.transition = 'all .5s ease-out';
+    console.log('details.listNode :>> ', details.listNode);
+    clearTimeout(timer);
+  }, 100);
+});
+
+/** 请求页面数据 */
+const onLoad = async (page: any, params = {}) => {
+  // 获取暂存单列表
+  details.data = await getopenOrderAdvancePageList(page, { ...details.query, ...params });
+};
+
+onLoad(details.page);
+
+/** 搜索 */
+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 = () => {
+  details.search = !details.search;
+
+  setNodeHeight(details.listNode, '', true);
+};
+
+/** 表格表头输入框搜索 */
+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.packageListColumnList = newarr;
+    functions.setStorage(window.location.pathname + 'checkList', headarr);
+  } else if (type == 2) {
+    details.packageListColumnList = newarr;
+    functions.setStorage(window.location.pathname + 'flexList', headarr);
+  } else if (type == 3) {
+    details.packageListColumnList = newarr;
+    functions.setStorage(window.location.pathname + 'sortlist', headarr);
+  }
+};
+
+/** 弹出层开启前清除数据 */
+const beforeClose = done => {
+  done();
+  details.form = {};
+  details.selectionList = [];
+  details.view = false;
+};
+
+/** 查看包内产品 */
+const handleShowPackageOrderList = ({ row }) => {
+  details.popUpShow.packageDetailColumnListVisited = true;
+
+  nextTick(() => {
+    // 获取弹窗内表格元素节点, 并设置高度
+    const _node: any = document.querySelector('.packageDetailColumnListVisited .maboxhi');
+    if (!_node) return;
+    _node.style.height = '550px';
+    console.log('_node :>> ', _node);
+  });
+};
+
+/** 订单转运单 */
+const handleCreateOrder = () => {
+  $router.push('/distribution/inventory/CreateOrder');
+};
+
+/** 修改客户信息 */
+const editClientInfo = () => {
+  if (details.selectionList.length !== 0) {
+    return ElMessage({
+      type: 'warning',
+      message: '最少选择一条数据',
+    });
+  }
+  //   editClientInfoVisible;
+  details.popUpShow.editClientInfoVisible = true;
+};
+
+/** 批量删除 */
+const handleDelete = () => {
+  if (details.selectionList.length === 0) {
+    return ElMessage({
+      type: 'warning',
+      message: '最少选择一条数据',
+    });
+  }
+};
+
+/** 批量发车 */
+const handleDepart = () => {
+  if (details.selectionList.length === 0) {
+    return ElMessage({
+      type: 'warning',
+      message: '最少选择一条数据',
+    });
+  }
+};
+
+/** 批量冻结 */
+const handleFreeze = () => {
+  if (details.selectionList.length === 0) {
+    return ElMessage({
+      type: 'warning',
+      message: '最少选择一条数据',
+    });
+  }
+};
+
+/**
+ * 是否开启全屏
+ * @params(_type) 开启或关闭
+ */
+const handleFullScrean = (_type: 'open' | 'close', _name: string) => {
+  let _node = '';
+  if (_name) _node = document.querySelector(`.${_name} .maboxhi`);
+
+  switch (_name) {
+    // 包内产品
+    case 'packageDetailColumnListVisited':
+      details.fullscreenObj.packageDetailColumnListVisited =
+        !details.fullscreenObj.packageDetailColumnListVisited;
+
+      if (_type === 'close') {
+        if (_node) setNodeHeight(_node, '500px');
+      } else {
+        if (_node) setNodeHeight(_node);
+      }
+      break;
+
+    default:
+      details.fullscreenObj[_name] = !details.fullscreenObj[_name];
+      if (_type === 'close') {
+        if (_node) setNodeHeight(_node, '500px');
+      } else {
+        if (_node) setNodeHeight(_node);
+      }
+      break;
+  }
+};
+
+/** 单列查看包条码 */
+const printOrder = ({ row }) => {
+  let qr = {
+    ids: row.id,
+  };
+  details.html = '';
+  showOrderPackgeCode(qr).then(res => {
+    // this.orderPackageCode = res.data
+    if (res.data.code !== 200) return;
+    console.log(res.data);
+    details.html = getHtmls(res.data.data.dataList, res.data.data.templateHtml);
+  });
+};
+
+/** 单列查看包条码 */
+const batchPrintOrder = ({ row }) => {
+  let qr = {
+    ids: row.id,
+  };
+  showOrderPackgeCode(qr).then(res => {
+    // this.orderPackageCode = res.data
+    if (res.data.code !== 200) return;
+    console.log(res.data);
+    details.html = '';
+    details.html = getHtmls(res.data.data.dataList, res.data.data.templateHtml);
+  });
+};
+
+/** 打印包条码 */
+const printTemplate = () => {
+  const orderNodeList = document.querySelectorAll('.el-dialog-QRCode .el-dialog__body>div>div>div');
+  print(orderNodeList);
+};
+
+/** 入库 */
+const handlePutInStorage = row => {
+  ElMessageBox.confirm('确认直接入库吗?', '警告', {
+    confirmButtonText: '确认',
+    cancelButtonText: '取消',
+    type: 'warning',
+  })
+    .then(() => {
+      ElMessage({
+        type: 'success',
+        message: '入库成功',
+      });
+    })
+    .catch(() => {});
+};
+
+/** 显示流转节点 */
+const handleShowFlowNode = ({ row }) => {
+  details.popUpShow.flowNodeColumnListVisited = true;
+
+  nextTick(() => {
+    // 获取弹窗内表格元素节点, 并设置高度
+    const _node: any = document.querySelector('.flowNodeColumnListVisited .maboxhi');
+    if (!_node) return;
+    _node.style.height = '550px';
+    console.log('_node :>> ', _node);
+  });
+};
+</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;
+    }
+  }
+}
+</style>
diff --git a/src/views/waybill/orderPackageListDetails.vue b/src/views/waybill/orderPackageListDetails.vue
index 9b23b599..1a16704d 100644
--- a/src/views/waybill/orderPackageListDetails.vue
+++ b/src/views/waybill/orderPackageListDetails.vue
@@ -2,9 +2,9 @@
   <basic-container>
     <div class="avue-crud">
       <!-- 搜索模块 -->
-      <el-row v-if="!search">
+      <el-row v-h5uShow="!search">
         <!-- 查询模块 -->
-        <el-form :inline="true" :model="query" class="el-fr-d" label-width="100px">
+        <el-form :inline="true" :model="query" class="header_search" label-width="100px">
           <el-form-item label="是否入库">
             <el-input v-model="query.trainNumber" placeholder="是否入库" clearable></el-input>
           </el-form-item>