export const fontSizeAdv = (options) => {
  class FontSizeOption {
    // 唯一的 参数 键. 如果重复 后面的将覆盖前面的
    name = 'fontSize';
    isInput = false;

    constructor(options) {
      this.isInput = options.isInput || false;
    }

    target = null;

    createTarget(printElement, options, printElementType) {
      const input = `<input type="number" class="auto-submit"/>`;
      const select = `<select class="auto-submit"></select>`;
      this.target = $(`
      <div class="hiprint-option-item hiprint-option-item-row">
        <div class="hiprint-option-item-label">字体大小</div>
        <div class="hiprint-option-item-field">
          ${ this.isInput ? input : select }
        </div>
      </div>
    `);
      // 不是输入框, 就插入 select option
      if (!this.isInput) {
        let list = [1,2,3,4,5,6,7,8, 9, 10, 11, 12, 14, 15,16, 17,18, 19,20, 21,22, 23,24,25, 26,27, 28,29,30];
        let fontSizeList = '<option value="" >默认</option>';
        list.forEach(function(e) {
          fontSizeList += '<option value="' + e + '">' + e + 'pt</option>';
        });
        this.target.find('.auto-submit').append($(fontSizeList));
      }
      // 别忘了 getValue, setValue, 也需要做对应调整
      return this.target;
    }

    // 获取这个参数的 值
    getValue() {
      var t = '';
      if (this.isInput) {
        t = this.target.find('input').val();
      } else {
        t = this.target.find('select').val();
      }
      if (t) return parseFloat(t.toString());
    }

    // 设置这个参数的 值
    setValue(t) {
      if (this.isInput) {
        return t && this.target.find('input').val(t);
      }
      t && (this.target.find('option[value="' + t + '"]').length || this.target.find('select').prepend('<option value="' + t + '" >' + t + '</option>'));
      this.target.find('select').val(t);
    }

    // 销毁这个参数 (比如点击其他元素的时候，移除这个 DOM)
    destroy() {
      this.target.remove();
    }
  }

  return function () { 
    return new FontSizeOption(options) 
  };
};