fix: 修改卡片样式

This commit is contained in:
blp 2023-02-01 13:50:17 +08:00
parent 531ef16a2f
commit be172b1580
2 changed files with 19 additions and 12 deletions

View File

@ -2,22 +2,21 @@
<div class="card">
<div
class="card-warp"
:class="{ active: active ? 'active' : ''}"
:class="{ active: active ? 'active' : '' }"
@click="handleClick"
>
<div class="card-content">
<a-row>
<a-col :span="6">
<!-- 图片 -->
<div class="card-item-avatar">
<slot name="img"> </slot>
</div>
</a-col>
<a-col :span="18">
<!-- 内容 -->
<div style="display: flex">
<!-- 图片 -->
<div class="card-item-avatar">
<slot name="img"> </slot>
</div>
<!-- 内容 -->
<div class="card-item-body">
<slot name="content"></slot>
</a-col>
</a-row>
</div>
</div>
<!-- 勾选 -->
<div v-if="active" class="checked-icon">
@ -201,6 +200,13 @@ const handleClick = () => {
margin-right: 16px;
}
.card-item-body {
display: flex;
flex-direction: column;
flex-grow: 1;
width: 0;
}
.card-state {
position: absolute;
top: 30px;

View File

@ -47,6 +47,7 @@
<template #img>
<slot name="img">
<img
style="width: 80px; height: 80px"
:src="
getLogo(slotProps.type, slotProps.provider)
"