修复调整相机位置的样式异常问题

src/views/cameras/preview/components/CameraDirectionControl/DirectionItem.vue

@@ -17,7 +17,7 @@
     }, 200);
   };
 </script>
-<style scoped>
+<style scoped lang="scss">
   .sectorWrapper {
     width: 90px;
     height: 90px;
@@ -26,28 +26,28 @@
     cursor: pointer;
     left: 0;
     top: 0;
-    &.top {
-      transform: rotate(45deg);
-    }
+  }
+  .sectorWrapper.top {
+    transform: rotate(45deg);
+  }
 
-    &.right {
-      transform: rotate(135deg);
-    }
+  .sectorWrapper.right {
+    transform: rotate(135deg);
+  }
 
-    &.bottom {
-      transform: rotate(225deg);
-    }
-    &.left {
-      transform: rotate(315deg);
+  .sectorWrapper.bottom {
+    transform: rotate(225deg);
+  }
+  .sectorWrapper.left {
+    transform: rotate(315deg);
+  }
+  .sectorWrapper.active {
+    .sector {
+      background-color: #1890ff;
+      opacity: 0.4;
     }
-    &.active {
-      .sector {
-        background-color: #1890ff;
-        opacity: 0.4;
-      }
-      .triangle {
-        border-bottom-color: #1677ff;
-      }
+    .triangle {
+      border-bottom-color: #1677ff;
     }
   }
   .sector {