Merge branch 'boss'

src/api/boss/index.js

@@ -0,0 +1,62 @@
+import request from '@/utils/request';
+
+// 客户订单计划追踪信息分页
+export async function getList(params) {
+  const res = await request.get('/boss/customerOrderTracking/v1/page', {
+    params
+  });
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
+// 客户订单计划追踪信息分页-平铺
+export async function getListPage(params) {
+  const res = await request.get('/boss/customerOrderTracking/v1/listPage', {
+    params
+  });
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
+// 更新首工序下达时间接口
+
+export async function updateFirstProcessDeliveryTime(data) {
+  const res = await request.patch(
+    '/boss/customerOrderTracking/v1/updateFirstProcessDeliveryTime/' +
+      data.id +
+      '?processDeliveryTime=' +
+      data.processDeliveryTime
+  );
+  if (res.data.code == 0) {
+    return res.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
+// 工艺路线详情接口
+export async function getProduceRoutingDetail(data) {
+  const res = await request.post(
+    '/main/producerouting/taskinstance/page',
+    data
+  );
+  if (res.data.code == 0) {
+    return res.data.data.list;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
+// 工艺清单接口
+export async function workManShipList(params) {
+  const res = await request.get(
+    '/boss/customerOrderTracking/v1/workManShipList',
+    { params }
+  );
+  if (res.data.code == 0) {
+    return res.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}

src/main.js

@@ -38,6 +38,8 @@ import fileMain from '@/components/addDoc/index.vue';
 
 import './directives';
 
+import Tooltip from './utils/tooltip'; // 引入封装的工具
+Vue.prototype.$tooltip = Tooltip;
 Vue.use(elTableInfiniteScroll);
 
 Vue.component('HeaderTitle', HeaderTitle);

src/utils/tooltip.js

@@ -0,0 +1,49 @@
+import Vue from 'vue';
+import { Tooltip } from 'element-ui';
+
+// 扩展 Tooltip 组件
+const TooltipConstructor = Vue.extend(Tooltip);
+
+let tooltipInstance = null;
+
+// 显示提示框
+const showTooltip = (target, content) => {
+  if (tooltipInstance) {
+    tooltipInstance.$destroy();
+    tooltipInstance.$el.remove();
+  }
+
+  tooltipInstance = new TooltipConstructor({
+    propsData: {
+      content,
+      placement: 'top',
+      visible: true,
+      trigger: 'manual'
+    }
+  });
+  // 手动挂载实例
+  tooltipInstance.$mount(document.createElement('div'));
+  document.body.appendChild(tooltipInstance.$el);
+
+  // 设置目标元素
+  tooltipInstance.referenceElm = target;
+  tooltipInstance.$nextTick(() => {
+    tooltipInstance.show();
+  });
+};
+
+// 隐藏提示框
+const hideTooltip = () => {
+  //   console.log(tooltipInstance);
+  if (tooltipInstance) {
+    tooltipInstance.hide();
+    tooltipInstance.doDestroy();
+    tooltipInstance.$el.remove();
+    tooltipInstance = null;
+  }
+};
+
+export default {
+  show: showTooltip,
+  hide: hideTooltip
+};

src/utils/util.js

@@ -49,7 +49,7 @@ export function copyObj(obj) {
 }
 
 //合计费用
-export function getSummaries(param,key) {
+export function getSummaries(param, key) {
   const { columns, data } = param;
   const sums = [];
   columns.forEach((column, index) => {
@@ -78,4 +78,69 @@ export function getSummaries(param,key) {
   });
 
   return sums;
-}
+}
+
+export function getRecords(records) {
+  const result = {};
+  records.forEach((record) => {
+    const res = record.deliveryTime.split('-');
+    const yearMonth = res.slice(0, 2).join('-');
+    const day = 'date' + res.slice(-1);
+    const quantity = record.quantity;
+    if (!result[day]) {
+      result[day] = [];
+    }
+    const existingEntry = result[day].find((entry) => entry.day === yearMonth);
+    if (existingEntry) {
+      existingEntry.num += quantity;
+    } else {
+      result[day].push({ day: yearMonth, num: quantity });
+    }
+  });
+  return result;
+}
+
+export function groupByProperty(arr, property) {
+  return arr.reduce((acc, item) => {
+    const key = item[property];
+    // 若对象中不存在该键，则初始化一个空数组
+    if (!acc[key]) {
+      acc[key] = [];
+    }
+    // 将当前元素添加到对应的数组中
+    acc[key].push(item);
+    return acc;
+  }, {});
+}
+
+export function getMaxArrayLength(obj) {
+  let maxLength = 0;
+  // 遍历对象的所有属性
+  for (const key in obj) {
+    if (Array.isArray(obj[key])) {
+      // 比较当前数组长度与最大长度
+      maxLength = Math.max(maxLength, obj[key].length);
+    }
+  }
+  return maxLength;
+}
+
+export function getMaxSameProcessIdCount(arr) {
+  const countMap = {};
+  // 遍历数组，统计每个 processId 出现的次数
+  arr.forEach((item) => {
+    const processId = item.processId;
+    if (countMap[processId]) {
+      countMap[processId]++;
+    } else {
+      countMap[processId] = 1;
+    }
+  });
+
+  let maxCount = 0;
+  // 遍历计数对象，找出最大的计数
+  for (const key in countMap) {
+    maxCount = Math.max(maxCount, countMap[key]);
+  }
+  return maxCount;
+}

src/views/boss/orderTracking/columns.js

@@ -0,0 +1,595 @@
+export const getColumns = (vm) => {
+  console.log(vm);
+
+  function getDeliveryCount(row, columnKey) {
+    if (!row.deliveryQuantity) {
+      return '';
+    }
+
+    if (!row.deliveryTime) {
+      return '';
+    }
+
+    let result;
+    const res = row.deliveryTime.split(' ')[0].split('-');
+    const yearMonth = res[0] + '-' + res[1];
+    const day = 'date' + res[2];
+    if (columnKey !== day) {
+      return '';
+    }
+
+    result = `${yearMonth} : ${row.deliveryQuantity} `;
+    return result;
+  }
+
+  return [
+    {
+      columnKey: 'index',
+      type: 'index',
+      label: '序号',
+      width: 55,
+      align: 'center',
+      showOverflowTooltip: true,
+      fixed: 'left'
+    },
+    {
+      prop: 'saleTypeName',
+      label: '订单类型',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'projectName',
+      label: '项目名称',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'orderNo',
+      label: '销售订单号',
+      width: 170,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'preSaleOrderNo',
+      label: '预销售订单号',
+      width: 170,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'productionPlanNo',
+      label: '生产计划编号',
+      width: 170,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'productionWorkOrderNo',
+      label: '生产工单号',
+      width: 170,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'materialProductionOrderNo',
+      label: '生产订单号 \n（编码+图号）',
+      width: 180,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row) => {
+        if (row.imgCode && row.materialCode) {
+          return row.materialCode + '-' + row.imgCode;
+        }
+
+        if (row.materialCode) {
+          return row.materialCode;
+        }
+        return '';
+      }
+    },
+
+    {
+      prop: 'customerCode',
+      label: '客户代号',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'customerName',
+      label: '客户名称',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'productCode',
+      label: '主机编码',
+      width: 150,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'productName',
+      label: '主机名称',
+      width: 150,
+      align: 'center',
+      showOverflowTooltip: true,
+      height: 50
+    },
+    {
+      prop: 'productQuantity',
+      label: '主机\n订单数量',
+      width: 80,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'productUnitName',
+      label: '主机单位',
+      width: 80,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'materialWeight',
+      label: '主机\n重量（kg）',
+      width: 100,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'processProgress',
+      label: '工序进度',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'productionNo',
+      label: '生产编号',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'orderStatus',
+      label: '订单状态',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row) => {
+        return vm.orderObj[row.orderStatus] || '';
+      }
+    },
+    {
+      prop: 'productionStatus',
+      label: '生产状态',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row) => {
+        if (!row.productionStatus) {
+          return '';
+        }
+        return vm.productionStatus[row.productionStatus][row.productionStatus];
+      }
+    },
+    {
+      prop: 'customerExpectDeliveryDate',
+      label: '客户期望交期',
+      width: 150,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'productionDeliveryDate',
+      label: '生产计划交期',
+      width: 150,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'productionCycle',
+      label: '生产周期（天）',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'materialCode',
+      label: '编码',
+      width: 170,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'materialName',
+      label: '名称',
+      width: 200,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'materialQuantity',
+      label: '数量',
+      width: 80,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'materialUnitName',
+      label: '单位',
+      width: 80,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'productWeight',
+      label: '重量（kg）',
+      width: 100,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      slot: 'firstProcessDeliveryTime',
+      prop: 'firstProcessDeliveryTime',
+      label: '首工序\n预计完成时间',
+      width: 160,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'firstProcessCompleteTime',
+      label: '首工序\n实际下达时间',
+      width: 160,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'productEstimatedCompletionTime',
+      label: '成品\n预计完成时间',
+      width: 160,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'productActualCompletionTime',
+      label: '成品\n实际完成时间',
+      width: 160,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+
+    {
+      slot: 'produceRoutingName',
+      prop: 'produceRoutingName',
+      label: '工艺路线',
+      width: 140,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      slot: 'deliveryRecords',
+      prop: 'deliveryRecords',
+      label: '发货',
+      width: 200,
+      align: 'center'
+    },
+    {
+      prop: 'date01',
+      label: '1日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date02',
+      label: '2日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date03',
+      label: '3日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date04',
+      label: '4日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date05',
+      label: '5日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date06',
+      label: '6日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date07',
+      label: '7日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date08',
+      label: '8日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date09',
+      label: '9日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date10',
+      label: '10日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date11',
+      label: '11日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date12',
+      label: '12日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date13',
+      label: '13日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date14',
+      label: '14日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date15',
+      label: '15日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date16',
+      label: '16日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date17',
+      label: '17日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date18',
+      label: '18日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date19',
+      label: '19日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date20',
+      label: '20日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date21',
+      label: '21日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+
+    {
+      prop: 'date22',
+      label: '22日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date23',
+      label: '23日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date24',
+      label: '24日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date25',
+      label: '25日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date26',
+      label: '26日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date27',
+      label: '27日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date28',
+      label: '28日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date29',
+      label: '29日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date30',
+      label: '30日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    },
+    {
+      prop: 'date31',
+      label: '31日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        return getDeliveryCount(row, column.property);
+      }
+    }
+  ];
+};

src/views/boss/orderTracking/components/produceRouting.vue

@@ -0,0 +1,211 @@
+<template>
+  <div>
+    <el-drawer
+      :visible.sync="drawer"
+      :direction="direction"
+      :before-close="handleClose"
+      size="100%"
+    >
+      <div slot="title" class="title">
+        <span style="margin: 0" class="name"
+          >工艺路线名称：{{ row.produceRoutingName }}</span
+        >
+      </div>
+
+      <el-steps :active="process.length" align-center style="margin: 18px 0">
+        <el-step
+          class="text"
+          v-for="(item, index) in process"
+          :key="index"
+          :title="item.name"
+        ></el-step>
+      </el-steps>
+
+      <div class="ele-table-container" style="height: 100%">
+        <ele-pro-table
+          :loading="loading"
+          ref="table"
+          :columns="columns"
+          :datasource="datasource"
+          :pageSizes="[10, 20, 50, 100]"
+          :pageSize="20"
+          height="calc(100% - 120px )"
+          :needPage="false"
+        >
+        </ele-pro-table>
+      </div>
+    </el-drawer>
+  </div>
+</template>
+
+<script>
+  import { workManShipList } from '@/api/boss/index.js';
+  import { getMaxArrayLength } from '@/utils/util.js';
+
+  import { h } from 'vue';
+
+  export default {
+    name: 'produceRouting',
+    props: {},
+    data() {
+      return {
+        drawer: false,
+        direction: 'rtl',
+        title: '',
+        row: {},
+        columns: [],
+        productOrderId: '',
+        process: [],
+        datasource: [],
+        loading: true
+      };
+    },
+    computed: {},
+    methods: {
+      open({ row, process }) {
+        this.row = row;
+        this.process = process;
+        this.productOrderId = row.productionWorkOrderId;
+        this.drawer = true;
+        this.columns = this.process.map((item, index) => ({
+          prop: index + item.code,
+          label: item.name,
+          align: 'center',
+          showOverflowTooltip: true,
+          formatter(row) {
+            let info = row[index + item.code];
+            if (!info) {
+              return '';
+            }
+
+            return h('div', { class: 'box', style: 'text-align: left;' }, [
+              h('div', {}, '投料时间：' + (info?.feedTime ?? '')),
+              h('div', {}, '投料数量：' + (info?.feedQuantity ?? '')),
+
+              h('div', {}, '报工时间：' + (info?.reportTime ?? '')),
+
+              h('div', {}, '报工数量：' + (info?.reportQuantity ?? '')),
+
+              h('div', {}, '工时：' + (info?.workHour ?? ''))
+            ]);
+          }
+        }));
+
+        // this.columns.unshift({
+        //   prop: 'index',
+        //   type: 'index',
+        //   label: '序号',
+        //   width: 55,
+        //   align: 'center',
+        //   showOverflowTooltip: true,
+        //   fixed: 'left'
+        // });
+        this.getList();
+      },
+      async getList() {
+        const { data } = await workManShipList({
+          processId: 1,
+          productOrderId: this.productOrderId
+        });
+        let obj = {};
+        this.columns.forEach((column) => {
+          obj[column.prop] = data.filter(
+            (item) => item.processName === column.label
+          );
+        });
+
+        let maxLength = getMaxArrayLength(obj);
+        let list = [];
+        for (let i = 0; i < maxLength; i++) {
+          let result = {};
+          for (let key in obj) {
+            result[key] = obj[key][i];
+          }
+          list.push(result);
+        }
+        this.datasource = list;
+        this.loading = false;
+      },
+      handleClose(done) {
+        done();
+      }
+    },
+    created() {}
+  };
+</script>
+
+<style lang="scss" scoped>
+  .title {
+    font-size: 20px;
+    span {
+      margin-left: 50px;
+    }
+    .name {
+      font-weight: 800;
+      color: #40a9ff;
+    }
+  }
+
+  :deep(.el-drawer__header) {
+    height: 60px;
+  }
+
+  :deep(.el-steps) {
+    height: 60px;
+  }
+
+  :deep(
+      .el-step__head.is-finish .el-step__icon.is-text .el-step__icon-inner
+    )::before {
+    content: '';
+  }
+
+  :deep(.el-step__head.is-finish .el-step__icon.is-text .el-step__icon-inner) {
+    font-size: 12px !important;
+  }
+
+  :deep(.el-step__title) {
+    color: #1890ff !important;
+  }
+
+  .box {
+    display: flex;
+    text-align: left !important;
+  }
+
+  .ele-table-container {
+    height: 100%;
+    :deep(.el-card__body) {
+      padding: 0.3vw;
+    }
+    // :deep(.el-card__header) {
+    //   padding: 20px;
+    // }
+
+    :deep(.ele-table-tool-default) {
+      padding: 0 15px;
+    }
+
+    :deep(.has-gutter) {
+      height: 50px;
+    }
+
+    :deep(.el-table__header) {
+      height: 50px;
+      // background-color: #615fe7;
+    }
+
+    :deep(.ele-pro-table) {
+      height: 99%;
+    }
+    :deep(.el-table) {
+      // font-size: 0.62vw;
+    }
+  }
+
+  ::v-deep .active .is-text {
+    background: #ffa929; /* 背景色 */
+    border-color: #ffa929;
+    color: #ffffff; /* 图标文字颜色 */
+  }
+</style>

src/views/boss/orderTracking/index.vue

@@ -0,0 +1,378 @@
+<template>
+  <div class="ele-body">
+    <el-card shadow="never">
+      <div class="filter-container">
+        <el-form
+          label-width="100px"
+          class="ele-form-search"
+          @keyup.enter.native="reload"
+          @submit.native.prevent
+        >
+          <el-row :gutter="15">
+            <el-col v-bind="styleResponsive ? { lg: 5, md: 12 } : { span: 5 }">
+              <el-form-item label="销售订单号：" prop="orderNo">
+                <el-input v-model="params.orderNo" clearable></el-input>
+              </el-form-item>
+            </el-col>
+
+            <el-col v-bind="styleResponsive ? { lg: 5, md: 12 } : { span: 5 }">
+              <el-form-item label="项目名称：" prop="projectName">
+                <el-input v-model="params.projectName" clearable></el-input>
+              </el-form-item>
+            </el-col>
+
+            <el-col v-bind="styleResponsive ? { lg: 5, md: 12 } : { span: 5 }">
+              <el-form-item label="客户名称：" prop="customerName">
+                <el-input v-model="params.customerName" clearable></el-input>
+              </el-form-item>
+            </el-col>
+
+            <el-col v-bind="styleResponsive ? { lg: 5, md: 12 } : { span: 5 }">
+              <el-form-item label="创建时间：" prop="createTime">
+                <el-date-picker
+                  v-model="timeSearch"
+                  style="width: 100%"
+                  value-format="yyyy-MM-dd"
+                  type="daterange"
+                  range-separator="-"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                  :default-time="['00:00:00', '23:59:59']"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col v-bind="styleResponsive ? { lg: 4, md: 24 } : { span: 4 }">
+              <div class="ele-form-actions">
+                <el-button
+                  type="primary"
+                  icon="el-icon-search"
+                  class="ele-btn-icon"
+                  @click="reload('search')"
+                >
+                  查询
+                </el-button>
+                <el-button @click="reload('reset')">重置</el-button>
+              </div>
+            </el-col>
+          </el-row>
+        </el-form>
+      </div>
+    </el-card>
+
+    <div class="ele-table-container" style="height: 100%">
+      <ele-pro-table
+        ref="table"
+        :columns="columns"
+        :datasource="datasource"
+        :pageSizes="[10, 20, 50, 100]"
+        :pageSize="20"
+        height="calc(100% - 80px)"
+        @columns-change="handleColumnChange"
+        :cache-key="cacheKeyUrl"
+      >
+        <template v-slot:firstProcessDeliveryTime="{ row, $index }">
+          <el-date-picker
+            style="width: 100%"
+            v-if="row.isEdit"
+            v-model="row.firstProcessDeliveryTime"
+            type="date"
+            value-format="yyyy-MM-dd"
+            placeholder="选择日期"
+            @change="handleDateChange($event, row, $index)"
+            :ref="`date${$index}`"
+          >
+          </el-date-picker>
+
+          <span v-else> {{ row.firstProcessDeliveryTime }}</span>
+
+          <!-- <i
+            v-if="!row.firstProcessDeliveryTime"
+            class="xiada el-icon-edit"
+            @click="editFirstTime(row)"
+          ></i> -->
+        </template>
+
+        <template v-slot:produceRoutingName="{ row }">
+          <el-link
+            type="primary"
+            :underline="false"
+            @click="produceRouting(row)"
+          >
+            {{ row.produceRoutingName }}</el-link
+          >
+        </template>
+
+        <!-- 材料完成 -->
+
+        <!-- 出库 -->
+
+        <template v-slot:deliveryRecords="{ row }">
+          <div v-if="row.deliveryStatus === 0" class="delivery-status">
+            <span> 未发货 </span>
+            <span> 数量：{{ row.productQuantity }} </span>
+          </div>
+
+          <div v-if="row.deliveryStatus === 1" class="delivery-status">
+            <span> 已发：{{ row.deliveryQuantity }} </span>
+            <span>
+              未发：{{ row.productQuantity - row.deliveryQuantity }}
+            </span>
+          </div>
+
+          <div v-if="row.deliveryStatus === 2" class="delivery-status">
+            <span> 全部发货 </span>
+            <span> 数量:{{ row.deliveryQuantity }} </span>
+          </div>
+        </template>
+      </ele-pro-table>
+    </div>
+
+    <produceRouting ref="produceRouting"></produceRouting>
+  </div>
+</template>
+<script>
+  import tabMixins from '@/mixins/tableColumnsMixin';
+  import produceRouting from './components/produceRouting.vue';
+  import {
+    getList,
+    getListPage,
+    updateFirstProcessDeliveryTime,
+    getProduceRoutingDetail
+  } from '@/api/boss/index.js';
+  import { mapGetters } from 'vuex';
+  import { getColumns } from './columns.js';
+  import { getRecords } from '@/utils/util';
+  import { getByCode } from '@/api/system/dictionary-data';
+  export default {
+    mixins: [tabMixins],
+    components: {
+      produceRouting
+    },
+    data() {
+      return {
+        columnsVersion: 1,
+        cacheKeyUrl: 'wt-views-boss-orderTracking',
+        timeSearch: null,
+        params: {
+          startDate: '',
+          endDate: '',
+          customerId: '',
+          projectId: '',
+          orderNo: '',
+          customerName: '',
+          projectName: ''
+        },
+        // columns: [],
+        orderObj: {
+          0: '未提交',
+          1: '审核中',
+          2: '已审核',
+          3: '审核未通过',
+          7: '作废'
+        },
+        statusObj: {
+          0: '未发货',
+          1: '部分发货',
+          2: '全部发货'
+        },
+        firstTime: '',
+        records: []
+      };
+    },
+    computed: {
+      ...mapGetters(['user']),
+      // 是否开启响应式布局
+      styleResponsive() {
+        return this.$store.state.theme.styleResponsive;
+      },
+      columns() {
+        let columnsVersion = this.columnsVersion;
+        return getColumns(this);
+      }
+    },
+
+    methods: {
+      reload(type) {
+        if (this.timeSearch) {
+          this.params.startDate = this.timeSearch[0];
+          this.params.endDate = this.timeSearch[1];
+        }
+        if (type == 'reset') {
+          this.params = {
+            startDate: '',
+            endDate: '',
+            customerId: '',
+            projectId: '',
+            orderNo: ''
+          };
+        }
+        this.$refs.table.reload({ page: 1, where: this.params });
+      },
+      datasource({ page, where, limit, ...row }) {
+        return getListPage({
+          ...where,
+          pageNum: page,
+          size: limit
+        });
+      },
+
+      editFirstTime(row) {
+        row.isEdit = !row.isEdit;
+      },
+      //   选择首工序的时间
+      async handleDateChange(e, item, index) {
+        item.firstProcessDeliveryTime = e;
+        await updateFirstProcessDeliveryTime({
+          id: item.saleOrderMaterialId,
+          processDeliveryTime: e
+        });
+
+        this.$refs.table.reload({ where: this.params });
+      },
+
+      //打开工艺路线详情
+      async produceRouting(row) {
+        const res = await getProduceRoutingDetail({
+          isDetail: false,
+          pageNum: 1,
+          size: -1,
+          routingId: row.produceRoutingId
+        });
+
+        this.$refs.produceRouting.open({
+          row: row,
+          process: res
+        });
+      }
+    },
+
+    mounted() {
+      this.$store.dispatch('theme/setBodyFullscreen', true);
+    },
+    beforeDestroy() {
+      this.$store.dispatch('theme/setBodyFullscreen', false);
+    },
+    async created() {
+      console.log(this, window);
+      const res1 = await getByCode('production_status');
+      this.productionStatus = res1.data;
+    },
+    beforeUpdate() {
+      console.log('更新');
+    }
+  };
+</script>
+<style lang="scss" scoped>
+  .app-container {
+    background: #f0f3f3;
+    min-height: calc(100vh - 84px);
+  }
+
+  .zw-page-table {
+    background: #ffffff;
+    padding-top: 20px;
+  }
+
+  .pagination-wrap {
+    display: flex;
+    justify-content: flex-end;
+    padding: 10px 0;
+  }
+
+  .table {
+    width: 100%;
+    margin-top: 10px;
+  }
+  .outline {
+    width: 100%;
+    // min-width: 1px;
+    position: relative;
+    border-bottom: 1px solid #e5e5e5;
+    // display: flex;
+    // align-items: center;
+  }
+
+  .xiada {
+    position: absolute;
+    top: 50%;
+    right: 0;
+    transform: translateY(-50%);
+  }
+
+  //
+  :deep(.spanbox) {
+    display: flex;
+    flex-wrap: wrap;
+  }
+
+  :deep(.span) {
+    flex: 1;
+  }
+
+  .flex-col {
+    display: flex;
+    flex-direction: column;
+    .col {
+      flex: 1;
+      align-content: center;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+      overflow: hidden;
+    }
+  }
+
+  :deep(.el-card__body) {
+    padding: 15px 15px 0 15px;
+  }
+
+  .ele-body {
+    height: calc(100vh - 95px);
+
+    .ele-table-container {
+      height: 100%;
+      :deep(.el-card__body) {
+        padding: 0.3vw;
+      }
+
+      :deep(.ele-table-tool-default) {
+        padding: 0 15px;
+      }
+
+      :deep(.has-gutter) {
+        height: 50px;
+      }
+
+      :deep(.el-table__header) {
+        height: 50px;
+        // background-color: #615fe7;
+      }
+
+      :deep(.ele-pro-table) {
+        height: 99%;
+      }
+      :deep(.el-table) {
+        // font-size: 0.62vw;
+      }
+    }
+  }
+
+  .delivery-status {
+    display: flex;
+    justify-content: space-around;
+  }
+
+  :deep(.ele-pro-table-header-ellipsis > .el-table th.el-table__cell > .cell) {
+    white-space: pre;
+  }
+
+  :deep(
+      .el-date-editor
+        el-input
+        el-input--medium
+        el-input--prefix
+        el-input--suffix
+        el-date-editor--date
+    ) {
+    width: 100%;
+  }
+</style>

src/views/boss/orderTrackingOld/columns.js

@@ -0,0 +1,330 @@
+import { h } from 'vue';
+
+export const getColumns = (vm) => {
+  console.log(vm);
+
+  return [
+    {
+      columnKey: 'index',
+      type: 'index',
+      label: '序号',
+      width: 55,
+      align: 'center',
+      showOverflowTooltip: true,
+      fixed: 'left'
+    },
+    {
+      prop: 'saleTypeName',
+      label: '订单类型',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'projectName',
+      label: '项目名称',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'orderNo',
+      label: '销售订单号',
+      width: 170,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'productionPlanNo',
+      label: '生产计划编号',
+      width: 170,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'productionWorkOrderNo',
+      label: '生产工单号',
+      width: 170,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'processProgress',
+      label: '工序进度',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'productionNo',
+      label: '生产编号',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'preSaleOrderNo',
+      label: '预销售订单号',
+      width: 170,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'orderStatus',
+      label: '订单状态',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row) => {
+        return vm.orderObj[row.orderStatus] || '';
+      }
+    },
+
+    {
+      prop: 'productionStatus',
+      label: '生产状态',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'customerCode',
+      label: '客户代号',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'customerName',
+      label: '客户名称',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    // 明细
+    {
+      prop: 'saleOrderProductsName',
+      slot: 'saleOrderProductsName',
+      label: '产品描述',
+      width: 150,
+      align: 'center',
+      showOverflowTooltip: true,
+      height: 50
+    },
+    {
+      prop: 'saleOrderProductsCode',
+      slot: 'saleOrderProductsCode',
+      label: '产品编码',
+      width: 150,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'saleOrderProductsQuantity',
+      slot: 'saleOrderProductsQuantity',
+      label: '订单数量',
+      width: 80,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'saleOrderProductsUnitName',
+      slot: 'saleOrderProductsUnitName',
+      label: '单位',
+      width: 80,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'saleOrderProductsWeight',
+      slot: 'saleOrderProductsWeight',
+      label: '重量（kg）',
+      width: 100,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'saleOrderProductsCustomerExpectDeliveryDate',
+      slot: 'saleOrderProductsCustomerExpectDeliveryDate',
+      label: '客户期望交期',
+      width: 150,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'saleOrderProductsProductionDeliveryDate',
+      slot: 'saleOrderProductsProductionDeliveryDate',
+      label: '生产计划完成交期',
+      width: 150,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'materialsCode',
+      slot: 'materialsCode',
+      label: '材料编码',
+      width: 170,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'materialsName',
+      slot: 'materialsName',
+      label: '材料描述',
+      width: 200,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      slot: 'materialsProductionOrderNo',
+      prop: 'materialsProductionOrderNo',
+      label: '生产订单号（图号 + 编码）',
+      width: 180,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'materialsQuantity',
+      slot: 'materialsQuantity',
+      label: '数量',
+      width: 80,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'materialsUnitName',
+      slot: 'materialsUnitName',
+      label: '单位',
+      width: 80,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'materialsWeight',
+      slot: 'materialsWeight',
+      label: '重量（kg）',
+      width: 100,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'materialsProductionCycle',
+      slot: 'materialsProductionCycle',
+      label: '生产周期（天）',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'materialsFirstProcessDeliveryTime',
+      slot: 'materialsFirstProcessDeliveryTime',
+      label: '首工序实际下达时间',
+      width: 160,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'materialsFirstProcessCompleteTime',
+      slot: 'materialsFirstProcessCompleteTime',
+      label: '首工序预计完成时间',
+      width: 160,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'materialsProductEstimatedCompletionTime',
+      slot: 'materialsProductEstimatedCompletionTime',
+      label: '成品预计完成时间',
+      width: 160,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      slot: 'produceRoutingName',
+      prop: 'produceRoutingName',
+      label: '工艺路线',
+      width: 140,
+      align: 'center',
+      showOverflowTooltip: true
+    },
+    {
+      prop: 'deliveryRecords',
+      slot: 'deliveryRecords',
+      label: '发货',
+      width: 300,
+      align: 'center',
+      // showOverflowTooltip: true,
+      formatter: (row) => {
+        let yifa, weifa;
+
+        yifa = row.deliveryRecords.reduce((pre, cur) => pre + cur.quantity, 0);
+
+        weifa = row.deliveryRecords.reduce(
+          (pre, cur) => cur.deliveryQuantity - cur.quantity + pre,
+          0
+        );
+
+        return h(
+          'div',
+          { class: 'outlineBox' },
+          row.deliveryRecords.map((record) =>
+            h('div', { class: 'outline' }, record.deliveryQuantity || '')
+          )
+        );
+      }
+    },
+    {
+      prop: 'date01',
+      label: '1日',
+      width: 120,
+      align: 'center',
+      showOverflowTooltip: true,
+      formatter: (row, column, cellValue, index) => {
+        const result = vm.records[index];
+        if (!result) {
+          return '';
+        }
+
+        if (Object.keys(result).length === 0) {
+          return '';
+        }
+
+        const data = result[column.property];
+        if (!data?.length) {
+          return '';
+        }
+        return h(
+          'div',
+          { class: 'spanbox' },
+          data.map((span) =>
+            h('span', { class: 'span' }, span.day + '  ：  ' + span.num)
+          )
+        );
+      }
+    }
+    // {
+    //   prop: 'date02',
+    //   label: '2日',
+    //   width: 120,
+    //   align: 'center',
+    //   showOverflowTooltip: true,
+    //   formatter: (row, column, cellValue, index) => {
+    //     const result = vm.records[index];
+    //     if (Object.keys(result).length === 0) {
+    //       return '';
+    //     }
+    //     const data = result[column.property];
+    //     if (!data?.length) {
+    //       return '';
+    //     }
+    //     return h(
+    //       'div',
+    //       { class: 'spanbox' },
+    //       data.map((span) =>
+    //         h('span', { class: 'span' }, span.day + '  ：  ' + span.num)
+    //       )
+    //     );
+    //   }
+    // }
+  ];
+};

src/views/boss/orderTrackingOld/components/drawer.vue

@@ -0,0 +1,294 @@
+<template>
+  <el-drawer
+    :visible.sync="drawer"
+    direction="rtl"
+    :append-to-body="true"
+    size="100%"
+  >
+    <div slot="title" class="title">
+      <span style="margin: 0" class="name"
+        >客户名称：{{ row?.base?.name }}</span
+      >
+      <span>客户编码：{{ row?.base?.code }}</span>
+      <span>客户代号：{{ row?.base?.serialNo }}</span>
+      <span>业务员：{{ row?.base?.salesmanName }}</span>
+      <span
+        >客户级别：{{ getDictValue('供应商级别', row?.base?.level + '') }}</span
+      >
+    </div>
+
+    <div class="ele-body" style="height: 100%">
+      <div style="width: calc(100% - 350px); height: 100%">
+        <!-- <headerTitle title="摘要卡片" style="margin-top: 15px"></headerTitle> -->
+
+        <div class="card">
+          <div>
+            <span> 销售订单总额</span>
+            <span class="value"
+              >{{ contactCountData.totalAmountSaleOrder }}
+              &nbsp;&nbsp;元
+            </span>
+          </div>
+          <div>
+            <span> 退货单总额</span>
+            <span class="value"
+              >{{
+                contactCountData.totalAmountSaleOrderRecord
+              }}
+              &nbsp;&nbsp;元</span
+            >
+          </div>
+          <div>
+            <span> 回款总额</span>
+            <span class="value"
+              >{{ contactCountData.totalAmountReturn }}&nbsp;&nbsp;元</span
+            ></div
+          >
+          <div>
+            <span> 退款总额</span>
+            <span class="value"
+              >{{ contactCountData.totalAmountRecord }}&nbsp;&nbsp;元</span
+            ></div
+          >
+          <div>
+            <span> 待回款总额</span>
+            <span class="value"
+              >{{ contactCountData.totalAmountTreatReturn }}&nbsp;&nbsp;元</span
+            ></div
+          >
+        </div>
+        <el-tabs v-model="activeName" style="height: calc(100% - 124px)">
+          <el-tab-pane label="详细信息" name="详细信息">
+            <contactInfo ref="contactInfoRef"></contactInfo>
+          </el-tab-pane>
+          <el-tab-pane label="银行信息" name="银行信息">
+            <bankInfo ref="bankInfoRef"></bankInfo>
+          </el-tab-pane>
+          <el-tab-pane label="联系人信息" name="联系人信息">
+            <linkInfo ref="linkInfoREf"></linkInfo
+          ></el-tab-pane>
+          <el-tab-pane label="跟进记录" name="跟进记录">
+            <followList ref="followListRef"></followList
+          ></el-tab-pane>
+          <el-tab-pane label="商机" name="商机">
+            <businessOpportunity
+              :key="row?.base?.id"
+              :contactId="row?.base?.id"
+              :contactName="row?.base?.name"
+            ></businessOpportunity>
+          </el-tab-pane>
+
+          <el-tab-pane label="报价单" name="报价单">
+            <quotation :key="row?.base?.id" :contactData="row.base"></quotation>
+          </el-tab-pane>
+
+          <el-tab-pane label="销售订单" name="销售订单">
+            <saleOrder :key="row?.base?.id" :contactData="row.base"></saleOrder>
+          </el-tab-pane>
+
+          <el-tab-pane label="销售合同" name="销售合同">
+            <contractBook
+              :key="row?.base?.id"
+              :contactData="row.base"
+            ></contractBook>
+          </el-tab-pane>
+          <el-tab-pane label="发货单" name="发货单">
+            <invoice :key="row?.base?.id" :contactData="row.base"></invoice>
+          </el-tab-pane>
+          <el-tab-pane label="退货单" name="退货单">
+            <returnGoods
+              :key="row?.base?.id"
+              :contactData="row.base"
+            ></returnGoods>
+          </el-tab-pane>
+          <el-tab-pane label="对账单" name="对账单">
+            <accountstatement
+              :key="row?.base?.id"
+              :contactData="row.base"
+            ></accountstatement>
+          </el-tab-pane>
+
+          <el-tab-pane label="开票信息" name="开票信息">
+            <invoiceManage
+              :key="row?.base?.id"
+              :contactData="row.base"
+            ></invoiceManage>
+          </el-tab-pane>
+          <el-tab-pane label="应收信息" name="应收信息">
+            <receivableManage
+              :key="row?.base?.id"
+              :contactData="row.base"
+            ></receivableManage>
+          </el-tab-pane>
+          <el-tab-pane label="证书资质" name="证书资质">
+            <certificateManagement
+              ref="certificateManagementRef"
+            ></certificateManagement>
+          </el-tab-pane>
+          <el-tab-pane label="申请记录" name="申请记录">
+            <applyList
+              ref="applyListRef"
+              :tableList="row.listApply"
+            ></applyList>
+          </el-tab-pane>
+
+          <el-tab-pane label="审批流程" name="审批流程">
+            <bpmDetail
+              v-if="activeName === '审批流程' && row.base?.processInstanceId"
+              :id="row.base?.processInstanceId"
+            ></bpmDetail>
+          </el-tab-pane>
+        </el-tabs>
+      </div>
+
+      <el-card
+        class="box-card"
+        style="width: 350px; margin-left: 15px; height: 100%"
+      >
+        <div slot="header" class="clearfix">
+          <span>客户动态</span>
+          <el-button
+            style="float: right; padding: 3px 0"
+            type="text"
+            @click="commitCommentVisible = true"
+            >新建</el-button
+          >
+        </div>
+        <!-- <tinymce-editor v-model="content" :init="{ height: 525 }" /> -->
+        <comment :key="row.base?.id" ref="commentRef"></comment>
+      </el-card>
+      <ele-modal
+        custom-class="ele-dialog-form long-dialog-form"
+        :centered="true"
+        :visible.sync="commitCommentVisible"
+        :close-on-click-modal="false"
+        :append-to-body="true"
+        width="500px"
+      >
+        <el-form label-width="90px" ref="form" class="el-form-box">
+          <el-form-item label="动态内容">
+            <el-input
+              class="gray-bg-input"
+              v-model="inputComment"
+              type="textarea"
+              :rows="3"
+              autofocus
+              placeholder="发布内容"
+            >
+            </el-input>
+          </el-form-item>
+        </el-form>
+        <div slot="footer" class="footer">
+          <el-button @click="commitCommentVisible = false">取消</el-button>
+          <el-button type="primary" @click="commitComment">发布</el-button>
+        </div>
+      </ele-modal>
+    </div>
+  </el-drawer>
+</template>
+
+<script>
+ 
+  export default {
+
+    data() {
+      return {
+        drawer: false,
+      };
+    },
+    created() {
+      // this.requestDict('供应商级别');
+    },
+    computed: {
+      // ...mapGetters(['user'])
+    },
+    methods: {
+      async open(row, pageName) {
+        console.log(row, pageName);
+
+        this.row = await contactDetail(row.id);
+        if (this.row?.listApply) {
+          this.row?.listApply.forEach((item, index) => {
+            this.$set(this.row?.listApply[index],'contactName',this.row.base.name)
+          });
+        }
+        this.pageName = pageName;
+        const contactCountData = await queryContactIdCount(row.id);
+        this.contactCountData = contactCountData.data;
+        this.drawer = true;
+        this.$nextTick(() => {
+          this.$refs.contactInfoRef.init(this.row);
+          this.$refs.bankInfoRef.init(this.row);
+          this.$refs.linkInfoREf.init(this.row);
+          // this.$refs.certificateTableRef.init(this.row.base);
+          this.$refs.certificateManagementRef &&
+            this.$refs.certificateManagementRef.init(
+              '4',
+              this.row.base.id,
+              this.row.base.name
+            );
+          this.$refs.followListRef.init(this.row);
+          this.$refs.commentRef.init(this.row.base);
+        });
+      },
+   
+      handleClose(done) {
+        this.$confirm('确认关闭？')
+          .then((_) => {
+            done();
+          })
+          .catch((_) => {});
+      }
+    }
+  };
+</script>
+<style lang="scss" scoped>
+  .ele-body {
+    display: flex;
+  }
+  :deep(.el-tabs__content) {
+    padding: 10px;
+    height: calc(100% - 40px);
+    overflow: auto;
+  }
+  :deep(.el-input.is-disabled .el-input__inner) {
+    color: #606266;
+  }
+  .card {
+    display: flex;
+    padding: 15px;
+    font-size: 16px;
+    > div {
+      flex: 1;
+      margin: 0px 40px;
+      background: #1890ff;
+      color: #fff;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      padding: 12px;
+      border-radius: 10px;
+      .value {
+        margin-top: 8px;
+      }
+    }
+  }
+  .title {
+    span {
+      margin-left: 50px;
+    }
+    .name {
+      font-weight: 800;
+      color: #40a9ff;
+    }
+  }
+  :deep(.el-card__body) {
+    overflow: auto;
+    height: calc(100% - 51px);
+  }
+
+
+
+  
+</style>

src/views/boss/orderTrackingOld/data.js

@@ -0,0 +1,932 @@
+export default [
+  {
+    createTime: '',
+    createUserId: 0,
+    customerCode: 'customerCode',
+    customerName: 'customerName',
+    // 出库
+    deliveryRecords: [],
+    id: 0,
+    // 材料
+    materials: [
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '2033-01-23',
+        id: 8892,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312,
+        isEdit: false
+      },
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '33',
+        id: 0,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312
+      },
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '33',
+        id: 0,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312
+      }
+    ],
+    produceRoutingName:'工艺路线',
+    orderNo: 'orderNo',
+    orderType: 'orderType',
+    orderStatus: 0,
+    preSaleOrderNo: 'preSaleOrderNo',
+    processProgress: 'processProgress',
+    productionNo: 'productionNo',
+    productionOrderNo: 'productionOrderNo',
+    productionPlanNo: 'productionPlanNo',
+    productionStatus: 0,
+    productionWorkOrderNo: 'productionWorkOrderNo',
+    projectName: '项目名称',
+    // 销售
+    saleOrderProducts: [
+      {
+        code: '123',
+        createTime: '',
+        createUserId: 0,
+        id: 0,
+        name: '产品描述22222222222222222222222222222222222222221',
+        quantity: 1,
+        unitName: 'kg',
+        weight: 1,
+        customerExpectDeliveryDate: '2023-01-01',
+        productionDeliveryDate: '2023-01-02'
+      },
+      {
+        code: '456',
+        createTime: '',
+        createUserId: 0,
+        id: 0,
+        name: '产品描述2',
+        quantity: 2,
+        unitName: 'kg',
+        weight: 222,
+        customerExpectDeliveryDate: '2023-01-01',
+        productionDeliveryDate: '2023-01-02'
+      }
+    ],
+    saleTypeName: '订单类型'
+  },
+   {
+    createTime: '',
+    createUserId: 0,
+    customerCode: 'customerCode',
+    customerName: 'customerName',
+    // 出库
+    deliveryRecords: [
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-01-01',
+        deliveryQuantity: 2,
+        id: 0,
+        productCode: 'cc1',
+        productName: '',
+        quantity: 1,
+        saleQuantity: 0,
+        status:1
+      },
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-02-01',
+        deliveryQuantity: 10,
+        id: 0,
+        productCode: 'ff1',
+        productName: '',
+        quantity: 3,
+        saleQuantity: 0
+      },
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-02-21',
+        deliveryQuantity: 10,
+        id: 0,
+        productCode: 'ff1',
+        productName: '',
+        quantity: 3,
+        saleQuantity: 0
+      }
+    ],
+    id: 0,
+    // 材料
+    materials: [
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '2033-01-23',
+        id: 8892,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312,
+        isEdit: false
+      },
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '33',
+        id: 0,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312
+      },
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '33',
+        id: 0,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312
+      }
+    ],
+    produceRoutingName:'工艺路线',
+    orderNo: 'orderNo',
+    orderType: 'orderType',
+    orderStatus: 0,
+    preSaleOrderNo: 'preSaleOrderNo',
+    processProgress: 'processProgress',
+    productionNo: 'productionNo',
+    productionOrderNo: 'productionOrderNo',
+    productionPlanNo: 'productionPlanNo',
+    productionStatus: 0,
+    productionWorkOrderNo: 'productionWorkOrderNo',
+    projectName: '项目名称',
+    // 销售
+    saleOrderProducts: [
+      {
+        code: '123',
+        createTime: '',
+        createUserId: 0,
+        id: 0,
+        name: '产品描述22222222222222222222222222222222222222221',
+        quantity: 1,
+        unitName: 'kg',
+        weight: 1,
+        customerExpectDeliveryDate: '2023-01-01',
+        productionDeliveryDate: '2023-01-02'
+      },
+      {
+        code: '456',
+        createTime: '',
+        createUserId: 0,
+        id: 0,
+        name: '产品描述2',
+        quantity: 2,
+        unitName: 'kg',
+        weight: 222,
+        customerExpectDeliveryDate: '2023-01-01',
+        productionDeliveryDate: '2023-01-02'
+      }
+    ],
+    saleTypeName: '订单类型'
+  },
+   {
+    createTime: '',
+    createUserId: 0,
+    customerCode: 'customerCode',
+    customerName: 'customerName',
+    // 出库
+    deliveryRecords: [
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-01-01',
+        deliveryQuantity: 2,
+        id: 0,
+        productCode: 'cc1',
+        productName: '',
+        quantity: 1,
+        saleQuantity: 0
+      },
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-02-01',
+        deliveryQuantity: 10,
+        id: 0,
+        productCode: 'ff1',
+        productName: '',
+        quantity: 3,
+        saleQuantity: 0
+      },
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-02-21',
+        deliveryQuantity: 10,
+        id: 0,
+        productCode: 'ff1',
+        productName: '',
+        quantity: 3,
+        saleQuantity: 0
+      }
+    ],
+    id: 0,
+    // 材料
+    materials: [
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '2033-01-23',
+        id: 8892,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312,
+        isEdit: false
+      },
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '33',
+        id: 0,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312
+      },
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '33',
+        id: 0,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312
+      }
+    ],
+    produceRoutingName:'工艺路线',
+    orderNo: 'orderNo',
+    orderType: 'orderType',
+    orderStatus: 0,
+    preSaleOrderNo: 'preSaleOrderNo',
+    processProgress: 'processProgress',
+    productionNo: 'productionNo',
+    productionOrderNo: 'productionOrderNo',
+    productionPlanNo: 'productionPlanNo',
+    productionStatus: 0,
+    productionWorkOrderNo: 'productionWorkOrderNo',
+    projectName: '项目名称',
+    // 销售
+    saleOrderProducts: [
+      {
+        code: '123',
+        createTime: '',
+        createUserId: 0,
+        id: 0,
+        name: '产品描述22222222222222222222222222222222222222221',
+        quantity: 1,
+        unitName: 'kg',
+        weight: 1,
+        customerExpectDeliveryDate: '2023-01-01',
+        productionDeliveryDate: '2023-01-02'
+      },
+      {
+        code: '456',
+        createTime: '',
+        createUserId: 0,
+        id: 0,
+        name: '产品描述2',
+        quantity: 2,
+        unitName: 'kg',
+        weight: 222,
+        customerExpectDeliveryDate: '2023-01-01',
+        productionDeliveryDate: '2023-01-02'
+      }
+    ],
+    saleTypeName: '订单类型'
+  },
+   {
+    createTime: '',
+    createUserId: 0,
+    customerCode: 'customerCode',
+    customerName: 'customerName',
+    // 出库
+    deliveryRecords: [
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-01-01',
+        deliveryQuantity: 2,
+        id: 0,
+        productCode: 'cc1',
+        productName: '',
+        quantity: 1,
+        saleQuantity: 0
+      },
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-02-01',
+        deliveryQuantity: 10,
+        id: 0,
+        productCode: 'ff1',
+        productName: '',
+        quantity: 3,
+        saleQuantity: 0
+      },
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-02-21',
+        deliveryQuantity: 10,
+        id: 0,
+        productCode: 'ff1',
+        productName: '',
+        quantity: 3,
+        saleQuantity: 0
+      }
+    ],
+    id: 0,
+    // 材料
+    materials: [
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '2033-01-23',
+        id: 8892,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312,
+        isEdit: false
+      },
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '33',
+        id: 0,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312
+      },
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '33',
+        id: 0,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312
+      }
+    ],
+    produceRoutingName:'工艺路线',
+    orderNo: 'orderNo',
+    orderType: 'orderType',
+    orderStatus: 0,
+    preSaleOrderNo: 'preSaleOrderNo',
+    processProgress: 'processProgress',
+    productionNo: 'productionNo',
+    productionOrderNo: 'productionOrderNo',
+    productionPlanNo: 'productionPlanNo',
+    productionStatus: 0,
+    productionWorkOrderNo: 'productionWorkOrderNo',
+    projectName: '项目名称',
+    // 销售
+    saleOrderProducts: [
+      {
+        code: '123',
+        createTime: '',
+        createUserId: 0,
+        id: 0,
+        name: '产品描述22222222222222222222222222222222222222221',
+        quantity: 1,
+        unitName: 'kg',
+        weight: 1,
+        customerExpectDeliveryDate: '2023-01-01',
+        productionDeliveryDate: '2023-01-02'
+      },
+      {
+        code: '456',
+        createTime: '',
+        createUserId: 0,
+        id: 0,
+        name: '产品描述2',
+        quantity: 2,
+        unitName: 'kg',
+        weight: 222,
+        customerExpectDeliveryDate: '2023-01-01',
+        productionDeliveryDate: '2023-01-02'
+      }
+    ],
+    saleTypeName: '订单类型'
+  },
+   {
+    createTime: '',
+    createUserId: 0,
+    customerCode: 'customerCode',
+    customerName: 'customerName',
+    // 出库
+    deliveryRecords: [
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-01-01',
+        deliveryQuantity: 2,
+        id: 0,
+        productCode: 'cc1',
+        productName: '',
+        quantity: 1,
+        saleQuantity: 0
+      },
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-02-01',
+        deliveryQuantity: 10,
+        id: 0,
+        productCode: 'ff1',
+        productName: '',
+        quantity: 3,
+        saleQuantity: 0
+      },
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-02-21',
+        deliveryQuantity: 10,
+        id: 0,
+        productCode: 'ff1',
+        productName: '',
+        quantity: 3,
+        saleQuantity: 0
+      }
+    ],
+    id: 0,
+    // 材料
+    materials: [
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '2033-01-23',
+        id: 8892,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312,
+        isEdit: false
+      },
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '33',
+        id: 0,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312
+      },
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '33',
+        id: 0,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312
+      }
+    ],
+    produceRoutingName:'工艺路线',
+    orderNo: 'orderNo',
+    orderType: 'orderType',
+    orderStatus: 0,
+    preSaleOrderNo: 'preSaleOrderNo',
+    processProgress: 'processProgress',
+    productionNo: 'productionNo',
+    productionOrderNo: 'productionOrderNo',
+    productionPlanNo: 'productionPlanNo',
+    productionStatus: 0,
+    productionWorkOrderNo: 'productionWorkOrderNo',
+    projectName: '项目名称',
+    // 销售
+    saleOrderProducts: [
+      {
+        code: '123',
+        createTime: '',
+        createUserId: 0,
+        id: 0,
+        name: '产品描述22222222222222222222222222222222222222221',
+        quantity: 1,
+        unitName: 'kg',
+        weight: 1,
+        customerExpectDeliveryDate: '2023-01-01',
+        productionDeliveryDate: '2023-01-02'
+      },
+      {
+        code: '456',
+        createTime: '',
+        createUserId: 0,
+        id: 0,
+        name: '产品描述2',
+        quantity: 2,
+        unitName: 'kg',
+        weight: 222,
+        customerExpectDeliveryDate: '2023-01-01',
+        productionDeliveryDate: '2023-01-02'
+      }
+    ],
+    saleTypeName: '订单类型'
+  },
+   {
+    createTime: '',
+    createUserId: 0,
+    customerCode: 'customerCode',
+    customerName: 'customerName',
+    // 出库
+    deliveryRecords: [
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-01-01',
+        deliveryQuantity: 2,
+        id: 0,
+        productCode: 'cc1',
+        productName: '',
+        quantity: 1,
+        saleQuantity: 0
+      },
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-02-01',
+        deliveryQuantity: 10,
+        id: 0,
+        productCode: 'ff1',
+        productName: '',
+        quantity: 3,
+        saleQuantity: 0
+      },
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-02-21',
+        deliveryQuantity: 10,
+        id: 0,
+        productCode: 'ff1',
+        productName: '',
+        quantity: 3,
+        saleQuantity: 0
+      }
+    ],
+    id: 0,
+    // 材料
+    materials: [
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '2033-01-23',
+        id: 8892,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312,
+        isEdit: false
+      },
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '33',
+        id: 0,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312
+      },
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '33',
+        id: 0,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312
+      }
+    ],
+    produceRoutingName:'工艺路线',
+    orderNo: 'orderNo',
+    orderType: 'orderType',
+    orderStatus: 0,
+    preSaleOrderNo: 'preSaleOrderNo',
+    processProgress: 'processProgress',
+    productionNo: 'productionNo',
+    productionOrderNo: 'productionOrderNo',
+    productionPlanNo: 'productionPlanNo',
+    productionStatus: 0,
+    productionWorkOrderNo: 'productionWorkOrderNo',
+    projectName: '项目名称',
+    // 销售
+    saleOrderProducts: [
+      {
+        code: '123',
+        createTime: '',
+        createUserId: 0,
+        id: 0,
+        name: '产品描述22222222222222222222222222222222222222221',
+        quantity: 1,
+        unitName: 'kg',
+        weight: 1,
+        customerExpectDeliveryDate: '2023-01-01',
+        productionDeliveryDate: '2023-01-02'
+      },
+      {
+        code: '456',
+        createTime: '',
+        createUserId: 0,
+        id: 0,
+        name: '产品描述2',
+        quantity: 2,
+        unitName: 'kg',
+        weight: 222,
+        customerExpectDeliveryDate: '2023-01-01',
+        productionDeliveryDate: '2023-01-02'
+      }
+    ],
+    saleTypeName: '订单类型'
+  },
+   {
+    createTime: '',
+    createUserId: 0,
+    customerCode: 'customerCode',
+    customerName: 'customerName',
+    // 出库
+    deliveryRecords: [
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-01-01',
+        deliveryQuantity: 2,
+        id: 0,
+        productCode: 'cc1',
+        productName: '',
+        quantity: 1,
+        saleQuantity: 0
+      },
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-02-01',
+        deliveryQuantity: 10,
+        id: 0,
+        productCode: 'ff1',
+        productName: '',
+        quantity: 3,
+        saleQuantity: 0
+      },
+      {
+        createTime: '',
+        createUserId: 0,
+        deliveryProductId: 0,
+        deliveryTime: '2012-02-21',
+        deliveryQuantity: 10,
+        id: 0,
+        productCode: 'ff1',
+        productName: '',
+        quantity: 3,
+        saleQuantity: 0
+      }
+    ],
+    id: 0,
+    // 材料
+    materials: [
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '2033-01-23',
+        id: 8892,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312,
+        isEdit: false
+      },
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '33',
+        id: 0,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312
+      },
+      {
+        code: '1',
+        createTime: '',
+        createUserId: 0,
+        customerExpectDeliveryDate: '',
+        firstProcessCompleteTime: '22',
+        firstProcessDeliveryTime: '33',
+        id: 0,
+        name: 'dad',
+        productEstimatedCompletionTime: '4',
+        productionCycle: 0,
+        productionDeliveryDate: '',
+        quantity: 0,
+        unitName: '131',
+        weight: 12312
+      }
+    ],
+    produceRoutingName:'工艺路线',
+    orderNo: 'orderNo',
+    orderType: 'orderType',
+    orderStatus: 0,
+    preSaleOrderNo: 'preSaleOrderNo',
+    processProgress: 'processProgress',
+    productionNo: 'productionNo',
+    productionOrderNo: 'productionOrderNo',
+    productionPlanNo: 'productionPlanNo',
+    productionStatus: 0,
+    productionWorkOrderNo: 'productionWorkOrderNo',
+    projectName: '项目名称',
+    // 销售
+    saleOrderProducts: [
+      {
+        code: '123',
+        createTime: '',
+        createUserId: 0,
+        id: 0,
+        name: '产品描述22222222222222222222222222222222222222221',
+        quantity: 1,
+        unitName: 'kg',
+        weight: 1,
+        customerExpectDeliveryDate: '2023-01-01',
+        productionDeliveryDate: '2023-01-02'
+      },
+      {
+        code: '456',
+        createTime: '',
+        createUserId: 0,
+        id: 0,
+        name: '产品描述2',
+        quantity: 2,
+        unitName: 'kg',
+        weight: 222,
+        customerExpectDeliveryDate: '2023-01-01',
+        productionDeliveryDate: '2023-01-02'
+      }
+    ],
+    saleTypeName: '订单类型'
+  }
+];

