1.递交

小小儁爺

2026-01-21 4fbd0c98d22c2ce6eabfcb507c13c6c9ce77492d

 src/views/gantt/index.vue

@@ -20,7 +20,7 @@
        size="mini"
        style="margin-left: 10px;"
        placeholder="请选择"
        @change="prepareArrange"
        @change="priorityMethodChange"
      >
        <el-option
          v-for="item in priorityMethodArr"
@@ -46,6 +46,13 @@
      </el-button>
      <el-button size="mini" @click="handleClearSelection">
        清空复选框选择
      </el-button>

      <el-button size="mini" type="primary" @click="prepareArrange">
        预排
      </el-button>
      <el-button size="mini" disabled>
        预排进度：{{ canArrangeNumber }}/{{ needArrangeNumber }}
      </el-button>

    </div>
@@ -83,7 +90,7 @@
        { code: '360min', name: '360min' }
      ],
      scaleValue: '240min',
      ganttDateRange: ['2026-01-20', '2026-01-25'],
      ganttDateRange: ['2026-01-21', '2026-01-22'], // '2026-01-20', '2026-01-25'
      selectedIds: [],
      // 分页相关数据
      currentPage: 1,
@@ -94,6 +101,7 @@

      fivePeriodsTimeName: ['OneStartDate', 'TwoStartDate', 'ThreeStartDate', 'FourStartDate', 'FiveStartDate'], // 五个时间段的键名
      needArrangeNumber: 5000, // 假设需要排产数量5000
      canArrangeNumber: 0, // 能排数量默认为 0
      priorityMethod: 'device', // device 设备   time  时间
      priorityMethodArr: [
        { code: 'device', name: '设备优先' },
@@ -115,7 +123,6 @@

    initGantt() {
      gantt.plugins({

        critical_path: true,
        drag_timeline: true,
        grouping: true,
@@ -137,37 +144,9 @@

      gantt.config.row_height = 32 // 行高
      gantt.config.bar_height = 20 // bar高

      gantt.config.xml_date = '%Y-%m-%d %H:%i' // gantt的日期格式

      gantt.config.drag_progress = false // 禁止通过拖动进度条改变任务进度

      gantt.config.readonly = true // 只读模式

      /* ↓↓↓ Group configuration ↓↓↓ */
      gantt.serverList('task_priority', [
        { key: 1, label: '高' },
        { key: 2, label: '中等' },
        { key: 3, label: '低' }
      ])

      gantt.serverList('task_status', [
        { key: 1, label: 'Planning' },
        { key: 2, label: 'Not started' },
        { key: 3, label: 'In Progress' },
        { key: 4, label: 'Complete' }
      ])

      function byId(list, id) {
        for (let i = 0; i < list.length; i++) {
          if (list[i].key == id) {
            return list[i].label || ''
          }
        }
        return ''
      }

      /* ↑↑↑ Group configuration ↑↑↑ */

      // 刻度值改变
      this.changeTimeScale()
@@ -252,13 +231,7 @@
      ]
      /* ↑↑↑ Grid Columns configuration ↑↑↑ */

      // 汉化窗口

      // gantt.config.order_branch = true
      // gantt.config.open_tree_initially = true

      gantt.config.show_errors = false // 发生异常时，不允许弹出警告到 UI 界面

      gantt.config.grid_elastic_columns = true

      // 自定义浮动框的显示内容   tooltip浮动框显示的End Date被追加1的问题修复（应该显示数据库的原始值）
@@ -267,7 +240,7 @@
        // return '<b>任务:</b> ' + task.text + '<br/><b>开始时间:</b> ' + `${gantt.date.date_to_str('%Y-%m-%d')(start)}` + '<br/><b>结束时间:</b> ' + handleDateReduceOneDay(end)
        // return '<b>任务:</b> ' + task.text + '<br/><b>开始时间:</b> ' + handleDatetime2(start) + '<br/><b>结束时间:</b> ' + handleDateReduceOneDay(end) + '<br/><b>进度:</b> ' + task.progress * 100 + '%'
        return '<b>任务:</b> ' + task.text +
          '<br/><b>生产数量:</b> ' + task.producedCount +
          '<br/><b>' + `${task.type === 'task' ? '产能' : '生产数量'}` + ' :</b> ' + task.producedCount +
          '<br/><b>进度:</b> ' + task.progress * 100 + '%' +
          '<br/><b>开始时间:</b> ' + handleDatetime2(start) +
          '<br/><b>结束时间:</b> ' + handleDatetime2(end)
@@ -520,7 +493,8 @@
                text: '任务名称预留',
                partName: it.AdvaDevicName,
                partCode: it.AdvaDevicNumber,
                // start_date: item.YearDate + ' ' + it.OneStartDate.split('~')[0],
                start_date: handleDatetime2(item.YearDate + ' ' + it.OneStartDate.split('~')[0]), // 这个是无效的，只是为了预排prepareArrange方法里面不报错
                end_date: handleDatetime2(item.YearDate + ' ' + it.OneStartDate.split('~')[1]), // 这个是无效的，只是为了预排prepareArrange方法里面不报错
                // duration: this.calculateTimeRangeInMinutes(it.OneStartDate),
                render: 'split', // 用于在一个工作时间段内显示不下，需要进行分割显示
                checked: false,
@@ -542,6 +516,7 @@
                  partName: it.AdvaDevicName,
                  partCode: it.AdvaDevicNumber,
                  start_date: handleDatetime2(item.YearDate + ' ' + it[this.fivePeriodsTimeName[i]].split('~')[0]),
                  end_date: handleDatetime2(item.YearDate + ' ' + it[this.fivePeriodsTimeName[i]].split('~')[1]),
                  duration,
                  checked: false,
                  progress: 0,
@@ -561,233 +536,11 @@
      // 使用原有的示例数据作为基础
      this.allTasks = newArr

      const dataBack = [
        {
          'id': 1,
          'text': '工单:MO-2025-05-001',
          saleOrder: 'SO-2025-05001',
          'calendar_id': 'customCalendar1',
          partName: '跑步机',
          partCode: 'Run01',
          description: '排产数量:500 报工数量:100 进度:20%',
          'type': 'project',
          'start_date': '2025-04-02 00:00',
          // 'duration': 5,
          'progress': 0.2,
          'parent': 0,
          'checked': false
          // render: 'split'
        },
        {
          'id': 2,
          'text': '工序:切割',
          saleOrder: 'SO-2025-05001',
          'calendar_id': 'customCalendar1',
          partName: '跑步机',
          partCode: 'Run01',
          description: '排产数量:500 报工数量:100 进度:20%',
          'type': 'project',
          'start_date': '2025-04-02 00:00',
          'duration': 2,
          'progress': 0.2,
          'parent': '1',
          checked: false
        },
        {
          'id': 3,
          'text': '设备:金工车间1号设备',
          saleOrder: 'SO-2025-05001',
          'calendar_id': 'customCalendar1',
          partName: '跑步机',
          partCode: 'Run01',
          description: '排产数量:500 报工数量:100 进度:20%',
          'type': 'task',
          'start_date': '2025-04-07 00:00',
          'parent': '2',
          'duration': 4,
          'progress': 0,
          checked: false
        },
        {
          'id': 4,
          'text': '设备:金工车间2号设备',
          saleOrder: 'SO-2025-05001',
          'calendar_id': 'customCalendar1',
          partName: '跑步机',
          partCode: 'Run01',
          description: '排产数量:500 报工数量:100 进度:20%',
          'type': 'task',
          'start_date': '2025-04-15 00:00',
          'parent': '2',
          'duration': 3,
          'progress': 0,
          checked: false
        },
        {
          'id': 5,
          'text': '工单:MO-2025-05-002',
          saleOrder: 'SO-2025-05002',
          'calendar_id': 'customCalendar1',
          partName: '走步机',
          partCode: 'W01',
          description: '排产数量:1000 报工数量:500 进度:50%',
          'type': 'project',
          'start_date': '2025-04-02 00:00',
          // 'duration': 5,
          'progress': 0.5,
          'parent': 0,
          'checked': false
          // render: 'split'
        },
        {
          'id': 6,
          'text': '工序:切割',
          saleOrder: 'SO-2025-05002',
          'calendar_id': 'customCalendar1',
          partName: '走步机',
          partCode: 'W01',
          description: '排产数量:1000 报工数量:500 进度:50%',
          'type': 'project',
          'start_date': '2025-04-02 00:00',
          'duration': 5,
          'progress': 0.5,
          'parent': '5',
          checked: false
        },
        {
          'id': 7,
          'text': '设备:金工车间3号设备',
          saleOrder: 'SO-2025-05002',
          partName: '走步机',
          'calendar_id': 'customCalendar1',
          partCode: 'W01',
          description: '排产数量:1000 报工数量:500 进度:50%',
          'type': 'task',
          'start_date': '2025-04-07 06:23',
          'parent': '6',
          'duration': 3,
          'progress': 0,
          checked: false
        },
        {
          'id': 8,
          'text': '设备:金工车间4号设备',
          saleOrder: 'SO-2025-05002',
          partName: '走步机',
          partCode: 'W01',
          'calendar_id': 'customCalendar1',
          description: '排产数量:1000 报工数量:600 进度:60%',
          'type': 'task',
          render: 'split', // 用于在一个工作时间段内显示不下，需要进行分割显示
          'start_date': '2025-04-12 00:00',
          'parent': '6',
          'duration': 4,
          'progress': 0,
          checked: false
        },
      this.totalTasks = this.allTasks.length
      this.updatePaginatedTasks()
      this.renderGanttChart()

        {
          'id': 11,
          'text': '设备:金工车间4号设备',
          saleOrder: 'SO-2025-05002',
          partName: '走步机',
          partCode: 'W01',
          'calendar_id': 'customCalendar1',
          description: '排产数量:1000 报工数量:600 进度:60%',
          'type': 'task',

          'start_date': '2025-04-14 00:00',
          'parent': '8',
          'duration': 3,
          'progress': 0,
          checked: false
        },

        {
          'id': 12,
          'text': '设备:金工车间4号设备',
          saleOrder: 'SO-2025-05002',
          partName: '走步机',
          partCode: 'W01',
          'calendar_id': 'customCalendar1',
          description: '排产数量:1000 报工数量:600 进度:60%',
          'type': 'task',
          'start_date': '2025-04-18 00:00',
          'parent': '8',
          'duration': 1,
          'progress': 0,
          checked: false
        },

        {
          'id': 13,
          'text': '设备:金工车间4号设备',
          saleOrder: 'SO-2025-05002',
          partName: '走步机',
          partCode: 'W01',
          'calendar_id': 'customCalendar1',
          description: '排产数量:1000 报工数量:600 进度:60%',
          'type': 'task',
          'start_date': '2025-04-10 02:50',
          'parent': '8',
          'duration': 2,
          'progress': 0,
          checked: false
        },
        {
          'id': 10,
          'text': '设备:金工车间4号设备',
          saleOrder: 'SO-2025-05002',
          partName: '走步机',
          partCode: 'W01',
          'calendar_id': 'customCalendar1',
          description: '排产数量:1000 报工数量:600 进度:60%',
          'type': 'task3',
          'start_date': '2025-04-10 06:24',
          'parent': '8',
          'duration': 1,
          'progress': 0,
          checked: false
        },
        {
          'id': 14,
          'text': '设备:金工车间4号设备',
          saleOrder: 'SO-2025-05002',
          partName: '走步机',
          partCode: 'W01',
          'calendar_id': 'customCalendar1',
          description: '排产数量:1000 报工数量:600 进度:60%',
          'type': 'task2',

          'start_date': '2025-04-11 06:24',
          'parent': '8',
          'duration': 1,
          'progress': 0,
          checked: false
        },

        {
          'id': 9,
          'text': '设备:金工车间5号设备',
          saleOrder: 'SO-2025-05002',
          partName: '走步机',
          partCode: 'W01',
          'calendar_id': 'customCalendar1',
          description: '排产数量:1000 报工数量:400 进度:40%',
          'type': 'task',
          'start_date': '2025-04-10 00:00',
          'parent': '6',
          'duration': 3,
          'progress': 0,
          checked: false
        }
      ]

      // this.totalTasks = this.allTasks.length
      // this.updatePaginatedTasks()
      // this.renderGanttChart()

      this.prepareArrange()
      // this.prepareArrange()
    },

    // 更新分页后的任务数据
@@ -856,7 +609,8 @@
      gantt.config.end_date = new Date(this.ganttDateRange[1] + ' 24:00')
      gantt.config.scales = scaleConfig
      if (boolean) {
        gantt.render()// gantt重绘
        // gantt.render()// gantt重绘
        this.renderGanttChart()
      }
    },

@@ -900,6 +654,7 @@
    },
    // 甘特图日期改变
    ganttDateRangeChange(val) {
      this.priorityMethodChange()// 清空已排值
      gantt.config.start_date = new Date(val[0] + ' 00:00')
      gantt.config.end_date = new Date(val[1] + ' 24:00')
      gantt.render()
@@ -949,7 +704,10 @@
    },
    // 预排
    prepareArrange() {
      this.allTasks = this.allTasks.filter(i => i.type !== 'task2')
      this.priorityMethodChange()

      this.loadTasks()

      // 优先方式  time  device
      if (this.priorityMethod === 'time') {
        this.allTasks.sort((a, b) => a.start_date - b.start_date)
@@ -961,30 +719,62 @@
      }

      const newArr = []
      // this.canArrangeNumber = 0
      let needArrangeNumber = this.needArrangeNumber
      this.allTasks.forEach(item => {
        if (item.type === 'task') {
        // if (item.type === 'task') { // 这里的判断条件还得加个日期判断
        if (item.type === 'task' &&
          new Date(item.start_date).getTime() >= new Date(this.ganttDateRange[0] + ' 00:00:00').getTime() &&
          new Date(item.end_date).getTime() >= new Date().getTime()) { // 这里的判断条件还得加个日期判断 结束时间要大于目前时间
          console.log(JSON.parse(JSON.stringify(item)))
          const count = needArrangeNumber > 0 && needArrangeNumber <= item.producedCount ? needArrangeNumber : item.producedCount
          needArrangeNumber = needArrangeNumber - item.producedCount // 剩余待排值
          if (count > 0 && (needArrangeNumber > 0 || Math.abs(needArrangeNumber) < item.producedCount)) { // 一定是大于零且小于整条的生产值的
            // duration  最后一条的数据应该是通过计算得出时间长度的
            const duration = (count / (item.AdvaDevicCropMob / 100)) * item.AdvaDevicRhythm / 60
            newArr.push({

          let ratio = 1 // 默认系数 1
          if (new Date(item.start_date).getTime() < new Date().getTime() && new Date(item.end_date).getTime() >= new Date().getTime()) {
            const d = this.calculateTimeRangeInMinutes(handleDatetime2(new Date()).split('  ')[1] + '~' + handleDatetime2(item.end_date).split('  ')[1])
            ratio = Math.round((d / item.duration) * 100) / 100
            console.log(ratio, 'ratio')
          }

          // 这个地方的count值 得变更  item.producedCount  得乘以个系数  默认系数 1
          const count = needArrangeNumber > 0 && needArrangeNumber <= item.producedCount * ratio ? needArrangeNumber : item.producedCount * ratio
          needArrangeNumber = needArrangeNumber - item.producedCount * ratio // 剩余待排值

          if (count > 0 && (needArrangeNumber > 0 || Math.abs(needArrangeNumber) < item.producedCount * ratio)) { // 一定是大于零且小于整条的生产值的
            // duration   单位 分钟
            let duration = (count / (item.AdvaDevicCropMob / 100)) * item.AdvaDevicRhythm / 60
            if (count < item.producedCount && new Date().getTime() <= new Date(item.start_date)) {
              // console.log('执行1111')
              duration = duration * (count / item.producedCount)
              // item.end_date = '2026-01-24  11:00:00'
            }
            // console.log(duration, 'duration')

            const obj = {
              id: nanoid(),
              type: 'task2',
              text: '任务名称111',
              partName: item.partName,
              partCode: item.partCode,
              start_date: handleDatetime2(item.start_date),
              // duration: item.duration,
              duration: duration,
              start_date: new Date(item.start_date).getTime() < new Date().getTime() ? handleDatetime2(new Date()) : handleDatetime2(item.start_date),
              // end_date: handleDatetime2(item.end_date),
              // end_date: item.end_date,
              duration, // 代表的是进度条
              checked: false,
              progress: 0,
              parent: item.parent,
              saleOrder: item.saleOrder,
              producedCount: count <= item.producedCount ? count : item.producedCount
            })
              producedCount: count <= item.producedCount ? Math.round(count) : item.producedCount
              // producedCount: count <= item.producedCount ? count : item.producedCount
            }
            this.canArrangeNumber += parseFloat(obj.producedCount)
            console.log(this.canArrangeNumber)
            if (Math.abs(this.canArrangeNumber - this.needArrangeNumber) === 1) {
              obj.producedCount = obj.producedCount + (this.needArrangeNumber - this.canArrangeNumber)
            }

            // 这个地方得加个逻辑，得根据世间日期进行push   下午研究一下

            newArr.push({ ...obj })
          }
        }
      })
@@ -1003,6 +793,14 @@
      this.totalTasks = this.allTasks.length
      this.updatePaginatedTasks()
      this.renderGanttChart()
    },
    // 清空已排值
    priorityMethodChange() {
      this.canArrangeNumber = 0
      this.allTasks = this.allTasks.filter(i => i.type !== 'task2')
      this.totalTasks = this.allTasks.length
      this.updatePaginatedTasks()
      this.renderGanttChart()
    }

  }