<template>
  <details open class="form-table-style mb30">
    <summary
      :class="{
        'point-font2': pageRole == 'adm',
        'point-font': pageRole == 'government',
      }"
    >
      <p class="summary-style pl10">기본정보</p>
    </summary>
    <div class="pt10 pb10">
      <table class="form-table">
        <colgroup>
          <col width="50%" />
          <col width="50%" />
        </colgroup>
        <tr>
          <td>
            <div class="gd-12 pl0">
              <label
                :class="{
                  'form-title mb10': true,
                  'point-font2': pageRole == 'adm',
                  'point-font': pageRole == 'government',
                }"
              >
                기업명
              </label>
              <div class="flex">
                <div class="gd-9 pl0">
                  <input
                    type="text"
                    class="full-input"
                    ref="entNm"
                    v-model="entInfoVO['entNm']"
                    placeholder="기업명을 입력하세요."
                  />
                </div>
                <div class="gd-3 pr0">
                  <button
                    type="button"
                    :class="{
                      'large-btn': true,
                      'blue-border-btn': pageRole == 'adm',
                      'green-border-btn': pageRole == 'government',
                    }"
                    @click="fnSearch"
                  >
                    조회
                  </button>
                </div>
              </div>
            </div>
          </td>
          <td>
            <div class="gd-12 pr0">
              <label
                :class="{
                  'form-title mb10': true,
                  'point-font2': pageRole == 'adm',
                  'point-font': pageRole == 'government',
                }"
              >
                사업자번호
              </label>
              <input
                type="text"
                class="full-input"
                ref="brno"
                v-model.trim="entInfoVO['brno']"
                maxlength="10"
                placeholder="사업자번호를 입력하세요."
                oninput="this.value = this.value.replace(/[^0-9]/g, '')"
              />
            </div>
          </td>
        </tr>
        <tr>
          <td>
            <div class="gd-12 pl0">
              <label
                :class="{
                  'form-title mb10': true,
                  'point-font2': pageRole == 'adm',
                  'point-font': pageRole == 'government',
                }"
              >
                대표자명
              </label>
              <input
                type="text"
                class="full-input"
                ref="rprsvNm"
                v-model="entInfoVO['rprsvNm']"
                placeholder="대표자명을 입력하세요."
              />
            </div>
          </td>
          <td>
            <div class="flex gd-12 pr0">
              <div class="gd-6 pl0">
                <label
                  for=""
                  :class="{
                    'form-title mb10': true,
                    'point-font2': pageRole == 'adm',
                    'point-font': pageRole == 'government',
                  }"
                >
                  기업신용
                </label>
                <input
                  type="text"
                  class="full-input"
                  ref="entCrdt"
                  v-model="entInfoVO['entCrdt']"
                  placeholder="기업신용을 입력하세요."
                />
              </div>
              <div class="gd-6 pr0">
                <label
                  for=""
                  :class="{
                    'form-title mb10': true,
                    'point-font2': pageRole == 'adm',
                    'point-font': pageRole == 'government',
                  }"
                >
                  설립일
                </label>
                <input
                  type="date"
                  class="full-input"
                  ref="fndnDt"
                  v-model="entInfoVO['fndnDt']"
                />
              </div>
            </div>
          </td>
        </tr>
        <tr>
          <td>
            <div class="gd-12 pl0">
              <label
                :class="{
                  'form-title mb10': true,
                  'point-font2': pageRole == 'adm',
                  'point-font': pageRole == 'government',
                }"
              >
                표준산업분류 코드
              </label>
              <div class="flex">
                <div class="gd-6 pl0">
                  <input
                    type="text"
                    class="full-input"
                    ref="ksicUpCd"
                    v-model.trim="entInfoVO['ksicUpCd']"
                    placeholder="상위분류를 입력하세요."
                  />
                </div>
                <div class="gd-6 pr0">
                  <input
                    type="text"
                    class="full-input"
                    ref="ksicCd"
                    v-model.trim="entInfoVO['ksicCd']"
                    placeholder="하위분류를 입력하세요."
                  />
                </div>
              </div>
            </div>
          </td>
          <td>
            <div class="gd-12 pr0">
              <label
                :class="{
                  'form-title mb10': true,
                  'point-font2': pageRole == 'adm',
                  'point-font': pageRole == 'government',
                }"
              >
                표준산업분류
              </label>
              <input
                type="text"
                class="full-input"
                ref="ksicNm"
                v-model="entInfoVO['ksicNm']"
                placeholder="표준사업분류를 입력하세요."
              />
            </div>
          </td>
        </tr>
        <tr>
          <td>
            <div class="gd-12 pl0">
              <label
                :class="{
                  'form-title mb10': true,
                  'point-font2': pageRole == 'adm',
                  'point-font': pageRole == 'government',
                }"
              >
                주요제품
              </label>
              <input
                type="text"
                class="full-input"
                ref="mainPrdct"
                v-model="entInfoVO['mainPrdct']"
                placeholder="주요제품을 입력하세요."
              />
            </div>
          </td>
          <td>
            <div class="gd-12 pr0">
              <label
                :class="{
                  'form-title mb10': true,
                  'point-font2': pageRole == 'adm',
                  'point-font': pageRole == 'government',
                }"
              >
                폐업여부
              </label>
              <div class="flex">
                <div class="gd-6 flex align-center pl0">
                  <input
                    type="radio"
                    class="mr5"
                    name="clsbizYn"
                    id="clsbizYnFalse"
                    v-model="entInfoVO['clsbizYn']"
                    value="N"
                  />
                  <label for="clsbizYnFalse">운영중</label>
                </div>
                <div class="gd-6 flex align-center pr0">
                  <input
                    type="radio"
                    class="mr5"
                    name="clsbizYn"
                    id="clsbizYnTrue"
                    v-model="entInfoVO['clsbizYn']"
                    value="Y"
                  />
                  <label for="clsbizYnTrue">폐업</label>
                </div>
              </div>
            </div>
          </td>
        </tr>
        <tr>
          <td>
            <div class="gd-12 pl0">
              <label
                :class="{
                  'form-title mb10': true,
                  'point-font2': pageRole == 'adm',
                  'point-font': pageRole == 'government',
                }"
              >
                고용인원수
              </label>
              <input
                type="text"
                class="full-input"
                ref="mainPrdct"
                v-model="entInfoVO['mainPrdct']"
                placeholder="고용인원수를 입력하세요."
              />
            </div>
          </td>
          <td>
            <div class="gd-12 pr0">
              <label
                :class="{
                  'form-title mb10': true,
                  'point-font2': pageRole == 'adm',
                  'point-font': pageRole == 'government',
                }"
              >
                소재지
              </label>
              <div class="flex">
                <div class="gd-6 pl0">
                  <select name="" id="" class="full-input">
                    <option value="">행정구역을 선택하세요.</option>
                    <option value="">강원특별자치도</option>
                    <option value="">경기도</option>
                    <option value="">경상남도</option>
                    <option value="">경상북도</option>
                    <option value="">광주광역시</option>
                    <option value="">대구광역시</option>
                    <option value="">대전광역시</option>
                    <option value="">부산광역시</option>
                    <option value="">서울특별시</option>
                    <option value="">세종특별자치시</option>
                    <option value="">울산광역시</option>
                    <option value="">인천광역시</option>
                    <option value="">전라남도</option>
                    <option value="">전북특별자치도</option>
                    <option value="">제주특별자치도</option>
                    <option value="">충청남도</option>
                    <option value="">충청북도</option>
                  </select>
                </div>
                <div class="gd-6 pr0">
                  <input
                    type="text"
                    class="full-input"
                    ref="mainPrdct"
                    v-model="entInfoVO['mainPrdct']"
                    placeholder="시, 군, 구를 입력하세요. ex)영주시"
                  />
                </div>
              </div>
            </div>
          </td>
        </tr>
        <tr>
          <td colspan="2">
            <label
              :class="{
                'form-title mb10': true,
                'point-font2': pageRole == 'adm',
                'point-font': pageRole == 'government',
              }"
            >
              주소
            </label>
            <input
              type="text"
              class="full-input"
              ref="mainPrdct"
              v-model="entInfoVO['mainPrdct']"
              placeholder="나머지 주소를 입력하세요."
            />
          </td>
          <td></td>
        </tr>
      </table>
    </div>
  </details>

  <!-- 기업명 조회 -->
  <Modal :showModal="isOpen">
    <template v-slot:header>
      <div
        :class="{
          'box-title': true,
          'point-font2': pageRole == 'adm',
          'point-font': pageRole == 'government',
        }"
      >
        <p>기업정보 조회</p>
      </div>
      <button class="close-btn" @click="fnDownloadModalClose">X</button>
    </template>
    <table class="form-table2 mb10">
      <colgroup>
        <col style="width: 30%" />
        <col />
      </colgroup>
      <thead>
        <tr>
          <th>기업명</th>
          <th>사업자번호</th>
          <th>대표자명</th>
          <th>비고</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="(item, index) of list" :key="index">
          <td>{{ item.entNm }}</td>
          <td class="text-ct">{{ item.brno }}</td>
          <td class="text-ct">{{ item.rprsvNm }}</td>
          <td class="text-ct">
            <button
              type="button"
              :class="{
                'large-btn': true,
                'blue-border-btn': pageRole == 'adm',
                'green-border-btn': pageRole == 'government',
              }"
              @click="fnModalInsert(item)"
            >
              이동
            </button>
          </td>
        </tr>
      </tbody>
    </table>
    <template v-slot:footer>
      <div class="gd-2"></div>
      <div class="gd-8">
        <PaginationButton
          v-model:currentPage="search.currentPage"
          :pagination="search"
          :click="fnViewList"
          :className="pageRole == 'adm' ? 'admin-pagination' : null"
        />
      </div>
      <div class="gd-2"></div>
    </template>
  </Modal>
</template>

<script>
export default {};
</script>