작업 완료 만들기
- InterFace 탭에서 Task를 더블 클릭하고, Widget Tree를 선택해주세요.
- List의 Is Active 항목의 체크박스를 우클릭하여 Delete를 눌러 삭제해주세요.
- 왼쪽 도구상자에서 Button을 검색해서 아이콘을 삭제했던 자리에 드래그해서 삽입해주세요.
그리고 Button이라고 적힌 글씨를 더블클릭해서 Done 이라고 바꿔주세요. 오른쪽 아래에서 Text 항목을 바꾸셔도 됩니다.
Text 항목만 Done으로 작성해주시고 혹시 Style Classes가 자동완성 되었다면 삭제해주세용
아니면 아래같은 에러나요
-
이제 1편에서 save 버튼에 기능을 만들었던것처럼, Done에 기능을 넣어볼게요. 앞에서 했던 방법과 똑같습니다.
(0) Done 버튼의 빈공간을 더블클릭!
(1) Logic 탭에서 Server Actions에서 우클릭 후 'Add Server Actions' 이름은 Task Delete.
(2) TaskDelete를 우클릭하고 'Add Input Parameter' 로 입력 변수를 만들고
(3) 이름을 TaskId, 타입은 Task Identifier로 설정해주세요.
참고로 이름을 TaskDelete라고 적는 이유는 작업을 완료하고나면, 작업리스트에서 '삭제' 해야하기 때문입니다. -
(1) Data 탭에서 DeleteTask를 왼쪽 그림의 가운데에 드래그해서 삽입.
(2) 이후 DeleteTask의 Id 속성에 TaskId라고 설정해주세요.
-
Interface 탭에서 DoneOnClick을 더블 클릭해주세요. (DoneOnClick은 4번의 0번 항목을 했을때 생성됩니다.)
-
(1) Logic 탭에서 TaskDelete를 왼쪽 그림 가운데로 드래그하여 삽입.
(2) 오른쪽 아래에서 TaskId를 GetTasks.List.Current.Task.Id. 로 설정 (자동완성 안됨, 직접 작성해야함.)
- TaskDelete 작업 후에 Toolbox에서 작업 흐름으로 데이터 새로 고치고 집계 GetTasks를 선택하여 화면에서 사용 가능한 작업을 새로 고칩니다.
그러기 위해 왼쪽 도구박스에서 Refresh Data를 TaskDelete 뒤에 삽입하고,
삽입후 뜨는 모달창에서 GetTasks를 선택하고 Select하면 끝이다 !
태스크 추가 허용
- Interface 탭에서 Task를 더블클릭합니다.
- List 위쪽 Click to add Actions 컨테이너에 왼쪽 도구상자에서 button을 끌어와 삽입합니다. 이후 (1) 버튼의 Text를 Add Task로 수정하고
(2) 오른쪽에서 Button에서 우클릭, Link to 클릭, MainFlow/TaskDetail을 선택허면 끝 입니다.
사후 대응형 웹 앱 테스트
상단에 Publish를 눌러 원클릭 배포를 합니다. 잠시 기다리면 Open in browser 가 생기고, 누르면 아래처럼 브라우저에서 열립니다 !
완전 신기하네요 ㄷㄷㄷ
AddTask 화면
Task 추가후 메인 화면
Done을 클릭하면 항목이 삭제됨. Finish Projects on Time을 제외하고 모두 삭제된 모습!
반응형 확인
이렇게 제작이 마무리되었습니다. 진짜 너무 쉬워서 당황스러울정도네요... 조금 더 연습하고 Gpt를 적용하면 실무에서도 사용할 수 있을지도 모르겠네요! 아주 기대가 됩니다 ㅎㅎ
