tfp/lib/components/popuplist/controller.pc.js

A Web UI framework for TaskBuilder

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _controller = require("../controller.js");

function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }

function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }

/**
 * 弹出列表组件
 * @param {[type]} dataModel [description]
 */
var PopupList = /*#__PURE__*/function (_FormInput) {
  (0, _inherits2["default"])(PopupList, _FormInput);

  var _super = _createSuper(PopupList);

  function PopupList(__tfp, dataModel, parent) {
    (0, _classCallCheck2["default"])(this, PopupList);
    return _super.call(this, __tfp, "PopupList", dataModel, parent);
  }

  (0, _createClass2["default"])(PopupList, [{
    key: "value",
    get: function get() {
      if (!this.dataModel.value) return "";
      return this.dataModel.value;
    },
    set: function set(value) {
      var val = value;

      if (isNull(value)) {
        val = "";
        this.dataModel.value = null;
      } else {
        this.dataModel.value = val;
      }

      if (this._jqObj) {
        if (isNull(value)) {
          this._jqObj.find("input").val("");
        } else {
          if (this.dataModel.options) {
            for (var i = 0; i < this.dataModel.options.length; i++) {
              var option = this.dataModel.options[i];

              if (option.value + "" == val + "") {
                this._jqObj.find("input").val(option.text);

                break;
              }
            }
          }
        }
      }

      if (!this._tfp.isDesigning) {
        this.valueOnChange();
        this.exeEventHandler("onChange", val);
      }
    }
  }, {
    key: "options",
    get: function get() {
      return this.dataModel.options;
    },
    set: function set(value) {
      //if(this._tfp.isDesigning) {
      this.dataModel.options = value;
      return; //}

      /*if(this._jqObj && value && Array.isArray(value)) {
        this._jqObj.empty();
        this.dataModel.options = [];
        for(var i=0;i<value.length;i++) {
          this.addOption(value[i]);
        }
        //TODO 如果重置选项列表后，没有组件当前值对应的选项，应该把组件值设置为空
      }*/
    }
  }, {
    key: "placeHolder",
    get: function get() {
      return this.dataModel.placeHolder;
    },
    set: function set(value) {
      this.dataModel.placeHolder = value;
      if (this._jqObj) this._jqObj.find("input").attr("placeholder", value);
    }
  }, {
    key: "loadDataListService",
    get: function get() {
      return this.dataModel.loadDataListService;
    },
    set: function set(value) {
      this.dataModel.loadDataListService = value;
    }
  }, {
    key: "dataListBindingMember",
    get: function get() {
      return this.dataModel.dataListBindingMember;
    },
    set: function set(value) {
      this.dataModel.dataListBindingMember = value;
    }
  }, {
    key: "dataListValueFormat",
    get: function get() {
      return this.dataModel.dataListValueFormat;
    },
    set: function set(value) {
      this.dataModel.dataListValueFormat = value;
    }
  }, {
    key: "dataListTextFormat",
    get: function get() {
      return this.dataModel.dataListTextFormat;
    },
    set: function set(value) {
      this.dataModel.dataListTextFormat = value;
    }
  }, {
    key: "dataListDivWidth",
    get: function get() {
      return this.dataModel.dataListDivWidth;
    },
    set: function set(value) {
      this.dataModel.dataListDivWidth = value;
    }
  }, {
    key: "dataListDivHeight",
    get: function get() {
      return this.dataModel.dataListDivHeight;
    },
    set: function set(value) {
      this.dataModel.dataListDivHeight = value;
    }
  }, {
    key: "enableFilter",
    get: function get() {
      return this.dataModel.enableFilter;
    },
    set: function set(value) {
      this.dataModel.enableFilter = value;
    }
  }, {
    key: "bindData",
    value: function bindData(data) {
      if (isNull(data) || !Array.isArray(data)) return;
      this.options = [];

      for (var i = 0; i < data.length; i++) {
        var row = data[i];
        var option = {};

        try {
          var valueFormat = this.dataModel.dataListValueFormat;
          if (valueFormat.indexOf("{") < 0 && valueFormat.indexOf("#[") < 0) valueFormat = "{" + valueFormat + "}";
          option.value = this._tfp.replaceDataField(row, valueFormat);
          if (option.value) option.value = this._tfp.exeExpress(option.value);
        } catch (e) {
          console.log(e);
          return;
        }

        if (isNull(option.value)) continue;
        option.text = option.value;

        if (this.dataModel.dataListTextFormat) {
          try {
            var textFormat = this.dataModel.dataListTextFormat;
            if (textFormat.indexOf("{") < 0 && textFormat.indexOf("#[") < 0) textFormat = "{" + textFormat + "}";
            option.text = this._tfp.replaceDataField(row, textFormat);
            if (option.text) option.text = this._tfp.exeExpress(option.text);
          } catch (e) {
            console.log(e);
            return;
          }
        }

        if (isNull(option.text)) continue;
        if (!isNull(this.value) && this.value + "" == option.value + "" && this._jqObj) this._jqObj.find("input").val(option.text);
        this.options.push(option);
      }

      if (this.options.length == 0) return;
    }
  }, {
    key: "loadData",
    value: function loadData() {
      if (!this.dataModel.loadDataListService) {
        alert("请为[" + this.id + "]设置加载数据服务！");
        return;
      }

      var serviceCpt = this._tfp.get(this.dataModel.loadDataListService);

      if (!serviceCpt) {
        alert("ID为[" + this.dataModel.loadDataListService + "]的组件不存在！");
        return;
      }

      if (!this.dataModel.dataListBindingMember) {
        alert("请为[" + this.id + "]设置数据绑定成员！");
        return;
      }

      if (!this.dataModel.dataListValueFormat) {
        alert("请为[" + this.id + "]设置选项值数据格式！");
        return;
      }

      var that = this; //与服务组件建立绑定

      if (!serviceCpt.bindCpts) serviceCpt.bindCpts = [];
      if (!serviceCpt.bindCpts.contains(this.id)) serviceCpt.bindCpts.push(this.id);
      serviceCpt.request(null, function (req, res) {
        var data = res[that.dataModel.dataListBindingMember];
        that.bindData(data);
      });
    }
  }, {
    key: "showOptions",
    value: function showOptions() {
      if (!this.options || this.options.length == 0) return;
      var divDataList = $("#" + this.id + "_PopupListDiv");

      var iptVal = this._jqObj.find("input").val().trim();

      divDataList.empty();
      /*if(iptVal=="") {
        divDataList.hide();
        return;
      }*/

      if (!this.dataModel.required) {
        divDataList.append("<div data-value=\"-1\"></div>");
      }

      for (var i = 0; i < this.options.length; i++) {
        var option = this.options[i];

        if (this.dataModel.enableFilter && !isNull(iptVal)) {
          if (!isNull(option.text) && option.text.indexOf(iptVal) >= 0) {
            divDataList.append("<div data-value=\"" + i + "\">" + option.text.replace(iptVal, "<span>" + iptVal + "</span>") + "</div>");
          }
        } else {
          divDataList.append("<div data-value=\"" + i + "\">" + option.text + "</div>");
        }
      }

      var that = this;
      divDataList.find("div").click(function () {
        var index = parseInt($(this).attr("data-value"));

        if (index >= 0) {
          that.value = that.options[index].value;
        } else {
          that.value = null;
        }

        divDataList.empty();
        divDataList.hide();
        event.stopPropagation();
      });
      divDataList.css("left", that._jqObj.offset().left + "px");
      divDataList.css("top", that._jqObj.offset().top + 31 + "px");
      divDataList.show();
      document.addEventListener("click", function () {
        divDataList.hide();
      });
    }
  }, {
    key: "initRuntime",
    value: function initRuntime() {
      var that = this;

      this._jqObj.blur(function () {
        var val = $(this).val().trim();
        that.dataModel.value = val;
        that.valueOnChange();
        that.exeEventHandler("onChange", val);
      }); //如果设置了加载数据列表的服务


      if (this.dataModel.loadDataListService) {
        this.loadData();
      }

      this._jqObj.find("input").click(function () {
        that.showOptions();
        event.stopPropagation();
      });

      this._jqObj.find("img").click(function () {
        that.showOptions();
        event.stopPropagation();
      });

      if (this.enableFilter) {
        this._jqObj.find("input").bind("input", function () {
          that.showOptions();
        });

        this._jqObj.find("input").blur(function () {
          var val = $(this).val().trim();

          for (var i = 0; i < that.options.length; i++) {
            if (that.options[i].text == val) return;
          }

          $(this).val("");
        });

        this._jqObj.find("input").removeAttr("readonly");
      }

      var dataListDivWidth = this._jqObj.width() + 6;
      if (this.dataModel.dataListDivWidth) dataListDivWidth = this.dataModel.dataListDivWidth;
      var dataListDivHeight = 240;
      if (this.dataModel.dataListDivHeight) dataListDivHeight = this.dataModel.dataListDivHeight; //添加数据列表层

      $("body").append("<div id=\"" + this.id + "_PopupListDiv\" " + "class=\"tfp-popuplist-datalist\" style=\"width:" + dataListDivWidth + "px; height:" + dataListDivHeight + "px;\"></div>");
    }
  }]);
  return PopupList;
}(_controller.FormInput);

exports["default"] = PopupList;