define([ "require", "backbone", "hbs!tmpl/entity/CreateEntityLayoutView_tmpl", "utils/Utils", "collection/VTagList", "collection/VEntityList", "models/VEntity", "modules/Modal", "utils/Messages", "moment", "utils/UrlLinks", "collection/VSearchList", "utils/Enums", "utils/Globals", "daterangepicker" ], function(require, Backbone, CreateEntityLayoutViewTmpl, Utils, VTagList, VEntityList, VEntity, Modal, Messages, moment, UrlLinks, VSearchList, Enums, Globals) { var CreateEntityLayoutView = Backbone.Marionette.LayoutView.extend({ _viewName: "CreateEntityLayoutView", template: CreateEntityLayoutViewTmpl, templateHelpers: function() { return { guid: this.guid }; }, regions: {}, ui: { entityName: "[data-id='entityName']", entityList: "[data-id='entityList']", entityInputData: "[data-id='entityInputData']", toggleRequired: 'input[name="toggleRequired"]', assetName: "[data-id='assetName']", entityInput: "[data-id='entityInput']", entitySelectionBox: "[data-id='entitySelectionBox']" }, events: function() { var events = {}; return events["change " + this.ui.entityList] = "onEntityChange", events["change " + this.ui.toggleRequired] = function(e) { this.requiredAllToggle(e.currentTarget.checked); }, events; }, initialize: function(options) { _.extend(this, _.pick(options, "guid", "callback", "showLoader", "entityDefCollection", "typeHeaders", "searchVent")); var entityTitle, okLabel, that = this; this.selectStoreCollection = new Backbone.Collection(), this.collection = new VEntityList(), this.entityModel = new VEntity(), this.guid && (this.collection.modelAttrName = "createEntity"), this.asyncReferEntityCounter = 0, this.required = !0, this.guid ? (entityTitle = "编辑实体", okLabel = "Update") : (entityTitle = "创建实体", okLabel = "Create"), this.modal = new Modal({ title: entityTitle, content: this, cancelText: "Cancel", okText: okLabel, allowCancel: !0, okCloses: !1, width: "50%" }).open(), this.modal.$el.find("button.ok").attr("disabled", !0), this.modal.on("ok", function(e) { that.modal.$el.find("button.ok").showButtonLoader(), that.okButton(); }), this.modal.on("closeModal", function() { that.modal.trigger("cancel"); }); }, bindEvents: function() { this.listenTo(this.collection, "reset", function() { this.entityCollectionList(); }, this), this.listenTo(this.collection, "error", function() { this.hideLoader(); }, this); }, onRender: function() { this.bindEvents(), this.guid || this.bindRequiredField(), this.showLoader(), this.fetchCollections(), this.$(".toggleRequiredSwitch").hide(); }, bindRequiredField: function() { var that = this; this.ui.entityInputData.on("keyup change", "textarea", function(e) { var value = this.value; if (!value.length && $(this).hasClass("false")) $(this).removeClass("errorClass"), that.modal.$el.find("button.ok").prop("disabled", !1); else try { value && value.length && (JSON.parse(value), $(this).removeClass("errorClass"), that.modal.$el.find("button.ok").prop("disabled", !1)); } catch (err) { $(this).addClass("errorClass"), that.modal.$el.find("button.ok").prop("disabled", !0); } }), this.ui.entityInputData.on("keyup change", "input.true,select.true", function(e) { "" !== this.value.trim() ? ($(this).data("select2") ? $(this).data("select2").$container.find(".select2-selection").removeClass("errorClass") : $(this).removeClass("errorClass"), 0 === that.ui.entityInputData.find(".errorClass").length && that.modal.$el.find("button.ok").prop("disabled", !1)) : (that.modal.$el.find("button.ok").prop("disabled", !0), $(this).data("select2") ? $(this).data("select2").$container.find(".select2-selection").addClass("errorClass") : $(this).addClass("errorClass")); }); }, bindNonRequiredField: function() { var that = this; this.ui.entityInputData.off("keyup change", "input.false,select.false").on("keyup change", "input.false,select.false", function(e) { that.modal.$el.find("button.ok").prop("disabled") && 0 === that.ui.entityInputData.find(".errorClass").length && that.modal.$el.find("button.ok").prop("disabled", !1); }); }, decrementCounter: function(counter) { this[counter] > 0 && --this[counter]; }, fetchCollections: function() { this.guid ? (this.collection.url = UrlLinks.entitiesApiUrl({ guid: this.guid }), this.collection.fetch({ reset: !0 })) : this.entityCollectionList(); }, entityCollectionList: function() { this.ui.entityList.empty(); var that = this, name = ""; if (this.guid) { this.collection.each(function(val) { name += Utils.getName(val.get("entity")), that.entityData = val; }), this.ui.assetName.html(name); var referredEntities = this.entityData.get("referredEntities"), attributes = this.entityData.get("entity").attributes; _.map(_.keys(attributes), function(key) { if (_.isObject(attributes[key])) { var attrObj = attributes[key]; _.isObject(attrObj) && !_.isArray(attrObj) && (attrObj = [ attrObj ]), _.each(attrObj, function(obj) { obj.guid && !referredEntities[obj.guid] && (++that.asyncReferEntityCounter, that.collection.url = UrlLinks.entitiesApiUrl({ guid: obj.guid }), that.collection.fetch({ success: function(data, response) { referredEntities[obj.guid] = response.entity; }, complete: function() { that.decrementCounter("asyncReferEntityCounter"), 0 === that.asyncReferEntityCounter && that.onEntityChange(null, that.entityData); }, silent: !0 })); }); } }), 0 === this.asyncReferEntityCounter && this.onEntityChange(null, this.entityData); } else { var str = ''; this.entityDefCollection.fullCollection.each(function(val) { var name = Utils.getName(val.toJSON()); Globals.entityTypeConfList && 0 !== name.indexOf("__") && (_.isEmptyArray(Globals.entityTypeConfList) ? str += "" : _.contains(Globals.entityTypeConfList, val.get("name")) && (str += "")); }), this.ui.entityList.html(str), this.ui.entityList.select2({}), this.hideLoader(); } }, capitalize: function(string) { return string.charAt(0).toUpperCase() + string.slice(1); }, requiredAllToggle: function(checked) { checked ? (this.ui.entityInputData.addClass("all").removeClass("required"), this.ui.entityInputData.find("div.true").show(), this.ui.entityInputData.find("fieldset div.true").show(), this.ui.entityInputData.find("fieldset").show(), this.required = !1) : (this.ui.entityInputData.addClass("required").removeClass("all"), this.ui.entityInputData.find("fieldset").each(function() { $(this).find("div").hasClass("false") || $(this).hide(); }), this.ui.entityInputData.find("div.true").hide(), this.ui.entityInputData.find("fieldset div.true").hide(), this.required = !0); }, onEntityChange: function(e, value) { var that = this, typeName = value && value.get("entity") ? value.get("entity").typeName : null; this.guid || this.showLoader(), this.ui.entityInputData.empty(), typeName ? this.collection.url = UrlLinks.entitiesDefApiUrl(typeName) : e && (this.collection.url = UrlLinks.entitiesDefApiUrl(e.target.value), this.collection.modelAttrName = "attributeDefs"), this.collection.fetch({ success: function(model, data) { that.supuertypeFlag = 0, that.subAttributeData(data); }, complete: function() { that.modal.$el.find("button.ok").prop("disabled", !0); }, silent: !0 }); }, renderAttribute: function(object) { var that = this, visitedAttr = {}, attributeObj = object.attributeDefs, isAllAttributeOptinal = !0, isAllRelationshipAttributeOptinal = !0, attributeDefList = attributeObj.attributeDefs, relationshipAttributeDefsList = attributeObj.relationshipAttributeDefs, attributeHtml = "", relationShipAttributeHtml = "", fieldElemetHtml = "", commonInput = function(object) { var containerHtml = (object.value, ""); return containerHtml += that.getContainer(object); }; return (attributeDefList.length || relationshipAttributeDefsList.length) && (_.each(attributeDefList, function(value) { value.isOptional === !1 && (isAllAttributeOptinal = !1), attributeHtml += commonInput({ value: value, duplicateValue: !1, isAttribute: !0 }); }), _.each(relationshipAttributeDefsList, function(value) { if (value.isOptional === !1 && (isAllRelationshipAttributeOptinal = !1), null === visitedAttr[value.name]) { var duplicateRelationship = _.where(relationshipAttributeDefsList, { name: value.name }), str = ''; _.each(duplicateRelationship, function(val, index, list) { str += ""; }); value.isOptional; visitedAttr[value.name] = '
"; } else relationShipAttributeHtml += commonInput({ value: value, duplicateValue: !0, isRelation: !0 }), visitedAttr[value.name] = null; }), attributeHtml.length && (fieldElemetHtml += that.getFieldElementContainer({ htmlField: attributeHtml, attributeType: !0, alloptional: isAllAttributeOptinal })), relationShipAttributeHtml.length && (fieldElemetHtml += that.getFieldElementContainer({ htmlField: relationShipAttributeHtml, relationshipType: !0, alloptional: isAllRelationshipAttributeOptinal })), fieldElemetHtml.length ? (that.ui.entityInputData.append(fieldElemetHtml), _.each(_.keys(visitedAttr), function(key) { if (null !== visitedAttr[key]) { var elFound = that.ui.entityInputData.find('[data-key="' + key + '"]'); elFound.prop("disabled", !0), elFound.parent().prepend(visitedAttr[key]); } })) : (fieldElemetHtml = "

Defination not found

", that.ui.entityInputData.append(fieldElemetHtml))), that.ui.entityInputData.find("select[data-for-key]").select2({}).on("change", function() { var forKey = $(this).data("forKey"), forKeyEl = null; forKey && forKey.length && (forKeyEl = that.ui.entityInputData.find('[data-key="' + forKey + '"]'), forKeyEl && ("" == this.value ? (forKeyEl.val(null).trigger("change"), forKeyEl.prop("disabled", !0)) : forKeyEl.prop("disabled", !1))); }), !1; }, subAttributeData: function(data) { var that = this, attributeDefs = Utils.getNestedSuperTypeObj({ seperateRelatioshipAttr: !0, attrMerge: !0, data: data, collection: this.entityDefCollection }); attributeDefs && attributeDefs.relationshipAttributeDefs.length && (attributeDefs.attributeDefs = _.filter(attributeDefs.attributeDefs, function(obj) { if (void 0 === _.find(attributeDefs.relationshipAttributeDefs, { name: obj.name })) return !0; })), attributeDefs.attributeDefs.length || attributeDefs.relationshipAttributeDefs.length ? this.$(".toggleRequiredSwitch").show() : this.$(".toggleRequiredSwitch").hide(), this.renderAttribute({ attributeDefs: attributeDefs }), this.required && (this.ui.entityInputData.find("fieldset div.true").hide(), this.ui.entityInputData.find("div.true").hide()), "placeholder" in HTMLInputElement.prototype || this.ui.entityInputData.find("input,select,textarea").placeholder(), that.initilizeElements(); }, initilizeElements: function() { var that = this, $createTime = this.modal.$el.find('input[name="createTime"]'), dateObj = { singleDatePicker: !0, showDropdowns: !0, startDate: new Date(), locale: { format: Globals.dateFormat } }; this.$('input[data-type="date"]').each(function() { $(this).data("daterangepicker") || (that.guid && this.value.length && (dateObj.startDate = new Date(Number(this.value))), "modifiedTime" === $(this).attr("name") && (dateObj.minDate = $createTime.val()), $(this).daterangepicker(dateObj)); }), modifiedDateObj = _.extend({}, dateObj), $createTime.on("apply.daterangepicker", function(ev, picker) { that.modal.$el.find('input[name="modifiedTime"]').daterangepicker(_.extend(modifiedDateObj, { minDate: $createTime.val() })); }), this.initializeValidation(), this.ui.entityInputData.find("fieldset").length > 0 && 0 === this.ui.entityInputData.find("select.true,input.true").length && (this.requiredAllToggle(0 === this.ui.entityInputData.find("select.true,input.true").length), this.guid || this.bindNonRequiredField()), this.$('select[data-type="boolean"]').each(function(value, key) { var dataKey = $(key).data("key"); if (that.entityData) { var setValue = that.entityData.get("entity").attributes[dataKey]; this.value = setValue; } }), this.addJsonSearchData(); }, initializeValidation: function() { var regex = /^[0-9]*((?=[^.]|$))?$/, removeText = function(e, value) { if (!regex.test(value)) { var txtfld = e.currentTarget, newtxt = txtfld.value.slice(0, txtfld.value.length - 1); txtfld.value = newtxt; } }; this.$('input[data-type="int"],input[data-type="long"]').on("keydown", function(e) { if (!regex.test(e.currentTarget.value)) return !1; }), this.$('input[data-type="int"],input[data-type="long"]').on("paste", function(e) { return !1; }), this.$('input[data-type="long"],input[data-type="int"]').on("keyup click", function(e) { removeText(e, e.currentTarget.value); }), this.$('input[data-type="date"]').on("hide.daterangepicker keydown", function(event) { if (event.type) if ("hide" == event.type) this.blur(); else if ("keydown" == event.type) return !1; }); }, getContainer: function(object) { var value = object.value, entityLabel = this.capitalize(_.escape(value.name)); return '
' + this.getElement(object) + "
"; }, getFieldElementContainer: function(object) { var htmlField = object.htmlField, relationshipType = (!!object.attributeType && object.attributeType, !!object.relationshipType && object.relationshipType), alloptional = object.alloptional, typeOfDefination = relationshipType ? "Relationships" : "Attributes"; return '
' + typeOfDefination + "" + htmlField + "
"; }, getSelect: function(object) { var value = object.value, name = _.escape(value.name), entityValue = _.escape(object.entityValue), isAttribute = object.isAttribute, isRelation = object.isRelation; if ("boolean" === value.typeName) return ''; var splitTypeName = value.typeName.split("<"); return splitTypeName = splitTypeName.length > 1 ? splitTypeName[1].split(">")[0] : value.typeName, '"; }, getTextArea: function(object) { var value = object.value, name = _.escape(value.name), setValue = _.escape(object.entityValue), isAttribute = object.isAttribute, isRelation = object.isRelation, structType = object.structType; try { if (structType && entityValue && entityValue.length) { var parseValue = JSON.parse(entityValue); _.isObject(parseValue) && !_.isArray(parseValue) && parseValue.attributes && (setValue = JSON.stringify(parseValue.attributes)); } } catch (err) {} return '"; }, getInput: function(object) { var value = object.value, name = _.escape(value.name), entityValue = _.escape(object.entityValue), isAttribute = object.isAttribute, isRelation = object.isRelation; return ''; }, getElement: function(object) { var value = object.value, isAttribute = object.isAttribute, isRelation = object.isRelation, typeName = value.typeName, entityValue = ""; if (this.guid) { var dataValue = this.entityData.get("entity").attributes[value.name]; _.isObject(dataValue) ? entityValue = JSON.stringify(dataValue) : (dataValue && (entityValue = dataValue), "date" === value.typeName && (entityValue = dataValue ? moment(dataValue) : Utils.formatDate({ zone: !1, dateFormat: Globals.dateFormat }))); } if (typeName && this.entityDefCollection.fullCollection.find({ name: typeName }) || "boolean" === typeName || typeName.indexOf("array") > -1) return this.getSelect({ value: value, entityValue: entityValue, isAttribute: isAttribute, isRelation: isRelation }); if (typeName.indexOf("map") > -1) return this.getTextArea({ value: value, entityValue: entityValue, isAttribute: isAttribute, isRelation: isRelation, structType: !1 }); var typeNameCategory = this.typeHeaders.fullCollection.findWhere({ name: typeName }); return typeNameCategory && "STRUCT" === typeNameCategory.get("category") ? this.getTextArea({ value: value, entityValue: entityValue, isAttribute: isAttribute, isRelation: isRelation, structType: !0 }) : this.getInput({ value: value, entityValue: entityValue, isAttribute: isAttribute, isRelation: isRelation }); }, okButton: function() { var that = this; this.showLoader({ editVisiblityOfEntitySelectionBox: !0 }), this.parentEntity = this.ui.entityList.val(); var entityAttribute = {}, referredEntities = {}, relationshipAttribute = {}, extractValue = function(value, typeName) { if (!value) return value; if (_.isArray(value)) { var parseData = []; _.map(value, function(val) { parseData.push({ guid: val, typeName: typeName }); }); } else var parseData = { guid: value, typeName: typeName }; return parseData; }; try { this.ui.entityInputData.find("input,select,textarea").each(function() { var value = $(this).val(), el = this; if ($(this).val() && $(this).val().trim && (value = $(this).val().trim()), "TEXTAREA" === this.nodeName) try { value && value.length && (JSON.parse(value), $(this).removeClass("errorClass")); } catch (err) { throw new Error(err.message); } if ($(this).hasClass("true") && ("" == value || void 0 == value)) throw $(this).data("select2") ? $(this).data("select2").$container.find(".select2-selection").addClass("errorClass") : $(this).addClass("errorClass"), that.hideLoader(), that.modal.$el.find("button.ok").hideButtonLoader(), new Error("Please fill the required fields"); var dataTypeEnitity = $(this).data("type"), datakeyEntity = $(this).data("key"), typeName = $(this).data("querydata"), attribute = "undefined" != $(this).data("attribute"), relation = "undefined" != $(this).data("relation"), typeNameCategory = that.typeHeaders.fullCollection.findWhere({ name: dataTypeEnitity }), val = null; if (dataTypeEnitity && datakeyEntity) { if (that.entityDefCollection.fullCollection.find({ name: dataTypeEnitity })) val = extractValue(value, typeName); else if ("date" === dataTypeEnitity || "time" === dataTypeEnitity) val = Date.parse(value); else if (dataTypeEnitity.indexOf("map") > -1 || typeNameCategory && "STRUCT" === typeNameCategory.get("category")) try { value && value.length && (parseData = JSON.parse(value), val = parseData); } catch (err) { throw $(this).addClass("errorClass"), new Error(datakeyEntity + " : " + err.message); } else val = dataTypeEnitity.indexOf("array") > -1 && dataTypeEnitity.indexOf("string") === -1 ? extractValue(value, typeName) : _.isString(value) ? value.length ? value : null : value; attribute ? entityAttribute[datakeyEntity] = val : relation && (relationshipAttribute[datakeyEntity] = val); } else { var dataRelEntity = $(this).data("forKey"); dataRelEntity && relationshipAttribute[dataRelEntity] && (_.isArray(relationshipAttribute[dataRelEntity]) ? _.each(relationshipAttribute[dataRelEntity], function(obj) { obj && (obj.relationshipType = $(el).val()); }) : relationshipAttribute[dataRelEntity].relationshipType = $(this).val()); } }); var entityJson = { entity: { typeName: this.guid ? this.entityData.get("entity").typeName : this.parentEntity, attributes: entityAttribute, relationshipAttributes: relationshipAttribute, guid: this.guid ? this.guid : -1 }, referredEntities: referredEntities }; this.entityModel.createOreditEntity({ data: JSON.stringify(entityJson), type: "POST", success: function(model, response) { that.modal.$el.find("button.ok").hideButtonLoader(), that.modal.close(); var msgType = model.mutatedEntities && model.mutatedEntities.UPDATE ? "editSuccessMessage" : "addSuccessMessage"; if (Utils.notifySuccess({ content: "实体" + Messages.getAbbreviationMsg(!1, msgType) }), that.guid && that.callback) that.callback(); else if (model.mutatedEntities) { var mutatedEntities = model.mutatedEntities.CREATE || model.mutatedEntities.UPDATE; mutatedEntities && _.isArray(mutatedEntities) && mutatedEntities[0] && mutatedEntities[0].guid && Utils.setUrl({ url: "#!/detailPage/" + mutatedEntities[0].guid, mergeBrowserUrl: !1, trigger: !0 }), that.searchVent && that.searchVent.trigger("entityList:refresh"); } }, complete: function() { that.hideLoader({ editVisiblityOfEntitySelectionBox: !0 }), that.modal.$el.find("button.ok").hideButtonLoader(); } }); } catch (e) { Utils.notifyError({ content: e.message }), that.hideLoader({ editVisiblityOfEntitySelectionBox: !0 }); } }, showLoader: function(options) { var editVisiblityOfEntitySelectionBox = options && options.editVisiblityOfEntitySelectionBox; this.$(".entityLoader").addClass("show"), this.$(".entityInputData").hide(), (this.guid || editVisiblityOfEntitySelectionBox) && this.ui.entitySelectionBox.hide(); }, hideLoader: function(options) { var editVisiblityOfEntitySelectionBox = options && options.editVisiblityOfEntitySelectionBox; this.$(".entityLoader").removeClass("show"), this.$(".entityInputData").show(), (this.guid || editVisiblityOfEntitySelectionBox) && this.ui.entitySelectionBox.show(), this.ui.entityList.select2("open"), this.ui.entityList.select2("close"); }, addJsonSearchData: function() { var that = this; this.$('select[data-id="entitySelectData"]').each(function(value, key) { var $this = $(this), keyData = $(this).data("key"), typeData = $(this).data("type"), queryData = $(this).data("querydata"), placeholderName = ($(this).data("skip"), "请从以下列表中选择一个" + typeData); if ($this.attr("multiple", $this.data("type").indexOf("array") !== -1), that.guid) { var dataValue = that.entityData.get("entity").attributes[keyData], relationshipType = (that.entityData.get("entity").attributes, that.entityData.get("entity").relationshipAttributes ? that.entityData.get("entity").relationshipAttributes[keyData] : null), referredEntities = that.entityData.get("referredEntities"), selectedValue = [], select2Options = []; if (dataValue && (_.isObject(dataValue) && !_.isArray(dataValue) && (dataValue = [ dataValue ]), _.each(dataValue, function(obj) { if (_.isObject(obj) && obj.guid && referredEntities[obj.guid]) { var refEntiyFound = referredEntities[obj.guid]; refEntiyFound.id = refEntiyFound.guid, Enums.entityStateReadOnly[refEntiyFound.status] || (select2Options.push(refEntiyFound), selectedValue.push(refEntiyFound.guid)); } }), _.isUndefined(relationshipType) || relationshipType && relationshipType.relationshipAttributes && relationshipType.relationshipAttributes.typeName && that.$("select[data-for-key=" + keyData + "]").val(relationshipType.relationshipAttributes.typeName).trigger("change")), 0 === selectedValue.length && dataValue && dataValue.length && "string" === $this.data("querydata")) { var str = ""; _.each(dataValue, function(obj) { _.isString(obj) && (selectedValue.push(obj), str += ""); }), $this.html(str); } } else $this.val([]); var select2Option = { placeholder: placeholderName, allowClear: !0, tags: "string" == $this.data("querydata") }, getTypeAheadData = function(data, params) { var dataList = data.entities, foundOptions = []; return _.each(dataList, function(obj) { obj && (obj.guid && (obj.id = obj.guid), foundOptions.push(obj)); }), foundOptions; }; "string" !== $this.data("querydata") && _.extend(select2Option, { ajax: { url: UrlLinks.searchApiUrl("attribute"), dataType: "json", delay: 250, data: function(params) { return { attrValuePrefix: params.term, typeName: queryData, limit: 10, offset: 0 }; }, processResults: function(data, params) { return { results: getTypeAheadData(data, params) }; }, cache: !0 }, templateResult: function(option) { var name = Utils.getName(option, "qualifiedName"); return "-" === name ? option.text : name; }, templateSelection: function(option) { var name = Utils.getName(option, "qualifiedName"); return "-" === name ? option.text : name; }, escapeMarkup: function(markup) { return markup; }, data: select2Options, minimumInputLength: 1 }), $this.select2(select2Option), selectedValue && $this.val(selectedValue).trigger("change"); }), this.guid && (this.bindRequiredField(), this.bindNonRequiredField()), this.hideLoader(); } }); return CreateEntityLayoutView; });