招聘会卡片

pages/index/jobFair.vue

@@ -1,18 +1,19 @@
 <!-- 招聘会 -->
 <template>
-  <view style="padding-bottom: 30px; ">
+  <view class="" style="padding-bottom: 30px; ">
     <view v-if="items.length">
-      <uni-card v-for="val in items" :key="val.id" @tap="handleToJobFairEnterprises(val)">
+      <view v-for="val in items" :key="val.id" @tap="handleToJobFairEnterprises(val)" class="list-item defaultBgc default-border">
         <image v-if="val?.previewImg" class="ss-m-t-10" :src="val.previewImg" mode="widthFix" style="width: 100%; height: auto; border-radius: 6px;"></image>
-        <view class="ss-m-t-20">活动时间：{{ timesTampChange(val.startTime, 'Y-M-D') }}至{{ timesTampChange(val.endTime, 'Y-M-D') }}</view>
-        <button class="ss-m-t-20 ss-m-b-10" style="background-color: #00B760; color: #fff;" type="primary">查看详情</button>
-      </uni-card>
+        <view class="ss-m-t-20 MiSans-Normal">活动时间：{{ timesTampChange(val.startTime, 'Y-M-D') }}至{{ timesTampChange(val.endTime, 'Y-M-D') }}</view>
+        <button class="ss-m-t-20 ss-m-b-10 MiSans-Medium" style="background-color: #00B760; color: #fff;" type="primary">查看详情</button>
+      </view>
     </view>
     <view v-else class="nodata-img-parent">
       <image src="https://minio.citupro.com/dev/static/nodata.png" mode="widthFix" style="width: 100vw;height: 100vh;"></image>
     </view>
   </view>
 </template>
+
 <script setup>
 import { onShow, onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app'
 import { ref }  from 'vue'
@@ -63,8 +64,21 @@ onShareTimeline(() => {
 })
 
 </script>
+
 <style lang="scss" scoped>
-.line {
-  border-top: 1px solid #ccc;
+.list-item {
+  margin: 30rpx;
+  border-radius: 20rpx;
+  padding: 30rpx;
+  &:last-child {
+    margin-bottom: 0;
+  }
+  &:first-child {
+    margin-top: 0;
+  }
+  view {
+    font-size: 28rpx;
+    color: #666;
+  }
 }
 </style>