diff --git a/liquid-prep-app/src/app/components/measure-soil/measure-soil.component.html b/liquid-prep-app/src/app/components/measure-soil/measure-soil.component.html index 8f8bf97..5bb98de 100644 --- a/liquid-prep-app/src/app/components/measure-soil/measure-soil.component.html +++ b/liquid-prep-app/src/app/components/measure-soil/measure-soil.component.html @@ -4,7 +4,7 @@
- +

Loosen the soil

@@ -23,8 +23,11 @@

Connect to Sensor

- - + +
Connect to Sensor @@ -69,20 +72,19 @@
-
- +
+ navigate_before + BACK +
- +
+ NEXT + navigate_next +
diff --git a/liquid-prep-app/src/app/components/measure-soil/measure-soil.component.scss b/liquid-prep-app/src/app/components/measure-soil/measure-soil.component.scss index 173812b..da878d9 100644 --- a/liquid-prep-app/src/app/components/measure-soil/measure-soil.component.scss +++ b/liquid-prep-app/src/app/components/measure-soil/measure-soil.component.scss @@ -8,31 +8,6 @@ background-color: #fff; } -.swiper-container { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; -} - -.swiper-slide { - color: white; - background-color: white; - display: -webkit-box; - display: -ms-flexbox; - display: -webkit-flex; - display: flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - -webkit-justify-content: center; - justify-content: center; - -webkit-box-align: center; - -ms-flex-align: center; - -webkit-align-items: center; - align-items: center; -} - .title { color: #666666; font-size: 20px; @@ -108,6 +83,9 @@ background-color: #2F4FFE; font-size: 16px; letter-spacing: 2px; + align-items: center; + white-space: nowrap; + line-height: 2; } .m-button{ diff --git a/liquid-prep-app/src/app/components/measure-soil/measure-soil.component.ts b/liquid-prep-app/src/app/components/measure-soil/measure-soil.component.ts index 5be7fee..369fc85 100644 --- a/liquid-prep-app/src/app/components/measure-soil/measure-soil.component.ts +++ b/liquid-prep-app/src/app/components/measure-soil/measure-soil.component.ts @@ -1,4 +1,4 @@ -import {AfterViewInit, Component, OnInit, ViewChild} from '@angular/core'; +import {AfterViewInit, Component, OnInit} from '@angular/core'; import { Location } from '@angular/common'; import {ActivatedRoute, Router} from '@angular/router'; import {SoilMoistureService} from '../../service/SoilMoistureService'; @@ -10,10 +10,6 @@ import {PlantGrowthStage} from '../../models/api/CropInfoResp'; import {HeaderService} from '../../service/header.service'; import { HeaderConfig } from 'src/app/models/HeaderConfig.interface'; import {DateTimeUtil} from "../../utility/DateTimeUtil"; -import Swiper from 'swiper'; -import { SwiperOptions } from 'swiper/types'; - - @Component({ selector: 'app-measure-soil', @@ -43,7 +39,7 @@ export class MeasureSoilComponent implements OnInit, AfterViewInit { public curIndex = 0; public isFirstSlide = true; public isLastSlide = false; - public disabled = false; + public enableUSB = false; public countdownSecond = 5; public measureView: 'before-measuring' | 'measuring' | 'after-measuring' = 'before-measuring'; private interval; @@ -69,27 +65,12 @@ export class MeasureSoilComponent implements OnInit, AfterViewInit { } ngAfterViewInit(): void { - const swiperOptions: SwiperOptions = { - a11y: { - enabled: true - }, - speed: 400, - direction: 'horizontal', - on: { - init: function () { - console.log('on Swiper initialized'); - }, - slideNextTransitionEnd: () => { - this.onIndexChange(swiper.realIndex); - console.log('on slideNextTransitionEnd', swiper.realIndex); - }, - slidePrevTransitionEnd: () => { - this.onIndexChange(swiper.realIndex); - console.log('on slidePrevTransitionEnd', swiper.realIndex); - } - } - }; - const swiper = new Swiper('.swiper-container', swiperOptions); + const swiperEl = document.querySelector('swiper-container'); + swiperEl.addEventListener('swiperslidechange', (event) => { + this.curIndex = swiperEl.swiper.activeIndex; + this.isLastSlide=swiperEl.swiper.isEnd; + this.isFirstSlide=swiperEl.swiper.isBeginning; + }); } public onSensorConnect(connectionOption){ @@ -257,20 +238,6 @@ export class MeasureSoilComponent implements OnInit, AfterViewInit { } } - public onIndexChange(index: number): void { - this.curIndex = index; - if (index === 0 ){ - this.isFirstSlide = true; - this.isLastSlide = false; - }else if (index === 2){ - this.isFirstSlide = false; - this.isLastSlide = true; - }else{ - this.isFirstSlide = false; - this.isLastSlide = false; - } - } - public volumeClicked() { } @@ -332,15 +299,11 @@ export class MeasureSoilComponent implements OnInit, AfterViewInit { onSlideNav(direction: string){ const swiperEl = document.querySelector('swiper-container'); - console.log('onSlideNav swiperEl',swiperEl.swiper.realIndex); if (direction === 'next'){ - // this.swiper.directiveRef.nextSlide(200); swiperEl.swiper.slideNext(200); }else{ - // this.swiper.directiveRef.prevSlide(200); swiperEl.swiper.slidePrev(200); } - console.log('onSlideNav swiperEl',swiperEl.swiper.realIndex); } saveMeasuretoCrop(soilMoisture: number){ diff --git a/liquid-prep-app/src/app/components/select-crop/select-crop.component.html b/liquid-prep-app/src/app/components/select-crop/select-crop.component.html index a0946a6..72016e3 100644 --- a/liquid-prep-app/src/app/components/select-crop/select-crop.component.html +++ b/liquid-prep-app/src/app/components/select-crop/select-crop.component.html @@ -29,7 +29,7 @@ search -