任务新增导出

zhongrj

2023-06-27 d74b495736f0c04522ec54274b70fed0ded2878d

 public/map/controls/tab/TabControl.js

New file
@@ -0,0 +1,135 @@
/**
 * infoWindow的template
 * @author Wenyb
 * @date 2015/11/4
 */
define([
   "base/BaseControl",
   "dojo",
   "dojo/_base/declare",
   "dojo/text!controls/tab/TabControl.html",
   "dojo/_base/lang",
   "dojo/query",
   "dojo/dom-construct",
   "dojo/dom-style",
   "dojo/dom-attr",
   "dojo/on",
   "dojo/dom-class",
   "dojo/domReady!"
], function(
   BaseControl,
   dojo,
   declare,
   template,
   lang,
   query,
   domConstruct,
   domStyle,
   domAttr,
   on,
   domClass
) {
   var Widget = declare("TabControl", [BaseControl], {
      templateString: template,
      baseClass: "tabcontrol",
      //{tab:[{type:"tab1",label:"TAB1",active:true},{type:"tab1",label:"TAB2"}]}
      constructor: function(options, srcRefNode) {
         this.activeTabType = null;
         this.tabIndex = {};
      },
      startup: function() {
         for (var i = 0; i < this.tab.length; i++) {
            this._createTab(this.tab[i]);
         }
         this.inherited(arguments);
      },
      _createTab: function(tab) {
         var className = this.baseClass + "-tabbutton ";
         if (tab.active) {
            className += this.baseClass + "-tabbutton-actived";
         }
         tab.span = domConstruct.create("div", {
            className: className,
            innerHTML: tab.label,
            "data-type": tab.type
         }, this.tabContainer);
         on(tab.span, "click", lang.hitch(this, this._tabButtonClick));
         this.tabIndex[tab.type] = tab;
      },
      postCreate: function() {
         this.inherited(arguments);
      },
      changeActiveTab: function(type) {
         if (this.activeTabType) {
            var tab = this.tabIndex[this.activeTabType];
            domClass.remove(tab.span, this.baseClass + "-tabbutton-actived");
            if (tab.content) {
               domStyle.set(tab.content, "display", "none");
            }
            this.activeTabType = null;
         }
         if (type) {
            var tab = this.tabIndex[type];
            domClass.add(tab.span, this.baseClass + "-tabbutton-actived");
            if (tab.content) {
               domStyle.set(tab.content, "display", "block");
            }
            this.activeTabType = type;
         }
      },
      onChangeActiveTab: function(type) {
         return type;
      },
      //将两个type的Content关联，即设为同一个dom，使得切换到两个tab时，显示状态一致的相同内容。如需根据type改变content内部行为，可对onChangeActiveTab进行拦截。
      //type2需要已设置content，linkContent后type1的content将与type2的保持一致
      linkContent: function(type1, type2) {
         if (this.tabIndex[type2] && this.tabIndex[type2].content && this.tabIndex[type1]) {
            this.tabIndex[type1].content = this.tabIndex[type2].content;
         }
      },
      setContent: function(type, content) {
         var tab = this.tabIndex[type];
         if (tab.content) {
            domConstruct.destroy(tab.content);
            tab.content = null;
         }
         var style = "display:none";
         if (this.activeTabType == type) {
            style = "display:block";
         }
         tab.content = domConstruct.create("div", {
            className: this.baseClass + "-tabcontent-box",
            "data-type": type,
            style: style
         }, this.tabContent);
         domConstruct.place(content, tab.content);
      },
      _tabButtonClick: function(evt) {
         var type = domAttr.get(evt.currentTarget, "data-type");
         if (this.activeTabType == type) {
            if (!this.disableNoActiveTab) {
               this.changeActiveTab(null);
               this.onChangeActiveTab(null);
            }
         } else {
            this.changeActiveTab(type);
            this.onChangeActiveTab(type);
         }

      },
      hideContent: function() {
         this.changeActiveTab(null);
      },
      hideTab: function() {
         domStyle.set(this.tabcontainer, "display", "none");
         domStyle.set(this.content, "bottom", "0px");
      },
      show: function() {
         domStyle.set(this.domNode, "display", "block");
      },
      hide: function() {
         domStyle.set(this.domNode, "display", "none");
      }
   });
   return Widget;
});