slibra-module-web/src/views/screen/components/middleBox.vue

<script setup>
defineProps({
  dataTime: ''
})
</script>

<template>
  <div class="send-ask">
    <RouterLink class="send-ask-button" to="/answer" :data-time="dataTime">输入您的问题或需求</RouterLink>
  </div>
</template>

<style scoped lang="scss">
.send-ask {
  margin: 0 2rem;
  position: relative;
  height: 100%;

  &-button {
    position: absolute;
    width: 100%;
    height: 6rem;
    border-radius: 0.8rem;
    box-shadow: 0 0.3rem 1.2rem 0 #97D3FF40;
    background: #FFFFFF;
    font-size: 1.5rem;
    color: #9E9E9E99;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.7rem 0 3.4rem;
    bottom: 4.7rem;

    &::before {
      content: attr(data-time);
      display: block;
      position: absolute;
      right: 0;
      bottom: 6.8rem;
      color: #9E9E9E;
      font-size: 1.2rem;
    }

    &::after {
      content: '';
      background: url(@/assets/images/home/send.png) no-repeat;
      background-size: contain;
      width: 5.6rem;
      height: 3.6rem;
    }
  }
}
</style>