2023/01/09

기나긴 연휴가 끝났다....

10일정도 휴일이였는데, 일본은 한국보다 공휴일이 많은점이 좋은거같다. 너무 오래 쉬었는지 바이오리듬이 엉망이다. 다시 오늘부터 열심히 코딩을 해보자!

일내용: 1. 데이터베이스에 등록될때 등록시간이 아닌 정해진 시간으로 등록이 되도록 설정되어있는걸 바꾼다.

2. 정해진시간 전에 수동으로 등록할시에 불가능 한것을 수동으로 등록가능하게 하기.

3. 유저를 지정해 시간을 정하고 "휴식" 버튼을 누를때 화면에서 사라지지 않고 휴식중으로 표시하게 한다. (사진으로 설명)

방법

1. case로 정해진 시간을 기준으로 등록됐지만, 이것을 수동으로 가능하게 변경

2.현재시간과 정해진 시간을 비교해서 input했던것을 등록시간으로만 한다.

3. 유저를 지정하고 시간을 정한다음 break를 누르면 10분동안 "0005" 유저는 화면에서 보이지 않게된다. 이것을 사라지지 않고 휴식중이라는 문구가 같이 나오게 표시해보자

3-1 vue에서 보면 테이블에서 가져온 값을 배열에 저장하고 value에 컬럼을 넣은값을 표시한다.

3-2 2. 그렇다면 테이블에서 값을 가져올때 휴식중인 user에 userName뒤에 휴식중이라 추가하자.

*문제가 있다. 이미 10곳에 쓰여있는 메소드이기때문에 안에서 바꾸면 안된다.그래서 내 생각은 flag를 하나 만들어서, true일때 조건을 수행하도록 하려하였지만, 파라미터 형식이 달라서 적용이안된다. 그렇다면 파라미터는 그냥 추가하면되는거 아닌가?

맞다.. 추가하면 매우 간단하지만 메소드에 entity는 테이블에 있는 컬럼명만 쓰기로 약속하였기 때문에 추가하면 안된다. 그럼 어떻게 문제를 해결해야할까…...

3-3. 새로운 sql메서드를 만들어서 시간을 비교해 userName에 추가했다. 같은 조건의 파라미터를 where에 입력하고 break중인 것을 골라야 하기때문에 현재시간(Time)과 시작시간(StartTime) 종료시간(EndTime)으로 가져온다.

3-4 IEnumable< > 형태에 추가하는 방법을 모른다.

검색을 해보니 IEnumable은 concat또는 Append를 이용하여 추가하는것을 알았지만, 적용이 안되어 IList형태로 바꾸어 적용하기로 했다.

3까지 구현완료

4. 휴식중인 유저는 휴식이 끝나기전까지 break버튼을 누르지 못하게 추가 화면 움직임이기 때문에 이것은 vue에서 구현! 휴식중인걸 구분하기 위해 flag를 서버에 추가해준다.

5. 이후에 vue로 return할때 리스트에 같이 보낸다.

6. vue에서는 IsBreak가 true인것들은 체크가 안되도록 바꾸어야 한다. v-data-table을 사용하였다. Workers에서 서버로부터 request받은 데이터들을 배열로 저장하여 테이블형식으로 나오게한거다.

7. 배열 중 IsBreak가 참인것은 체크에 disbled를 하면 될거같다. v-slot을 사용해야 하는지 알았다. isBreak의 값은 읽지만, 체크박스 컨트롤이 안되어 검색을 해보았다. 먼저 체크박스이기 때문에 v-simple-checkbox와 v-data-table값을 사용해야 하므로 template를 사용한다.

완성!!! 이라고 하고 싶지만…. 전체선택인 경우를 간과하였다 ㅎㅎㅎ

기능은 정상 구현하였다

하지만 콘솔창에서 비명을 지르고 있었다. 오류메세지를 검색한 결과 checkbox의 ripple이 문제였다.

8. 리플문제 해결을 위해 ripple을 추가해주자.

에러가 사라졌다.

전체 선택하였을때 기존코드에서 배열의 모든값을 넣었기 때문에 등록시에 에러가 발생한다.

9.이를 해결하기 위해서 isBreak가 포함된 배열자리를 삭제해줄 필요가 있다.

for문으로 배열의 갯수만큼 반복후에 isBreak를 포함하는 열은 splice로 삭제해준다.

계속 문제가 발생한다

첫번째. For문에 workers가 아닌 selectWorkers이다. 이미 selectWorkers에 workers를 집어넣었고, splice가 작동하는배열이 selectWorkers이기 때문에

두번째, i--를 안해주었다. 열을 삭제하기 때문에, i--를 해주지 않으면 배열을 건너뛰게 되기 때문에 값이 이상해질 수 밖에 없다.

여기서 i--를 하여도 되지만, 처음부터 i를 0에서 시작하지 않고 배열의 갯수만큼 시작하여 제일 뒤에꺼부터 시작하면 전체 배열에 갯수에 지장없이 기능구현 가능하다.

10.모든 user가 휴식일때 전체선택버튼은 disabled해주어야한다.

11. data에 변수 noWorker을 선언 false로 초기화 해준다.

12. 서버로부터 받은 데이터를 for문을 이용해 반복한다. User한명이라도 휴식상태가 아니면 noWorer를 true로 바꾼다.

13. check박스에 disabled조건을 noWorker로 해준다.

14. 다음과 같이 서버에서 휴식중인 user는 Add로 추가하였기 때문에 배열순서가 제일 뒤에 추가가 된다. 그렇기 때문에 리스트를 전부 Add한 뒤에 Order By로 정리해줄 필요가 있다.

구현완료!