<template>
  <view class='card-view'>
    <view class='c-flex-row'>
      <text>默认</text>
      <text>
        黄先生
        <!--        {{ item.name }}-->
      </text>
      <text>
        13xxxxxx8900
        <!--        {{ item.mobile }}-->
      </text>
    </view>
    <text class='address'>
      湖南省 长沙市 雨花区 地址地址地址
            {{ item.address }}
    </text>

    <view class='btn-view c-flex-row'>
      <text>编辑</text>
      <text>删除</text>
    </view>
  </view>
</template>

<script lang='ts' setup>

defineProps({
  item: <any>[]
});
</script>

<style lang='scss' scoped>
.card-view {
  margin: 20rpx 30rpx;
  padding: 38rpx 30rpx 30rpx 34rpx;

  view:nth-of-type(1) {
    text:nth-of-type(1) {
      border-radius: 5rpx;
      border: 1rpx solid #F32B2B;
      color: #F32B2B;
      font-size: 24prx;
      padding: 1rpx 8rpx;
    }

    text:nth-of-type(2) {
      font-size: 32rpx;
      font-weight: bold;
      margin-left: 10rpx;
      color: #333333;
    }

    text:nth-of-type(3) {
      font-size: 32rpx;
      font-weight: bold;
      margin-left: 20rpx;
      color: #333333;
    }
  }

  .address {
    font-size: 26rpx;
    font-weight: 400;
    margin-top: 10rpx;
    color: #999999;
  }

  .btn-view {
    display: flex;
    align-self: flex-end;
    align-items: center;

    text:nth-of-type(n+1) {
      display: flex;
      width: 84rpx;
      height: 48rpx;
      border-radius: 24rpx;
      border: 1rpx solid #F32B2B;
      align-items: center;
      justify-content: center;
      color: #F32B2B;
      margin-left: 20rpx;
    }

    text:nth-of-type(2) {
      border: 1rpx solid #DDDDDD;
      color: #666666;
    }
  }
}
</style>
