목차
1. 소개
전염병 예방 및 통제가 정상화됨에 따라 시민들이 편리하게 핵산 검사를 수행 할 수 있도록 핵산 검사 지점이 많은 도시에 나타났습니다. 거주자는 가장 가까운 핵산 검사 장소로 이동하여 등록 코드를 스캔할 수 있습니다. 핵산이 완성된 후 애플릿에서 보고서를 직접 얻을 수 있어 매우 편리합니다.
이 튜토리얼에서는 이 실제 시나리오를 예로 들어 Microbuild의 로우 코드 도구를 결합하여 핵산 탐지 애플릿을 만듭니다. 애플릿은 온라인 약속과 내 약속의 두 섹션으로 나뉩니다. 온라인 약속은 수험자 추가, 약속 장소, 약속 날짜를 선택할 수 있습니다. 내 약속은 내가 생성한 보고서를 볼 수 있습니다.
2 데이터 소스 디자인
우리는 총 3개의 데이터 소스를 설계합니다. 즉, 탐지점 데이터 소스, 수험자 데이터 소스 및 약속 데이터 소스입니다.
2.1 탐지 포인트 데이터 소스
2.2 주제 데이터 소스
여기서 인증서 유형은 자체적으로 옵션 세트를 생성해야 하며, 옵션 유형은 다음과 같습니다.
같은 성별도 옵션 세트를 생성해야 하며 옵션 유형은 다음과 같습니다.
2.3 핵산 예약 데이터 소스
위치를 직접 선택할 수 있도록 탐지 위치에 대한 연관 관계를 만들어야 합니다.
우리는 또한 수험자와 연관 관계를 만들어야하며, 당신이 직접 사람을 선택할 수 있습니다
나머지 필드는 아래 그림과 같습니다.
3 모델 애플리케이션 생성
보고서를 업로드해야 하므로 핵산 검사 기관을 위한 PC 측 관리 애플리케이션을 만들어야 합니다. 마이크로 빌드는 모델 애플리케이션을 생성하여 자동으로 생성됩니다.
Weida 콘솔에 로그인하고 적용을 클릭한 다음 새 모델 응용 프로그램을 클릭합니다.
응용 프로그램 이름을 입력하고 새로 만들기를 클릭합니다.
방금 생성한 데이터 소스를 확인하여 모델 애플리케이션 생성을 완료합니다.
플랫폼은 추가, 삭제, 수정 및 확인을 위한 페이지를 자동으로 생성합니다.
릴리스 버튼을 클릭하면 구성 확인이 자동으로 수행되며 표시된 모든 문제는 목표 방식으로 해결해야 합니다.
애플리케이션이 성공적으로 게시되면 링크를 클릭하여 엔터프라이즈 워크벤치에 들어가 특정 콘텐츠를 볼 수 있습니다.
핵산검사기관은 일반적으로 이용자가 열람할 수 있도록 해당 기관의 정보를 미리 입력해야 합니다.
4 애플릿 생성
모델 애플리케이션이 생성된 후 애플릿을 생성하고 적용을 클릭한 후 새 사용자 정의 애플리케이션을 클릭해야 합니다.
애플리케이션 이름을 입력하고 애플릿을 선택하여 생성을 완료합니다.
이 과정에서 빈 페이지를 생성하려면 다시 클릭해야 합니다.
5 홈페이지 개발
우리의 홈 페이지는 기능을 안내하는 그리드 탐색을 제공합니다. 먼저 그리드 탐색 구성 요소를 페이지에 추가하십시오.
탐색 설정의 속성을 수정하고 메뉴를 탐지 지점, 수험자, 온라인 약속의 세 가지 메뉴로 조정합니다.
아이콘을 클릭하여 페이지로 이동합니다. 세 개의 새 페이지를 생성해야 하며, 왼쪽 상단 모서리에 있는 페이지 옆에 있는 + 기호를 클릭하고 추가할 페이지 이름을 입력해야 합니다. 검사포인트, 검사인원, 온라인예약페이지를 각각 추가
페이지 추가 후 해당 페이지에 궁전내비게이션 메뉴를 구성합니다.
상단 탐색 외에도 홈 페이지와 내 페이지 사이를 전환하기 위해 하단 탐색을 추가해야 합니다. 탭 표시줄 구성 요소 추가
탭바 컴포넌트의 레이아웃 모드를 텍스트 모드로 변경하고 탭 목록을 홈 페이지로 변경하고 마이닝하고 선택한 페이지를 홈 페이지로 설정
위의 페이지 생성 방법에 따라 또 다른 마이 페이지 생성
그런 다음 메뉴 항목의 해당 페이지로의 점프를 수정합니다.
6 탐지 포인트 페이지 개발
탐지 지점 페이지에 데이터 목록 구성 요소 추가
체크 포인트를 위해 데이터 모델 수정
단순 목록 제목을 선택하고 텍스트 내용을 감지 지점 이름으로 바인딩합니다.
간단한 목록 내용인지 확인하고 필드를 세부 주소로 바인딩
7 수험자 목록 페이지 개발
탐지 포인트 페이지에 정보를 표시하기만 하면 되며 데이터는 PC 측에서 입력됩니다. 수험자 정보는 사용자가 입력해야 합니다. 데이터를 기록할 때 데이터를 입력한 사람을 식별해야 합니다. 이 식별은 애플릿에서 openid입니다.
초보자인 경우 사용자가 로그인하기 위해 사용자 이름과 암호를 입력하도록 요구하는 것과 같이 권한이 표시되는 즉시 직접 권한을 구현해야 할 수도 있습니다. 이는 일반적으로 사고방식에서 기인하며, 기존의 개발적 사고를 인터넷 애플리케이션에 적용하면 필연적으로 우회로로 이어진다.
일반적으로 우리의 애플릿 사용자는 열렸을 때 이미 익명으로 로그인되어 있으며 로그인하지 않으면 데이터베이스를 작동하고 액세스할 수 없습니다. 그런 다음 애플릿이 열릴 때 로그인 정보를 가져와야 합니다. 즉, 사용자의 openid를 가져와야 합니다.
어떻게 해야 하나요? 일반적으로 글로벌 라이프 사이클의 시작 방법에서 얻습니다. 왼쪽 상단 모서리에 있는 6개의 점을 클릭하고 로우 코드 편집기를 클릭합니다.
열린 인터페이스에서 수명 주기를 클릭하여 openid를 가져오는 코드를 작성합니다.
openid를 얻으려면 다른 페이지에서 사용해야 하는 경우 전역 변수에 값을 저장해야 합니다. 이를 위해 먼저 변수 openid에 전역 변수를 생성해야 합니다.
사용자의 openid를 얻으려면 로우 코드 편집기의 수명 주기에 다음 코드를 입력하십시오.
export default {
async onAppLaunch(launchOpts) {
//console.log('---------> LifeCycle onAppLaunch', launchOpts)
const {
OPENID, FROM_OPENID } = await app.utils.getWXContext()
let userId = FROM_OPENID || OPENID
if (!userId) {
const {
wedaId } = await app.cloud.getUserInfo()
userId = wedaId
}
app.dataset.state.openid = userId
console.log("openid",app.dataset.state.openid)
},
onAppShow(appShowOpts) {
//console.log('---------> LifeCycle onAppShow', appShowOpts)
},
onAppHide() {
//console.log('---------> LifeCycle onAppHide')
},
onAppError(options) {
//console.log('---------> LifeCycle onAppError', options)
},
onAppPageNotFound(options) {
//console.log('---------> LifeCycle onAppPageNotFound', options)
},
onAppUnhandledRejection(options) {
//console.log('---------> LifeCycle onAppUnhandledRejection', options)
}
}
사용자의 openid를 얻은 후 페이지 기능을 개발할 수 있습니다.먼저 데이터 목록 구성 요소를 추가하고 데이터 모델이 수험자를 선택합니다.
우리 탐지 포인트의 데이터는 모든 사람에게 공개되어 있으므로 필터 조건을 설정할 필요가 없습니다. 수험자의 경우 사용자가 자신이 추가한 데이터만 쿼리할 수 있기를 희망하므로 사용자의 현재 openid에 따라 필터링해야 합니다.
필드에 대해 openid를 선택하고 조건에 대해 같음을 선택하고 값에 대해 변수를 선택하고 전역 변수의 openid에서 값을 가져옵니다. 검사포인트 페이지의 데이터 바인딩 방식에 따라 해당 필드에 검사자의 이름과 인증서 번호를 각각 바인딩합니다.
리스트 조회 외에 수험자의 정보를 추가하는 기능도 있는데 하단에 버튼을 추가하고 스타일을 고정으로 설정하고 하단에 고정할 수 있습니다.
먼저 수험자를 위한 새 페이지를 만든 다음 버튼에 클릭 이벤트를 추가하여 새 페이지로 이동합니다.
8 수험자를 위한 새로운 페이지 개발
새 페이지 개발은 비교적 간단하며 양식 컨테이너를 추가하고 수험자의 데이터 소스를 선택하기만 하면 플랫폼이 자동으로 페이지를 생성합니다.
전역 변수에 사용자의 openid를 저장했습니다. 여기서 openid의 입력 값에 바인딩하고 스타일을 hidden으로 설정해야 합니다.
9 핵산 예약 페이지 개발
핵산 예약의 새 페이지도 컨테이너 양식을 사용하고 데이터 소스는 핵산 예약을 선택합니다.
Openid의 설정 방법은 수험자의 새 페이지와 동일합니다.
검사 장소, 검사 대상자, 약속 시간 필드만 사용자에게 공개하고 나머지는 숨깁니다.
발견된 문제는 탐지 포인트를 선택할 때 데이터 ID가 나타나는 것입니다. 이름을 표시해야 합니다. 탐지 포인트 데이터 소스를 수정하고 기본 열 필드를 탐지 포인트 이름으로 변경해야 합니다.
같은 방식으로 주제에 대한 기본 열 필드도 설정합니다.
다시 선택하는 것이 맞습니다.
또 다른 문제는 우리의 수험자가 모두 직원이며 미니 프로그램 사용자가 직접 입력해야 하는 데이터여야 한다는 것입니다. 현재 로그인한 사용자의 openid에 따라 데이터를 필터링해야 하며, 검사 대상자의 드롭다운 선택 구성 요소를 선택하고 옵션 필터 조건을 선택합니다.
필터 조건을 추가하여 필드의 openid를 필터링을 위한 전역 변수의 openid와 동일하게 만듭니다.
이를 통해 사용자는 약속을 잡을 때 자신이 입력한 데이터만 볼 수 있습니다.
10 마이페이지 개발
마이페이지의 기능은 현재 사용자가 예약한 기록의 현황 및 보고 현황을 목록 형태로 표시하는 것입니다. 먼저 현재 로그인한 사람의 보고서 데이터를 조회할 모델 변수를 생성합니다. 변수 식별자를 먼저 입력하십시오.
데이터 소스는 핵산 예약을 선택하고 메서드는 쿼리 목록을 선택합니다.
필터 조건을 추가해야 하지만 여전히 필드의 openid를 전역 변수의 openid와 동일하게 만듭니다.
최종 설정 결과
변수를 정의한 후에는 컴포넌트를 빌드해야 하며, 레벨에 따라 먼저 일반 컨테이너를 배치하고 일반 컨테이너에 다른 일반 컨테이너를 추가한 다음 내부에 두 개의 텍스트 컴포넌트를 배치합니다.
상태로 첫 번째 텍스트 구성 요소의 텍스트 내용을 수정하고 내부 레이어에서 일반 컨테이너를 선택하고 스타일을 플렉스 레이아웃으로 설정하고 양쪽 끝을 정렬합니다.
그런 다음 4개의 구성 요소를 복제합니다.
검사대상자, 검사결과, 샘플링시간, 보고시간 등 텍스트 내용 수정
가장 바깥쪽의 일반 컨테이너에서 루프 디스플레이를 바인딩하고 방금 정의한 변수를 바인딩합니다.
루프가 바인딩된 후 루프 변수의 오른쪽에 있는 텍스트에 필드를 차례로 바인딩할 수 있습니다.
11 사용자 및 권한 생성
모든 기능이 개발된 후 소프트웨어를 사용하려면 비즈니스 담당자에게 전달해야 합니다. 계정을 만들고 업무 담당자에게 권한을 할당해야 합니다. 사용자 클릭, 새 사용자 클릭, 사용자 정보 추가
계정이 추가되면 액세스할 수 있는 페이지를 제어하는 역할을 추가해야 합니다.
설정은 관리자 백그라운드 앱에 액세스할 수 있습니다.
데이터 소스 액세스 권한 활성화
Enterprise Workbench에 대한 액세스 활성화
권한이 활성화된 후 사용자를 추가할 수 있습니다.
12 출시 및 미리보기
PC 측 애플리케이션의 경우 Weida는 직접 액세스할 수 있는 기본 도메인 이름을 구성했습니다. 애플릿을 릴리스해야 하는 경우 탐색 모음에서 릴리스 버튼을 클릭하여 공식 릴리스를 만듭니다.
