priyatham
/
gcs-user-interface
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added flight components to CamFocus to temporary position

This commit is contained in:
chillwafflez 2024-04-14 06:07:06 -07:00
parent 215671271b
commit b9aef7ff1c
5 changed files with 26 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/ERU.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.2 KiB

After

Width:  |  Height:  |  Size: 3.3 KiB

1
src/components/FlightComponents/Airspeed.vue
View File

@ -27,7 +27,6 @@ export default {
display: flex;
flex-direction: column;
align-items: center;
border: 1px solid black;
}
</style>

1
src/components/FlightComponents/Altimeter.vue
View File

@ -27,7 +27,6 @@ export default {
display: flex;
flex-direction: column;
align-items: center;
border: 1px solid black;
}
</style>

1
src/components/FlightComponents/Altitude.vue
View File

@ -29,6 +29,5 @@ export default {
display: flex;
flex-direction: column;
align-items: center;
border: 1px solid black;
}
</style>

28
src/views/CamFocus.vue
View File

@ -1,5 +1,7 @@
<script setup lang="ts">
import Airspeed from "../components/FlightComponents/Airspeed.vue";
import Altimeter from "../components/FlightComponents/Altimeter.vue";
import Altitude from "../components/FlightComponents/Altitude.vue";
import Camera from "../components/Camera.vue";
import { useRoute } from 'vue-router';
const route = useRoute();
@ -17,7 +19,19 @@ const cameraID = Number(route.params.id); // Assuming we're using camera Number
</div>
</div>
<div class="vehicle-info-container"></div>
<div class="vehicle-info-container">
<div class="flight-indicator">
<Altitude :pitch=2 :roll=10></Altitude>
</div>
<div class="flight-indicator">
<Altimeter :altitude=200></Altimeter>
</div>
<div class="flight-indicator">
<Airspeed :airspeed=100></Airspeed>
</div>
</div>
</div>
</template>
@ -52,8 +66,18 @@ const cameraID = Number(route.params.id); // Assuming we're using camera Number
cursor: pointer;
}
.vehicle-info-container {
display: flex;
flex-direction: column;
gap: 1%;
height: 100%;
width: 25%;
/* background-color: pink; */
}
.flight-indicator{
position: relative;
width: 45%;
border: 1px solid black;
padding-bottom: 2%;
}
</style>