hookehuyr

style(IndexCheckInPage): 调整上传按钮样式和间距

移除底部边距并优化悬停效果
<!--
* @Date: 2025-05-29 15:34:17
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-09-26 11:27:26
* @LastEditTime: 2025-09-30 16:43:16
* @FilePath: /mlaj/src/views/checkin/IndexCheckInPage.vue
* @Description: 文件描述
-->
......@@ -62,18 +62,18 @@
</div>
</div>
<div v-if="!taskDetail.is_finish" class="text-wrapper">
<div v-if="!taskDetail.is_finish" class="text-wrapper" style="padding-bottom: 0;">
<div class="text-header">打卡类型</div>
<div class="upload-wrapper">
<div
v-for="option in attachmentTypeOptions"
:key="option.key"
@click="handleCheckinTypeClick(option.key)"
<div
v-for="option in attachmentTypeOptions"
:key="option.key"
@click="handleCheckinTypeClick(option.key)"
class="upload-button"
>
<van-icon
:name="getIconName(option.key)"
size="1.2rem"
<van-icon
:name="getIconName(option.key)"
size="1.2rem"
/>
<span class="button-text">{{ option.value }}</span>
</div>
......@@ -715,7 +715,7 @@ onMounted(async () => {
getTaskDetail(dayjs().format('YYYY-MM'));
onLoad(dayjs().format('YYYY-MM-DD'));
}
// 获取作品类型数据
try {
const { code, data } = await getTeacherFindSettingsAPI();
......@@ -842,10 +842,10 @@ const formatData = (data) => {
.upload-wrapper {
display: flex;
margin: 1rem 0;
margin: 1rem 0 0;
gap: 0.5rem;
flex-wrap: wrap;
.upload-button {
display: flex;
align-items: center;
......@@ -858,16 +858,16 @@ const formatData = (data) => {
cursor: pointer;
transition: all 0.2s ease;
min-width: 80px;
&:hover {
background-color: #f0fdf4;
border-color: #4caf50;
}
&:active {
transform: scale(0.98);
}
.button-text {
font-size: 0.8rem;
color: #4caf50;
......