@antv/l7-component 2.9.32-alpha.4 → 2.9.32-alpha.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/control/baseControl/buttonControl.d.ts +1 -1
- package/es/control/baseControl/control.d.ts +4 -5
- package/es/control/baseControl/control.js +18 -5
- package/es/control/baseControl/popperControl.d.ts +1 -1
- package/es/control/baseControl/selectControl.d.ts +2 -2
- package/es/control/baseControl/selectControl.js +5 -0
- package/es/control/zoom.d.ts +3 -2
- package/lib/assets/iconfont/iconfont.js +46 -30
- package/lib/constants/index.js +34 -56
- package/lib/control/baseControl/buttonControl.js +194 -105
- package/lib/control/baseControl/control.js +317 -156
- package/lib/control/baseControl/index.js +57 -22
- package/lib/control/baseControl/popperControl.js +136 -102
- package/lib/control/baseControl/selectControl.js +230 -130
- package/lib/control/exportImage.js +175 -81
- package/lib/control/fullscreen.js +157 -102
- package/lib/control/geoLocate.js +143 -67
- package/lib/control/layerControl.js +162 -116
- package/lib/control/logo.js +101 -70
- package/lib/control/mapTheme.js +144 -85
- package/lib/control/mouseLocation.js +112 -71
- package/lib/control/scale.js +180 -127
- package/lib/control/zoom.js +154 -111
- package/lib/index.js +251 -48
- package/lib/interface.js +4 -16
- package/lib/marker-layer.js +367 -249
- package/lib/marker.js +419 -277
- package/lib/popup/layerPopup.js +305 -188
- package/lib/popup/popup.js +602 -339
- package/lib/utils/anchor.js +37 -55
- package/lib/utils/icon.js +13 -32
- package/lib/utils/popper.js +268 -180
- package/lib/utils/screenfull.js +110 -103
- package/package.json +5 -5
|
@@ -1,108 +1,142 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
var __export = (target, all) => {
|
|
8
|
-
for (var name in all)
|
|
9
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
-
};
|
|
11
|
-
var __copyProps = (to, from, except, desc) => {
|
|
12
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
-
for (let key of __getOwnPropNames(from))
|
|
14
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
-
}
|
|
17
|
-
return to;
|
|
18
|
-
};
|
|
19
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
20
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
21
|
-
|
|
22
|
-
// src/control/baseControl/popperControl.ts
|
|
23
|
-
var popperControl_exports = {};
|
|
24
|
-
__export(popperControl_exports, {
|
|
25
|
-
PopperControl: () => PopperControl,
|
|
26
|
-
default: () => PopperControl
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
27
7
|
});
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
var
|
|
8
|
+
exports.default = exports.PopperControl = void 0;
|
|
9
|
+
|
|
10
|
+
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
11
|
+
|
|
12
|
+
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
13
|
+
|
|
14
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
15
|
+
|
|
16
|
+
var _get2 = _interopRequireDefault(require("@babel/runtime/helpers/get"));
|
|
17
|
+
|
|
18
|
+
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
19
|
+
|
|
20
|
+
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
|
|
21
|
+
|
|
22
|
+
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
|
23
|
+
|
|
24
|
+
var _popper = require("../../utils/popper");
|
|
25
|
+
|
|
26
|
+
var _buttonControl = _interopRequireDefault(require("./buttonControl"));
|
|
27
|
+
|
|
28
|
+
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); }; }
|
|
29
|
+
|
|
30
|
+
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; } }
|
|
31
|
+
|
|
31
32
|
var PopperPlacementMap = {
|
|
32
|
-
topleft:
|
|
33
|
-
topcenter:
|
|
34
|
-
topright:
|
|
35
|
-
bottomleft:
|
|
36
|
-
bottomcenter:
|
|
37
|
-
bottomright:
|
|
38
|
-
lefttop:
|
|
39
|
-
leftcenter:
|
|
40
|
-
leftbottom:
|
|
41
|
-
righttop:
|
|
42
|
-
rightcenter:
|
|
43
|
-
rightbottom:
|
|
33
|
+
topleft: 'right-start',
|
|
34
|
+
topcenter: 'bottom',
|
|
35
|
+
topright: 'left-start',
|
|
36
|
+
bottomleft: 'right-end',
|
|
37
|
+
bottomcenter: 'top',
|
|
38
|
+
bottomright: 'left-end',
|
|
39
|
+
lefttop: 'bottom-start',
|
|
40
|
+
leftcenter: 'right',
|
|
41
|
+
leftbottom: 'top-start',
|
|
42
|
+
righttop: 'bottom-end',
|
|
43
|
+
rightcenter: 'left',
|
|
44
|
+
rightbottom: 'top-end'
|
|
44
45
|
};
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
const defaultOption = super.getDefault(option);
|
|
55
|
-
const position = (option == null ? void 0 : option.position) ?? defaultOption.position;
|
|
56
|
-
return {
|
|
57
|
-
...super.getDefault(option),
|
|
58
|
-
popperPlacement: PopperPlacementMap[position],
|
|
59
|
-
popperTrigger: "click"
|
|
60
|
-
};
|
|
61
|
-
}
|
|
62
|
-
onAdd() {
|
|
63
|
-
const button = super.onAdd();
|
|
64
|
-
this.initPopper();
|
|
65
|
-
return button;
|
|
66
|
-
}
|
|
67
|
-
onRemove() {
|
|
68
|
-
this.popper.destroy();
|
|
69
|
-
}
|
|
70
|
-
initPopper() {
|
|
71
|
-
const {
|
|
72
|
-
popperClassName,
|
|
73
|
-
popperPlacement,
|
|
74
|
-
popperTrigger
|
|
75
|
-
} = this.controlOption;
|
|
76
|
-
const popperContainer = this.mapsService.getMapContainer();
|
|
77
|
-
this.popper = new import_popper.Popper(this.button, {
|
|
78
|
-
className: popperClassName,
|
|
79
|
-
placement: popperPlacement,
|
|
80
|
-
trigger: popperTrigger,
|
|
81
|
-
container: popperContainer,
|
|
82
|
-
unique: true
|
|
83
|
-
});
|
|
84
|
-
this.popper.on("show", () => {
|
|
85
|
-
this.emit("popperShow", this);
|
|
86
|
-
}).on("hide", () => {
|
|
87
|
-
this.emit("popperHide", this);
|
|
88
|
-
});
|
|
89
|
-
return this.popper;
|
|
46
|
+
|
|
47
|
+
var PopperControl = /*#__PURE__*/function (_ButtonControl) {
|
|
48
|
+
(0, _inherits2.default)(PopperControl, _ButtonControl);
|
|
49
|
+
|
|
50
|
+
var _super = _createSuper(PopperControl);
|
|
51
|
+
|
|
52
|
+
function PopperControl() {
|
|
53
|
+
(0, _classCallCheck2.default)(this, PopperControl);
|
|
54
|
+
return _super.apply(this, arguments);
|
|
90
55
|
}
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
56
|
+
|
|
57
|
+
(0, _createClass2.default)(PopperControl, [{
|
|
58
|
+
key: "getPopper",
|
|
59
|
+
value:
|
|
60
|
+
/**
|
|
61
|
+
* 气泡实例
|
|
62
|
+
* @protected
|
|
63
|
+
*/
|
|
64
|
+
function getPopper() {
|
|
65
|
+
return this.popper;
|
|
66
|
+
}
|
|
67
|
+
}, {
|
|
68
|
+
key: "hide",
|
|
69
|
+
value: function hide() {
|
|
70
|
+
this.popper.hide();
|
|
71
|
+
(0, _get2.default)((0, _getPrototypeOf2.default)(PopperControl.prototype), "hide", this).call(this);
|
|
72
|
+
}
|
|
73
|
+
/**
|
|
74
|
+
* 获取默认配置
|
|
75
|
+
* @param option
|
|
76
|
+
*/
|
|
77
|
+
|
|
78
|
+
}, {
|
|
79
|
+
key: "getDefault",
|
|
80
|
+
value: function getDefault(option) {
|
|
81
|
+
var _option$position;
|
|
82
|
+
|
|
83
|
+
var defaultOption = (0, _get2.default)((0, _getPrototypeOf2.default)(PopperControl.prototype), "getDefault", this).call(this, option);
|
|
84
|
+
var position = (_option$position = option === null || option === void 0 ? void 0 : option.position) !== null && _option$position !== void 0 ? _option$position : defaultOption.position;
|
|
85
|
+
return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, (0, _get2.default)((0, _getPrototypeOf2.default)(PopperControl.prototype), "getDefault", this).call(this, option)), {}, {
|
|
86
|
+
popperPlacement: PopperPlacementMap[position],
|
|
87
|
+
popperTrigger: 'click'
|
|
88
|
+
});
|
|
89
|
+
}
|
|
90
|
+
}, {
|
|
91
|
+
key: "onAdd",
|
|
92
|
+
value: function onAdd() {
|
|
93
|
+
var button = (0, _get2.default)((0, _getPrototypeOf2.default)(PopperControl.prototype), "onAdd", this).call(this);
|
|
100
94
|
this.initPopper();
|
|
101
|
-
|
|
95
|
+
return button;
|
|
102
96
|
}
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
}
|
|
97
|
+
}, {
|
|
98
|
+
key: "onRemove",
|
|
99
|
+
value: function onRemove() {
|
|
100
|
+
this.popper.destroy();
|
|
101
|
+
}
|
|
102
|
+
}, {
|
|
103
|
+
key: "initPopper",
|
|
104
|
+
value: function initPopper() {
|
|
105
|
+
var _this = this;
|
|
106
|
+
|
|
107
|
+
var _this$controlOption = this.controlOption,
|
|
108
|
+
popperClassName = _this$controlOption.popperClassName,
|
|
109
|
+
popperPlacement = _this$controlOption.popperPlacement,
|
|
110
|
+
popperTrigger = _this$controlOption.popperTrigger;
|
|
111
|
+
var popperContainer = this.mapsService.getMapContainer();
|
|
112
|
+
this.popper = new _popper.Popper(this.button, {
|
|
113
|
+
className: popperClassName,
|
|
114
|
+
placement: popperPlacement,
|
|
115
|
+
trigger: popperTrigger,
|
|
116
|
+
container: popperContainer,
|
|
117
|
+
unique: true
|
|
118
|
+
});
|
|
119
|
+
this.popper.on('show', function () {
|
|
120
|
+
_this.emit('popperShow', _this);
|
|
121
|
+
}).on('hide', function () {
|
|
122
|
+
_this.emit('popperHide', _this);
|
|
123
|
+
});
|
|
124
|
+
return this.popper;
|
|
125
|
+
}
|
|
126
|
+
}, {
|
|
127
|
+
key: "setOptions",
|
|
128
|
+
value: function setOptions(option) {
|
|
129
|
+
(0, _get2.default)((0, _getPrototypeOf2.default)(PopperControl.prototype), "setOptions", this).call(this, option);
|
|
130
|
+
|
|
131
|
+
if (this.checkUpdateOption(option, ['popperPlacement', 'popperTrigger', 'popperClassName'])) {
|
|
132
|
+
var content = this.popper.getContent();
|
|
133
|
+
this.popper.destroy();
|
|
134
|
+
this.initPopper();
|
|
135
|
+
this.popper.setContent(content);
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
}]);
|
|
139
|
+
return PopperControl;
|
|
140
|
+
}(_buttonControl.default);
|
|
141
|
+
|
|
142
|
+
exports.default = exports.PopperControl = PopperControl;
|
|
@@ -1,153 +1,253 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
8
|
-
};
|
|
9
|
-
var __copyProps = (to, from, except, desc) => {
|
|
10
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
11
|
-
for (let key of __getOwnPropNames(from))
|
|
12
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
13
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
14
|
-
}
|
|
15
|
-
return to;
|
|
16
|
-
};
|
|
17
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
|
-
|
|
19
|
-
// src/control/baseControl/selectControl.ts
|
|
20
|
-
var selectControl_exports = {};
|
|
21
|
-
__export(selectControl_exports, {
|
|
22
|
-
SelectControl: () => SelectControl,
|
|
23
|
-
default: () => SelectControl
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
24
7
|
});
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
var
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
8
|
+
exports.default = exports.SelectControl = void 0;
|
|
9
|
+
|
|
10
|
+
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
11
|
+
|
|
12
|
+
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
13
|
+
|
|
14
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
15
|
+
|
|
16
|
+
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
17
|
+
|
|
18
|
+
var _get2 = _interopRequireDefault(require("@babel/runtime/helpers/get"));
|
|
19
|
+
|
|
20
|
+
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
21
|
+
|
|
22
|
+
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
|
|
23
|
+
|
|
24
|
+
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
|
25
|
+
|
|
26
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
27
|
+
|
|
28
|
+
var _l7Utils = require("@antv/l7-utils");
|
|
29
|
+
|
|
30
|
+
var _popperControl = require("./popperControl");
|
|
31
|
+
|
|
32
|
+
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); }; }
|
|
33
|
+
|
|
34
|
+
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; } }
|
|
35
|
+
|
|
36
|
+
var SelectControlConstant;
|
|
37
|
+
|
|
38
|
+
(function (SelectControlConstant) {
|
|
39
|
+
SelectControlConstant["ActiveOptionClassName"] = "l7-select-control-item-active";
|
|
40
|
+
SelectControlConstant["OptionValueAttrKey"] = "data-option-value";
|
|
41
|
+
SelectControlConstant["OptionIndexAttrKey"] = "data-option-index";
|
|
42
|
+
})(SelectControlConstant || (SelectControlConstant = {}));
|
|
43
|
+
|
|
44
|
+
var SelectControl = /*#__PURE__*/function (_PopperControl) {
|
|
45
|
+
(0, _inherits2.default)(SelectControl, _PopperControl);
|
|
46
|
+
|
|
47
|
+
var _super = _createSuper(SelectControl);
|
|
48
|
+
|
|
49
|
+
function SelectControl() {
|
|
50
|
+
var _this;
|
|
51
|
+
|
|
52
|
+
(0, _classCallCheck2.default)(this, SelectControl);
|
|
53
|
+
|
|
54
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
55
|
+
args[_key] = arguments[_key];
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
_this = _super.call.apply(_super, [this].concat(args));
|
|
59
|
+
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "selectValue", []);
|
|
60
|
+
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "createNormalOption", function (option) {
|
|
61
|
+
var isSelect = _this.selectValue.includes(option.value);
|
|
62
|
+
|
|
63
|
+
var optionDOM = _l7Utils.DOM.create('div', "l7-select-control-item ".concat(isSelect ? SelectControlConstant.ActiveOptionClassName : ''));
|
|
64
|
+
|
|
65
|
+
if (_this.getIsMultiple()) {
|
|
66
|
+
optionDOM.appendChild(_this.createCheckbox(isSelect));
|
|
37
67
|
}
|
|
68
|
+
|
|
38
69
|
if (option.icon) {
|
|
39
70
|
optionDOM.appendChild(option.icon);
|
|
40
71
|
}
|
|
41
|
-
|
|
72
|
+
|
|
73
|
+
var textDOM = _l7Utils.DOM.create('span');
|
|
74
|
+
|
|
42
75
|
textDOM.innerText = option.text;
|
|
43
76
|
optionDOM.appendChild(textDOM);
|
|
44
77
|
return optionDOM;
|
|
45
|
-
};
|
|
46
|
-
|
|
47
|
-
if (
|
|
48
|
-
|
|
78
|
+
});
|
|
79
|
+
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onItemClick", function (item) {
|
|
80
|
+
if (_this.getIsMultiple()) {
|
|
81
|
+
var targetIndex = _this.selectValue.findIndex(function (value) {
|
|
82
|
+
return value === item.value;
|
|
83
|
+
});
|
|
84
|
+
|
|
49
85
|
if (targetIndex > -1) {
|
|
50
|
-
|
|
86
|
+
_this.selectValue.splice(targetIndex, 1);
|
|
51
87
|
} else {
|
|
52
|
-
|
|
88
|
+
_this.selectValue = [].concat((0, _toConsumableArray2.default)(_this.selectValue), [item.value]);
|
|
53
89
|
}
|
|
54
90
|
} else {
|
|
55
|
-
|
|
91
|
+
_this.selectValue = [item.value];
|
|
56
92
|
}
|
|
57
|
-
|
|
58
|
-
|
|
93
|
+
|
|
94
|
+
_this.setSelectValue(_this.selectValue);
|
|
95
|
+
});
|
|
96
|
+
return _this;
|
|
59
97
|
}
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
98
|
+
|
|
99
|
+
(0, _createClass2.default)(SelectControl, [{
|
|
100
|
+
key: "setOptions",
|
|
101
|
+
value: function setOptions(option) {
|
|
102
|
+
(0, _get2.default)((0, _getPrototypeOf2.default)(SelectControl.prototype), "setOptions", this).call(this, option);
|
|
103
|
+
var options = option.options;
|
|
104
|
+
|
|
105
|
+
if (options) {
|
|
106
|
+
this.popper.setContent(this.getPopperContent(options));
|
|
107
|
+
}
|
|
65
108
|
}
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
109
|
+
}, {
|
|
110
|
+
key: "onAdd",
|
|
111
|
+
value: function onAdd() {
|
|
112
|
+
var button = (0, _get2.default)((0, _getPrototypeOf2.default)(SelectControl.prototype), "onAdd", this).call(this);
|
|
113
|
+
var defaultValue = this.controlOption.defaultValue;
|
|
114
|
+
|
|
115
|
+
if (defaultValue) {
|
|
116
|
+
this.selectValue = this.transSelectValue(defaultValue);
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
this.popper.setContent(this.getPopperContent(this.controlOption.options));
|
|
120
|
+
return button;
|
|
72
121
|
}
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
122
|
+
}, {
|
|
123
|
+
key: "getSelectValue",
|
|
124
|
+
value: function getSelectValue() {
|
|
125
|
+
return this.getIsMultiple() ? this.selectValue : this.selectValue[0];
|
|
126
|
+
}
|
|
127
|
+
}, {
|
|
128
|
+
key: "setSelectValue",
|
|
129
|
+
value: function setSelectValue(value) {
|
|
130
|
+
var _this2 = this;
|
|
131
|
+
|
|
132
|
+
var emitEvent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
|
133
|
+
var finalValue = this.transSelectValue(value);
|
|
134
|
+
this.optionDOMList.forEach(function (optionDOM) {
|
|
135
|
+
var optionValue = optionDOM.getAttribute(SelectControlConstant.OptionValueAttrKey);
|
|
136
|
+
var checkboxDOM = _this2.getIsMultiple() ? optionDOM.querySelector('input[type=checkbox]') : undefined;
|
|
137
|
+
|
|
138
|
+
if (finalValue.includes(optionValue)) {
|
|
139
|
+
_l7Utils.DOM.addClass(optionDOM, SelectControlConstant.ActiveOptionClassName);
|
|
140
|
+
|
|
141
|
+
if (checkboxDOM) {
|
|
142
|
+
// @ts-ignore
|
|
143
|
+
_l7Utils.DOM.setChecked(checkboxDOM, true);
|
|
144
|
+
}
|
|
145
|
+
} else {
|
|
146
|
+
_l7Utils.DOM.removeClass(optionDOM, SelectControlConstant.ActiveOptionClassName);
|
|
147
|
+
|
|
148
|
+
if (checkboxDOM) {
|
|
149
|
+
// @ts-ignore
|
|
150
|
+
_l7Utils.DOM.setChecked(checkboxDOM, false);
|
|
151
|
+
}
|
|
93
152
|
}
|
|
153
|
+
});
|
|
154
|
+
this.selectValue = finalValue;
|
|
155
|
+
|
|
156
|
+
if (emitEvent) {
|
|
157
|
+
this.emit('selectChange', this.getIsMultiple() ? finalValue : finalValue[0]);
|
|
94
158
|
}
|
|
95
|
-
});
|
|
96
|
-
this.selectValue = finalValue;
|
|
97
|
-
if (emitEvent) {
|
|
98
|
-
this.emit("selectChange", this.getIsMultiple() ? finalValue : finalValue[0]);
|
|
99
159
|
}
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
160
|
+
/**
|
|
161
|
+
* 是否为多选
|
|
162
|
+
* @protected
|
|
163
|
+
*/
|
|
164
|
+
|
|
165
|
+
}, {
|
|
166
|
+
key: "getIsMultiple",
|
|
167
|
+
value: function getIsMultiple() {
|
|
168
|
+
return false;
|
|
106
169
|
}
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
170
|
+
}, {
|
|
171
|
+
key: "getPopperContent",
|
|
172
|
+
value: function getPopperContent(options) {
|
|
173
|
+
var _this3 = this;
|
|
174
|
+
|
|
175
|
+
var isImageOptions = this.isImageOptions();
|
|
176
|
+
|
|
177
|
+
var content = _l7Utils.DOM.create('div', isImageOptions ? 'l7-select-control--image' : 'l7-select-control--normal');
|
|
178
|
+
|
|
179
|
+
if (this.getIsMultiple()) {
|
|
180
|
+
_l7Utils.DOM.addClass(content, 'l7-select-control--multiple');
|
|
181
|
+
}
|
|
182
|
+
|
|
183
|
+
var optionsDOMList = options.map(function (option, optionIndex) {
|
|
184
|
+
var optionDOM = isImageOptions ? // @ts-ignore
|
|
185
|
+
_this3.createImageOption(option) : _this3.createNormalOption(option);
|
|
186
|
+
optionDOM.setAttribute(SelectControlConstant.OptionValueAttrKey, option.value);
|
|
187
|
+
optionDOM.setAttribute(SelectControlConstant.OptionIndexAttrKey, window.String(optionIndex));
|
|
188
|
+
optionDOM.addEventListener('click', _this3.onItemClick.bind(_this3, option));
|
|
189
|
+
return optionDOM;
|
|
190
|
+
});
|
|
191
|
+
content.append.apply(content, (0, _toConsumableArray2.default)(optionsDOMList));
|
|
192
|
+
this.optionDOMList = optionsDOMList;
|
|
193
|
+
return content;
|
|
194
|
+
}
|
|
195
|
+
}, {
|
|
196
|
+
key: "createImageOption",
|
|
197
|
+
value: function createImageOption(option) {
|
|
198
|
+
var isSelect = this.selectValue.includes(option.value);
|
|
199
|
+
|
|
200
|
+
var optionDOM = _l7Utils.DOM.create('div', "l7-select-control-item ".concat(isSelect ? SelectControlConstant.ActiveOptionClassName : ''));
|
|
201
|
+
|
|
202
|
+
var imgDOM = _l7Utils.DOM.create('img');
|
|
203
|
+
|
|
204
|
+
imgDOM.setAttribute('src', option.img);
|
|
205
|
+
|
|
206
|
+
_l7Utils.DOM.setUnDraggable(imgDOM);
|
|
207
|
+
|
|
208
|
+
optionDOM.appendChild(imgDOM);
|
|
209
|
+
|
|
210
|
+
var rowDOM = _l7Utils.DOM.create('div', 'l7-select-control-item-row');
|
|
211
|
+
|
|
212
|
+
if (this.getIsMultiple()) {
|
|
213
|
+
optionDOM.appendChild(this.createCheckbox(isSelect));
|
|
214
|
+
}
|
|
215
|
+
|
|
216
|
+
var textDOM = _l7Utils.DOM.create('span');
|
|
217
|
+
|
|
218
|
+
textDOM.innerText = option.text;
|
|
219
|
+
rowDOM.appendChild(textDOM);
|
|
220
|
+
optionDOM.appendChild(rowDOM);
|
|
112
221
|
return optionDOM;
|
|
113
|
-
});
|
|
114
|
-
content.append(...optionsDOMList);
|
|
115
|
-
this.optionDOMList = optionsDOMList;
|
|
116
|
-
return content;
|
|
117
|
-
}
|
|
118
|
-
createImageOption(option) {
|
|
119
|
-
const isSelect = this.selectValue.includes(option.value);
|
|
120
|
-
const optionDOM = import_l7_utils.DOM.create("div", `l7-select-control-item ${isSelect ? "l7-select-control-item-active" /* ActiveOptionClassName */ : ""}`);
|
|
121
|
-
const imgDOM = import_l7_utils.DOM.create("img");
|
|
122
|
-
imgDOM.setAttribute("src", option.img);
|
|
123
|
-
import_l7_utils.DOM.setUnDraggable(imgDOM);
|
|
124
|
-
optionDOM.appendChild(imgDOM);
|
|
125
|
-
const rowDOM = import_l7_utils.DOM.create("div", "l7-select-control-item-row");
|
|
126
|
-
if (this.getIsMultiple()) {
|
|
127
|
-
optionDOM.appendChild(this.createCheckbox(isSelect));
|
|
128
222
|
}
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
223
|
+
}, {
|
|
224
|
+
key: "createCheckbox",
|
|
225
|
+
value: function createCheckbox(isSelect) {
|
|
226
|
+
var checkboxDOM = _l7Utils.DOM.create('input');
|
|
227
|
+
|
|
228
|
+
checkboxDOM.setAttribute('type', 'checkbox');
|
|
229
|
+
|
|
230
|
+
if (isSelect) {
|
|
231
|
+
_l7Utils.DOM.setChecked(checkboxDOM, true);
|
|
232
|
+
}
|
|
233
|
+
|
|
234
|
+
return checkboxDOM;
|
|
140
235
|
}
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
}
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
}
|
|
236
|
+
}, {
|
|
237
|
+
key: "isImageOptions",
|
|
238
|
+
value: function isImageOptions() {
|
|
239
|
+
// @ts-ignore
|
|
240
|
+
return !!this.controlOption.options.find(function (item) {
|
|
241
|
+
return item.img;
|
|
242
|
+
});
|
|
243
|
+
}
|
|
244
|
+
}, {
|
|
245
|
+
key: "transSelectValue",
|
|
246
|
+
value: function transSelectValue(value) {
|
|
247
|
+
return Array.isArray(value) ? value : [value];
|
|
248
|
+
}
|
|
249
|
+
}]);
|
|
250
|
+
return SelectControl;
|
|
251
|
+
}(_popperControl.PopperControl);
|
|
252
|
+
|
|
253
|
+
exports.default = exports.SelectControl = SelectControl;
|