feature/bug修改

index.html

@@ -59,9 +59,92 @@
     }
     /* 甘特图样式控制 */
     .gantt_task_line {
-      border-radius: 15px !important;
+      border-radius: 20px !important;
       border: 0px solid black;
     }
+    .gantt_tooltip {
+      font-size: 15px;
+      font-weight: 300;
+    }
+    .gantt_tree_content {
+      font-size: 15px !important;
+    }
+    .gantt_grid_data {
+      background-color: rgba(0, 0, 0, 0.1);
+      .gantt_row_task {
+        background-color: rgba(0, 0, 0, 0.1) !important;
+      }
+      .odd {
+        background-color: rgba(0, 0, 0, 0.2) !important;
+      }
+      .gantt_row:hover {
+        background-color: rgba(0, 0, 0, 0.4) !important;
+      }
+      .gantt_selected {
+        background-color: rgb(123, 123, 123) !important;
+      }
+    }
+    .gantt_task {
+      .gantt_selected {
+        background-color: rgb(123, 123, 123);
+        .gantt_task_cell {
+          border-color: white;
+        }
+      }
+    }
+    .gantt_data_area {
+      background-color: rgba(0, 0, 0, 0.1);
+      .gantt_task_cell {
+        background-color: rgba(0, 0, 0, 0.1);
+        border-color: white;
+      }
+    }
+    .year {
+      background: #ffcc00;
+      color: #fff !important;
+      font-size: 16px;
+    }
+    .month {
+      background: #66ccff;
+      color: #fff !important;
+      font-size: 16px;
+    }
+    .day {
+      background: #abe4ff;
+      color: #fff !important;
+      font-size: 16px;
+    }
+    .hour {
+      background: #0bb051;
+      color: #fff !important;
+      font-size: 16px;
+    }
+    .gantt_grid_head_cell {
+      font-size: 16px;
+      color: white !important;
+      font-weight: 600;
+      border: 1px solid rgb(206, 206, 206);
+      background-color: rgb(48, 65, 86, 0.6);
+    }
+
+    /* 滚动条样式 */
+    ::-webkit-scrollbar {
+      width: 6px !important; /* 设置滚动条的宽度 */
+    }
+
+    ::-webkit-scrollbar-track {
+      background-color: #f0f2f5; /* 滚动条轨道的背景色 */
+    }
+
+    ::-webkit-scrollbar-thumb {
+      background-color: #90939960; /* 滚动条的颜色 */
+      border-radius: 8px !important; /* 滚动条的圆角 */
+    }
+
+    ::-webkit-scrollbar-thumb:hover {
+      background-color: #5a5e66; /* 滚动条hover时的颜色 */
+    }
+
     @keyframes l19 {
       100% {
         transform: rotate(360deg);

src/views/report/productionScheduling/line/index.vue

@@ -7,8 +7,8 @@
       @search-reset="resetChange"
     />
     <div class="btns">
-      <el-button type="params" @click="exportToPNG">导出PNG图片</el-button>
-      <el-button type="params" @click="exportToPDF">导出PDF文件</el-button>
+      <el-button type="primary" @click="exportToPNG">导出PNG图片</el-button>
+      <el-button type="primary" @click="exportToPDF">导出PDF文件</el-button>
       <!-- <el-button type="params" v-print="printObj" @click="toPrint"
         >打印</el-button
       > -->
@@ -190,7 +190,7 @@ const initGantt = (type) => {
   });
   gantt.templates.task_text = function (start, end, task) {
     return (
-      "<span style='padding:0 5px;color: #000; display: inline-block;width: 100%; white-space: nowrap;overflow: hidden; text-overflow: ellipsis; '>" +
+      "<span style='padding:0 5px;font-size:15px;color: #000; display: inline-block;width: 100%; white-space: nowrap;overflow: hidden; text-overflow: ellipsis; '>" +
       task.text +
       "</span>"
     );
@@ -241,8 +241,8 @@ const initGantt = (type) => {
   ];
   gantt.config.autofit = true;
   gantt.config.resize_rows = true;
-  gantt.config.row_height = 40;
-  gantt.config.bar_height = 30;
+  gantt.config.row_height = 60;
+  gantt.config.bar_height = 40;
   gantt.config.min_column_width = 60;
   gantt.config.xml_date = "%Y-%m-%d %H:%i:%s"; //甘特图时间格式
   gantt.config.readonly = true; //是否只读
@@ -312,17 +312,37 @@ const setGantt = () => {
       gantt.config.duration_unit = "hour";
       gantt.config.scale_height = 28 * 4;
       gantt.config.scales = [
-        { unit: "year", step: 1, format: "%Y年" },
-        { unit: "month", step: 1, format: "%m月" },
+        {
+          unit: "year",
+          step: 1,
+          format: "%Y年",
+          css: function (date) {
+            return "year";
+          },
+        },
+        {
+          unit: "month",
+          step: 1,
+          format: "%m月",
+          css: function (date) {
+            return "month";
+          },
+        },
         {
           unit: "day",
           step: 1,
           format: "%d日",
+          css: function (date) {
+            return "day";
+          },
         },
         {
           unit: "hour",
           step: 1,
           format: "%H时",
+          css: function (date) {
+            return "hour";
+          },
         },
       ];
       gantt.init("gantt_here");
@@ -332,12 +352,29 @@ const setGantt = () => {
     case "1":
       gantt.config.scale_height = 28 * 4;
       gantt.config.scales = [
-        { unit: "year", step: 1, format: "%Y年" },
-        { unit: "month", step: 1, format: "%m月" },
+        {
+          unit: "year",
+          step: 1,
+          format: "%Y年",
+          css: function (date) {
+            return "year";
+          },
+        },
+        {
+          unit: "month",
+          step: 1,
+          format: "%m月",
+          css: function (date) {
+            return "month";
+          },
+        },
         {
           unit: "day",
           step: 1,
           format: "%d日",
+          css: function (date) {
+            return "day";
+          },
         },
       ];
       gantt.config.duration_unit = "day";
@@ -350,8 +387,22 @@ const setGantt = () => {
       // initGantt("month");
       gantt.config.scale_height = 28 * 4;
       gantt.config.scales = [
-        { unit: "year", step: 1, format: "%Y年" },
-        { unit: "month", step: 1, format: "%m月" },
+        {
+          unit: "year",
+          step: 1,
+          format: "%Y年",
+          css: function (date) {
+            return "year";
+          },
+        },
+        {
+          unit: "month",
+          step: 1,
+          format: "%m月",
+          css: function (date) {
+            return "month";
+          },
+        },
       ];
       gantt.config.duration_unit = "month";
       gantt.init("gantt_here");

src/views/report/productionScheduling/order/index.vue

@@ -7,8 +7,8 @@
       @search-reset="resetChange"
     />
     <div class="btns">
-      <el-button type="params" @click="exportToPNG">导出PNG图片</el-button>
-      <el-button type="params" @click="exportToPDF">导出PDF文件</el-button>
+      <el-button type="primary" @click="exportToPNG">导出PNG图片</el-button>
+      <el-button type="primary" @click="exportToPDF">导出PDF文件</el-button>
       <!-- <el-button type="params" v-print="printObj" @click="toPrint"
         >打印</el-button
       > -->
@@ -188,9 +188,10 @@ const initGantt = (type) => {
     critical_path: true,
     export_api: true,
   });
+
   gantt.templates.task_text = function (start, end, task) {
     return (
-      "<span style='padding:0 5px;color: #000; display: inline-block;width: 100%; white-space: nowrap;overflow: hidden; text-overflow: ellipsis; '>" +
+      "<span style='padding:0 5px;font-size:15px;color: #000; display: inline-block;width: 100%; white-space: nowrap;overflow: hidden; text-overflow: ellipsis; '>" +
       task.text +
       "</span>"
     );
@@ -212,7 +213,7 @@ const initGantt = (type) => {
   gantt.config.grid_width = 350;
   gantt.config.add_column = false;
   gantt.config.duration_step = 1;
-  gantt.config.drag_resize = true;
+  gantt.config.resize_rows = true;
   gantt.config.columns = [
     {
       tree: true,
@@ -241,8 +242,8 @@ const initGantt = (type) => {
   ];
   gantt.config.autofit = true;
   gantt.config.resize_rows = true;
-  gantt.config.row_height = 40;
-  gantt.config.bar_height = 30;
+  gantt.config.row_height = 60;
+  gantt.config.bar_height = 40;
   gantt.config.min_column_width = 60;
   gantt.config.xml_date = "%Y-%m-%d %H:%i:%s"; //甘特图时间格式
   gantt.config.readonly = true; //是否只读
@@ -312,17 +313,37 @@ const setGantt = () => {
       gantt.config.duration_unit = "hour";
       gantt.config.scale_height = 28 * 4;
       gantt.config.scales = [
-        { unit: "year", step: 1, format: "%Y年" },
-        { unit: "month", step: 1, format: "%m月" },
+        {
+          unit: "year",
+          step: 1,
+          format: "%Y年",
+          css: function (date) {
+            return "year";
+          },
+        },
+        {
+          unit: "month",
+          step: 1,
+          format: "%m月",
+          css: function (date) {
+            return "month";
+          },
+        },
         {
           unit: "day",
           step: 1,
           format: "%d日",
+          css: function (date) {
+            return "day";
+          },
         },
         {
           unit: "hour",
           step: 1,
           format: "%H时",
+          css: function (date) {
+            return "hour";
+          },
         },
       ];
       gantt.init("gantt_here");
@@ -332,16 +353,32 @@ const setGantt = () => {
     case "1":
       gantt.config.scale_height = 28 * 4;
       gantt.config.scales = [
-        { unit: "year", step: 1, format: "%Y年" },
-        { unit: "month", step: 1, format: "%m月" },
+        {
+          unit: "year",
+          step: 1,
+          format: "%Y年",
+          css: function (date) {
+            return "year";
+          },
+        },
+        {
+          unit: "month",
+          step: 1,
+          format: "%m月",
+          css: function (date) {
+            return "month";
+          },
+        },
         {
           unit: "day",
           step: 1,
           format: "%d日",
+          css: function (date) {
+            return "day";
+          },
         },
       ];
       gantt.config.duration_unit = "day";
-
       gantt.init("gantt_here");
       gantt.render();
       gantt.parse({ data: useData.value });
@@ -350,8 +387,22 @@ const setGantt = () => {
       // initGantt("month");
       gantt.config.scale_height = 28 * 4;
       gantt.config.scales = [
-        { unit: "year", step: 1, format: "%Y年" },
-        { unit: "month", step: 1, format: "%m月" },
+        {
+          unit: "year",
+          step: 1,
+          format: "%Y年",
+          css: function (date) {
+            return "year";
+          },
+        },
+        {
+          unit: "month",
+          step: 1,
+          format: "%m月",
+          css: function (date) {
+            return "month";
+          },
+        },
       ];
       gantt.config.duration_unit = "month";
       gantt.init("gantt_here");
@@ -374,7 +425,6 @@ const setUseData = (data) => {
   });
   const data2 = JSON.parse(JSON.stringify(data1));
   useData.value = data2;
-  console.log(useData.value, "useData2222");
 };
 onMounted(() => {
   setTime();