<template>
  <el-dialog :visible.sync="fontSelectVisible" :title="$t('label.select_font_pic')" v-if="fontSelectVisible" width="70%" custom-class="font_select  dialogPaddingTop0" :append-to-body="innerDialog">
    <el-container>
      <div class="fontContainer">
        <div id="icons">
          <section id="new">
            <h2 class="page-header">New Icons</h2>
            <div class="row fontawesome-icon-list">
              <div class="fa-hover" v-for="(elm, ind) in data.newIcons" :key="ind" @click="checkFontIcon('newIcons', ind)">
                <a :class="{ checkedA: ind == checkIndex && 'newIcons' == checkType }"><i :class="elm.className"></i>{{ elm.description }}</a>
              </div>
            </div>
          </section>
          <section id="web-application">
            <h2 class="page-header">Web Application Icons</h2>
            <div class="row fontawesome-icon-list">
              <div class="fa-hover" v-for="(elm, ind) in data.webApplicationIcons" :key="ind"  @click="checkFontIcon('webApplicationIcons', ind)">
                <a :class="{ checkedA: ind == checkIndex && 'webApplicationIcons' == checkType }"><i :class="elm.className"></i>{{ elm.description }}</a>
              </div>
            </div>
          </section>
          <section id="hand">
            <h2 class="page-header">Hand Icons</h2>
            <div class="row fontawesome-icon-list">
              <div class="fa-hover" v-for="(elm, ind) in data.handIcons" :key="ind" @click="checkFontIcon('handIcons', ind)">
                <a :class="{ checkedA: ind == checkIndex && 'handIcons' == checkType }"><i :class="elm.className"></i>{{ elm.description }}</a>                
              </div>
            </div>
          </section>
          <section id="transportation">
            <h2 class="page-header">Transportation Icons</h2>
            <div class="row fontawesome-icon-list">
              <div class="fa-hover" v-for="(elm, ind) in data.transportationIcons" :key="ind" @click="checkFontIcon('transportationIcons', ind)">
                <a :class="{ checkedA: ind == checkIndex && 'transportationIcons' == checkType }"><i :class="elm.className"></i>{{ elm.description }}</a>                
              </div>
            </div>
          </section>
          <section id="gender">
            <h2 class="page-header">Gender Icons</h2>
            <div class="row fontawesome-icon-list">
              <div class="fa-hover" v-for="(elm, ind) in data.genderIcons" :key="ind" @click="checkFontIcon('genderIcons', ind)">
                <a :class="{ checkedA: ind == checkIndex && 'genderIcons' == checkType }"><i :class="elm.className"></i>{{ elm.description }}</a>
              </div>
            </div>
          </section>
          <section id="filetype">
            <h2 class="page-header">File Type Icons</h2>
            <div class="row fontawesome-icon-list">
              <div class="fa-hover" v-for="(elm, ind) in data.fileTypeIcons" :key="ind" @click="checkFontIcon('fileTypeIcons', ind)">
                <a :class="{ checkedA: ind == checkIndex && 'fileTypeIcons' == checkType }"><i :class="elm.className"></i>{{ elm.description }}</a>                
              </div>
            </div>
          </section>
          <section id="spinner">
            <h2 class="page-header">Spinner Icons</h2>
            <div class="row fontawesome-icon-list">
              <div class="fa-hover" v-for="(elm, ind) in data.spinnerIcons" :key="ind" @click="checkFontIcon('spinnerIcons', ind)">
                <a :class="{ checkedA: ind == checkIndex && 'spinnerIcons' == checkType }"><i :class="elm.className"></i>{{ elm.description }}</a>                
              </div>
            </div>
          </section>
          <section id="formControl">
            <h2 class="page-header">Form Control Icons</h2>
            <div class="row fontawesome-icon-list">
              <div class="fa-hover" v-for="(elm, ind) in data.formControlIcons" :key="ind" @click="checkFontIcon('formControlIcons', ind)">
                <a :class="{ checkedA: ind == checkIndex && 'formControlIcons' == checkType }"><i :class="elm.className"></i>{{ elm.description }}</a>                
              </div>
            </div>
          </section>
          <section id="payment">
            <h2 class="page-header">Payment Icons</h2>
            <div class="row fontawesome-icon-list">
              <div class="fa-hover" v-for="(elm, ind) in data.paymentIcons" :key="ind" @click="checkFontIcon('paymentIcons', ind)">
                <a :class="{ checkedA: ind == checkIndex && 'paymentIcons' == checkType }"><i :class="elm.className"></i>{{ elm.description }}</a>                
              </div>
            </div>
          </section>
          <section id="chart">
            <h2 class="page-header">Chart Icons</h2>
            <div class="row fontawesome-icon-list">
              <div class="fa-hover" v-for="(elm, ind) in data.chartIcons" :key="ind" @click="checkFontIcon('chartIcons', ind)">
                <a :class="{ checkedA: ind == checkIndex && 'chartIcons' == checkType }"><i :class="elm.className"></i>{{ elm.description }}</a>                
              </div>
            </div>
          </section>
          <section id="currency">
            <h2 class="page-header">Currency Icons</h2>
            <div class="row fontawesome-icon-list">
              <div class="fa-hover" v-for="(elm, ind) in data.currencyIcons" :key="ind" @click="checkFontIcon('currencyIcons', ind)">
                <a :class="{ checkedA: ind == checkIndex && 'currencyIcons' == checkType }"><i :class="elm.className"></i>{{ elm.description }}</a>                
              </div>
            </div>
          </section>
          <section id="textEditor">
            <h2 class="page-header">Text Editor Icons</h2>
            <div class="row fontawesome-icon-list">
              <div class="fa-hover" v-for="(elm, ind) in data.textEditorIcons" :key="ind" @click="checkFontIcon('textEditorIcons', ind)">
                <a :class="{ checkedA: ind == checkIndex && 'textEditorIcons' == checkType }"><i :class="elm.className"></i>{{ elm.description }}</a>                
              </div>
            </div>
          </section>
          <section id="directional">
            <h2 class="page-header">Directional Icons</h2>
            <div class="row fontawesome-icon-list">
              <div class="fa-hover" v-for="(elm, ind) in data.directionalIcons" :key="ind" @click="checkFontIcon('directionalIcons', ind)">
                <a :class="{ checkedA: ind == checkIndex && 'directionalIcons' == checkType }"><i :class="elm.className"></i>{{ elm.description }}</a>                
              </div>
            </div>
          </section>
          <section id="videoPlayer">
            <h2 class="page-header">Video Player Icons</h2>
            <div class="row fontawesome-icon-list">
              <div class="fa-hover" v-for="(elm, ind) in data.videoPlayerIcons" :key="ind" @click="checkFontIcon('videoPlayerIcons', ind)">
                <a :class="{ checkedA: ind == checkIndex && 'videoPlayerIcons' == checkType }"><i :class="elm.className"></i>{{ elm.description }}</a>                
              </div>
            </div>
          </section>
          <section id="brand">
            <h2 class="page-header">Brand Icons</h2>
            <div class="row fontawesome-icon-list">
              <div class="fa-hover" v-for="(elm, ind) in data.brandIcons" :key="ind" @click="checkFontIcon('brandIcons', ind)">
                <a :class="{ checkedA: ind == checkIndex && 'brandIcons' == checkType }"><i :class="elm.className"></i>{{ elm.description }}</a>                
              </div>
            </div>
          </section>
          <section id="media">
            <h2 class="page-header">Media Icons</h2>
            <div class="row fontawesome-icon-list">
              <div class="fa-hover" v-for="(elm, ind) in data.mediaIcons" :key="ind" @click="checkFontIcon('mediaIcons', ind)">
                <a :class="{ checkedA: ind == checkIndex && 'mediaIcons' == checkType }"><i :class="elm.className"></i>{{ elm.description }}</a>                
              </div>
            </div>
          </section>
        </div>
      </div>
    </el-container>
    <div class=" dialog-footer" slot="footer">
      <el-row>
        <el-col style="text-align:right;margin-top:10px;width:100%;">
          <span class="toolbar-buttons">
            <el-button @click="onCancel" size="small" type="primary" plain>{{$t('btns.cancel')}}</el-button>
            <el-button type="primary" @click="onOk" size="small">{{$t('btns.confirm')}}</el-button>
          </span>
        </el-col>
      </el-row>
    </div>
  </el-dialog>
</template>

<script>
import "../../assets/css/font-awesome.min.css";

