修改4F agv

src/views/cs/index2.vue

@@ -101,7 +101,7 @@
 
 
       <div :class="`${i.isGoods? 'agv2':'agv1'}`" v-for="i in agvData"
-           :style="`${getLocation(i.x,i.y)}transform: rotate(45deg);`"></div>
+           :style="`${getLocation(i.x,i.y)}transform: rotate(${parseFloat(i.rotate )- 90}deg);`"></div>
     </div>
   </div>
 </template>
@@ -275,28 +275,7 @@ export default {
       ],
       hfData: [],
       equipmentData: [],
-      agvData: [
-        {
-          x: 0,
-          y: 0,
-          isGoods: false,
-        },
-        {
-          x: 0,
-          y: 1,
-          isGoods: true,
-        },
-        {
-          x: 1,
-          y: 0,
-          isGoods: false,
-        },
-        {
-          x: 1,
-          y: 1,
-          isGoods: true,
-        }
-      ]
+      agvData: []
     }
   },
   methods: {
@@ -307,10 +286,39 @@ export default {
       let yLocation = 22 + (84 - 22) * y
       return ` left: ${xLocation}%;top: ${yLocation}%;`
     },
-    getData() {
-      getAgvData().then(e=>{
-        console.log(e)
+    getAgvLocation() {
+      let agvArr = []
+      getAgvData().then(e => {
+        e.Data.forEach(v => {
+          agvArr.push({
+            id: v.AgvId,
+            x: Math.random(),
+            y: Math.random(),
+            rotate: v.Angle,
+            isGoods: false,
+          })
+        })
+        this.agvData = agvArr
+      })
+    },
+    updateAGVLocation(time){
+      getAgvData().then(e => {
+        e.Data.forEach(v => {
+          if(this.agvData.filter(r=>r.id===v.AgvId).length>=1){
+            new TWEEN.Tween(this.agvData.find(r=>r.id===v.AgvId)).to({x: Math.random(), y: Math.random()}, time).start()
+          }else{
+            this.agvData.push({
+              id: v.AgvId,
+              x: Math.random(),
+              y: Math.random(),
+              rotate: v.Angle,
+              isGoods: false,
+            })
+          }
+        })
       })
+    },
+    getData() {
       getHourProductionList().then(e => {
         let hfArr = []
         let equipmentArr = []
@@ -327,55 +335,10 @@ export default {
   },
   mounted() {
     this.getData()
-    setInterval(() => {
-      this.loopIndex = (this.loopIndex + 1) % 26
-    }, 1000 * 5)
-    let agv = [
-      {
-        top: 22,
-        left: 16
-      },
-      {
-        top: 22,
-        left: 82
-      },
-      {
-        top: 84,
-        left: 4
-      },
-      {
-        top: 84,
-        left: 94
-      },
-      {
-        width: 12,
-        height: 62
-      },
-      {
-        width1: 66,
-        width2: 90
-      }
-    ]
-    let cs = [
-      [0, 0],
-      [10, 10],
-      [20, 20],
-      [30, 30],
-      [40, 40],
-      [50, 50],
-      [60, 60],
-      [70, 70],
-      [80, 80],
-      [90, 90],
-      [100, 100],
-    ]
-    let time = 10 * 1000
-    setInterval(() => {
-      this.agvData.forEach(e => {
-        new TWEEN.Tween(e).to({x: Math.random(), y: Math.random()}, time).start()
-      })
-    }, time)
-
+    this.getAgvLocation()
+    setInterval(()=>{
+      this.updateAGVLocation(5*1000)
+    },5*1000)
     function animate() {
       requestAnimationFrame(animate)
       TWEEN.update()