fix PackagePurchase.vue style

This commit is contained in:
Timi
2026-09-09 23:15:24 +08:00
parent 5991cbc1d4
commit 8a88df99fc
+20 -30
View File
@@ -102,16 +102,9 @@
/> />
</template> </template>
<div class="content"> <div class="content">
<div class="item-title">
<span class="name" v-text="getItemLabel(item)" /> <span class="name" v-text="getItemLabel(item)" />
<t-button
size="extra-small"
variant="outline"
:content="getItemUnit(item)?.name || '选择单位'"
@click="openItemUnitPicker(index)"
/>
</div>
<t-input <t-input
class="input"
:model-value="item.totalQuantity" :model-value="item.totalQuantity"
type="number" type="number"
:readonly="!canPriceOverride" :readonly="!canPriceOverride"
@@ -121,9 +114,13 @@
@update:model-value="updateItemQuantity(index, $event)" @update:model-value="updateItemQuantity(index, $event)"
> >
<template #suffix-icon> <template #suffix-icon>
<span class="unit" v-text="getItemUnit(item)?.name || ''" /> <div class="actions">
</template> <t-button
</t-input> size="extra-small"
variant="outline"
:content="getItemUnit(item)?.name || '选择单位'"
@click="openItemUnitPicker(index)"
/>
<t-button <t-button
v-if="canPriceOverride" v-if="canPriceOverride"
class="remove" class="remove"
@@ -134,6 +131,9 @@
@click="removePurchaseItem(index)" @click="removePurchaseItem(index)"
/> />
</div> </div>
</template>
</t-input>
</div>
</t-form-item> </t-form-item>
<div v-if="!packagePurchaseItemList.length" class="center-tips" v-text="'当前套餐暂无权益明细'" /> <div v-if="!packagePurchaseItemList.length" class="center-tips" v-text="'当前套餐暂无权益明细'" />
</t-form> </t-form>
@@ -741,32 +741,22 @@ watch(config, value => {
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
.item-title {
gap: .375rem;
min-width: 0;
display: flex;
align-items: center;
}
.t-input {
min-width: 0;
flex: 1;
}
.remove {
flex: none;
}
.name { .name {
min-width: 0; min-width: 0;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
}
.unit { .input {
font-size: 1rem; min-width: 0;
flex: 1;
.actions {
gap: .25rem;
display: flex;
}
}
} }
} }
} }