사용자 정의 필드 필수 항목 표시 변경 롤백 (jquery로 pattern 조건 변경 예정)

wyu

2021-12-27 c324b3949406123cbeb323c180857d57712b945e

 src/main/webapp/views/customField/customFieldModify.html

@@ -25,7 +25,7 @@
                       ng-maxlength="15"
                       input-regex="[^a-zA-Z0-9 가-힣ㄱ-ㅎㅏ-ㅣ\u318D\u119E\u11A2\u2022\u2025a\u00B7\uFE55]"
                       required>
                <small ng-show="customFieldModifyForm.name.$error.maxlength" class="help-block form-text text-danger"
                <small ng-if="customFieldModifyForm.name.$error.maxlength" class="help-block form-text text-danger"
                       translate="common.upTo15Characters">
                    최대 15글자까지 입력할 수 있습니다.
                </small>
@@ -35,22 +35,36 @@
            <div class="form-group">
                <label for="customFieldModifyForm2"><span translate="customField.fieldType">필드 유형</span><code
                        class="highlighter-rouge">*</code></label>
                <!--&nbsp;&nbsp; <label> <input type="checkbox" ng-model="vm.form.requiredData"> 필수 데이터 </label>-->
                <select id="customFieldModifyForm2" class="form-control" ng-model="vm.form.customFieldType"
                        ng-change="fn.changeCustomFieldType()">
                    <option value="INPUT" translate="common.stringField">문자열 필드</option>
                    <option value="SINGLE_SELECT" translate="common.singleSelectionField">단일 선택 필드</option>
                    <option value="MULTI_SELECT" translate="common.multipleSelectionField">다중 선택 필드</option>
                    <option value="NUMBER" translate="common.numberField">숫자 필드</option>
                    <option value="DATETIME" translate="common.datetimeField">날짜 필드</option>
                    <option value="IP_ADDRESS" translate="common.ipAddressField">IP 주소 필드</option>
                    <option value="EMAIL" translate="common.emailField">이메일 필드</option>
                    <option value="SITE" translate="common.siteField">홈페이지 주소 필드</option>
                    <option value="TEL" translate="common.telField">전화번호 필드</option>
                </select>
                <div class="mt-3">
                    <span class="custom-detail-label">필수 데이터</span>
                    <label class='switch'><input type='checkbox' ng-model="vm.form.requiredData">
                        <span class='slider round'></span>
                    </label>
                </div>
            </div>

            <div class="form-group" ng-show="vm.form.customFieldType != 'INPUT'">
                <label ng-show="vm.form.customFieldType == 'SINGLE_SELECT'"><span
            <div class="form-group" ng-if="vm.form.customFieldType == 'SINGLE_SELECT' || vm.form.customFieldType == 'MULTI_SELECT'">
                <label ng-if="vm.form.customFieldType == 'SINGLE_SELECT'"><span
                        translate="customField.createSingleFieldList">단일 선택 필드 목록 만들기</span> <code
                        class="highlighter-rouge">*</code></label>
                <label ng-show="vm.form.customFieldType == 'MULTI_SELECT'"><span
                <label ng-if="vm.form.customFieldType == 'MULTI_SELECT'"><span
                        translate="customField.createMultiFieldList">다중 선택 필드 목록 만들기</span> <code
                        class="highlighter-rouge">*</code></label>
                <div class="input-group">

                <div class="input-group" ng-if="vm.form.customFieldType == 'SINGLE_SELECT' || vm.form.customFieldType == 'MULTI_SELECT'">
                    <input id="optionAdd"
                           type="text"
                           name="options"
@@ -69,7 +83,8 @@
                </small>
            </div>

            <div ng-repeat="option in vm.form.options" ng-show="vm.form.customFieldType != 'INPUT'">
            <div ng-repeat="option in vm.form.options" ng-if="vm.form.customFieldType == 'SINGLE_SELECT' || vm.form.customFieldType == 'MULTI_SELECT'">
<!--            <div ng-repeat="option in vm.form.options" ng-if="vm.form.customFieldType != 'INPUT'">-->
                <span class="select3-selection__choice">
                    <span>{{option}}</span>
                    <span class="select3-selection__choice__remove" ng-click="fn.removeOption($index)">×</span>
@@ -78,7 +93,8 @@

            <div class="form-group">
                <label for="customFieldModifyForm3"><span translate="customField.defaultValue">기본값</span> </label>
                <input id="customFieldModifyForm3"
                <input ng-if="vm.form.customFieldType == 'INPUT' || vm.form.customFieldType == 'SINGLE_SELECT' || vm.form.customFieldType == 'MULTI_SELECT'"
                       id="customFieldModifyForm3"
                       type="text"
                       name="defaultValue"
                       class="form-control"
