<template>
  <view
    class="delivery-card-item-wrapper"
    :style="{ 'border-radius': borderRadius }"
  >
    <view class="delivery-card-item__top">
      <view class="delivery-card-item__left">
        {{ leftTitle }}
      </view>
      <view class="delivery-card-item__right">
        <view class="btn" @click="btnHandle">{{ rightTitle }}</view>
      </view>
    </view>
    <view class="delivery-card-item__bottom" v-if="isBottomMessage"> 
      <uni-icons type="info-filled" size="25" color=" #D81E06"></uni-icons>
      <text class="txt">{{tipsMessage}}</text>
	</view>
    <slot name="bottom"></slot>
  </view>
</template>

<script>
//待收货--【送货】--订单详情---送货信息有误？
//待收货--【物流】--订单详情---物流信息有误？
export default {
  props: {
    borderRadius: {
      type: String,
      default: "16rpx",
    },
    leftTitle: {
      type: String,
      default: "送货信息有误？",
    },
    rightTitle: {
      type: String,
      default: "更改送货信息",
    },
    isBottomMessage: {
      type: Boolean,
      default: false,
    },
	tipsMessage:{
		type: String,
		default: "物流信息有误时使用，请勿随意更改物流信息！",
	}
  },
  data() {
    return {};
  },
  methods: {
	  btnHandle(){
		  this.$emit("btn-click")
	  }
  },
};
</script>

<style lang="scss" scoped>
.delivery-card-item-wrapper {
  min-height: 104rpx;
  background: #ffffff;
  border-radius: 16rpx;
  overflow: hidden;
  user-select: none;
  font-family: PingFangSC, PingFang SC;
  .delivery-card-item__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 104rpx;
    .delivery-card-item__left {
      flex: 1;
      flex-shrink: 0;
      font-weight: 600;
      font-size: 28rpx;
      color: #333333;
    }
    .delivery-card-item__right {
      width: 200rpx;
      flex-shrink: 0;
      .btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 188rpx;
        height: 58rpx;
        border-radius: 30rpx;
        font-weight: 400;
        font-size: 24rpx;
        color: #333333;
        border: 1rpx solid #999999;
      }
    }
  }

  .delivery-card-item__bottom {
	  display: flex;
	  align-items: center;
	  padding-bottom:35rpx ;
	  gap:15rpx;
  }
}
</style>
