Modal 작업... 힘듦..

Updated on 2019-09-16

Nuxt 에서 Modal을 만들고 있다..
추가, 수정할때에는 모달로 열어서 데이터를 보고 수정할 수 있게 만들기 위해서인데..

메인의 로그인 인증 모달같은 경우는 $refs 를 사용 했는데.
이 경우에는 Vue에서 추천하고 있지 않다고 한다…

그래서.. 우여곡절 끝에.. Modal 컴포넌트를 만들었다…
하루 걸렸음. .

앞선 데이터는 Slot으로 넣어주고, 안에서 버튼 클릭 시에는 다시 부모 컴포넌트 이벤트를 호출하게끔 했다.

일반적인 모달 사용이라면, 이 컴포넌트를 계속해서 재사용하게 될 예정이다..

와.. 진짜… 지금 거의다 된 듯 싶었는데…
모달에 vee-validate를 주는 것이 안되고 있다..
Slot으로 넣어줘서 그런가? 도대체 뭐가 원인이란 말인가..
머리가 너무 아프다.. 후우….. 스트레스 받네…
너무너무 해결이 안된다..

(2시간 경과… 새벽 4시 40분)
vee-validate로 컴포넌트 사용은 가능하다.. 하지만, 여기서 에러를 띄우고 할 수는 있다…

근데 여기가 가장 큰 문제점이다..

만약에, 모달에서 [추가]버튼을 눌렀는데, 같은 이름이 있어서 거절됬다고 치자..
그러면, 분명 모달은 열려있는 상태에서, 에러 값을 갱신시켜줘야 할거다..

하지만… 이게 안되는거 같은데…..
애초에 프로바이더나 옵져버로 사용을 하게되면, 에러백을 사용할 수가 없게되는것 같은데….

그러면 모달 컴포넌트 재사용 자체가 가능하긴 한건가 ? 불가능하잖아. 그러면 매번 모달 컴포넌트를 각자에 맞춰서 다 만들어줘야하나.. 하아.. 대갈빡 뿌서진다..

컴포넌트 안에 Slot으로 넣어주는건데.. 여기서 Slot으로 넣어줄때에…가 문제인데.. 프로바이더로는 해결이 되려나 ? 후미 !

이게 4일전 저장 글일듯..

vee-validate 는 버젼이 3.0으로 업데이트 됬었음.. 그래서 그 부분에 맞춰서 전부 수정하느라 더 시간 오래 걸렸고,, 결과적으로는 모두 성공..
Role하고 Permission 부분 전부 만들었음..

        $validator = Validator::make($request->all(), [
            'name' => 'required|string|unique:roles,name,'.$id.',id',
            'permission' => 'required',
        ]);

특히나 여기서… update할때, 닉네임이 중복되는걸 예외시켜야하는데.. 그 부분에 있어서
unique:roles,name,’.$id.’,id’ 처리해줬고..

$role->update($request->except('permission'));

여기서.. update할때 원래 all() 해도 없는 컬럼은 무시됬던거같은데.. 아니였나봄…
근데 생각해보니 except 로 처리하는 것보다, only 처리하는게 나을것 같네..
수정하도록 하겠음..

$role->update($request->only(['name']));

수정했음… only 로 넣어주고, 굳이 넣어줄 필요가 없는 id나 update_at 기타 등은 안하는게 나을듯..

if($role->updated_at->toDateTimeString() === $request->updated_at) {

그리고… form에 updated_at 을 받아서, 다를 경우에는 에러를 나오게 했음..
그래야지만, 동시다발적으로 누군가 수정했을때에 온전한 데이터가 아닌 상태에서 수정되는것을 방지할 수 있음…

우여곡절 끝에.. 어쨌든, 권한 부분을 전부 만들었다.. 이제 프론트랑 백엔드에서 권한 부여하고서,, 수정되는지 테스트해봐야한다…

Modal 작업... 힘듦..

다른 글