@@ -87,15 +103,101 @@
                       kr-input
                       ng-maxlength="100"
                       autocomplete="off">
                <small ng-show="customFieldModifyForm.defaultValue.$error.maxlength"
                       class="help-block form-text text-danger" translate="common.upTo100Characters">

                <input ng-if="vm.form.customFieldType == 'NUMBER'"
                       name="numberType"
                       type="text"
                       class="form-control"
                       kr-input
                       ng-pattern="/^[0-9]*$/"
                       placeholder="숫자만 입력 가능합니다."
                       autocomplete="off"
                       ng-model="vm.form.defaultValue">
                <div ng-if="customFieldModifyForm.numberType.$error.pattern && vm.form.customFieldType == 'NUMBER'" class="help-block form-text text-danger"
                     translate="common.invalidNumberFormat">숫자만 입력 가능합니다.
                </div>

                <input ng-if="vm.form.customFieldType == 'DATETIME'"
                       name="dateTime"
                       class="form-control input-readonly"
                       placeholder="{{'issue.clickToSelectDate' | translate}}"
                       ng-model="vm.form.defaultValue"
                       modal-form-auto-scroll
                       range-type="singleDate"
                       date-range-picker>
                <div class="row">
                    <div class="col-xs-12">
                        <div id="createdWidget" class="bootstrap-datepicker"></div>
                    </div>
                </div>

                <input ng-if="vm.form.customFieldType == 'IP_ADDRESS'"
                       name="ipAddress"
                       type="text"
                       class="form-control"
                       kr-input
                       ng-pattern="/^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/"
                       placeholder="IP 주소 형식만 입력 가능합니다."
                       autocomplete="off"
                       ng-model="vm.form.defaultValue">
                <div ng-if="customFieldModifyForm.ipAddress.$error.pattern && vm.form.customFieldType == 'IP_ADDRESS'" class="help-block form-text text-danger"
                     translate="common.invalidipAdressFormat">IP주소 형식이 맞지 않습니다.
                </div>

                <input ng-if="vm.form.customFieldType == 'EMAIL'"
                       name="email"
                       type="email"
                       class="form-control"
                       maxlength="30"
                       kr-input
                       ng-pattern="/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/"
                       placeholder="이메일 형식만 입력 가능합니다."
                       autocomplete="off"
                       ng-model="vm.form.defaultValue">
                <div ng-if="customFieldModifyForm.email.$error.pattern && vm.form.customFieldType == 'EMAIL'" class="help-block form-text text-danger"
                     translate="common.invalidEmailFormat">이메일 형식이 맞지 않습니다.
                </div>

                <input ng-if="vm.form.customFieldType == 'SITE'"
                       name="site"
                       type="text"
                       class="form-control"
                       maxlength="100"
                       kr-input
                       ng-pattern="/(https?:\/\/)?(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/"
                       placeholder="홈페이지 주소 형식만 입력 가능합니다."
                       autocomplete="off"
                       ng-model="vm.form.defaultValue">
                <div ng-if="customFieldModifyForm.site.$error.pattern && vm.form.customFieldType == 'SITE'" class="help-block form-text text-danger"
                     translate="common.invalidSiteFormat">홈페이지 주소 형식이 맞지 않습니다.(http://로 시작하셔야합니다)
                </div>

                <input ng-if="vm.form.customFieldType == 'TEL'"
                       name="tel"
                       type="text"
                       maxlength="30"
                       class="form-control"
                       kr-input
                       ng-pattern="/^\d{2,3}-\d{3,4}-\d{4}$/"
                       placeholder="연락처 형식만 입력 가능합니다."
                       autocomplete="off"
                       ng-model="vm.form.defaultValue">
                <div ng-if="customFieldModifyForm.tel.$error.pattern && vm.form.customFieldType == 'TEL'" class="help-block form-text text-danger"
                     translate="common.invalidTelFormat">전화번호 형식이 맞지 않습니다.
                </div>

<!--                <small ng-if="customFieldModifyForm.defaultValue.$error.maxlength"-->
<!--                       class="help-block form-text text-danger" translate="common.upTo100Characters">-->
<!--                    최대 100글자까지 입력할 수 있습니다.-->
<!--                </small>-->
                <small ng-if="vm.form.customFieldType == 'INPUT'" translate="common.upTo100Characters">
                    최대 100글자까지 입력할 수 있습니다.
                </small>
                <div class="help-block form-text text-danger" ng-show="vm.form.customFieldType == 'SINGLE_SELECT'"
                <div class="help-block form-text text-danger" ng-if="vm.form.customFieldType == 'SINGLE_SELECT'"
                     translate="customField.selectSingleFieldListHashTag">
                    단일 선택 필드 목록에 있는 값을 기본적으로 선택하고 싶을 때는 해시태그를 사용해야합니다. ex) #대상값
                </div>
                <div class="help-block form-text text-danger" ng-show="vm.form.customFieldType == 'MULTI_SELECT'"
                <div class="help-block form-text text-danger" ng-if="vm.form.customFieldType == 'MULTI_SELECT'"
                     translate="customField.selectMultiFieldListHashTag">
                    다중 선택 필드 목록에 있는 값을 기본적으로 선택하고 싶을 때는 해시태그를 사용해야합니다. ex) #대상값#대상값
                </div>