src/views/boss/orderTrackingOld/index.vue

@@ -0,0 +1,709 @@
+<template>
+  <div class="ele-body">
+    <el-card shadow="never">
+      <div class="filter-container">
+        <el-form
+          label-width="100px"
+          class="ele-form-search"
+          @keyup.enter.native="reload"
+          @submit.native.prevent
+        >
+          <el-row :gutter="15">
+            <el-col v-bind="styleResponsive ? { lg: 5, md: 12 } : { span: 5 }">
+              <el-form-item label="订单编号：" prop="orderNo">
+                <el-input v-model="params.orderNo"></el-input>
+              </el-form-item>
+            </el-col>
+
+            <el-col v-bind="styleResponsive ? { lg: 5, md: 12 } : { span: 5 }">
+              <el-form-item label="项目名称：" prop="projectName">
+                <el-input v-model="params.projectName"></el-input>
+              </el-form-item>
+            </el-col>
+
+            <el-col v-bind="styleResponsive ? { lg: 5, md: 12 } : { span: 5 }">
+              <el-form-item label="客户名称：" prop="customerName">
+                <el-input v-model="params.customerName"></el-input>
+              </el-form-item>
+            </el-col>
+
+            <el-col v-bind="styleResponsive ? { lg: 5, md: 12 } : { span: 5 }">
+              <el-form-item label="创建时间：" prop="createTime">
+                <el-date-picker
+                  v-model="timeSearch"
+                  style="width: 100%"
+                  value-format="yyyy-MM-dd"
+                  type="daterange"
+                  range-separator="-"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                  :default-time="['00:00:00', '23:59:59']"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col v-bind="styleResponsive ? { lg: 4, md: 24 } : { span: 4 }">
+              <div class="ele-form-actions">
+                <el-button
+                  type="primary"
+                  icon="el-icon-search"
+                  class="ele-btn-icon"
+                  @click="reload('search')"
+                >
+                  查询
+                </el-button>
+                <el-button @click="reload('reset')">重置</el-button>
+              </div>
+            </el-col>
+          </el-row>
+        </el-form>
+      </div>
+    </el-card>
+
+    <div class="ele-table-container" style="height: 100%">
+      <ele-pro-table
+        ref="table"
+        :columns="columns"
+        :datasource="datasource"
+        :pageSizes="[10, 20, 50, 100]"
+        :pageSize="20"
+        @columns-change="handleColumnsChange"
+        @done="done"
+        stripe
+        height="calc(100% - 80px)"
+        :key="tableKey"
+      >
+        <!-- 这里是产品 -->
+
+        <template v-slot:saleOrderProductsName="{ row }">
+          <div
+            v-if="row.saleOrderProducts.length > 0"
+            class="outlineBox flex-col"
+          >
+            <div
+              v-for="(item, index) in row.saleOrderProducts"
+              :key="index"
+              class="outline col"
+            >
+              {{ item.name }}
+            </div>
+          </div>
+        </template>
+
+        <template v-slot:saleOrderProductsCode="{ row }">
+          <div
+            v-if="row.saleOrderProducts.length > 0"
+            class="outlineBox flex-col"
+          >
+            <div
+              v-for="(item, index) in row.saleOrderProducts"
+              :key="index"
+              class="outline col"
+            >
+              {{ item.code }}
+            </div>
+          </div>
+        </template>
+
+        <template v-slot:saleOrderProductsQuantity="{ row }">
+          <div
+            v-if="row.saleOrderProducts.length > 0"
+            class="outlineBox flex-col"
+          >
+            <div
+              v-for="(item, index) in row.saleOrderProducts"
+              :key="index"
+              class="outline col"
+            >
+              {{ item.quantity }}
+            </div>
+          </div>
+        </template>
+
+        <template v-slot:saleOrderProductsUnitName="{ row }">
+          <div
+            v-if="row.saleOrderProducts.length > 0"
+            class="outlineBox flex-col"
+          >
+            <div
+              v-for="(item, index) in row.saleOrderProducts"
+              :key="index"
+              class="outline col"
+            >
+              {{ item.unitName }}
+            </div>
+          </div>
+        </template>
+
+        <template v-slot:saleOrderProductsWeight="{ row }">
+          <div
+            v-if="row.saleOrderProducts.length > 0"
+            class="outlineBox flex-col"
+          >
+            <div
+              v-for="(item, index) in row.saleOrderProducts"
+              :key="index"
+              class="outline col"
+            >
+              {{ item.weight }}
+            </div>
+          </div>
+        </template>
+
+        <template v-slot:saleOrderProductsCustomerExpectDeliveryDate="{ row }">
+          <div
+            v-if="row.saleOrderProducts.length > 0"
+            class="outlineBox flex-col"
+          >
+            <div
+              v-for="(item, index) in row.saleOrderProducts"
+              :key="index"
+              class="outline col"
+            >
+              {{ item.customerExpectDeliveryDate }}
+            </div>
+          </div>
+        </template>
+
+        <template v-slot:saleOrderProductsProductionDeliveryDate="{ row }">
+          <div
+            v-if="row.saleOrderProducts.length > 0"
+            class="outlineBox flex-col"
+          >
+            <div
+              v-for="(item, index) in row.saleOrderProducts"
+              :key="index"
+              class="outline col"
+            >
+              {{ item.productionDeliveryDate }}
+            </div>
+          </div>
+        </template>
+
+        <!-- 产品结束，材料开始 -->
+
+        <template v-slot:materialsCode="{ row }">
+          <div v-if="row.materials.length > 0" class="outlineBox flex-col">
+            <div
+              v-for="(item, index) in row.materials"
+              :key="index"
+              class="outline col"
+            >
+              {{ item.code }}
+            </div>
+          </div>
+        </template>
+
+        <template v-slot:materialsName="{ row }">
+          <div v-if="row.materials.length > 0" class="outlineBox flex-col">
+            <div
+              v-for="(item, index) in row.materials"
+              :key="index"
+              class="outline col"
+            >
+              {{ item.name }}
+            </div>
+          </div>
+        </template>
+
+        <template v-slot:materialsProductionOrderNo="{ row }">
+          <div v-if="row.materials.length > 0" class="outlineBox flex-col">
+            <div
+              v-for="(item, index) in row.materials"
+              :key="index"
+              class="outline col"
+            >
+              {{ item.code }}{{ item.imgCode ? `-${item.imgCode}` : '' }}
+            </div>
+          </div>
+        </template>
+
+        <template v-slot:materialsQuantity="{ row }">
+          <div v-if="row.materials.length > 0" class="outlineBox flex-col">
+            <div
+              v-for="(item, index) in row.materials"
+              :key="index"
+              class="outline col"
+            >
+              {{ item.quantity }}
+            </div>
+          </div>
+        </template>
+
+        <template v-slot:materialsUnitName="{ row }">
+          <div v-if="row.materials.length > 0" class="outlineBox flex-col">
+            <div
+              v-for="(item, index) in row.materials"
+              :key="index"
+              class="outline col"
+            >
+              {{ item.unitName }}
+            </div>
+          </div>
+        </template>
+
+        <template v-slot:materialsWeight="{ row }">
+          <div v-if="row.materials.length > 0" class="outlineBox flex-col">
+            <div
+              v-for="(item, index) in row.materials"
+              :key="index"
+              class="outline col"
+            >
+              {{ item.weight }}
+            </div>
+          </div>
+        </template>
+
+        <template v-slot:materialsProductionCycle="{ row }">
+          <div v-if="row.materials.length > 0" class="outlineBox flex-col">
+            <div
+              v-for="(item, index) in row.materials"
+              :key="index"
+              class="outline col"
+            >
+              {{ item.productionCycle }}
+            </div>
+          </div>
+        </template>
+
+        <template
+          v-slot:materialsFirstProcessDeliveryTime="{ row, column, $index }"
+        >
+          <div v-if="row.materials.length > 0" class="outlineBox flex-col">
+            <div
+              v-for="(item, itemindex) in row.materials"
+              :key="itemindex"
+              class="outline col"
+            >
+              <el-date-picker
+                v-if="item.isEdit"
+                v-model="firstTime"
+                type="date"
+                value-format="yyyy-MM-dd"
+                :default-value="item.firstProcessDeliveryTime"
+                placeholder="选择日期"
+                @change="handleDateChange($event, item)"
+              >
+              </el-date-picker>
+              <span v-else>
+                {{ item.firstProcessDeliveryTime || '请选择' }}</span
+              >
+
+              <i
+                class="xiada el-icon-edit"
+                @click="editFirstTime($index, item, itemindex)"
+              ></i>
+            </div>
+          </div>
+        </template>
+
+        <template v-slot:materialsFirstProcessCompleteTime="{ row }">
+          <div v-if="row.materials.length > 0" class="outlineBox flex-col">
+            <div
+              v-for="(item, index) in row.materials"
+              :key="index"
+              class="outline col"
+            >
+              {{ item.firstProcessCompleteTime }}
+            </div>
+          </div>
+        </template>
+
+        <template v-slot:materialsProductEstimatedCompletionTime="{ row }">
+          <div v-if="row.materials.length > 0" class="outlineBox flex-col">
+            <div
+              v-for="(item, index) in row.materials"
+              :key="index"
+              class="outline col"
+            >
+              {{ item.productEstimatedCompletionTime }}
+            </div>
+          </div>
+        </template>
+        <!-- 材料完成 -->
+
+        <template v-slot:produceRoutingName="{ row }">
+          <el-link
+            type="primary"
+            :underline="false"
+            @click="produceRouting(row)"
+          >
+            {{ row.produceRoutingName }}</el-link
+          >
+        </template>
+
+        <!-- 出库 -->
+
+        <template v-slot:deliveryRecords="{ row }">
+          <div
+            v-if="row.deliveryRecords.length > 0"
+            class="outlineBox flex-col"
+          >
+            <div
+              v-for="(item, index) in row.deliveryRecords"
+              :key="index"
+              class="outline col"
+              @mouseenter="handleMouseEnter($event)"
+              @mouseleave="handleMouseLeave"
+            >
+              <span style="width: 100%">
+                状态：{{ statusObj[item.status] }}
+              </span>
+              <span style="width: 100%">
+                未发：{{ item.deliveryQuantity }}
+              </span>
+              <span style="width: 100%"> 已发：{{ item.quantity }} </span>
+            </div>
+          </div>
+        </template>
+
+        <!-- 操作列 -->
+        <!-- <template v-slot:action="{ row }">
+          <el-link
+            type="primary"
+            :underline="false"
+            icon="el-icon-view"
+            v-if="!row.readStatus"
+            @click="handleAddOrEdit(row)"
+          >
+            首工序下达
+          </el-link>
+        </template> -->
+      </ele-pro-table>
+    </div>
+  </div>
+</template>
+<script>
+  import { h } from 'vue';
+  import {
+    getList,
+    getListPage,
+    updateFirstProcessDeliveryTime
+  } from '@/api/boss/index.js';
+  import { mapGetters } from 'vuex';
+  import { getColumns } from './columns.js';
+  import datasss from './data.js';
+  import { getRecords } from '@/utils/util';
+
+  export default {
+    data() {
+      return {
+        tableKey: '',
+        datasss: datasss,
+        timeSearch: null,
+        params: {
+          startDate: '',
+          endDate: '',
+          customerId: '',
+          projectId: '',
+          orderNo: '',
+          customerName: '',
+          projectName: ''
+        },
+        columns: [],
+        orderObj: {
+          0: '未提交',
+          1: '审核中',
+          2: '已审核',
+          3: '审核未通过',
+          7: '作废'
+        },
+        statusObj: {
+          0: '未发货',
+          1: '部分发货',
+          2: '全部发货'
+        },
+
+        firstTime: '',
+        records: []
+      };
+    },
+    computed: {
+      ...mapGetters(['user']),
+      // 是否开启响应式布局
+      styleResponsive() {
+        return this.$store.state.theme.styleResponsive;
+      }
+    },
+
+    methods: {
+      reload(type) {
+        if (this.timeSearch) {
+          this.params.startDate = this.timeSearch[0];
+          this.params.endDate = this.timeSearch[1];
+        }
+        if (type == 'reset') {
+          this.params = {
+            startDate: '',
+            endDate: '',
+            customerId: '',
+            projectId: '',
+            orderNo: ''
+          };
+        }
+        console.log(this.params);
+
+        // this.tableKey= Math.random();
+
+        this.$refs.table.reload({ page: 1, where: this.params });
+        this.$refs.table.reRenderTable();
+      },
+      async datasource({ page, where, limit, ...row }) {
+        console.log(where);
+
+        const result = await getListPage({
+          ...where,
+          pageNum: page,
+          size: limit
+        });
+
+        // this.columns = getColumns(this);
+        this.reRenderTable();
+        this.getRecords(result.list);
+        return result;
+      },
+      //   表格默认样式有padding，取消这个padding，让拆分的表格下border占满整行
+      getParentElement() {
+        let arr = document.querySelectorAll('.outlineBox');
+        if (!arr.length) return;
+        arr.forEach((childElement) => {
+          const parentElement = childElement.parentNode;
+          parentElement.style.padding = '0';
+        });
+      },
+
+      editFirstTime(rowindex, item, index) {
+        item.isEdit = !item.isEdit;
+      },
+      //   选择首工序的时间
+      async handleDateChange(e, item) {
+        console.log(e);
+        console.log(item);
+        await updateFirstProcessDeliveryTime({
+          id: item.id,
+          processDeliveryTime: e
+        });
+        item.firstProcessDeliveryTime = e;
+        item.isEdit = false;
+      },
+      //   重新渲染表格，获取每行的高度，给拆分的表格使用
+      reRenderTable() {
+        this.$nextTick(() => {
+          const trElements =
+            this.$refs.table.$el.querySelectorAll('.el-table__row');
+
+          const kk = [...new Set(trElements)];
+
+          trElements.forEach((tr) => {
+            // console.log(tr);
+            const trHeight = tr.offsetHeight;
+            const divs = tr.querySelectorAll('.outlineBox');
+            divs.forEach((div) => {
+              div.style.height = `${trHeight}px`;
+            });
+          });
+          this.getParentElement();
+        });
+      },
+      //   列筛选时，重新渲染
+      handleColumnsChange(columns) {
+        this.$refs.table.reRenderTable();
+        // this.reRenderTable();
+      },
+      //   处理发货的数据，给columns.js中列的formatter使用
+      getRecords(data) {
+        this.records = [];
+        data.forEach((item) => {
+          this.records.push(getRecords(item.deliveryRecords));
+        });
+      },
+      done(res) {
+        console.log('done');
+        this.$refs.table.reRenderTable();
+        this.$nextTick(() => {
+          this.reRenderTable();
+        });
+      },
+      handleMouseEnter(e) {
+        console.log(e);
+
+        console.log(e.target.scrollWidth, e.target.clientWidth);
+
+        if (e.target.clientWidth < e.target.scrollWidth) {
+          this.$tooltip.show(e.target, e.target.innerText);
+        }
+
+        // this.$tooltip.show(e.target, e.target.innerText);
+      },
+      handleMouseLeave() {
+        this.$tooltip.hide();
+      },
+
+      //打开工艺路线详情
+      produceRouting(row) {
+        this.$refs.drawer.open({
+          title: '工艺路线详情',
+          width: '80%',
+          row: row
+        });
+      }
+    },
+
+    mounted() {
+      //   this.$nextTick(() => {
+      //     this.reRenderTable();
+      //   });
+      this.$store.dispatch('theme/setBodyFullscreen', true);
+    },
+    beforeDestroy() {
+      this.$store.dispatch('theme/setBodyFullscreen', false);
+    },
+    created() {
+      //   this.timer = Math.random();
+      // this.getRecords()
+      //   console.log(h);
+      this.columns = getColumns(this);
+    },
+    beforeUpdate() {
+      // this.time = new Date().getTime();
+      console.log('更新');
+    }
+  };
+</script>
+<style lang="scss" scoped>
+  .app-container {
+    background: #f0f3f3;
+    min-height: calc(100vh - 84px);
+  }
+
+  .zw-page-table {
+    background: #ffffff;
+    padding-top: 20px;
+  }
+
+  .pagination-wrap {
+    display: flex;
+    justify-content: flex-end;
+    padding: 10px 0;
+  }
+
+  .table {
+    width: 100%;
+    margin-top: 10px;
+  }
+  .outline {
+    width: 100%;
+    // min-width: 1px;
+    position: relative;
+    border-bottom: 1px solid #e5e5e5;
+    // display: flex;
+    // align-items: center;
+  }
+  .outlineBox .outline:last-child {
+    border-bottom: none;
+  }
+
+  .xiada {
+    position: absolute;
+    top: 50%;
+    right: 0;
+    transform: translateY(-50%);
+  }
+
+  .records {
+    display: flex;
+  }
+
+  //
+  :deep(.spanbox) {
+    display: flex;
+    flex-wrap: wrap;
+  }
+
+  :deep(.span) {
+    flex: 1;
+  }
+
+  .flex-col {
+    display: flex;
+    flex-direction: column;
+    .col {
+      flex: 1;
+      align-content: center;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+      overflow: hidden;
+    }
+  }
+
+  //   :deep(.el-table) {
+  //     position: relative;
+  //     overflow: visible !important;
+
+  //     // 创建占位元素
+  //     &::before {
+  //       content: '';
+  //       display: block;
+  //       height: 17px; // 滚动条高度
+  //       width: 100%;
+  //       position: absolute;
+  //       top: 0;
+  //       left: 0;
+  //       z-index: 1;
+  //     }
+
+  //     // 调整滚动条位置
+  //     .el-scrollbar__wrap {
+  //       transform: translateY(-50px); // 滚动条高度
+  //       margin-bottom: 0 !important;
+  //     }
+  //   }
+
+  //   :deep(.el-table__row--striped) {
+  //     background-color: rgb(66, 166, 212) !important;
+
+  //     // background-color: rga230, 247, 255 !important;
+  //   }
+  :deep(.el-table__row) {
+    /* 确保没有动态增加的 padding 或 margin */
+    padding: 0;
+    margin: 0;
+  }
+
+  :deep(.el-card__body) {
+    padding: 15px 15px 0 15px;
+  }
+
+  .ele-body {
+    height: calc(100vh - 95px);
+
+    .ele-table-container {
+      height: 100%;
+      :deep(.el-card__body) {
+        padding: 0.3vw;
+      }
+      // :deep(.el-card__header) {
+      //   padding: 20px;
+      // }
+
+      :deep(.ele-table-tool-default) {
+        padding: 0 15px;
+      }
+
+      :deep(.has-gutter) {
+        height: 50px;
+      }
+
+      :deep(.el-table__header) {
+        height: 50px;
+        // background-color: #615fe7;
+      }
+
+      :deep(.ele-pro-table) {
+        height: 99%;
+      }
+      :deep(.el-table) {
+        // font-size: 0.62vw;
+      }
+    }
+  }
+</style>