fix: 效率管理

src/api/project/project-api.js

@@ -36,7 +36,7 @@ export const projectApi = {
 
   //获取任务管理
   getTaskInfo: (params) => {
-    return getRequest(`/mate/delivery/task/permission/queryPage?`);
+    return getRequest(`/mate/delivery/task/permission/queryPage`);
   },
 
   //新增单项目任务管理

src/views/project/efficiency-manage/progress-track/index.vue

@@ -1,76 +1,76 @@
 <template>
-    <div class="progress-track">
-        <div id="ganttContainer" style="height: 600px; width: 100%"></div>
-    </div>
+  <div class="progress-track">
+    <div id="ganttContainer" style="height: 800px; width: 100%"></div>
+  </div>
 </template>
 <script setup>
-import { onMounted, ref } from 'vue';
-import { gantt } from "dhtmlx-gantt";
-import { projectApi } from '/@/api/project/project-api.js';
-import "dhtmlx-gantt/codebase/dhtmlxgantt.css";
+  import { onMounted, ref } from 'vue';
+  import { gantt } from 'dhtmlx-gantt';
+  import { projectApi } from '/@/api/project/project-api.js';
+  import 'dhtmlx-gantt/codebase/dhtmlxgantt.css';
 
-const taskData = ref([])
+  const taskData = ref([]);
 
-onMounted(() => {
-    projectApi.getTrackInfo().then(res => {
-        taskData.value = res.data
-        initGantt()
-        gantt.init(document.getElementById("ganttContainer"));
-        const today = gantt.posFromDate(new Date());
-        gantt.scrollLayoutCell("timeline", today - 400);
-    })
-});
+  onMounted(() => {
+    projectApi.getTrackInfo().then((res) => {
+      taskData.value = res.data;
+      initGantt();
+      gantt.init(document.getElementById('ganttContainer'));
+      const today = gantt.posFromDate(new Date());
+      gantt.scrollLayoutCell('timeline', today - 400);
+    });
+  });
 
-function initGantt() {
+  function initGantt() {
     gantt.clearAll();
     // 设置中文
-    gantt.i18n.setLocale("cn");
+    gantt.i18n.setLocale('cn');
 
     // 设置插件
     gantt.plugins({
-        marker: true,
-        drag_timeline: true,
+      marker: true,
+      drag_timeline: true,
     });
 
     // 设置今天标记
     gantt.addMarker({
-        start_date: new Date(),
-        css: "today",
-        text:
-            // <span style="margin-bottom: 2px">${new Date().getDate()}</span>
-            `
+      start_date: new Date(),
+      css: 'today',
+      text:
+        // <span style="margin-bottom: 2px">${new Date().getDate()}</span>
+        `
                         <span>今天</span>
                     `,
     });
     // 设置滚动条
     gantt.config.layout = {
-        css: "gantt_container",
-        cols: [
-            {
-                width: 400,
-                minWidth: 200,
-                maxWidth: 600,
+      css: 'gantt_container',
+      cols: [
+        {
+          width: 400,
+          minWidth: 200,
+          maxWidth: 600,
 
-                // adding horizontal scrollbar to the grid via the scrollX attribute
-                rows: [
-                    {
-                        view: "grid",
-                        scrollX: "gridScroll",
-                        scrollable: true,
-                        scrollY: "scrollVer",
-                    },
-                    { view: "scrollbar", id: "gridScroll" },
-                ],
-            },
-            { resizer: true, width: 1 },
+          // adding horizontal scrollbar to the grid via the scrollX attribute
+          rows: [
             {
-                rows: [
-                    { view: "timeline", scrollX: "scrollHor", scrollY: "scrollVer" },
-                    { view: "scrollbar", id: "scrollHor" },
-                ],
+              view: 'grid',
+              scrollX: 'gridScroll',
+              scrollable: true,
+              scrollY: 'scrollVer',
             },
-            { view: "scrollbar", id: "scrollVer" },
-        ],
+            { view: 'scrollbar', id: 'gridScroll' },
+          ],
+        },
+        { resizer: true, width: 1 },
+        {
+          rows: [
+            { view: 'timeline', scrollX: 'scrollHor', scrollY: 'scrollVer' },
+            { view: 'scrollbar', id: 'scrollHor' },
+          ],
+        },
+        { view: 'scrollbar', id: 'scrollVer' },
+      ],
     };
 
     // tasks: [
@@ -89,83 +89,82 @@ function initGantt() {
     //     ],
     console.log('taskData.value', taskData.value);
     const tasks = taskData.value.map((item) => {
-        return {
-            open: true,
-            id: item.id,
-            key: item.key,
-            parent: item.parent,
-            text: "",
-            nodeName: item.nodeName,
-            planStartDate: item.planStartDate,
-            planEndDate: item.planEndDate,
-            start_date: new Date(item.planStartDate),
-            end_date: new Date(item.planEndDate),
-            actualStartDate: item.actualStartDate ? new Date(item.actualStartDate) : '/',
-            actualEndDate: item.actualEndDate ? new Date(item.actualEndDate) : '/',
-            // color: "#F1F1F5",
-            // progress_color: "#001529",
-            bar_height: 25,
-            progress: item.progress,
-        };
+      return {
+        // open: true,
+        id: item.id,
+        key: item.key,
+        parent: item.parent,
+        text: '',
+        nodeName: item.nodeName,
+        planStartDate: item.planStartDate,
+        planEndDate: item.planEndDate,
+        start_date: new Date(item.planStartDate),
+        end_date: new Date(item.planEndDate),
+        actualStartDate: item.actualStartDate ? new Date(item.actualStartDate) : '/',
+        actualEndDate: item.actualEndDate ? new Date(item.actualEndDate) : '/',
+        // color: "#F1F1F5",
+        // progress_color: "#001529",
+        bar_height: 25,
+        progress: item.progress,
+      };
     });
     console.log('tasks', tasks);
 
     gantt.parse({
-        tasks
-        // tasks: taskData.value
+      tasks,
+      // tasks: taskData.value
     });
 
     // 定义列
     gantt.config.columns = [
-        {
-            align: "center",
-            name: "key",
-            label: "序号",
-            width: "100",
-            tree: true,
-        },
-        {
-            align: "left",
-            name: "nodeName",
-            label: "节点名称",
-            width: "150",
-            template: function (item) {
-                console.log('item', item);
-                if (item.parent === 0) {
-                    return `<div style="font-size: 16px;color: #1677ff;font-weight: bold" >
+      {
+        align: 'center',
+        name: 'key',
+        label: '序号',
+        width: '100',
+        tree: true,
+      },
+      {
+        align: 'left',
+        name: 'nodeName',
+        label: '节点名称',
+        width: '150',
+        template: function (item) {
+          if (item.parent === 0) {
+            return `<div style="font-size: 16px;color: #1677ff;font-weight: bold" >
                              ${item.nodeName}
                             </div>`;
-                } else {
-                    return `<div title="${item.nodeName}">
+          } else {
+            return `<div title="${item.nodeName}">
                                ${item.nodeName}
                             </div>`;
-                }
-            },
-        },
-        {
-            align: "center",
-            name: "planStartDate",
-            label: "计划开始日期",
-            width: "120",
-        },
-        {
-            align: "center",
-            name: "planEndDate",
-            label: "计划完成日期",
-            width: "120",
-        },
-        {
-            align: "center",
-            name: "actualStartDate",
-            label: "实际开始日期",
-            width: "120",
-        },
-        {
-            align: "center",
-            name: "actualEndDate",
-            label: "实际完成日期",
-            width: "120",
+          }
         },
+      },
+      {
+        align: 'center',
+        name: 'planStartDate',
+        label: '计划开始日期',
+        width: '120',
+      },
+      {
+        align: 'center',
+        name: 'planEndDate',
+        label: '计划完成日期',
+        width: '120',
+      },
+      {
+        align: 'center',
+        name: 'actualStartDate',
+        label: '实际开始日期',
+        width: '120',
+      },
+      {
+        align: 'center',
+        name: 'actualEndDate',
+        label: '实际完成日期',
+        width: '120',
+      },
     ];
 
     // 定义时间
@@ -175,18 +174,18 @@ function initGantt() {
     //     { unit: "week", step: 1, format: "%j" }
     // ];
     var dateGroup = function (date) {
-        var dateToStr = gantt.date.date_to_str("%d");
-        var start = gantt.date.add(date, 0, "day");
-        var end = gantt.date.add(date, 2, "day");
-        return dateToStr(start) + " - " + dateToStr(end);
+      var dateToStr = gantt.date.date_to_str('%d');
+      var start = gantt.date.add(date, 0, 'day');
+      var end = gantt.date.add(date, 2, 'day');
+      return dateToStr(start) + ' - ' + dateToStr(end);
     };
     gantt.config.scales = [
-        { unit: "month", step: 1, format: "%Y-%m" },
-        {
-            unit: "day",
-            step: 2,
-            format: dateGroup,
-        },
+      { unit: 'month', step: 1, format: '%Y-%m' },
+      {
+        unit: 'day',
+        step: 2,
+        format: dateGroup,
+      },
     ];
 
     // 自适应
@@ -200,12 +199,11 @@ function initGantt() {
 
     // 设置行高
     gantt.config.row_height = 40;
-}
-
+  }
 </script>
 <style scoped lang="less">
-.progress-track {
+  .progress-track {
     height: 100%;
     width: 100%;
-}
-</style>
+  }
+</style>