123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224 |
- import { __awaiter, __generator } from "tslib";
- import { Component, triggerEvent, triggerEventOnly, triggerEventValues, getValueFromProps, } from '../_util/simply';
- import equal from 'fast-deep-equal';
- import { PickerDefaultProps } from './props';
- import { getMatchedItemByValue, getMatchedItemByIndex, getStrictMatchedItemByValue, } from './utils';
- import mixinValue from '../mixins/value';
- Component(PickerDefaultProps, {
- // visible受控判断
- isVisibleControlled: function () {
- return 'visible' in getValueFromProps(this);
- },
- initData: function () {
- var _this = this;
- var _a = getValueFromProps(this, [
- 'options',
- 'visible',
- 'defaultVisible',
- ]), options = _a[0], visible = _a[1], defaultVisible = _a[2];
- var columns = this.getterColumns(options);
- this.setData({
- columns: columns,
- }, function () {
- var formatValue = _this.getterFormatText();
- var selectedIndex = _this.getterSelectedIndex();
- _this.setData({
- formatValue: formatValue,
- selectedIndex: selectedIndex,
- visible: _this.isVisibleControlled() ? visible : defaultVisible,
- });
- });
- },
- getterColumns: function (options) {
- var columns = [];
- if (options.length > 0) {
- if (options.every(function (item) { return Array.isArray(item); })) {
- this.single = false;
- columns = options.slice();
- }
- else {
- this.single = true;
- columns = [options];
- }
- }
- return columns;
- },
- defaultFormat: function (value, column) {
- if (Array.isArray(column)) {
- return column
- .filter(function (c) { return c !== undefined; })
- .map(function (c) {
- if (typeof c === 'object') {
- return c.label;
- }
- return c;
- })
- .join('-');
- }
- return (column && column.label) || column || '';
- },
- getterFormatText: function () {
- var _a = getValueFromProps(this, [
- 'onFormat',
- 'formattedValueText',
- ]), onFormat = _a[0], formattedValueText = _a[1];
- if (typeof formattedValueText === 'string') {
- return formattedValueText;
- }
- var columns = this.data.columns;
- var realValue = this.getValue();
- var matchedColumn = getStrictMatchedItemByValue(columns, realValue, this.single).matchedColumn;
- var formatValueByProps = onFormat && onFormat(realValue, matchedColumn);
- if (formatValueByProps !== undefined && formatValueByProps !== null) {
- return formatValueByProps;
- }
- return this.defaultFormat(realValue, matchedColumn);
- },
- getterSelectedIndex: function () {
- var selectedIndex = [];
- var columns = this.data.columns;
- var realValue = this.getValue();
- var value = realValue || [];
- if (this.single) {
- value = [realValue];
- }
- var _loop_1 = function (i) {
- var column = columns[i];
- var compareValue = value[i];
- if (compareValue === undefined || compareValue === null) {
- selectedIndex[i] = 0;
- }
- var index = column.findIndex(function (c) {
- return c === compareValue || c.value === compareValue;
- });
- if (index === -1) {
- index = 0;
- }
- selectedIndex[i] = index;
- };
- for (var i = 0; i < columns.length; i++) {
- _loop_1(i);
- }
- return selectedIndex;
- },
- onOpen: function () {
- var disabled = getValueFromProps(this, 'disabled');
- if (!disabled) {
- this.tempSelectedIndex = null;
- var selectedIndex = this.getterSelectedIndex();
- this.setData({
- selectedIndex: selectedIndex,
- });
- this.triggerPicker(true);
- }
- },
- triggerPicker: function (visible) {
- this.setData({
- visible: visible,
- });
- triggerEvent(this, 'visibleChange', visible);
- },
- onMaskDismiss: function () {
- var maskClosable = getValueFromProps(this, 'maskClosable');
- if (!maskClosable) {
- return;
- }
- this.triggerPicker(false);
- triggerEventOnly(this, 'cancel', { detail: { type: 'mask' } });
- },
- onCancel: function () {
- this.triggerPicker(false);
- triggerEventOnly(this, 'cancel', { detail: { type: 'cancel' } });
- },
- onChange: function (e) {
- var selectedIndex = e.detail.value;
- this.tempSelectedIndex = selectedIndex;
- this.isChangingPickerView = true;
- var _a = getMatchedItemByIndex(this.data.columns, this.tempSelectedIndex, this.single), matchedColumn = _a.matchedColumn, matchedValues = _a.matchedValues;
- this.setData({
- selectedIndex: selectedIndex,
- });
- triggerEventValues(this, 'change', [matchedValues, matchedColumn], e);
- },
- onOk: function () {
- return __awaiter(this, void 0, void 0, function () {
- var result, matchedColumn, matchedValues;
- return __generator(this, function (_a) {
- if (this.tempSelectedIndex) {
- result = getMatchedItemByIndex(this.data.columns, this.tempSelectedIndex, this.single);
- }
- else {
- result = getMatchedItemByValue(this.data.columns, this.getValue(), this.single);
- }
- matchedColumn = result.matchedColumn, matchedValues = result.matchedValues;
- this.triggerPicker(false);
- if (!this.isControlled()) {
- this.update(matchedValues);
- }
- triggerEventValues(this, 'ok', [matchedValues, matchedColumn]);
- return [2 /*return*/];
- });
- });
- },
- }, {
- formatValue: '',
- columns: [],
- visible: false,
- selectedIndex: [],
- }, [
- mixinValue({
- transformValue: function (value) {
- return {
- needUpdate: true,
- value: value === undefined ? [] : value,
- };
- },
- }),
- ], {
- tempSelectedIndex: null,
- single: false,
- isChangingPickerView: false,
- onInit: function () {
- this.initData();
- },
- didUpdate: function (prevProps) {
- var _this = this;
- var options = getValueFromProps(this, 'options');
- if (!equal(options, prevProps.options)) {
- var newColums = this.getterColumns(options);
- this.setData({
- columns: newColums,
- }, function () {
- // 如果是在滚动过程中columns发生变化,以onChange里抛出的selectedIndex为准
- if (!_this.isChangingPickerView) {
- _this.tempSelectedIndex = null;
- var selectedIndex = _this.getterSelectedIndex();
- _this.setData({
- selectedIndex: selectedIndex,
- });
- }
- });
- }
- var value = getValueFromProps(this, 'value');
- if (!equal(prevProps.value, value)) {
- var selectedIndex = this.getterSelectedIndex();
- this.tempSelectedIndex = null;
- this.setData({
- selectedIndex: selectedIndex,
- });
- }
- var visible = getValueFromProps(this, 'visible');
- if (!equal(prevProps.visible, visible)) {
- this.setData({ visible: visible });
- }
- var formatValue = this.getterFormatText();
- var formattedValueText = getValueFromProps(this, 'formattedValueText');
- if (formatValue !== this.data.formatValue ||
- prevProps.formattedValueText !== formattedValueText) {
- this.setData({
- formatValue: formatValue,
- });
- }
- this.isChangingPickerView = false;
- },
- });
|