list.vue 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. <template>
  2. <view>
  3. <view
  4. class="list ss-m-x-15"
  5. v-for="item in items"
  6. :key="item.id"
  7. >
  8. <view class="list-top">
  9. <text class="list-top-person">牛人:{{ item.sendPerson?.name }}</text>
  10. <text class="list-top-time">{{ timesTampChange(item.createTime) }}</text>
  11. </view>
  12. <view class="list-remuneration">
  13. 薪酬:
  14. <span v-if="item.job?.payFrom && item.job?.payTo">{{ item.job?.payFrom + '-' + item.job?.payTo }}</span>
  15. <span v-else>面议</span>
  16. </view>
  17. <view class="list-company" style="border-radius: 0 0 12px 12px;">
  18. <text>{{ formatName(item.enterprise?.anotherName) }}</text>
  19. <text>{{ item.enterprise?.anotherName && item.job?.name ? ' · ' : '' }}</text>
  20. <text>{{ item.job?.name }}</text>
  21. </view>
  22. </view>
  23. </view>
  24. </template>
  25. <script setup>
  26. import { timesTampChange } from '@/utils/date'
  27. import { formatName } from '@/utils/getText'
  28. const props = defineProps({
  29. items: {
  30. type: Array,
  31. default: () => []
  32. }
  33. })
  34. </script>
  35. <style lang="scss" scoped>
  36. .list {
  37. background: #fff;
  38. margin-top: 20rpx;
  39. border-radius: 12px;
  40. &-top {
  41. padding: 20rpx;
  42. display: flex;
  43. justify-content: space-between;
  44. align-items: center;
  45. &-person {
  46. font-size: .9em;
  47. color: #333;
  48. }
  49. &-time {
  50. font-size: .75em;
  51. color: #999;
  52. }
  53. }
  54. &-company {
  55. padding: 30rpx 20rpx;
  56. font-size: 28rpx;
  57. color: #666;
  58. background: linear-gradient(90deg, #f5fcfc 0, #fcfbfa 100%);
  59. }
  60. &-remuneration {
  61. padding: 20rpx;
  62. font-size: 28rpx;
  63. color: #666;
  64. }
  65. }
  66. </style>