<view class="container">
    <block wx:for="{{mpColumns}}" wx:key="name">
        <view class="item">
            <block wx:if="{{item.viewType === 'Input'}}">
                <l-search-bar
                    value="{{item.currentValue || ''}}"
                    placeholder="{{item.resolvedPlaceholder}}"
                    l-class="search-bar"
                    l-placeholder-class="search-placeholder"
                    l-input-class="search-input"
                    data-name="{{item.name}}"
                    bind:linchange="handleInputChangeMp"
                    bind:linconfirm="handleInputConfirmMp"
                    bind:linclear="handleInputClearMp"
                    show-cancel="{{false}}"
                />
            </block>

            <block wx:elif="{{item.viewType === 'Select'}}">
                <view class="filter-bar" data-name="{{item.name}}" bindtap="openPopupMp">
                    <view class="filter-text {{item.selectedText ? '' : 'filter-placeholder'}}">
                        {{item.selectedText || item.resolvedPlaceholder}}
                    </view>
                    <l-icon name="right" color="#bdbdbd" size="24" />
                </view>
                <l-popup show="{{activePopupName == item.name}}" content-align="bottom">
                    <scroll-view scroll-y="true" style="height: 500rpx;">
                        <view class="popup-container">
                            <view class="popup-actions">
                                <view class="cancel-btn" data-name="{{item.name}}" bindtap="clearPopupValueMp">
                                    {{t('common::reset')}}
                                </view>
                                <view class="confirm-btn" data-name="{{item.name}}" bindtap="confirmPopupMp">
                                    {{t('common::action.confirm')}}
                                </view>
                            </view>
                            <l-checkbox-group data-name="{{item.name}}" bind:linchange="onSelectChangeMp">
                                <l-checkbox
                                    l-class="checkbox-item"
                                    wx:for="{{item.mpOptions}}"
                                    wx:for-item="option"
                                    wx:key="value"
                                    key="{{option.value}}"
                                    checked="{{option.checked}}"
                                >
                                    {{option.label}}
                                </l-checkbox>
                            </l-checkbox-group>
                        </view>
                    </scroll-view>
                </l-popup>
            </block>

            <block wx:elif="{{item.viewType === 'DatePicker'}}">
                <view class="filter-bar" data-name="{{item.name}}" bindtap="openPopupMp">
                    <view class="filter-text {{item.selectedText ? '' : 'filter-placeholder'}}">
                        {{item.selectedText || item.resolvedPlaceholder}}
                    </view>
                    <l-icon name="time" color="#bdbdbd" size="24" />
                </view>
                <l-calendar
                    show="{{activePopupName == item.name}}"
                    data-name="{{item.name}}"
                    bind:linconfirm="handleDateConfirmMp"
                />
            </block>

            <block wx:elif="{{item.viewType === 'DatePicker.RangePicker'}}">
                <view class="filter-bar" data-name="{{item.name}}" bindtap="openPopupMp">
                    <view class="filter-text {{item.selectedText ? '' : 'filter-placeholder'}}">
                        {{item.selectedText || item.resolvedPlaceholder}}
                    </view>
                    <l-icon name="time" color="#bdbdbd" size="24" />
                </view>
                <l-calendar
                    show="{{activePopupName == item.name}}"
                    type="range"
                    data-name="{{item.name}}"
                    bind:linconfirm="handleDateConfirmMp"
                />
            </block>

            <block wx:elif="{{item.viewType === 'RefAttr'}}">
                <refAttr
                    placeholder="{{item.resolvedPlaceholder}}"
                    multiple="{{item.multiple}}"
                    entityIds="{{item.entityIds}}"
                    pickerRender="{{item.refProps}}"
                    data-name="{{item.name}}"
                    bind:change="handleRefAttrChangeMp"
                />
            </block>
        </view>
    </block>

    <view wx:if="{{expandable}}" class="expand-action" bindtap="toggleExpand">
        <view class="expand-text">
            {{isExpanded ? t('common::shrink') : t('common::expand')}}
        </view>
        <l-icon
            name="down"
            color="#999"
            size="20"
            style="{{isExpanded ? 'transform:rotate(-180deg);' : ''}}"
        />
    </view>
</view>
