merge

src/components/taskDetail/editPerformancePage.vue

@@ -8,7 +8,7 @@
       @close="closeFun"
     >
       <div class="content">
-        <TableForm ref="tableFormRef" tableName="PERFORMANCE_POOL" />
+        <TableForm ref="tableFormRef" :tableName="tableName" />
       </div>
       <template #footer>
         <div>
@@ -25,7 +25,16 @@ import { ref, nextTick, watch } from 'vue';
 import TableForm from '@/components/common/table/tableForm.vue';
 import { cloneDeep } from 'lodash-es';
 
-const props = defineProps(['performanceInfo']);
+const props = defineProps({
+  performanceInfo: {
+    type: Object,
+    default: () => {},
+  },
+  tableName: {
+    type: String,
+    default: 'PERFORMANCE_POOL',
+  },
+});
 const emit = defineEmits(['cancel', 'submit']);
 
 const tableFormRef = ref();
@@ -51,7 +60,7 @@ watch(
     if (newVal) {
       nextTick(() => {
         console.log(newVal, 'newVal');
-        const info = cloneDeep(newVal) ;
+        const info = cloneDeep(newVal);
         nextTick(() => {
           tableFormRef.value.setFormDataFun(info);
         });

src/views/data/analysis/components/csvFileReview.vue

@@ -0,0 +1,124 @@
+<template>
+  <div calss="page-content">
+    <Dialog
+      v-model="diaVisible"
+      diaTitle="曲线预览"
+      :width="'50%'"
+      :height="'80%'"
+      :confirm-closable="false"
+      @close="closeFun"
+      :zIndex="108"
+    >
+      <div class="csv-page">
+        <EchartCard
+          ref="csvChartRef"
+          :bar-type="'lineChart'"
+          :title="''"
+          :charts-id="'chart-csv'"
+        ></EchartCard>
+      </div>
+    </Dialog>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, watch } from 'vue';
+import Dialog from '@/components/common/dialog/index.vue';
+import EchartCard from '@/components/common/echartCard/index.vue';
+import { getCSVDataApi } from '@/api/data/dataAnalysis';
+
+const props = defineProps({
+  fileId: {
+    type: Number,
+    default: 0,
+  },
+});
+
+const emits = defineEmits(['close']);
+
+const diaVisible = ref(true);
+const csvChartRef = ref();
+
+const initCsvChartFun = async (id: any) => {
+  const res: any = await getCSVDataApi({
+    fileId: id,
+  });
+
+  if (res && res.code === 200) {
+    const seriesData: any = [];
+    const titleList: any = [];
+    if (res?.data?.xData?.length) {
+      const data = res.data.xData[0].map((item: any, index: any) => {
+        return [item, res.data.yData[0][index]];
+      });
+      seriesData.push({
+        name: '曲线',
+        type: 'line',
+        stack: 'Total',
+        data,
+      });
+
+      console.log(seriesData, 'seriesData');
+      console.log(data, 'data');
+
+      csvChartRef.value.commonChartRef.disposeEchartsByKey('chart-csv');
+      csvChartRef.value.commonChartRef.option = {
+        title: {
+          show: false,
+        },
+        tooltip: {
+          trigger: 'axis',
+        },
+        legend: {
+          top: '0%',
+          left: 'center',
+          data: titleList,
+        },
+        grid: {
+          top: '10%',
+          bottom: '10%',
+          left: '5%',
+          right: '5%',
+        },
+        xAxis: {
+          type: 'category',
+        },
+        yAxis: {
+          type: 'value',
+        },
+        series: seriesData,
+      };
+      csvChartRef.value.commonChartRef.initChart();
+    }
+  }
+};
+
+const closeFun = () => {
+  emits('close');
+};
+
+watch(
+  () => props.fileId,
+  async (newVal) => {
+    if (newVal) {
+      const id = newVal;
+      await initCsvChartFun(id);
+    }
+  },
+  {
+    immediate: true,
+    deep: true,
+  }
+);
+</script>
+
+<style lang="scss" scoped>
+.page-content {
+  width: 100%;
+}
+
+.csv-page {
+  width: 100%;
+  height: 500px;
+}
+</style>

src/views/task/workLoad/index.vue

@@ -1,11 +1,15 @@
 <template>
   <div class="gl-page-content">
-
     <div class="page-filter-box">
       <el-form :model="filterFprmData" inline>
         <el-form-item label="用户组：">
           <el-select v-model="filterFprmData.userGroupId" class="mw200" @change="filterWorkLoadFun">
-            <el-option v-for="item in groupList" :key="item.id" :label="item.groupName" :value="item.id">
+            <el-option
+              v-for="item in groupList"
+              :key="item.id"
+              :label="item.groupName"
+              :value="item.id"
+            >
             </el-option>
           </el-select>
         </el-form-item>
@@ -51,7 +55,6 @@
         </div>
       </template>
     </div>
-
   </div>
 </template>
 
@@ -66,6 +69,7 @@ import weekOfYear from 'dayjs/plugin/weekOfYear';
 import { userQueryGroupApi, userQueryGroupDetailApi } from '@/api/system/user';
 import { getListUserWorkloadsApi } from '@/api/project/task';
 import { ElMessage } from 'element-plus';
+import { isWorkday } from 'chinese-workday';
 
 dayjs.extend(isBetween);
 dayjs.extend(weekOfYear);
@@ -85,6 +89,7 @@ const filterFprmData = reactive<any>({
   dateType: 'week',
 });
 
+
 const ganttRef = ref();
 
 const changeDateTypeFun = () => {
@@ -212,7 +217,6 @@ const clearParamFun = async () => {
 
 // 计算时间段中的工作日天数
 const calculateWorkDay = ([startDate, endDate]: any) => {
-
   let workdays = 0;
   let currentDate = dayjs(startDate);
   while (currentDate.isBefore(dayjs(endDate)) || currentDate.isSame(dayjs(endDate), 'day')) {
@@ -371,11 +375,11 @@ const initGantt = () => {
       }
     }
     return `<div class='${tasks?.length > 0 ? 'cell-style' : ''}' style='background:${colorList[tasks?.length >= 5 ? 5 : tasks?.length]
-    };cursor:${tasks?.length > 0 ? 'pointer' : 'default'}' userName=${task?.userName} userId=${task?.userId
-    }  tasks=${JSON.stringify(tasks)} date=${dayjs(date).format('YYYY-MM-DD')}></div>`;
+      };cursor:${tasks?.length > 0 ? 'pointer' : 'default'}' userName=${task?.userName} userId=${task?.userId
+      }  tasks=${JSON.stringify(tasks)} date=${dayjs(date).format('YYYY-MM-DD')}></div>`;
   };
   // gantt渲染结束添加监听单元格点击事件
-  const onGanttRender = Gantt.attachEvent('onGanttRender', function (e:any, date:any) {
+  const onGanttRender = Gantt.attachEvent('onGanttRender', function (e: any, date: any) {
 
     console.log(e, 'e');
     console.log(date, 'date');
@@ -385,7 +389,7 @@ const initGantt = () => {
     });
   });
   ganttEvents.value.push(onGanttRender);
-  const onLoadStart = Gantt.attachEvent('onGanttScroll', function (e:any, date:any) {
+  const onLoadStart = Gantt.attachEvent('onGanttScroll', function (e: any, date: any) {
     console.log(e, 'e');
     console.log(date, 'date');
     nextTick(() => {
@@ -432,7 +436,6 @@ onBeforeUnmount(() => {
   Gantt.clearAll();
   Gantt = null;
 });
-
 </script>
 
 <style lang="scss" scoped>
@@ -455,13 +458,11 @@ onBeforeUnmount(() => {
       height: 100%;
       display: flex;
       justify-content: flex-end;
-
     }
 
     .mr0 {
       margin-right: 0px;
     }
-
   }
 
   .page-content {
@@ -488,7 +489,7 @@ onBeforeUnmount(() => {
       justify-content: flex-end;
       margin-left: 12px;
 
-      &>div:first-child {
+      & > div:first-child {
         height: 16px;
         width: 16px;
         border-radius: 50%;
@@ -496,7 +497,6 @@ onBeforeUnmount(() => {
       }
     }
   }
-
 }
 
 :deep(.cell-style) {
@@ -506,6 +506,7 @@ onBeforeUnmount(() => {
   align-items: center;
   justify-content: center;
 }
+
 :deep(.gantt_links_area) {
   display: none;
 }
@@ -518,26 +519,32 @@ onBeforeUnmount(() => {
   background-image: url('~@/assets/imgs/versionTree/user.svg') !important;
   background-size: 60%;
 }
+
 :deep(
-    .gantt_grid_data .gantt_row.gantt_selected,
-    .gantt_grid_data .gantt_row.odd.gantt_selected,
-    .gantt_task_row.gantt_selected
-  ) {
+  .gantt_grid_data .gantt_row.gantt_selected,
+  .gantt_grid_data .gantt_row.odd.gantt_selected,
+  .gantt_task_row.gantt_selected
+) {
   background-color: #96bdff;
+
   &:hover {
     background-color: #96bdff !important;
   }
 }
+
 :deep(.gantt_grid_data .gantt_row.odd:hover, .gantt_grid_data .gantt_row:hover) {
   background-color: #ecf7ff;
 }
+
 :deep(.gantt_grid_data .gantt_row:hover) {
   background-color: #ecf7ff;
 }
+
 :deep(.task-table-container) {
   height: 100%;
   width: 100%;
 }
+
 :deep(.gantt_row.gantt_row_task) {
   position: none;
 }