export default {
  data() {
    return {
      data: {
        newIcons: [
          {
            className: "fa fa-bluetooth",
            description: "bluetooth",
          },
          {
            className: "fa fa-bluetooth-b",
            description: "bluetooth-b",
          },
          {
            className: "fa fa-codiepie",
            description: "codiepie",
          },
          {
            className: "fa fa-credit-card-alt",
            description: "credit-card-alt",
          },
          {
            className: "fa fa-edge",
            description: "edge",
          },
          {
            className: "fa fa-fort-awesome",
            description: "fort-awesome",
          },
          {
            className: "fa fa-hashtag",
            description: "hashtag",
          },
          {
            className: "fa fa-mixcloud",
            description: "mixcloud",
          },
          {
            className: "fa fa-modx",
            description: "modx",
          },
          {
            className: "fa fa-pause-circle",
            description: "pause-circle",
          },
          {
            className: "fa fa-pause-circle-o",
            description: "pause-circle-o",
          },
          {
            className: "fa fa-percent",
            description: "percent",
          },
          {
            className: "fa fa-product-hunt",
            description: "product-hunt",
          },
          {
            className: "fa fa-reddit-alien",
            description: "reddit-alien",
          },
          {
            className: "fa fa-scribd",
            description: "scribd",
          },
          {
            className: "fa fa-shopping-bag",
            description: "shopping-bag",
          },
          {
            className: "fa fa-shopping-basket",
            description: "shopping-basket",
          },
          {
            className: "fa fa-stop-circle",
            description: "stop-circle",
          },
          {
            className: "fa fa-stop-circle-o",
            description: "stop-circle-o",
          },
          {
            className: "fa fa-usb",
            description: "usb",
          },
        ],
        webApplicationIcons: [
          {
            className: "fa fa-bluetooth",
            description: "bluetooth",
          },
          {
            className: "fa fa-bluetooth-b",
            description: "bluetooth-b",
          },
          {
            className: "fa fa-codiepie",
            description: "codiepie",
          },
          {
            className: "fa fa-credit-card-alt",
            description: "credit-card-alt",
          },
          {
            className: "fa fa-edge",
            description: "edge",
          },
          {
            className: "fa fa-fort-awesome",
            description: "fort-awesome",
          },
          {
            className: "fa fa-hashtag",
            description: "hashtag",
          },
          {
            className: "fa fa-mixcloud",
            description: "mixcloud",
          },
          {
            className: "fa fa-modx",
            description: "modx",
          },
          {
            className: "fa fa-pause-circle",
            description: "pause-circle",
          },
          {
            className: "fa fa-pause-circle-o",
            description: "pause-circle-o",
          },
          {
            className: "fa fa-percent",
            description: "percent",
          },
          {
            className: "fa fa-product-hunt",
            description: "product-hunt",
          },
          {
            className: "fa fa-reddit-alien",
            description: "reddit-alien",
          },
          {
            className: "fa fa-scribd",
            description: "scribd",
          },
          {
            className: "fa fa-shopping-bag",
            description: "shopping-bag",
          },
          {
            className: "fa fa-shopping-basket",
            description: "shopping-basket",
          },
          {
            className: "fa fa-stop-circle",
            description: "stop-circle",
          },
          {
            className: "fa fa-stop-circle-o",
            description: "stop-circle-o",
          },
          {
            className: "fa fa-usb",
            description: "usb",
          },
          {
            className: "fa fa-adjust",
            description: "adjust",
          },
          {
            className: "fa fa-anchor",
            description: "anchor",
          },
          {
            className: "fa fa-archive",
            description: "archive",
          },
          {
            className: "fa fa-area-chart",
            description: "area-chart",
          },
          {
            className: "fa fa-arrows",
            description: "arrows",
          },
          {
            className: "fa fa-arrows-h",
            description: "arrows-h",
          },
          {
            className: "fa fa-arrows-v",
            description: "arrows-v",
          },
          {
            className: "fa fa-asterisk",
            description: "asterisk",
          },
          {
            className: "fa fa-at",
            description: "at",
          },
          {
            className: "fa fa-automobile",
            description: "automobile",
          },
          {
            className: "fa fa-balance-scale",
            description: "balance-scale",
          },
          {
            className: "fa fa-ban",
            description: "ban",
          },
          {
            className: "fa fa-bank",
            description: "bank",
          },
          {
            className: "fa fa-bar-chart",
            description: "bar-chart",
          },
          {
            className: "fa fa-bar-chart-o",
            description: "bar-chart-o",
          },
          {
            className: "fa fa-barcode",
            description: "barcode",
          },
          {
            className: "fa fa-bars",
            description: "bars",
          },
          {
            className: "fa fa-battery-0",
            description: "battery-0",
          },
          {
            className: "fa fa-battery-1",
            description: "battery-1",
          },
          {
            className: "fa fa-battery-2",
            description: "battery-2",
          },
          {
            className: "fa fa-battery-3",
            description: "battery-3",
          },
          {
            className: "fa fa-battery-4",
            description: "battery-4",
          },
          {
            className: "fa fa-battery-empty",
            description: "battery-empty",
          },
          {
            className: "fa fa-battery-full",
            description: "battery-full",
          },
          {
            className: "fa fa-battery-half",
            description: "battery-half",
          },
          {
            className: "fa fa-battery-quarter",
            description: "battery-quarter",
          },
          {
            className: "fa fa-battery-three-quarters",
            description: "battery-three-quarters",
          },
          {
            className: "fa fa-bed",
            description: "bed",
          },
          {
            className: "fa fa-beer",
            description: "beer",
          },
          {
            className: "fa fa-bell",
            description: "bell",
          },
          {
            className: "fa fa-bell-o",
            description: "bell-o",
          },
          {
            className: "fa fa-bell-slash",
            description: "bell-slash",
          },
          {
            className: "fa fa-bell-slash-o",
            description: "bell-slash-o",
          },
          {
            className: "fa fa-bicycle",
            description: "bicycle",
          },
          {
            className: "fa fa-binoculars",
            description: "binoculars",
          },
          {
            className: "fa fa-birthday-cake",
            description: "birthday-cake",
          },
          {
            className: "fa fa-bluetooth",
            description: "bluetooth",
          },
          {
            className: "fa fa-bluetooth-b",
            description: "bluetooth-b",
          },
          {
            className: "fa fa-bolt",
            description: "bolt",
          },
          {
            className: "fa fa-bomb",
            description: "bomb",
          },
          {
            className: "fa fa-book",
            description: "book",
          },
          {
            className: "fa fa-bookmark",
            description: "bookmark",
          },
          {
            className: "fa fa-bookmark-o",
            description: "bookmark-o",
          },
          {
            className: "fa fa-briefcase",
            description: "briefcase",
          },
          {
            className: "fa fa-bug",
            description: "bug",
          },
          {
            className: "fa fa-building",
            description: "building",
          },
          {
            className: "fa fa-building-o",
            description: "building-o",
          },
          {
            className: "fa fa-bullhorn",
            description: "bullhorn",
          },
          {
            className: "fa fa-bullseye",
            description: "bullseye",
          },
          {
            className: "fa fa-bus",
            description: "bus",
          },
          {
            className: "fa fa-cab",
            description: "cab",
          },
          {
            className: "fa fa-calculator",
            description: "calculator",
          },
          {
            className: "fa fa-calendar",
            description: "calendar",
          },
          {
            className: "fa fa-calendar-check-o",
            description: "calendar-check-o",
          },
          {
            className: "fa fa-calendar-minus-o",
            description: "calendar-minus-o",
          },
          {
            className: "fa fa-calendar-o",
            description: "calendar-o",
          },
          {
            className: "fa fa-calendar-plus-o",
            description: "calendar-plus-o",
          },
          {
            className: "fa fa-calendar-times-o",
            description: "calendar-times-o",
          },
          {
            className: "fa fa-camera",
            description: "camera",
          },
          {
            className: "fa fa-camera-retro",
            description: "camera-retro",
          },
          {
            className: "fa fa-car",
            description: "car",
          },
          {
            className: "fa fa-caret-square-o-down",
            description: "caret-square-o-down",
          },
          {
            className: "fa fa-caret-square-o-left",
            description: "caret-square-o-left",
          },
          {
            className: "fa fa-caret-square-o-right",
            description: "caret-square-o-right",
          },
          {
            className: "fa fa-caret-square-o-up",
            description: "caret-square-o-up",
          },
          {
            className: "fa fa-cart-arrow-down",
            description: "cart-arrow-down",
          },
          {
            className: "fa fa-cart-plus",
            description: "cart-plus",
          },
          {
            className: "fa fa-cc",
            description: "cc",
          },
          {
            className: "fa fa-certificate",
            description: "certificate",
          },
          {
            className: "fa fa-check",
            description: "check",
          },
          {
            className: "fa fa-check-circle",
            description: "check-circle",
          },
          {
            className: "fa fa-check-circle-o",
            description: "check-circle-o",
          },
          {
            className: "fa fa-check-square",
            description: "check-square",
          },
          {
            className: "fa fa-check-square-o",
            description: "check-square-o",
          },
          {
            className: "fa fa-child",
            description: "child",
          },
          {
            className: "fa fa-circle",
            description: "circle",
          },
          {
            className: "fa fa-circle-o",
            description: "circle-o",
          },
          {
            className: "fa fa-circle-o-notch",
            description: "circle-o-notch",
          },
          {
            className: "fa fa-circle-thin",
            description: "circle-thin",
          },
          {
            className: "fa fa-clock-o",
            description: "clock-o",
          },
          {
            className: "fa fa-clone",
            description: "clone",
          },
          {
            className: "fa fa-close",
            description: "close",
          },
          {
            className: "fa fa-cloud",
            description: "cloud",
          },
          {
            className: "fa fa-cloud-download",
            description: "cloud-download",
          },
          {
            className: "fa fa-cloud-upload",
            description: "cloud-upload",
          },
          {
            className: "fa fa-code",
            description: "code",
          },
          {
            className: "fa fa-code-fork",
            description: "code-fork",
          },
          {
            className: "fa fa-coffee",
            description: "coffee",
          },
          {
            className: "fa fa-cog",
            description: "cog",
          },
          {
            className: "fa fa-cogs",
            description: "cogs",
          },
          {
            className: "fa fa-comment",
            description: "comment",
          },
          {
            className: "fa fa-comment-o",
            description: "comment-o",
          },
          {
            className: "fa fa-commenting",
            description: "commenting",
          },
          {
            className: "fa fa-commenting-o",
            description: "commenting-o",
          },
          {
            className: "fa fa-comments",
            description: "comments",
          },
          {
            className: "fa fa-comments-o",
            description: "comments-o",
          },
          {
            className: "fa fa-compass",
            description: "compass",
          },
          {
            className: "fa fa-copyright",
            description: "copyright",
          },
          {
            className: "fa fa-creative-commons",
            description: "creative-commons",
          },
          {
            className: "fa fa-credit-card",
            description: "credit-card",
          },
          {
            className: "fa fa-credit-card-alt",
            description: "credit-card-alt",
          },
          {
            className: "fa fa-crop",
            description: "crop",
          },
          {
            className: "fa fa-crosshairs",
            description: "crosshairs",
          },
          {
            className: "fa fa-cube",
            description: "cube",
          },
          {
            className: "fa fa-cubes",
            description: "cubes",
          },
          {
            className: "fa fa-cutlery",
            description: "cutlery",
          },
          {
            className: "fa fa-dashboard",
            description: "dashboard",
          },
          {
            className: "fa fa-database",
            description: "database",
          },
          {
            className: "fa fa-desktop",
            description: "desktop",
          },
          {
            className: "fa fa-diamond",
            description: "diamond",
          },
          {
            className: "fa fa-dot-circle-o",
            description: "dot-circle-o",
          },
          {
            className: "fa fa-download",
            description: "download",
          },
          {
            className: "fa fa-edit",
            description: "edit",
          },
          {
            className: "fa fa-ellipsis-h",
            description: "ellipsis-h",
          },
          {
            className: "fa fa-ellipsis-v",
            description: "ellipsis-v",
          },
          {
            className: "fa fa-envelope",
            description: "envelope",
          },
          {
            className: "fa fa-envelope-o",
            description: "envelope-o",
          },
          {
            className: "fa fa-envelope-square",
            description: "envelope-square",
          },
          {
            className: "fa fa-eraser",
            description: "eraser",
          },
          {
            className: "fa fa-exchange",
            description: "exchange",
          },
          {
            className: "fa fa-exclamation",
            description: "exclamation",
          },
          {
            className: "fa fa-exclamation-circle",
            description: "exclamation-circle",
          },
          {
            className: "fa fa-exclamation-triangle",
            description: "exclamation-triangle",
          },
          {
            className: "fa fa-external-link",
            description: "external-link",
          },
          {
            className: "fa fa-external-link-square",
            description: "external-link-square",
          },
          {
            className: "fa fa-eye",
            description: "eye",
          },
          {
            className: "fa fa-eye-slash",
            description: "eye-slash",
          },
          {
            className: "fa fa-eyedropper",
            description: "eyedropper",
          },
          {
            className: "fa fa-fax",
            description: "fax",
          },
          {
            className: "fa fa-feed",
            description: "feed",
          },
          {
            className: "fa fa-female",
            description: "female",
          },
          {
            className: "fa fa-fighter-jet",
            description: "fighter-jet",
          },
          {
            className: "fa fa-file-archive-o",
            description: "file-archive-o",
          },
          {
            className: "fa fa-file-audio-o",
            description: "file-audio-o",
          },
          {
            className: "fa fa-file-code-o",
            description: "file-code-o",
          },
          {
            className: "fa fa-file-excel-o",
            description: "file-excel-o",
          },
          {
            className: "fa fa-file-image-o",
            description: "file-image-o",
          },
          {
            className: "fa fa-file-movie-o",
            description: "file-movie-o",
          },
          {
            className: "fa fa-file-pdf-o",
            description: "file-pdf-o",
          },
          {
            className: "fa fa-file-photo-o",
            description: "file-photo-o",
          },
          {
            className: "fa fa-file-picture-o",
            description: "file-picture-o",
          },
          {
            className: "fa fa-file-powerpoint-o",
            description: "file-powerpoint-o",
          },
          {
            className: "fa fa-file-sound-o",
            description: "file-sound-o",
          },
          {
            className: "fa fa-file-video-o",
            description: "file-video-o",
          },
          {
            className: "fa fa-file-word-o",
            description: "file-word-o",
          },
          {
            className: "fa fa-file-zip-o",
            description: "file-zip-o",
          },
          {
            className: "fa fa-film",
            description: "film",
          },
          {
            className: "fa fa-filter",
            description: "filter",
          },
          {
            className: "fa fa-fire",
            description: "fire",
          },
          {
            className: "fa fa-fire-extinguisher",
            description: "fire-extinguisher",
          },
          {
            className: "fa fa-flag",
            description: "flag",
          },
          {
            className: "fa fa-flag-checkered",
            description: "flag-checkered",
          },
          {
            className: "fa fa-flag-o",
            description: "flag-o",
          },
          {
            className: "fa fa-flash",
            description: "flash",
          },
          {
            className: "fa fa-flask",
            description: "flask",
          },
          {
            className: "fa fa-folder",
            description: "folder",
          },
          {
            className: "fa fa-folder-o",
            description: "folder-o",
          },
          {
            className: "fa fa-folder-open",
            description: "folder-open",
          },
          {
            className: "fa fa-folder-open-o",
            description: "folder-open-o",
          },
          {
            className: "fa fa-frown-o",
            description: "frown-o",
          },
          {
            className: "fa fa-futbol-o",
            description: "futbol-o",
          },
          {
            className: "fa fa-gamepad",
            description: "gamepad",
          },
          {
            className: "fa fa-gavel",
            description: "gavel",
          },
          {
            className: "fa fa-gear",
            description: "gear",
          },
          {
            className: "fa fa-gears",
            description: "gears",
          },
          {
            className: "fa fa-gift",
            description: "gift",
          },
          {
            className: "fa fa-glass",
            description: "glass",
          },
          {
            className: "fa fa-globe",
            description: "globe",
          },
          {
            className: "fa fa-graduation-cap",
            description: "graduation-cap",
          },
          {
            className: "fa fa-group",
            description: "group",
          },
          {
            className: "fa fa-hand-grab-o",
            description: "hand-grab-o",
          },
          {
            className: "fa fa-hand-lizard-o",
            description: "hand-lizard-o",
          },
          {
            className: "fa fa-hand-paper-o",
            description: "hand-paper-o",
          },
          {
            className: "fa fa-hand-peace-o",
            description: "hand-peace-o",
          },
          {
            className: "fa fa-hand-pointer-o",
            description: "hand-pointer-o",
          },
          {
            className: "fa fa-hand-rock-o",
            description: "hand-rock-o",
          },
          {
            className: "fa fa-hand-scissors-o",
            description: "hand-scissors-o",
          },
          {
            className: "fa fa-hand-spock-o",
            description: "hand-spock-o",
          },
          {
            className: "fa fa-hand-stop-o",
            description: "hand-stop-o",
          },
          {
            className: "fa fa-hashtag",
            description: "hashtag",
          },
          {
            className: "fa fa-hdd-o",
            description: "hdd-o",
          },
          {
            className: "fa fa-headphones",
            description: "headphones",
          },
          {
            className: "fa fa-heart",
            description: "heart",
          },
          {
            className: "fa fa-heart-o",
            description: "heart-o",
          },
          {
            className: "fa fa-heartbeat",
            description: "heartbeat",
          },
          {
            className: "fa fa-history",
            description: "history",
          },
          {
            className: "fa fa-home",
            description: "home",
          },
          {
            className: "fa fa-hotel",
            description: "hotel",
          },
          {
            className: "fa fa-hourglass",
            description: "hourglass",
          },
          {
            className: "fa fa-hourglass-1",
            description: "hourglass-1",
          },
          {
            className: "fa fa-hourglass-2",
            description: "hourglass-2",
          },
          {
            className: "fa fa-hourglass-3",
            description: "hourglass-3",
          },
          {
            className: "fa fa-hourglass-end",
            description: "hourglass-end",
          },
          {
            className: "fa fa-hourglass-half",
            description: "hourglass-half",
          },
          {
            className: "fa fa-hourglass-o",
            description: "hourglass-o",
          },
          {
            className: "fa fa-hourglass-start",
            description: "hourglass-start",
          },
          {
            className: "fa fa-i-cursor",
            description: "i-cursor",
          },
          {
            className: "fa fa-image",
            description: "image",
          },
          {
            className: "fa fa-inbox",
            description: "inbox",
          },
          {
            className: "fa fa-industry",
            description: "industry",
          },
          {
            className: "fa fa-info",
            description: "info",
          },
          {
            className: "fa fa-info-circle",
            description: "info-circle",
          },
          {
            className: "fa fa-institution",
            description: "institution",
          },
          {
            className: "fa fa-key",
            description: "key",
          },
          {
            className: "fa fa-keyboard-o",
            description: "keyboard-o",
          },
          {
            className: "fa fa-language",
            description: "language",
          },
          {
            className: "fa fa-laptop",
            description: "laptop",
          },
          {
            className: "fa fa-leaf",
            description: "leaf",
          },
          {
            className: "fa fa-legal",
            description: "legal",
          },
          {
            className: "fa fa-lemon-o",
            description: "lemon-o",
          },
          {
            className: "fa fa-level-down",
            description: "level-down",
          },
          {
            className: "fa fa-level-up",
            description: "level-up",
          },
          {
            className: "fa fa-life-bouy",
            description: "life-bouy",
          },
          {
            className: "fa fa-life-buoy",
            description: "life-buoy",
          },
          {
            className: "fa fa-life-ring",
            description: "life-ring",
          },
          {
            className: "fa fa-life-saver",
            description: "life-saver",
          },
          {
            className: "fa fa-lightbulb-o",
            description: "lightbulb-o",
          },
          {
            className: "fa fa-line-chart",
            description: "line-chart",
          },
          {
            className: "fa fa-location-arrow",
            description: "location-arrow",
          },
          {
            className: "fa fa-lock",
            description: "lock",
          },
          {
            className: "fa fa-magic",
            description: "magic",
          },
          {
            className: "fa fa-magnet",
            description: "magnet",
          },
          {
            className: "fa fa-mail-forward",
            description: "mail-forward",
          },
          {
            className: "fa fa-mail-reply",
            description: "mail-reply",
          },
          {
            className: "fa fa-mail-reply-all",
            description: "mail-reply-all",
          },
          {
            className: "fa fa-male",
            description: "male",
          },
          {
            className: "fa fa-map",
            description: "map",
          },
          {
            className: "fa fa-map-marker",
            description: "map-marker",
          },
          {
            className: "fa fa-map-o",
            description: "map-o",
          },
          {
            className: "fa fa-map-pin",
            description: "map-pin",
          },
          {
            className: "fa fa-map-signs",
            description: "map-signs",
          },
          {
            className: "fa fa-meh-o",
            description: "meh-o",
          },
          {
            className: "fa fa-microphone",
            description: "microphone",
          },
          {
            className: "fa fa-microphone-slash",
            description: "microphone-slash",
          },
          {
            className: "fa fa-minus",
            description: "minus",
          },
          {
            className: "fa fa-minus-circle",
            description: "minus-circle",
          },
          {
            className: "fa fa-minus-square",
            description: "minus-square",
          },
          {
            className: "fa fa-minus-square-o",
            description: "minus-square-o",
          },
          {
            className: "fa fa-mobile",
            description: "mobile",
          },
          {
            className: "fa fa-mobile-phone",
            description: "mobile-phone",
          },
          {
            className: "fa fa-money",
            description: "money",
          },
          {
            className: "fa fa-moon-o",
            description: "moon-o",
          },
          {
            className: "fa fa-mortar-board",
            description: "mortar-board",
          },
          {
            className: "fa fa-motorcycle",
            description: "motorcycle",
          },
          {
            className: "fa fa-mouse-pointer",
            description: "mouse-pointer",
          },
          {
            className: "fa fa-music",
            description: "music",
          },
          {
            className: "fa fa-navicon",
            description: "navicon",
          },
          {
            className: "fa fa-newspaper-o",
            description: "newspaper-o",
          },
          {
            className: "fa fa-object-group",
            description: "object-group",
          },
          {
            className: "fa fa-object-ungroup",
            description: "object-ungroup",
          },
          {
            className: "fa fa-paint-brush",
            description: "paint-brush",
          },
          {
            className: "fa fa-paper-plane",
            description: "paper-plane",
          },
          {
            className: "fa fa-paper-plane-o",
            description: "paper-plane-o",
          },
          {
            className: "fa fa-paw",
            description: "paw",
          },
          {
            className: "fa fa-pencil",
            description: "pencil",
          },
          {
            className: "fa fa-pencil-square",
            description: "pencil-square",
          },
          {
            className: "fa fa-pencil-square-o",
            description: "pencil-square-o",
          },
          {
            className: "fa fa-percent",
            description: "percent",
          },
          {
            className: "fa fa-phone",
            description: "phone",
          },
          {
            className: "fa fa-phone-square",
            description: "phone-square",
          },
          {
            className: "fa fa-photo",
            description: "photo",
          },
          {
            className: "fa fa-picture-o",
            description: "picture-o",
          },
          {
            className: "fa fa-pie-chart",
            description: "pie-chart",
          },
          {
            className: "fa fa-plane",
            description: "plane",
          },
          {
            className: "fa fa-plug",
            description: "plug",
          },
          {
            className: "fa fa-plus",
            description: "plus",
          },
          {
            className: "fa fa-plus-circle",
            description: "plus-circle",
          },
          {
            className: "fa fa-plus-square",
            description: "plus-square",
          },
          {
            className: "fa fa-plus-square-o",
            description: "plus-square-o",
          },
          {
            className: "fa fa-power-off",
            description: "power-off",
          },
          {
            className: "fa fa-print",
            description: "print",
          },
          {
            className: "fa fa-puzzle-piece",
            description: "puzzle-piece",
          },
          {
            className: "fa fa-qrcode",
            description: "qrcode",
          },
          {
            className: "fa fa-question",
            description: "question",
          },
          {
            className: "fa fa-question-circle",
            description: "question-circle",
          },
          {
            className: "fa fa-quote-left",
            description: "quote-left",
          },
          {
            className: "fa fa-quote-right",
            description: "quote-right",
          },
          {
            className: "fa fa-random",
            description: "random",
          },
          {
            className: "fa fa-recycle",
            description: "recycle",
          },
          {
            className: "fa fa-refresh",
            description: "refresh",
          },
          {
            className: "fa fa-registered",
            description: "registered",
          },
          {
            className: "fa fa-remove",
            description: "remove",
          },
          {
            className: "fa fa-reorder",
            description: "reorder",
          },
          {
            className: "fa fa-reply",
            description: "reply",
          },
          {
            className: "fa fa-reply-all",
            description: "reply-all",
          },
          {
            className: "fa fa-retweet",
            description: "retweet",
          },
          {
            className: "fa fa-road",
            description: "road",
          },
          {
            className: "fa fa-rocket",
            description: "rocket",
          },
          {
            className: "fa fa-rss",
            description: "rss",
          },
          {
            className: "fa fa-rss-square",
            description: "rss-square",
          },
          {
            className: "fa fa-search",
            description: "search",
          },
          {
            className: "fa fa-search-minus",
            description: "search-minus",
          },
          {
            className: "fa fa-search-plus",
            description: "search-plus",
          },
          {
            className: "fa fa-send",
            description: "send",
          },
          {
            className: "fa fa-send-o",
            description: "send-o",
          },
          {
            className: "fa fa-server",
            description: "server",
          },
          {
            className: "fa fa-share",
            description: "share",
          },
          {
            className: "fa fa-share-alt",
            description: "share-alt",
          },
          {
            className: "fa fa-share-alt-square",
            description: "share-alt-square",
          },
          {
            className: "fa fa-share-square",
            description: "share-square",
          },
          {
            className: "fa fa-share-square-o",
            description: "share-square-o",
          },
          {
            className: "fa fa-shield",
            description: "shield",
          },
          {
            className: "fa fa-ship",
            description: "ship",
          },
          {
            className: "fa fa-shopping-bag",
            description: "shopping-bag",
          },
          {
            className: "fa fa-shopping-basket",
            description: "shopping-basket",
          },
          {
            className: "fa fa-shopping-cart",
            description: "shopping-cart",
          },
          {
            className: "fa fa-sign-in",
            description: "sign-in",
          },
          {
            className: "fa fa-sign-out",
            description: "sign-out",
          },
          {
            className: "fa fa-signal",
            description: "signal",
          },
          {
            className: "fa fa-sitemap",
            description: "sitemap",
          },
          {
            className: "fa fa-sliders",
            description: "sliders",
          },
          {
            className: "fa fa-smile-o",
            description: "smile-o",
          },
          {
            className: "fa fa-soccer-ball-o",
            description: "soccer-ball-o",
          },
          {
            className: "fa fa-sort",
            description: "sort",
          },
          {
            className: "fa fa-sort-alpha-asc",
            description: "sort-alpha-asc",
          },
          {
            className: "fa fa-sort-alpha-desc",
            description: "sort-alpha-desc",
          },
          {
            className: "fa fa-sort-amount-asc",
            description: "sort-amount-asc",
          },
          {
            className: "fa fa-sort-amount-desc",
            description: "sort-amount-desc",
          },
          {
            className: "fa fa-sort-asc",
            description: "sort-asc",
          },
          {
            className: "fa fa-sort-desc",
            description: "sort-desc",
          },
          {
            className: "fa fa-sort-down",
            description: "sort-down",
          },
          {
            className: "fa fa-sort-numeric-asc",
            description: "sort-numeric-asc",
          },
          {
            className: "fa fa-sort-numeric-desc",
            description: "sort-numeric-desc",
          },
          {
            className: "fa fa-sort-up",
            description: "sort-up",
          },
          {
            className: "fa fa-space-shuttle",
            description: "space-shuttle",
          },
          {
            className: "fa fa-spinner",
            description: "spinner",
          },
          {
            className: "fa fa-spoon",
            description: "spoon",
          },
          {
            className: "fa fa-square",
            description: "square",
          },
          {
            className: "fa fa-square-o",
            description: "square-o",
          },
          {
            className: "fa fa-star",
            description: "star",
          },
          {
            className: "fa fa-star-half",
            description: "star-half",
          },
          {
            className: "fa fa-star-half-empty",
            description: "star-half-empty",
          },
          {
            className: "fa fa-star-half-full",
            description: "star-half-full",
          },
          {
            className: "fa fa-star-half-o",
            description: "star-half-o",
          },
          {
            className: "fa fa-star-o",
            description: "star-o",
          },
          {
            className: "fa fa-sticky-note",
            description: "sticky-note",
          },
          {
            className: "fa fa-sticky-note-o",
            description: "sticky-note-o",
          },
          {
            className: "fa fa-street-view",
            description: "street-view",
          },
          {
            className: "fa fa-suitcase",
            description: "suitcase",
          },
          {
            className: "fa fa-sun-o",
            description: "sun-o",
          },
          {
            className: "fa fa-support",
            description: "support",
          },
          {
            className: "fa fa-tablet",
            description: "tablet",
          },
          {
            className: "fa fa-tachometer",
            description: "tachometer",
          },
          {
            className: "fa fa-tag",
            description: "tag",
          },
          {
            className: "fa fa-tags",
            description: "tags",
          },
          {
            className: "fa fa-tasks",
            description: "tasks",
          },
          {
            className: "fa fa-taxi",
            description: "taxi",
          },
          {
            className: "fa fa-television",
            description: "television",
          },
          {
            className: "fa fa-terminal",
            description: "terminal",
          },
          {
            className: "fa fa-thumb-tack",
            description: "thumb-tack",
          },
          {
            className: "fa fa-thumbs-down",
            description: "thumbs-down",
          },
          {
            className: "fa fa-thumbs-o-down",
            description: "thumbs-o-down",
          },
          {
            className: "fa fa-thumbs-o-up",
            description: "thumbs-o-up",
          },
          {
            className: "fa fa-thumbs-up",
            description: "thumbs-up",
          },
          {
            className: "fa fa-ticket",
            description: "ticket",
          },
          {
            className: "fa fa-times",
            description: "times",
          },
          {
            className: "fa fa-times-circle",
            description: "times-circle",
          },
          {
            className: "fa fa-times-circle-o",
            description: "times-circle-o",
          },
          {
            className: "fa fa-tint",
            description: "tint",
          },
          {
            className: "fa fa-toggle-down",
            description: "toggle-down",
          },
          {
            className: "fa fa-toggle-left",
            description: "toggle-left",
          },
          {
            className: "fa fa-toggle-off",
            description: "toggle-off",
          },
          {
            className: "fa fa-toggle-on",
            description: "toggle-on",
          },
          {
            className: "fa fa-toggle-right",
            description: "toggle-right",
          },
          {
            className: "fa fa-toggle-up",
            description: "toggle-up",
          },
          {
            className: "fa fa-trademark",
            description: "trademark",
          },
          {
            className: "fa fa-trash",
            description: "trash",
          },
          {
            className: "fa fa-trash-o",
            description: "trash-o",
          },
          {
            className: "fa fa-tree",
            description: "tree",
          },
          {
            className: "fa fa-trophy",
            description: "trophy",
          },
          {
            className: "fa fa-truck",
            description: "truck",
          },
          {
            className: "fa fa-tty",
            description: "tty",
          },
          {
            className: "fa fa-tv",
            description: "tv",
          },
          {
            className: "fa fa-umbrella",
            description: "umbrella",
          },
          {
            className: "fa fa-university",
            description: "university",
          },
          {
            className: "fa fa-unlock",
            description: "unlock",
          },
          {
            className: "fa fa-unlock-alt",
            description: "unlock-alt",
          },
          {
            className: "fa fa-unsorted",
            description: "unsorted",
          },
          {
            className: "fa fa-upload",
            description: "upload",
          },
          {
            className: "fa fa-user",
            description: "user",
          },
          {
            className: "fa fa-user-plus",
            description: "user-plus",
          },
          {
            className: "fa fa-user-secret",
            description: "user-secret",
          },
          {
            className: "fa fa-user-times",
            description: "user-times",
          },
          {
            className: "fa fa-users",
            description: "users",
          },
          {
            className: "fa fa-video-camera",
            description: "video-camera",
          },
          {
            className: "fa fa-volume-down",
            description: "volume-down",
          },
          {
            className: "fa fa-volume-off",
            description: "volume-off",
          },
          {
            className: "fa fa-volume-up",
            description: "volume-up",
          },
          {
            className: "fa fa-warning",
            description: "warning",
          },
          {
            className: "fa fa-wheelchair",
            description: "wheelchair",
          },
          {
            className: "fa fa-wifi",
            description: "wifi",
          },
          {
            className: "fa fa-wrench",
            description: "wrench",
          },
        ],
        handIcons: [
          {
            className: "fa fa-hand-grab-o",
            description: "hand-grab-o",
          },
          {
            className: "fa fa-hand-lizard-o",
            description: "hand-lizard-o",
          },
          {
            className: "fa fa-hand-o-down",
            description: "hand-o-down",
          },
          {
            className: "fa fa-hand-o-left",
            description: "hand-o-left",
          },
          {
            className: "fa fa-hand-o-right",
            description: "hand-o-right",
          },
          {
            className: "fa fa-hand-o-up",
            description: "hand-o-up",
          },
          {
            className: "fa fa-hand-paper-o",
            description: "hand-paper-o",
          },
          {
            className: "fa fa-hand-peace-o",
            description: "hand-peace-o",
          },
          {
            className: "fa fa-hand-pointer-o",
            description: "hand-pointer-o",
          },
          {
            className: "fa fa-hand-rock-o",
            description: "hand-rock-o",
          },
          {
            className: "fa fa-hand-scissors-o",
            description: "hand-scissors-o",
          },
          {
            className: "fa fa-hand-spock-o",
            description: "hand-spock-o",
          },
          {
            className: "fa fa-hand-stop-o",
            description: "hand-stop-o",
          },
          {
            className: "fa fa-thumbs-down",
            description: "thumbs-down",
          },
          {
            className: "fa fa-thumbs-o-down",
            description: "thumbs-o-down",
          },
          {
            className: "fa fa-thumbs-o-up",
            description: "thumbs-o-up",
          },
          {
            className: "fa fa-thumbs-up",
            description: "thumbs-up",
          },
        ],
        transportationIcons: [
          {
            className: "fa fa-ambulance",
            description: "ambulance",
          },
          {
            className: "fa fa-automobile",
            description: "automobile",
          },
          {
            className: "fa fa-bicycle",
            description: "bicycle",
          },
          {
            className: "fa fa-bus",
            description: "bus",
          },
          {
            className: "fa fa-cab",
            description: "cab",
          },
          {
            className: "fa fa-car",
            description: "car",
          },
          {
            className: "fa fa-fighter-jet",
            description: "fighter-jet",
          },
          {
            className: "fa fa-motorcycle",
            description: "motorcycle",
          },
          {
            className: "fa fa-plane",
            description: "plane",
          },
          {
            className: "fa fa-rocket",
            description: "rocket",
          },
          {
            className: "fa fa-ship",
            description: "ship",
          },
          {
            className: "fa fa-space-shuttle",
            description: "space-shuttle",
          },
          {
            className: "fa fa-subway",
            description: "subway",
          },
          {
            className: "fa fa-taxi",
            description: "taxi",
          },
          {
            className: "fa fa-train",
            description: "train",
          },
          {
            className: "fa fa-truck",
            description: "truck",
          },
          {
            className: "fa fa-wheelchair",
            description: "wheelchair",
          },
        ],
        genderIcons: [
          {
            className: "fa fa-genderless",
            description: "genderless",
          },
          {
            className: "fa fa-intersex",
            description: "intersex",
          },
          {
            className: "fa fa-mars",
            description: "mars",
          },
          {
            className: "fa fa-mars-double",
            description: "mars-double",
          },
          {
            className: "fa fa-mars-stroke",
            description: "mars-stroke",
          },
          {
            className: "fa fa-mars-stroke-h",
            description: "mars-stroke-h",
          },
          {
            className: "fa fa-mars-stroke-v",
            description: "mars-stroke-v",
          },
          {
            className: "fa fa-mercury",
            description: "mercury",
          },
          {
            className: "fa fa-neuter",
            description: "neuter",
          },
          {
            className: "fa fa-transgender",
            description: "transgender",
          },
          {
            className: "fa fa-transgender-alt",
            description: "transgender-alt",
          },
          {
            className: "fa fa-venus",
            description: "venus",
          },
          {
            className: "fa fa-venus-double",
            description: "venus-double",
          },
          {
            className: "fa fa-venus-mars",
            description: "venus-mars",
          },
        ],
        fileTypeIcons: [
          {
            className: "fa fa-file",
            description: "file",
          },
          {
            className: "fa fa-file-archive-o",
            description: "file-archive-o",
          },
          {
            className: "fa fa-file-audio-o",
            description: "file-audio-o",
          },
          {
            className: "fa fa-file-code-o",
            description: "file-code-o",
          },
          {
            className: "fa fa-file-excel-o",
            description: "file-excel-o",
          },
          {
            className: "fa fa-file-image-o",
            description: "file-image-o",
          },
          {
            className: "fa fa-file-movie-o",
            description: "file-movie-o",
          },
          {
            className: "fa fa-file-o",
            description: "file-o",
          },
          {
            className: "fa fa-file-pdf-o",
            description: "file-pdf-o",
          },
          {
            className: "fa fa-file-photo-o",
            description: "file-photo-o",
          },
          {
            className: "fa fa-file-picture-o",
            description: "file-picture-o",
          },
          {
            className: "fa fa-file-powerpoint-o",
            description: "file-powerpoint-o",
          },
          {
            className: "fa fa-file-sound-o",
            description: "file-sound-o",
          },
          {
            className: "fa fa-file-text",
            description: "file-text",
          },
          {
            className: "fa fa-file-text-o",
            description: "file-text-o",
          },
          {
            className: "fa fa-file-video-o",
            description: "file-video-o",
          },
          {
            className: "fa fa-file-word-o",
            description: "file-word-o",
          },
          {
            className: "fa fa-file-zip-o",
            description: "file-zip-o",
          },
        ],
        spinnerIcons: [
          {
            className: "fa fa-circle-o-notch",
            description: "circle-o-notch",
          },
          {
            className: "fa fa-cog",
            description: "cog",
          },
          {
            className: "fa fa-gear",
            description: "gear(alias)",
          },
          {
            className: "fa fa-refresh",
            description: "refresh",
          },
          {
            className: "fa fa-spinner",
            description: "spinner",
          },
        ],
        formControlIcons: [
          {
            className: "fa fa-check-square",
            description: "check-square",
          },
          {
            className: "fa fa-check-square-o",
            description: "check-square-o",
          },
          {
            className: "fa fa-circle",
            description: "circle",
          },
          {
            className: "fa fa-circle-o",
            description: "circle-o",
          },
          {
            className: "fa fa-dot-circle-o",
            description: "dot-circle-o",
          },
          {
            className: "fa fa-minus-square",
            description: "minus-square",
          },
          {
            className: "fa fa-minus-square-o",
            description: "minus-square-o",
          },
          {
            className: "fa fa-plus-square",
            description: "plus-square",
          },
          {
            className: "fa fa-plus-square-o",
            description: "plus-square-o",
          },
          {
            className: "fa fa-square",
            description: "square",
          },
          {
            className: "fa fa-square-o",
            description: "square-o",
          },
        ],
        paymentIcons: [
          {
            className: "fa fa-cc-amex",
            description: "cc-amex",
          },
          {
            className: "fa fa-cc-diners-club",
            description: "cc-diners-club",
          },
          {
            className: "fa fa-cc-discover",
            description: "cc-discover",
          },
          {
            className: "fa fa-cc-jcb",
            description: "cc-jcb",
          },
          {
            className: "fa fa-cc-mastercard",
            description: "cc-mastercard",
          },
          {
            className: "fa fa-cc-paypal",
            description: "cc-paypal",
          },
          {
            className: "fa fa-cc-stripe",
            description: "cc-stripe",
          },
          {
            className: "fa fa-cc-visa",
            description: "cc-visa",
          },
          {
            className: "fa fa-credit-card",
            description: "credit-card",
          },
          {
            className: "fa fa-credit-card-alt",
            description: "credit-card-alt",
          },
          {
            className: "fa fa-google-wallet",
            description: "google-wallet",
          },
          {
            className: "fa fa-paypal",
            description: "paypal",
          },
        ],
        chartIcons: [
          {
            className: "fa fa-area-chart",
            description: "area-chart",
          },
          {
            className: "fa fa-bar-chart",
            description: "bar-chart",
          },
          {
            className: "fa fa-bar-chart-o",
            description: "bar-chart-o",
          },
          {
            className: "fa fa-line-chart",
            description: "line-chart",
          },
          {
            className: "fa fa-pie-chart",
            description: "pie-chart",
          },
        ],
        currencyIcons: [
          {
            className: "fa fa-bitcoin",
            description: "bitcoin",
          },
          {
            className: "fa fa-btc",
            description: "btc",
          },
          {
            className: "fa fa-cny",
            description: "cny",
          },
          {
            className: "fa fa-dollar",
            description: "dollar",
          },
          {
            className: "fa fa-eur",
            description: "eur",
          },
          {
            className: "fa fa-euro",
            description: "euro",
          },
          {
            className: "fa fa-gbp",
            description: "gbp",
          },
          {
            className: "fa fa-gg",
            description: "gg",
          },
          {
            className: "fa fa-gg-circle",
            description: "gg-circle",
          },
          {
            className: "fa fa-ils",
            description: "ils",
          },
          {
            className: "fa fa-inr",
            description: "inr",
          },
          {
            className: "fa fa-jpy",
            description: "jpy",
          },
          {
            className: "fa fa-krw",
            description: "krw",
          },
          {
            className: "fa fa-money",
            description: "money",
          },
          {
            className: "fa fa-rmb",
            description: "rmb",
          },
          {
            className: "fa fa-rouble",
            description: "rouble",
          },
          {
            className: "fa fa-rub",
            description: "rub",
          },
          {
            className: "fa fa-ruble",
            description: "ruble",
          },
          {
            className: "fa fa-rupee",
            description: "rupee",
          },
          {
            className: "fa fa-shekel",
            description: "shekel",
          },
          {
            className: "fa fa-sheqel",
            description: "sheqel",
          },
          {
            className: "fa fa-try",
            description: "try",
          },
          {
            className: "fa fa-turkish-lira",
            description: "turkish-lira",
          },
          {
            className: "fa fa-usd",
            description: "usd",
          },
          {
            className: "fa fa-won",
            description: "won",
          },
          {
            className: "fa fa-yen",
            description: "yen",
          },
        ],
        textEditorIcons: [
          {
            className: "fa fa-align-center",
            description: "align-center",
          },
          {
            className: "fa fa-align-justify",
            description: "align-justify",
          },
          {
            className: "fa fa-align-left",
            description: "align-left",
          },
          {
            className: "fa fa-align-right",
            description: "align-right",
          },
          {
            className: "fa fa-bold",
            description: "bold",
          },
          {
            className: "fa fa-chain",
            description: "chain",
          },
          {
            className: "fa fa-chain-broken",
            description: "chain-broken",
          },
          {
            className: "fa fa-clipboard",
            description: "clipboard",
          },
          {
            className: "fa fa-columns",
            description: "columns",
          },
          {
            className: "fa fa-copy",
            description: "copy",
          },
          {
            className: "fa fa-cut",
            description: "cut",
          },
          {
            className: "fa fa-dedent",
            description: "dedent",
          },
          {
            className: "fa fa-eraser",
            description: "eraser",
          },
          {
            className: "fa fa-file",
            description: "file",
          },
          {
            className: "fa fa-file-o",
            description: "file-o",
          },
          {
            className: "fa fa-file-text",
            description: "file-text",
          },
          {
            className: "fa fa-file-text-o",
            description: "file-text-o",
          },
          {
            className: "fa fa-files-o",
            description: "files-o",
          },
          {
            className: "fa fa-floppy-o",
            description: "floppy-o",
          },
          {
            className: "fa fa-font",
            description: "font",
          },
          {
            className: "fa fa-header",
            description: "header",
          },
          {
            className: "fa fa-indent",
            description: "indent",
          },
          {
            className: "fa fa-italic",
            description: "italic",
          },
          {
            className: "fa fa-link",
            description: "link",
          },
          {
            className: "fa fa-list",
            description: "list",
          },
          {
            className: "fa fa-list-alt",
            description: "list-alt",
          },
          {
            className: "fa fa-list-ol",
            description: "list-ol",
          },
          {
            className: "fa fa-list-ul",
            description: "list-ul",
          },
          {
            className: "fa fa-outdent",
            description: "outdent",
          },
          {
            className: "fa fa-paperclip",
            description: "paperclip",
          },
          {
            className: "fa fa-paragraph",
            description: "paragraph",
          },
          {
            className: "fa fa-paste",
            description: "paste",
          },
          {
            className: "fa fa-repeat",
            description: "repeat",
          },
          {
            className: "fa fa-rotate-left",
            description: "rotate-left",
          },
          {
            className: "fa fa-rotate-right",
            description: "rotate-right",
          },
          {
            className: "fa fa-save",
            description: "save",
          },
          {
            className: "fa fa-scissors",
            description: "scissors",
          },
          {
            className: "fa fa-strikethrough",
            description: "strikethrough",
          },
          {
            className: "fa fa-subscript",
            description: "subscript",
          },
          {
            className: "fa fa-superscript",
            description: "superscript",
          },
          {
            className: "fa fa-table",
            description: "table",
          },
          {
            className: "fa fa-text-height",
            description: "text-height",
          },
          {
            className: "fa fa-text-width",
            description: "text-width",
          },
          {
            className: "fa fa-th",
            description: "th",
          },
          {
            className: "fa fa-th-large",
            description: "th-large",
          },
          {
            className: "fa fa-th-list",
            description: "th-list",
          },
          {
            className: "fa fa-underline",
            description: "underline",
          },
          {
            className: "fa fa-undo",
            description: "undo",
          },
          {
            className: "fa fa-unlink",
            description: "unlink",
          },
        ],
        directionalIcons: [
          {
            className: "fa fa-angle-double-down",
            description: "angle-double-down",
          },
          {
            className: "fa fa-angle-double-left",
            description: "angle-double-left",
          },
          {
            className: "fa fa-angle-double-right",
            description: "angle-double-right",
          },
          {
            className: "fa fa-angle-double-up",
            description: "angle-double-up",
          },
          {
            className: "fa fa-angle-down",
            description: "angle-down",
          },
          {
            className: "fa fa-angle-left",
            description: "angle-left",
          },
          {
            className: "fa fa-angle-right",
            description: "angle-right",
          },
          {
            className: "fa fa-angle-up",
            description: "angle-up",
          },
          {
            className: "fa fa-arrow-circle-down",
            description: "arrow-circle-down",
          },
          {
            className: "fa fa-arrow-circle-left",
            description: "arrow-circle-left",
          },
          {
            className: "fa fa-arrow-circle-o-down",
            description: "arrow-circle-o-down",
          },
          {
            className: "fa fa-arrow-circle-o-left",
            description: "arrow-circle-o-left",
          },
          {
            className: "fa fa-arrow-circle-o-right",
            description: "arrow-circle-o-right",
          },
          {
            className: "fa fa-arrow-circle-o-up",
            description: "arrow-circle-o-up",
          },
          {
            className: "fa fa-arrow-circle-right",
            description: "arrow-circle-right",
          },
          {
            className: "fa fa-arrow-circle-up",
            description: "arrow-circle-up",
          },
          {
            className: "fa fa-arrow-down",
            description: "arrow-down",
          },
          {
            className: "fa fa-arrow-left",
            description: "arrow-left",
          },
          {
            className: "fa fa-arrow-right",
            description: "arrow-right",
          },
          {
            className: "fa fa-arrow-up",
            description: "arrow-up",
          },
          {
            className: "fa fa-arrows",
            description: "arrows",
          },
          {
            className: "fa fa-arrows-alt",
            description: "arrows-alt",
          },
          {
            className: "fa fa-arrows-h",
            description: "arrows-h",
          },
          {
            className: "fa fa-arrows-v",
            description: "arrows-v",
          },
          {
            className: "fa fa-caret-down",
            description: "caret-down",
          },
          {
            className: "fa fa-caret-left",
            description: "caret-left",
          },
          {
            className: "fa fa-caret-right",
            description: "caret-right",
          },
          {
            className: "fa fa-caret-square-o-down",
            description: "caret-square-o-down",
          },
          {
            className: "fa fa-caret-square-o-left",
            description: "caret-square-o-left",
          },
          {
            className: "fa fa-caret-square-o-right",
            description: "caret-square-o-right",
          },
          {
            className: "fa fa-caret-square-o-up",
            description: "caret-square-o-up",
          },
          {
            className: "fa fa-caret-up",
            description: "caret-up",
          },
          {
            className: "fa fa-chevron-circle-down",
            description: "chevron-circle-down",
          },
          {
            className: "fa fa-chevron-circle-left",
            description: "chevron-circle-left",
          },
          {
            className: "fa fa-chevron-circle-right",
            description: "chevron-circle-right",
          },
          {
            className: "fa fa-chevron-circle-up",
            description: "chevron-circle-up",
          },
          {
            className: "fa fa-chevron-down",
            description: "chevron-down",
          },
          {
            className: "fa fa-chevron-left",
            description: "chevron-left",
          },
          {
            className: "fa fa-chevron-right",
            description: "chevron-right",
          },
          {
            className: "fa fa-chevron-up",
            description: "chevron-up",
          },
          {
            className: "fa fa-exchange",
            description: "exchange",
          },
          {
            className: "fa fa-hand-o-down",
            description: "hand-o-down",
          },
          {
            className: "fa fa-hand-o-left",
            description: "hand-o-left",
          },
          {
            className: "fa fa-hand-o-right",
            description: "hand-o-right",
          },
          {
            className: "fa fa-hand-o-up",
            description: "hand-o-up",
          },
          {
            className: "fa fa-long-arrow-down",
            description: "long-arrow-down",
          },
          {
            className: "fa fa-long-arrow-left",
            description: "long-arrow-left",
          },
          {
            className: "fa fa-long-arrow-right",
            description: "long-arrow-right",
          },
          {
            className: "fa fa-long-arrow-up",
            description: "long-arrow-up",
          },
          {
            className: "fa fa-toggle-down",
            description: "toggle-down",
          },
          {
            className: "fa fa-toggle-left",
            description: "toggle-left",
          },
          {
            className: "fa fa-toggle-right",
            description: "toggle-right",
          },
          {
            className: "fa fa-toggle-up",
            description: "toggle-up",
          },
        ],
        videoPlayerIcons: [
          {
            className: "fa fa-arrows-alt",
            description: "arrows-alt",
          },
          {
            className: "fa fa-backward",
            description: "backward",
          },
          {
            className: "fa fa-compress",
            description: "compress",
          },
          {
            className: "fa fa-eject",
            description: "eject",
          },
          {
            className: "fa fa-expand",
            description: "expand",
          },
          {
            className: "fa fa-fast-backward",
            description: "fast-backward",
          },
          {
            className: "fa fa-fast-forward",
            description: "fast-forward",
          },
          {
            className: "fa fa-forward",
            description: "forward",
          },
          {
            className: "fa fa-pause",
            description: "pause",
          },
          {
            className: "fa fa-pause-circle",
            description: "pause-circle",
          },
          {
            className: "fa fa-pause-circle-o",
            description: "pause-circle-o",
          },
          {
            className: "fa fa-play",
            description: "play",
          },
          {
            className: "fa fa-play-circle",
            description: "play-circle",
          },
          {
            className: "fa fa-play-circle-o",
            description: "play-circle-o",
          },
          {
            className: "fa fa-random",
            description: "random",
          },
          {
            className: "fa fa-step-backward",
            description: "step-backward",
          },
          {
            className: "fa fa-step-forward",
            description: "step-forward",
          },
          {
            className: "fa fa-stop",
            description: "stop",
          },
          {
            className: "fa fa-stop-circle",
            description: "stop-circle",
          },
          {
            className: "fa fa-stop-circle-o",
            description: "stop-circle-o",
          },
          {
            className: "fa fa-youtube-play",
            description: "youtube-play",
          },
        ],
        brandIcons: [
          {
            className: "fa fa-500px",
          },
          {
            className: "fa fa-adn",
            description: "adn",
          },
          {
            className: "fa fa-amazon",
            description: "amazon",
          },
          {
            className: "fa fa-android",
            description: "android",
          },
          {
            className: "fa fa-angellist",
            description: "angellist",
          },
          {
            className: "fa fa-apple",
            description: "apple",
          },
          {
            className: "fa fa-behance",
            description: "behance",
          },
          {
            className: "fa fa-behance-square",
            description: "behance-square",
          },
          {
            className: "fa fa-bitbucket",
            description: "bitbucket",
          },
          {
            className: "fa fa-bitbucket-square",
            description: "bitbucket-square",
          },
          {
            className: "fa fa-bitcoin",
            description: "bitcoin",
          },
          {
            className: "fa fa-black-tie",
            description: "black-tie",
          },
          {
            className: "fa fa-bluetooth",
            description: "bluetooth",
          },
          {
            className: "fa fa-bluetooth-b",
            description: "bluetooth-b",
          },
          {
            className: "fa fa-btc",
            description: "btc",
          },
          {
            className: "fa fa-buysellads",
            description: "buysellads",
          },
          {
            className: "fa fa-cc-amex",
            description: "cc-amex",
          },
          {
            className: "fa fa-cc-diners-club",
            description: "cc-diners-club",
          },
          {
            className: "fa fa-cc-discover",
            description: "cc-discover",
          },
          {
            className: "fa fa-cc-jcb",
            description: "cc-jcb",
          },
          {
            className: "fa fa-cc-mastercard",
            description: "cc-mastercard",
          },
          {
            className: "fa fa-cc-paypal",
            description: "cc-paypal",
          },
          {
            className: "fa fa-cc-stripe",
            description: "cc-stripe",
          },
          {
            className: "fa fa-cc-visa",
            description: "cc-visa",
          },
          {
            className: "fa fa-chrome",
            description: "chrome",
          },
          {
            className: "fa fa-codepen",
            description: "codepen",
          },
          {
            className: "fa fa-codiepie",
            description: "codiepie",
          },
          {
            className: "fa fa-connectdevelop",
            description: "connectdevelop",
          },
          {
            className: "fa fa-contao",
            description: "contao",
          },
          {
            className: "fa fa-css3",
            description: "css3",
          },
          {
            className: "fa fa-dashcube",
            description: "dashcube",
          },
          {
            className: "fa fa-delicious",
            description: "delicious",
          },
          {
            className: "fa fa-deviantart",
            description: "deviantart",
          },
          {
            className: "fa fa-digg",
            description: "digg",
          },
          {
            className: "fa fa-dribbble",
            description: "dribbble",
          },
          {
            className: "fa fa-dropbox",
            description: "dropbox",
          },
          {
            className: "fa fa-drupal",
            description: "drupal",
          },
          {
            className: "fa fa-edge",
            description: "edge",
          },
          {
            className: "fa fa-empire",
            description: "empire",
          },
          {
            className: "fa fa-expeditedssl",
            description: "expeditedssl",
          },
          {
            className: "fa fa-facebook",
            description: "facebook",
          },
          {
            className: "fa fa-facebook-f",
            description: "facebook-f",
          },
          {
            className: "fa fa-facebook-official",
            description: "facebook-official",
          },
          {
            className: "fa fa-facebook-square",
            description: "facebook-square",
          },
          {
            className: "fa fa-firefox",
            description: "firefox",
          },
          {
            className: "fa fa-flickr",
            description: "flickr",
          },
          {
            className: "fa fa-fonticons",
            description: "fonticons",
          },
          {
            className: "fa fa-fort-awesome",
            description: "fort-awesome",
          },
          {
            className: "fa fa-forumbee",
            description: "forumbee",
          },
          {
            className: "fa fa-foursquare",
            description: "foursquare",
          },
          {
            className: "fa fa-ge",
            description: "ge",
          },
          {
            className: "fa fa-get-pocket",
            description: "get-pocket",
          },
          {
            className: "fa fa-gg",
            description: "gg",
          },
          {
            className: "fa fa-gg-circle",
            description: "gg-circle",
          },
          {
            className: "fa fa-git",
            description: "git",
          },
          {
            className: "fa fa-git-square",
            description: "git-square",
          },
          {
            className: "fa fa-github",
            description: "github",
          },
          {
            className: "fa fa-github-alt",
            description: "github-alt",
          },
          {
            className: "fa fa-github-square",
            description: "github-square",
          },
          {
            className: "fa fa-gittip",
            description: "gittip",
          },
          {
            className: "fa fa-google",
            description: "google",
          },
          {
            className: "fa fa-google-plus",
            description: "google-plus",
          },
          {
            className: "fa fa-google-plus-square",
            description: "google-plus-square",
          },
          {
            className: "fa fa-google-wallet",
            description: "google-wallet",
          },
          {
            className: "fa fa-gratipay",
            description: "gratipay",
          },
          {
            className: "fa fa-hacker-news",
            description: "hacker-news",
          },
          {
            className: "fa fa-houzz",
            description: "houzz",
          },
          {
            className: "fa fa-html5",
            description: "html5",
          },
          {
            className: "fa fa-instagram",
            description: "instagram",
          },
          {
            className: "fa fa-internet-explorer",
            description: "internet-explorer",
          },
          {
            className: "fa fa-ioxhost",
            description: "ioxhost",
          },
          {
            className: "fa fa-joomla",
            description: "joomla",
          },
          {
            className: "fa fa-jsfiddle",
            description: "jsfiddle",
          },
          {
            className: "fa fa-lastfm",
            description: "lastfm",
          },
          {
            className: "fa fa-lastfm-square",
            description: "lastfm-square",
          },
          {
            className: "fa fa-leanpub",
            description: "leanpub",
          },
          {
            className: "fa fa-linkedin",
            description: "linkedin",
          },
          {
            className: "fa fa-linkedin-square",
            description: "linkedin-square",
          },
          {
            className: "fa fa-linux",
            description: "linux",
          },
          {
            className: "fa fa-maxcdn",
            description: "maxcdn",
          },
          {
            className: "fa fa-meanpath",
            description: "meanpath",
          },
          {
            className: "fa fa-medium",
            description: "medium",
          },
          {
            className: "fa fa-mixcloud",
            description: "mixcloud",
          },
          {
            className: "fa fa-modx",
            description: "modx",
          },
          {
            className: "fa fa-odnoklassniki",
            description: "odnoklassniki",
          },
          {
            className: "fa fa-odnoklassniki-square",
            description: "odnoklassniki-square",
          },
          {
            className: "fa fa-opencart",
            description: "opencart",
          },
          {
            className: "fa fa-openid",
            description: "openid",
          },
          {
            className: "fa fa-opera",
            description: "opera",
          },
          {
            className: "fa fa-optin-monster",
            description: "optin-monster",
          },
          {
            className: "fa fa-pagelines",
            description: "pagelines",
          },
          {
            className: "fa fa-paypal",
            description: "paypal",
          },
          {
            className: "fa fa-pied-piper",
            description: "pied-piper",
          },
          {
            className: "fa fa-pied-piper-alt",
            description: "pied-piper-alt",
          },
          {
            className: "fa fa-pinterest",
            description: "pinterest",
          },
          {
            className: "fa fa-pinterest-p",
            description: "pinterest-p",
          },
          {
            className: "fa fa-pinterest-square",
            description: "pinterest-square",
          },
          {
            className: "fa fa-product-hunt",
            description: "product-hunt",
          },
          {
            className: "fa fa-qq",
            description: "qq",
          },
          {
            className: "fa fa-ra",
            description: "ra",
          },
          {
            className: "fa fa-rebel",
            description: "rebel",
          },
          {
            className: "fa fa-reddit",
            description: "reddit",
          },
          {
            className: "fa fa-reddit-alien",
            description: "reddit-alien",
          },
          {
            className: "fa fa-reddit-square",
            description: "reddit-square",
          },
          {
            className: "fa fa-renren",
            description: "renren",
          },
          {
            className: "fa fa-safari",
            description: "safari",
          },
          {
            className: "fa fa-scribd",
            description: "scribd",
          },
          {
            className: "fa fa-sellsy",
            description: "sellsy",
          },
          {
            className: "fa fa-share-alt",
            description: "share-alt",
          },
          {
            className: "fa fa-share-alt-square",
            description: "share-alt-square",
          },
          {
            className: "fa fa-shirtsinbulk",
            description: "shirtsinbulk",
          },
          {
            className: "fa fa-simplybuilt",
            description: "simplybuilt",
          },
          {
            className: "fa fa-skyatlas",
            description: "skyatlas",
          },
          {
            className: "fa fa-skype",
            description: "skype",
          },
          {
            className: "fa fa-slack",
            description: "slack",
          },
          {
            className: "fa fa-slideshare",
            description: "slideshare",
          },
          {
            className: "fa fa-soundcloud",
            description: "soundcloud",
          },
          {
            className: "fa fa-spotify",
            description: "spotify",
          },
          {
            className: "fa fa-stack-exchange",
            description: "stack-exchange",
          },
          {
            className: "fa fa-stack-overflow",
            description: "stack-overflow",
          },
          {
            className: "fa fa-steam",
            description: "steam",
          },
          {
            className: "fa fa-steam-square",
            description: "steam-square",
          },
          {
            className: "fa fa-stumbleupon",
            description: "stumbleupon",
          },
          {
            className: "fa fa-stumbleupon-circle",
            description: "stumbleupon-circle",
          },
          {
            className: "fa fa-tencent-weibo",
            description: "tencent-weibo",
          },
          {
            className: "fa fa-trello",
            description: "trello",
          },
          {
            className: "fa fa-tripadvisor",
            description: "tripadvisor",
          },
          {
            className: "fa fa-tumblr",
            description: "tumblr",
          },
          {
            className: "fa fa-tumblr-square",
            description: "tumblr-square",
          },
          {
            className: "fa fa-twitch",
            description: "twitch",
          },
          {
            className: "fa fa-twitter",
            description: "twitter",
          },
          {
            className: "fa fa-twitter-square",
            description: "twitter-square",
          },
          {
            className: "fa fa-usb",
            description: "usb",
          },
          {
            className: "fa fa-viacoin",
            description: "viacoin",
          },
          {
            className: "fa fa-vimeo",
            description: "vimeo",
          },
          {
            className: "fa fa-vimeo-square",
            description: "vimeo-square",
          },
          {
            className: "fa fa-vine",
            description: "vine",
          },
          {
            className: "fa fa-vk",
            description: "vk",
          },
          {
            className: "fa fa-wechat",
            description: "wechat",
          },
          {
            className: "fa fa-weibo",
            description: "weibo",
          },
          {
            className: "fa fa-weixin",
            description: "weixin",
          },
          {
            className: "fa fa-whatsapp",
            description: "whatsapp",
          },
          {
            className: "fa fa-wikipedia-w",
            description: "wikipedia-w",
          },
          {
            className: "fa fa-windows",
            description: "windows",
          },
          {
            className: "fa fa-wordpress",
            description: "wordpress",
          },
          {
            className: "fa fa-xing",
            description: "xing",
          },
          {
            className: "fa fa-xing-square",
            description: "xing-square",
          },
          {
            className: "fa fa-y-combinator",
            description: "y-combinator",
          },
          {
            className: "fa fa-y-combinator-square",
            description: "y-combinator-square",
          },
          {
            className: "fa fa-yahoo",
            description: "yahoo",
          },
          {
            className: "fa fa-yc",
            description: "yc",
          },
          {
            className: "fa fa-yc-square",
            description: "yc-square",
          },
          {
            className: "fa fa-yelp",
            description: "yelp",
          },
          {
            className: "fa fa-youtube",
            description: "youtube",
          },
          {
            className: "fa fa-youtube-play",
            description: "youtube-play",
          },
          {
            className: "fa fa-youtube-square",
            description: "youtube-square",
          },
        ],
        mediaIcons: [
          {
            className: "fa fa-ambulance",
            description: "ambulance",
          },
          {
            className: "fa fa-h-square",
            description: "h-square",
          },
          {
            className: "fa fa-heart",
            description: "heart",
          },
          {
            className: "fa fa-heart-o",
            description: "heart-o",
          },
          {
            className: "fa fa-heartbeat",
            description: "heartbeat",
          },
          {
            className: "fa fa-hospital-o",
            description: "hospital-o",
          },
          {
            className: "fa fa-medkit",
            description: "medkit",
          },
          {
            className: "fa fa-plus-square",
            description: "plus-square",
          },
          {
            className: "fa fa-stethoscope",
            description: "stethoscope",
          },
          {
            className: "fa fa-user-md",
            description: "user-md",
          },
          {
            className: "fa fa-wheelchair",
            description: "wheelchair",
          },
        ],
      },
      checkIcon: "",
      checkType: "",
      checkIndex: 0,
    };
  },
  watch: {},
  created() {},
  computed: {
    fontSelectVisible: {
      get() {
        return this.visible;
      },
      set(val) {
        this.$emit("update:visible", val);
      },
    },
  },
  // props: ["visible", "logoUrl"],
  props: {
    visible: Boolean,
    logoUrl: String,
    innerDialog: {
      // 是否为内嵌弹框
      type: Boolean,
      default: false,
    },
  },
  methods: {
    onCancel() {
      this.fontSelectVisible = false;
      this.$emit("select-ok", this.logoUrl);
    },
    onOk() {
      this.fontSelectVisible = false;
      this.$emit("select-ok", this.checkIcon);
    },
    checkFontIcon(obj, ind) {
      this.checkType = obj;
      this.checkIndex = ind;
      this.checkIcon = this.data[obj][ind].className;
      this.$forceUpdate();
    },
  },
};
</script>
<style scoped></style>
<style lang="scss" scoped></style>
