4D模型-计划显示

yanzhu-bigscreen/src/api/bim.js

@@ -108,6 +108,13 @@ const roamingGet=data=>{
   });
 }
 
+const getPlanList=projectId=>{
+   return request({
+    url: `/manage/plan/list?pageNum=1&pageSize=1000&projectId=${projectId}`,
+    method: "get"
+  });
+}
+
 export default {
   listBimModel,
   modelPropertyByExternalId,
@@ -121,5 +128,6 @@ export default {
   modelTreeAllChild,
   getTreeAllLeafChild,
   viewpointGet,
-  roamingGet
+  roamingGet,
+  getPlanList
 };

yanzhu-bigscreen/src/utils/request.js

@@ -16,7 +16,7 @@ const service = axios.create({
   // axios中请求配置有baseURL选项，表示请求URL公共部分
   baseURL: process.env.VUE_APP_BASE_API,
   // 超时
-  timeout: 200000,
+  timeout: 20000000,
 });
 
 // request拦截器

yanzhu-bigscreen/src/views/bim4DSimulation.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="bim-4d-simulation main-page">
-    <div v-if="hasLoad">
+    <div v-if="hasLoad" class="div-plan">
-      <gantt-elastic :options="options" :tasks="taskList" @tasks-changed="tasksUpdate" @options-changed="optionsUpdate" @dynamic-style-changed="styleUpdate">
+      <gantt-elastic :options="options" :tasks="taskList" :dynamicStyle="planStyle" @tasks-changed="tasksUpdate" @options-changed="optionsUpdate" @dynamic-style-changed="styleUpdate">
-        <gantt-header slot="header" :options="optionList" v-if="1==2"></gantt-header>
+        <gantt-header slot="header" :options="optionList" v-if="1 == 2"></gantt-header>
       </gantt-elastic>
     </div>
   </div>
@@ -19,7 +19,7 @@ let options = {
   maxRows: 100,
   maxHeight: 500,
   title: {
-    label: "Your project title as html (link or whatever...)",
+    label: "任务列表",
     html: false,
   },
   row: {
@@ -27,7 +27,7 @@ let options = {
   },
   calendar: {
     hour: {
-      display: true,
+      display: false,
     },
   },
   chart: {
@@ -51,51 +51,30 @@ let options = {
       },
       {
         id: 2,
-        label: "Description",
+        label: "任务名称",
         value: "label",
         width: 200,
         expander: true,
         html: true,
-        events: {
-          click({ data, column }) {
-            alert("description clicked!\n" + data.label);
-          },
-        },
       },
       {
         id: 3,
-        label: "Assigned to",
+        label: "任务工期",
-        value: "user",
+        value: "days",
-        width: 130,
+        width: 120,
-        html: true,
-      },
-      {
-        id: 3,
-        label: "Start",
-        value: (task) => dayjs(task.start).format("YYYY-MM-DD"),
-        width: 78,
       },
       {
         id: 4,
-        label: "Type",
+        label: "开始时间",
-        value: "type",
+        value: "start",
-        width: 68,
+        width: 120,
       },
+
       {
         id: 5,
-        label: "%",
+        label: "结束时间",
-        value: "progress",
+        value: "end",
-        width: 35,
+        width: 120,
-        style: {
-          "task-list-header-label": {
-            "text-align": "center",
-            width: "100%",
-          },
-          "task-list-item-value-container": {
-            "text-align": "center",
-            width: "100%",
-          },
-        },
       },
     ],
   },
@@ -108,23 +87,36 @@ let options = {
     "Before/After": "时间跨度",
     "Display task list": "显示列头",
     weekdays: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"],
-    months: [
+    months: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
-      "一月",
-      "二月",
-      "三月",
-      "四月",
-      "五月",
-      "六月",
-      "七月",
-      "八月",
-      "九月",
-      "十月",
-      "十一月",
-      "十二月",
-    ],
   },
 };
-
+let ganttStyle = {
+  "main-view": {
+    background: "#06445b81",
+  },
+  "main-container-wrapper": {
+    overflow: "hidden",
+    "border-top": "1px solid #eee",
+    "border-bottom": "1px solid #eee",
+  },
+  calendar: {
+    background: "transparent",
+  },
+  'chart-row-text': {
+      background:"transparent",
+      'border-radius': '0px',
+      color: '#fff',
+    },
+    'task-list-expander-border': {
+      fill: '#00f1ff',
+      stroke: '#003357',
+    },
+     'chart-expander-border': {
+      fill: '#00f1ff',
+      stroke: '#000000A0',
+    },
+    
+};
 export default {
   components: {
     ganttElastic,
@@ -134,10 +126,12 @@ export default {
   data() {
     return {
       dpi: "",
+      selProject: null,
       elId: 1,
       taskList: [],
       options,
       hasLoad: false,
+      planStyle: ganttStyle,
     };
   },
   beforeDestroy() {
@@ -157,204 +151,102 @@ export default {
         this.selProject = prj;
         this.elId++;
         //this.initEngine();
+        this.initPlanList();
       })
     );
     this.selProject = this.$store.getters.selProject;
     document.body.classList.add("is-sapi");
-    //this.initEngine();
+    this.initPlanList();
-    function getDate(hours) {
-      const currentDate = new Date();
-      const currentYear = currentDate.getFullYear();
-      const currentMonth = currentDate.getMonth();
-      const currentDay = currentDate.getDate();
-      const timeStamp = new Date(currentYear, currentMonth, currentDay, 0, 0, 0).getTime();
-      return new Date(timeStamp + hours * 60 * 60 * 1000).getTime();
-    }
-    this.taskList = [
-      {
-        id: 1,
-        label: "Make some noise",
-        user: '<a href="https://www.google.com/search?q=John+Doe" target="_blank" style="color:#0077c0;">John Doe</a>',
-        start: getDate(-24 * 5),
-        duration: 15 * 24 * 60 * 60 * 1000,
-        percent: 85,
-        type: "project",
-        //collapsed: true,
-      },
-      {
-        id: 2,
-        label: "With great power comes great responsibility",
-        user: '<a href="https://www.google.com/search?q=Peter+Parker" target="_blank" style="color:#0077c0;">Peter Parker</a>',
-        parentId: 1,
-        start: getDate(-24 * 4),
-        duration: 4 * 24 * 60 * 60 * 1000,
-        percent: 50,
-        type: "milestone",
-        collapsed: true,
-        style: {
-          base: {
-            fill: "#1EBC61",
-            stroke: "#0EAC51",
-          },
-        },
-      },
-      {
-        id: 3,
-        label: "Courage is being scared to death, but saddling up anyway.",
-        user: '<a href="https://www.google.com/search?q=John+Wayne" target="_blank" style="color:#0077c0;">John Wayne</a>',
-        parentId: 2,
-        start: getDate(-24 * 3),
-        duration: 2 * 24 * 60 * 60 * 1000,
-        percent: 100,
-        type: "task",
-      },
-      {
-        id: 4,
-        label: "Put that toy AWAY!",
-        user: '<a href="https://www.google.com/search?q=Clark+Kent" target="_blank" style="color:#0077c0;">Clark Kent</a>',
-        start: getDate(-24 * 2),
-        duration: 2 * 24 * 60 * 60 * 1000,
-        percent: 50,
-        type: "task",
-        dependentOn: [3],
-      },
-      {
-        id: 5,
-        label: "One billion, gajillion, fafillion... shabadylu...mil...shabady......uh, Yen.",
-        user: '<a href="https://www.google.com/search?q=Austin+Powers" target="_blank" style="color:#0077c0;">Austin Powers</a>',
-        parentId: 4,
-        start: getDate(0),
-        duration: 2 * 24 * 60 * 60 * 1000,
-        percent: 10,
-        type: "milestone",
-        style: {
-          base: {
-            fill: "#0287D0",
-            stroke: "#0077C0",
-          },
-        },
-      },
-      {
-        id: 6,
-        label: "Butch Mario and the Luigi Kid",
-        user: '<a href="https://www.google.com/search?q=Mario+Bros" target="_blank" style="color:#0077c0;">Mario Bros</a>',
-        parentId: 5,
-        start: getDate(24),
-        duration: 1 * 24 * 60 * 60 * 1000,
-        percent: 50,
-        type: "task",
-        collapsed: true,
-        style: {
-          base: {
-            fill: "#8E44AD",
-            stroke: "#7E349D",
-          },
-        },
-      },
-      {
-        id: 7,
-        label: "Devon, the old man wanted me, it was his dying request",
-        user: '<a href="https://www.google.com/search?q=Knight+Rider" target="_blank" style="color:#0077c0;">Knight Rider</a>',
-        parentId: 2,
-        dependentOn: [6],
-        start: getDate(24 * 2),
-        duration: 4 * 60 * 60 * 1000,
-        percent: 20,
-        type: "task",
-        collapsed: true,
-      },
-      {
-        id: 8,
-        label: "Hey, Baby! Anybody ever tell you I have beautiful eyes?",
-        user: '<a href="https://www.google.com/search?q=Johhny+Bravo" target="_blank" style="color:#0077c0;">Johhny Bravo</a>',
-        parentId: 7,
-        dependentOn: [7],
-        start: getDate(24 * 3),
-        duration: 1 * 24 * 60 * 60 * 1000,
-        percent: 0,
-        type: "task",
-      },
-      {
-        id: 9,
-        label: "This better be important, woman. You are interrupting my very delicate calculations.",
-        user: '<a href="https://www.google.com/search?q=Dexter\'s+Laboratory" target="_blank" style="color:#0077c0;">Dexter\'s Laboratory</a>',
-        parentId: 8,
-        dependentOn: [8, 7],
-        start: getDate(24 * 4),
-        duration: 4 * 60 * 60 * 1000,
-        percent: 20,
-        type: "task",
-        style: {
-          base: {
-            fill: "#8E44AD",
-            stroke: "#7E349D",
-          },
-        },
-      },
-      {
-        id: 10,
-        label: "current task",
-        user: '<a href="https://www.google.com/search?q=Johnattan+Owens" target="_blank" style="color:#0077c0;">Johnattan Owens</a>',
-        start: getDate(24 * 5),
-        duration: 24 * 60 * 60 * 1000,
-        percent: 0,
-        type: "task",
-      },
-      {
-        id: 11,
-        label: "test task",
-        user: '<a href="https://www.google.com/search?q=Johnattan+Owens" target="_blank" style="color:#0077c0;">Johnattan Owens</a>',
-        start: getDate(24 * 6),
-        duration: 24 * 60 * 60 * 1000,
-        percent: 0,
-        type: "task",
-      },
-      {
-        id: 12,
-        label: "test task",
-        user: '<a href="https://www.google.com/search?q=Johnattan+Owens" target="_blank" style="color:#0077c0;">Johnattan Owens</a>',
-        start: getDate(24 * 7),
-        duration: 24 * 60 * 60 * 1000,
-        percent: 0,
-        type: "task",
-        parentId: 11,
-      },
-      {
-        id: 13,
-        label: "test task",
-        user: '<a href="https://www.google.com/search?q=Johnattan+Owens" target="_blank" style="color:#0077c0;">Johnattan Owens</a>',
-        start: getDate(24 * 8),
-        duration: 24 * 60 * 60 * 1000,
-        percent: 0,
-        type: "task",
-      },
-      {
-        id: 14,
-        label: "test task",
-        user: '<a href="https://www.google.com/search?q=Johnattan+Owens" target="_blank" style="color:#0077c0;">Johnattan Owens</a>',
-        start: getDate(24 * 9),
-        duration: 24 * 60 * 60 * 1000,
-        percent: 0,
-        type: "task",
-      },
-      {
-        id: 15,
-        label: "test task",
-        user: '<a href="https://www.google.com/search?q=Johnattan+Owens" target="_blank" style="color:#0077c0;">Johnattan Owens</a>',
-        start: getDate(24 * 16),
-        duration: 24 * 60 * 60 * 1000,
-        percent: 0,
-        type: "task",
-      },
-    ];
-    this.hasLoad = true;
   },
   methods: {
-    tasksUpdate() {},
+    initPlanList() {
-    optionsUpdate() {},
+      if (this.selProject?.id) {
-    styleUpdate() {},
+        this.$api.bim.getPlanList(this.selProject.id).then((res) => {
+          this.taskList = (res.data || []).map((item) => {
+            let o = {
+              id: item.taskId,
+              user: '<a href="https://www.google.com/search?q=Johnattan+Owens" target="_blank" style="color:#0077c0;">Johnattan Owens</a>',
+              parentId: item.parentId == 0 ? null : item.parentId,
+              label: item.taskName,
+              start: item.planStartDate,
+              end: item.planEndDate,
+              duration: item.taskDuation * 24 * 60 * 60 * 1000,
+              days: item.taskDuation + "(天)",
+              collapsed: false,
+              gis: this.$tryToJson(item.bimId, {}),
+              type: item.parentId == 0 ? "project" : "milestone",
+              style: {
+                base: {
+                  fill: "#3da2ff",
+                  stroke: "#003357",
+                },
+              },
+              data: item,
+            };
+            return o;
+          });
+          this.hasLoad = true;
+        });
+      }
+    },
+    tasksUpdate() {
+      console.log("---tasksUpdate->");
+    },
+    optionsUpdate() {
+      console.log("---optionsUpdate>");
+    },
+    styleUpdate(a) {
+      console.log("--styleUpdate-->", a);
+    },
   },
 };
 </script>
 
-<style lang="less"></style>
+<style lang="less">
+.bim-4d-simulation {
+  .div-plan {
+    .gantt-elastic__main-view {
+      .gantt-elastic__task-list-header-column {
+        background: transparent !important;
+      }
+      .gantt-elastic__task-list-item-value {
+        color: deepskyblue !important;
+        background: transparent !important;
+      }
+      .gantt-elastic__main-view-container {
+        .gantt-elastic__calendar {
+          background: transparent !important;
+          .gantt-elastic__calendar-row-text {
+            color: deepskyblue !important;
+          }
+        }
+      }
+      .gantt-elastic__chart-calendar-container {
+        border-bottom: solid 1px rgb(238, 238, 238);
+      }
+      .gantt-elastic__calendar-row{
+        &.gantt-elastic__calendar-row--month{
+          border-bottom: solid 1px rgb(238, 238, 238);
+        }
+      }
+      .gantt-elastic__chart-scroll-container{
+        scrollbar-color: deepskyblue transparent;
+        scrollbar-track-color: transparent;
+        -ms-overflow-style: -ms-autohiding-scrollbar; /* IE and Edge */
+        scrollbar-width: thin; /* Firefox */
+        &::-webkit-scrollbar {
+          width: 8px;
+          height: 8px;
+        }
+        &::-webkit-scrollbar-thumb {
+          background-color: deepskyblue;
+          border-radius: 4px;
+        }
+        &::-webkit-scrollbar-track {
+          background-color: transparent;
+        }
+      }
+    }
+  }
+}
+</style>

yanzhu-bigscreen/src/views/bimBriefing.vue

@@ -22,7 +22,7 @@
                 }"
                 node-key="key"
                 @check="onCheckTree"
