지역 정보 추가 삭제

주요 활동 지역

• 태그 관리와 차이점은 미리 제공하는 데이터에서만 선택할 수 있다는 점.

Zone.java

    @Override
    public String toString() {
        return String.format("%s(%s)/%s", city, localNameOfCity, province);
    }

영문이름(한글이름)/province 이런 식으로 보이도록 하기 위해 toString()을 구현한다.

Q. toString()?

객체가 가지고 있는 정보나 값들을 문자열로 만들어 리턴하는 메소드이다.

SettingsController.java

    @GetMapping(ZONES)
    public String updateZonesForm(@CurrentAccount Account account, Model model) throws JsonProcessingException {
        model.addAttribute(account);

        Set<Zone> zones = accountService.getZones(account);
        model.addAttribute("zones", zones.stream().map(Zone::toString).collect(Collectors.toList()));

        List<String> allZones = zoneRepository.findAll().stream().map(Zone::toString).collect(Collectors.toList());
        model.addAttribute("whitelist", objectMapper.writeValueAsString(allZones));

        return SETTINGS + ZONES;
    }

컨트롤러 구현, tag 와 매우 유사하다.
accout추가하고, account가 가지고 있는 모든 정보를 getZones()를 통해 실행

SettingsService.java

    public Set<Zone> getZones(Account account) {
        Optional<Account> byId = accountRepository.findById(account.getId());
        return byId.orElseThrow().getZones();
    }

    public void addZone(Account account, Zone zone) {
        Optional<Account> byId = accountRepository.findById(account.getId());
        byId.ifPresent(a -> a.getZones().add(zone));
    }

    public void removeZone(Account account, Zone zone) {
        Optional<Account> byId = accountRepository.findById(account.getId());
        byId.ifPresent(a -> a.getZones().remove(zone));
    }

"zones" 정보를 모두 Zone::toString, 문자열로 toString 하여 뿌림.

그래서 이와 같이 나오는 것이다.

whitelist는 zoneRepository에 넣어놨던 데이터를 전부 다 읽어오고, toString으로 가져와서 withelist로 만들어줌

zones.html

                        <div id="whitelist" th:text="${whitelist}" hidden></div>
                        <input id="tags" type="text" name="tags" th:value="${#strings.listJoin(zones, ',')}"
                               class="tagify-outside" aria-describedby="tagHelp"/>

본인이 가지고 있는 정보 ${#strings.listJoin(zones, ',')} list join!😊

            function onAdd(e) {
                tagRequest("/add", e.detail.data.value);
            }

            function onRemove(e) {
                tagRequest("/remove", e.detail.data.value);
            }

add or remove ajax 요청이 보내지면 SettingsController에서 처리를 하게 된다.

    @PostMapping(ZONES + "/add")
    @ResponseBody
    public ResponseEntity addZone(@CurrentAccount Account account, @RequestBody ZoneForm zoneForm) {
        Zone zone = zoneRepository.findByCityAndProvince(zoneForm.getCityName(), zoneForm.getProvinceName());
        if (zone == null) {
            return ResponseEntity.badRequest().build();
        }

        accountService.addZone(account, zone);
        return ResponseEntity.ok().build();
    }

ZONE 이름에 해당하는 데이터가 있는지 먼저 검사 후 없으면 badRequest()로 응답을 보낸다.

기존의 지역 정보 자동완성 목록에서만 선택 가능하다.

• Tagify의 whitelist를 사용한다.
• https://yaireo.github.io/tagify/#section-textarea

출처 : 인프런 백기선님의 스프링과 JPA 기반 웹 애플리케이션 개발