Aurora Modules

1:1문의 상세

1:1문의 상세 페이지에서 노출되는 모듈입니다.

URL: /pages/my/inquiry-detail.html?inquiryNo={inquiryNo}&boardIdx={boardIdx}

모듈명: inquiry-detail원본소스

1:1문의 상세 모듈입니다.

사용 가능 변수

변수명	타입	기본값	설명
totalAvailableAmt	number	0	사용가능한 총 적립금액
totalExpireAmt	number	0	만료조회 총 적립금액
accumulationConfig	AccumulationConfig	-	몰 적립금 설정 API 응답 중 `accumulationConfig`와 동일 (아래 타입 참조)

AccumulationConfig 타입

속성명	타입	기본값	설명
accumulationName	string	-	적립금명
accumulationUnit	string	-	적립금 단위

커스텀 핸들바 더 알아보기

:query 속성 더 알아보기

<main class="l-my-page">
    <div class="my-page-box">
        <div class="right-box">
            <inquiry-detail inquiry-no:query="inquiryNo" board-idx:query="boardIdx">
                    <div class='inquiry-detail'>
                        <div class='right-box__container'>
                            <p class='right-box__head'>
                                <span class='right-box__title'>1:1문의 상세</span>
                            </p>
                            <div class='right-box__table' slot='inquiryDetail'>
                                <table class='l-table'>
                                    <colgroup>
                                        <!-- 번호 -->
                                        <col width='10%' />
                                        <!--문의유형 -->
                                        <col width='10%' />
                                        <!-- 제목-->
                                        <col />
                                        <!-- 관리 -->
                                        <col width='20%' />
                                    </colgroup>
                                    <tbody>
                                        <tr>
                                            <td>{{boardIdx}}</td>
                                            <td>
                                                <p class='inquiry-item__type'>{{inquiryDetail.inquiryTypeInformation.name}}</p>
                                            </td>
                                            <td class='td_left'>
                                                <span class="inquiry-detail__title">
                                                    {{inquiryDetail.inquiryTitle}}
                                                </span>
                                            </td>
                                            <td>
                                                <div class="inquiry-item__top-writer">
                                                    <span class="font-noto bold">{{maskingName inquiryDetail.issuerName}}</span>
                                                    <span class='inquiry-item__date'>{{formatUseByDate inquiryDetail.registerYmdt}}</p>
                                                </div>
                                                {{#ifEq inquiryDetail.inquiryStatus 'ANSWERED'}}
                                                    <span class='badge badge--line-dark'>답변완료</span>
                                                {{else}}
                                                    <span class='badge badge--line-point'>답변대기</span>
                                                {{/ifEq}}
                                            </td>
                                        </tr>
                                        <tr class='right-box__row'>
                                            <td class='td_icon'><strong class='font-montserrat right-box__icon right-box__icon-question'>Q</strong></td>
                                            <td colspan='2' class='td_left'>
                                                <div class='right-box__content'>
                                                    <span class="inquiry-detail__content">
                                                        {{inquiryDetail.inquiryContent}}
                                                    </span>
                                                </div>
                                                    {{#if inquiryDetail.images.length}}
                                                    <div class='right-box__question-attach-files folding-images-by-one-row is-active'>
                                                        <ul class='folding-images-by-one-row__image-list' shopby-images='{{inquiryDetail.images}}'>
                                                            {{#each inquiryDetail.images}}
                                                                <li class='folding-images-by-one-row__image-item' shopby-image-idx='{{@index}}'>
                                                                    {{img imageUrl 100 100 originName}}
                                                                    <button class='folding-images-by-one-row__image-zoom-in' shopby-on:click='ZOOM_IN_IMAGE'>
                                                                        <span class='ico ico--magnet-white-12'></span>
                                                                    </button>
                                                                </li>
                                                            {{/each}}
                                                        </ul>
                                                    </div>
                                                    {{/if}}
                                            </td>
                                            <td></td>
                                        </tr>
                                        {{#if inquiryDetail.answerInformation}}
                                            <tr class='right-box__row'>
                                                <td class='td_icon'><strong class='font-montserrat right-box__icon right-box__icon-answer'>A</strong></td>
                                                <td colspan='2' class='td_left'>
                                                    <div class='right-box__answer'>
                                                        {{{inquiryDetail.answerInformation.content}}}
                                                    </div>
                                                </td>
                                                <td>운영자 | {{formatUseByDate inquiryDetail.answerInformation.registerYmdt}}</td>
                                            </tr>
                                        {{/if}}
                                    </tbody>
                                </table>
                            </div>
                            <div class='right-box__btns' shopby-inquiry-no='{{inquiryDetail.inquiryNo}}' shopby-uses-attachment='{{inquiryConfiguration.usesAttachment}}' shopby-inquiry-board-name="{{inquiryConfiguration.name}}">
                                <div>
                                    {{#unless inquiryDetail.answerInformation}}
                                            <button class='btn btn--line-gray btn--xs' shopby-action='MODIFY'>수정</button>
                                            <button class='btn btn--line-gray btn--xs' shopby-action='DELETE'>삭제</button>
                                    {{/unless}}
                                </div>
                                <button class='btn btn--line-dark btn--xs' shopby-action='LIST'>목록</button>
                            </div>
                        </div>
                    </div>
            </inquiry-detail>
        </div>
    </div>
</main>

<main class="l-content">
    <inquiry-detail inquiry-no:query="inquiryNo" board-idx:query="boardIdx">
        <div class="personal-inquiry-detail">
            <div class="inquiry-item">
                <div class="inquiry-item__top">
                    {{#ifEq inquiryDetail.inquiryStatus 'ANSWERED'}}
                    <span class="badge badge--line-dark">답변완료</span>
                    {{else}}
                    <span class="badge badge--line-point">답변대기</span>
                    {{/ifEq}}
                    <div class="inquiry-item__top-writer">
                        <span class="font-noto bold">{{inquiryDetail.issuerName}}</span>
                        <span class="inquiry-item__date">{{formatUseByDate inquiryDetail.registerYmdt}}</span>
                    </div>
                </div>
                <div class="inquiry-item__bottom">
                    {{img (getFirstImageWithDefault inquiryDetail.images.imageUrl) 80 80 productName '' ''}}
                    <div class="inquiry-item__inquiry-info">
                        <p class="inquiry-item__inquiry-type">문의유형 - {{inquiryDetail.inquiryTypeInformation.name}}</p>
                        <p class="inquiry-item__inquiry-title">
                            <span class="ico ico--lock-black-16"></span>
                            {{inquiryDetail.inquiryTitle}}
                        </p>
                    </div>
                </div>
            </div>
            <div class="inquiry-item__reply">
                <strong class="reply-icon reply-icon--question">Q</strong>
                <div class="question-content">
                    <p>{{inquiryDetail.inquiryContent}}</p>
                    <div class="folding-images-by-one-row is-active">
                        <ul class="folding-images-by-one-row__image-list" shopby-images="{{inquiryDetail.images}}">
                            {{#each inquiryDetail.images}}
                            <li class="folding-images-by-one-row__image-item" shopby-image-idx="{{@index}}">
                                {{img imageUrl 80 80 originName}}
                                <button class="folding-images-by-one-row__image-zoom-in" shopby-on:click="ZOOM_IN_IMAGE">
                                    <span class="ico ico--magnet-white-12"></span>
                                </button>
                            </li>
                            {{/each}}
                        </ul>
                    </div>
                </div>
            </div>
            {{#if inquiryDetail.answerInformation}}
            <div class="inquiry-item__reply">
                <strong class="reply-icon reply-icon--answer">A</strong>
                <div class="inquiry-item__top-writer">
                    <span class="font-noto bold">운영자</span>
                    <span class="inquiry-item__date">{{formatUseByDate inquiryDetail.answerInformation.registerYmdt}}</span>
                    <div class="reply-content">{{{inquiryDetail.answerInformation.content}}}</div>
                </div>
            </div>
            {{/if}}

            <div
                class="personal-inquiry-detail__detail-btn-group"
                shopby-inquiry-no="{{inquiryDetail.inquiryNo}}"
                shopby-uses-attachment="{{inquiryConfiguration.usesAttachment}}"
            >
                {{#unless inquiryDetail.answerInformation}}
                <div>
                    <button class="btn btn--line-gray btn--md personal-inquiry__modify-btn" shopby-action="MODIFY">수정</button>
                    <button class="btn btn--line-gray btn--md personal-inquiry__modify-btn" shopby-action="DELETE">삭제</button>
                </div>
                {{/unless}}
                <button class="btn btn--fill-dark btn--lg personal-inquiry-detail__list-btn" shopby-action="LIST">목록</button>
            </div>
        </div>
    </inquiry-detail>
</main>

/* 여기에 스타일 코드를 작성해주세요. */