-                 :load="loadNode"
+                :load="loadNode"
                 lazy
                 show-checkbox></el-tree>
             </div>
@@ -35,7 +35,7 @@
     <div class="div-right" :class="{ isShow: leftShow, isHide: !leftShow }">
       <transition name="right">
         <div class="data-content" v-show="leftShow">
-          <div class="div-row r66">
+          <div class="div-row r100">
             <div class="row-title">
               <svg-icon icon-class="signal"></svg-icon>
               {{ title }}
@@ -115,7 +115,7 @@
             </div>
           </div>
 
-          <div class="div-row r33">
+          <div class="div-row r33" v-if="1==2">
             <div class="row-title">
               <svg-icon icon-class="signal"></svg-icon>
               进度信息
@@ -302,7 +302,7 @@ export default {
         this.getTreeChildren(node, resolve);
       }
     },
-     getTreeChildren(node, resolve) {
+    getTreeChildren(node, resolve) {
       let that = this;
       let data = node.data;
       this.$api.bim.getModelTree(data.modelId, data.glid).then((d) => {
@@ -379,11 +379,13 @@ export default {
       if (node.type == "root") {
         if (checked) {
           that.models.forEach((it) => {
+            it.visible = true;
             api.Model.setVisible(it.modelId, true);
             api.Model.original(it.modelId);
           });
         } else {
           that.models.forEach((it) => {
+            it.visible = false;
             api.Model.setVisible(it.modelId, false);
           });
         }
@@ -391,12 +393,14 @@ export default {
         if (checked) {
           api.Model.setVisible(node.modelId, true);
           api.Model.original(node.modelId);
+          this.models.find((mm) => mm.modelId == node.modelId).visible = true;
         } else {
           api.Model.setVisible(node.modelId, false);
+          this.models.find((mm) => mm.modelId == node.modelId).visible = false;
         }
       } else {
         let isPartLoad = false;
-        if (event.checkedKeys.length == 1 && checked) {
+        if (!this.models.find((mm) => mm.modelId == node.modelId).visible && checked) {
           isPartLoad = true;
         }
         let selFeatureIds = [];
@@ -415,10 +419,13 @@ export default {
         } else {
           if (isPartLoad) {
             api.Model.setVisible(node.modelId, true);
+            this.models.find((mm) => mm.modelId == node.modelId).visible = true;
             api.Model.original(node.modelId);
-            let tmpsIds2 = tmps.splice(0, 1000);
+            if(tmps.length>0){
-            api.Feature.showFeatures(tmpsIds2.join("#"));
+              let tmpsIds2 = tmps.splice(0, 1000);
-            this.setFeatueVisible(tmps, true);
+              api.Feature.showFeatures(tmpsIds2.join("#"));
+              this.setFeatueVisible(tmps, true);
+            }
           } else {
             this.setFeatueVisible(tmps, true);
           }
@@ -528,7 +535,13 @@ export default {
           projectId: this.selProject.id,
         })
         .then((d) => {
-          this.models = d.rows || [];
+          this.models = (d.rows || []).map((it) => {
+            it.modelId = it.lightweightName;
+            it.visible = false;
+            it.checked = true;
+            it.gis = this.$tryToJson(it.gisJson || "{}", {});
+            return it;
+          });
           if (this.models.length == 0) {
             this.$message.error("暂无模型，请先关联模型");
           } else {
@@ -537,7 +550,7 @@ export default {
               item.gis = JSON.parse(item.gisJson);
               this.addModel(item.lightweightName);
               this.doSelectMenu(7);
-               setTimeout(() => {
+              setTimeout(() => {
                 this.$refs.tree.setChecked(item.lightweightName, true, true);
               }, 3000);
             });
@@ -694,6 +707,9 @@ export default {
       &.r66 {
         height: calc(100% - 180px);
       }
+      &.r100{
+        height: 100%;
+      }
     }
   }
 
@@ -904,7 +920,7 @@ export default {
       span {
         font-size: 20px;
         position: relative;
-        top:-6px;
+        top: -6px;
       }
     }
 

yanzhu-bigscreen/src/views/bimRoaming.vue

@@ -124,7 +124,7 @@ export default {
       roamingLoading: true,
       selectedRoam: null,
       modelLoaded: false,
-      isPlay:false,
+      isPlay: false,
     };
   },
   mounted() {
@@ -216,12 +216,13 @@ export default {
     },
     playIRPause(data) {
       data.play = 2;
-      this.isPlay=false;
+      this.isPlay = false;
+
       bimRoadmApi.Camera.pauseImmersiveRoam(false);
     },
     playContinue(data) {
       data.play = 1;
-      this.isPlay=true;
+      this.isPlay = true;
       bimRoadmApi.Camera.pauseImmersiveRoam(true);
     },
     playCancle(data) {
@@ -261,14 +262,14 @@ export default {
         api.Camera.startImmersiveRoam([65.702301, 670.785328, 851.817162]);
         setTimeout(() => {
           this.selectedRoam = data;
-          this.isPlay=true;
+          this.isPlay = true;
           api.Camera.playImmersiveRoam({
             records: record,
             isLoopPlay: this.autoPlay,
             complete: function () {
               this.selectedRoam = null;
               data.play = 0;
-              this.isPlay=false;
+              this.isPlay = false;
             },
           });
         }, 400);
@@ -281,18 +282,20 @@ export default {
         this.$message.error("模型未加载完成，请稍后重试");
         return;
       }
-      if(this.isPlay){
+      if (this.isPlay) {
         this.playCancle();
       }
       let checked = event.checkedNodes.includes(node);
       if (node.type == "root") {
         if (checked) {
           that.models.forEach((it) => {
+            it.visible = true;
             api.Model.setVisible(it.modelId, true);
             api.Model.original(it.modelId);
           });
         } else {
           that.models.forEach((it) => {
+            it.visible = false;
             api.Model.setVisible(it.modelId, false);
           });
         }
@@ -300,12 +303,14 @@ export default {
         if (checked) {
           api.Model.setVisible(node.modelId, true);
           api.Model.original(node.modelId);
+          this.models.find((mm) => mm.modelId == node.modelId).visible = true;
         } else {
           api.Model.setVisible(node.modelId, false);
+          this.models.find((mm) => mm.modelId == node.modelId).visible = false;
         }
       } else {
         let isPartLoad = false;
-        if (event.checkedKeys.length == 1 && checked) {
+        if (!this.models.find((mm) => mm.modelId == node.modelId).visible && checked) {
           isPartLoad = true;
         }
         let selFeatureIds = [];
@@ -324,6 +329,7 @@ export default {
         } else {
           if (isPartLoad) {
             api.Model.setVisible(node.modelId, true);
+            this.models.find((mm) => mm.modelId == node.modelId).visible = true;
             api.Model.original(node.modelId);
             let tmpsIds2 = tmps.splice(0, 1000);
             api.Feature.showFeatures(tmpsIds2.join("#"));
@@ -433,7 +439,13 @@ export default {
           projectId: this.selProject.id,
         })
         .then((d) => {
-          this.models = d.rows || [];
+          this.models = (d.rows || []).map((it) => {
+            it.modelId = it.lightweightName;
+            it.visible = false;
+            it.checked = true;
+            it.gis = this.$tryToJson(it.gisJson || "{}", {});
+            return it;
+          });
           if (this.models.length == 0) {
             this.$modal.error("暂无模型，请先关联模型");
           } else {

yanzhu-ui-vue3/src/utils/request.js

@@ -22,7 +22,7 @@ const service = axios.create({
   // axios中请求配置有baseURL选项，表示请求URL公共部分
   baseURL: import.meta.env.VITE_APP_BASE_API,
   // 超时
-  timeout: 60000,
+  timeout: 6000000,
 });
 
 // request拦截器