bjquanjiang
/
DigitalScholl


			
				
					
						
						
							
							<template>
  <!-- #ifndef MP-ALIPAY -->
  <view class="customlist-banner-header">
    <view class="customlist-banner-content">
      <slot></slot>
      <view v-if="buttonShow" class="customlist-banner-action">
        <l-icon @click="$emit('buttonClick', $event)" :type="buttonIcon" color="blue" class="text-xxl" />
      </view>
    </view>
  </view>
  <!-- #endif -->

  <!-- #ifdef MP-ALIPAY -->
  <view :class="className" :style="style" class="customlist-banner-header">
    <view class="customlist-banner-content">
      <slot></slot>
      <view v-if="buttonShow" class="customlist-banner-action">
        <l-icon @click="$emit('buttonClick', $event)" :type="buttonIcon" color="blue" class="text-xxl" />
      </view>
    </view>
  </view>
  <!-- #endif -->
</template>

<script>
export default {
  name: 'l-customlist-banner',

  props: {
    buttonShow: { default: true },
    buttonIcon: { default: 'searchlist' }
  }
}
</script>

<style lang="less" scoped>
.customlist-banner-header {
  position: fixed;
  top: var(--window-top);
  z-index: 1024;
  border-bottom: 1rpx solid #ddd;
  height: 80rpx;
  width: 100%;
  box-shadow: 0 0.5px 3px rgba(0, 0, 0, 0.1);
  background: #f1f1f1;

  .customlist-banner-content {
    color: #8f8f94;
    background: #ffffff;
    padding: 20rpx 25rpx;
    width: 100%;
    vertical-align: middle;
    border-bottom: 1rpx solid #ddd;

    .customlist-banner-action {
      position: absolute;
      right: 20rpx;
      top: 20rpx;
    }
  }
}
</style>