fix style

This commit is contained in:
Timi
2026-09-25 23:24:58 +08:00
parent b62e7a5766
commit a0beee43cb
4 changed files with 27 additions and 49 deletions
+19 -41
View File
@@ -1,11 +1,14 @@
<template>
<t-popup v-model="popupVisible" placement="bottom">
<div class="tag-selector bg-white">
<div class="title-bar">
<t-button variant="text" size="small" @click="cancelSelection">取消</t-button>
<h3 class="title">选择标签</h3>
<t-button theme="primary" variant="text" size="small" @click="confirmSelection">确定</t-button>
</div>
<bottom-popup
v-model="popupVisible"
title="选择标签"
height="78vh"
left-button-text="取消"
right-button-text="确定"
@left-button-click="cancelSelection"
@right-button-click="confirmSelection"
>
<div class="tag-selector">
<div class="search-row">
<t-input
class="input"
@@ -46,13 +49,14 @@
>
<span v-text="getTagName(item)" />
</t-tag>
<div v-if="!visibleTagList.length" class="empty" v-text="emptyText" />
<div v-if="!visibleTagList.length" class="center-tips" v-text="emptyText" />
</div>
</div>
</t-popup>
</bottom-popup>
</template>
<script setup lang="ts">
import { BottomPopup } from "timi-tdesign-mobile";
import { Message } from "@/utils/message";
import { useUserStore } from "timi-web-api";
import TagAPI from "@/api/TagAPI";
@@ -199,24 +203,10 @@ watch(() => props.visible, async (value) => {
<style scoped lang="less">
.tag-selector {
display: flex;
height: 78vh;
padding-top: 1rem;
border-radius: 1.25rem 1.25rem 0 0;
height: 100%;
min-height: 0;
flex-direction: column;
.title-bar {
padding: 0 1rem;
display: grid;
grid-template-columns: 4rem 1fr 4rem;
align-items: center;
}
.title {
margin: 0;
font-size: 1rem;
text-align: center;
}
.search-row {
gap: .5rem;
display: flex;
@@ -224,7 +214,7 @@ watch(() => props.visible, async (value) => {
align-items: center;
.input {
--td-input-vertical-padding: 6px;
--td-input-vertical-padding: .5rem 1rem;
border: 1px solid var(--td-component-border);
border-radius: .875rem;
@@ -239,7 +229,7 @@ watch(() => props.visible, async (value) => {
display: flex;
flex-wrap: wrap;
align-content: flex-start;
padding: 0 1rem calc(1rem + env(safe-area-inset-bottom, 0)) 1rem;
padding: 0 1rem 1rem;
.item {
flex: 1 1 auto;
@@ -248,22 +238,10 @@ watch(() => props.visible, async (value) => {
max-width: 100%;
justify-content: center;
}
.empty {
color: #52607a;
padding: 2rem 1rem;
text-align: center;
}
}
}
:global(html.theme-dark) {
.tag-selector {
background: rgba(15, 23, 42, .96);
.empty {
color: #94a3b8;
}
}
:global(.bottom-popup:has(.tag-selector) .body) {
overflow: hidden;
}
</style>
@@ -21,18 +21,18 @@
</template>
</t-input>
<t-dropdown-menu ref="dropdownMenuRef" class="menus">
<t-dropdown-item
v-model="statusFilter"
:label="statusFilterLabel"
:options="statusOptions"
@change="handleStatusChange"
/>
<t-dropdown-item
v-model="dateFilterType"
:label="dateFilterLabel"
:options="dateOptions"
@change="handleDateFilterChange"
/>
<t-dropdown-item
v-model="statusFilter"
:label="statusFilterLabel"
:options="statusOptions"
@change="handleStatusChange"
/>
<t-dropdown-item
:label="selectedResponsibleName"
:options="[]"
+1 -1
View File
@@ -305,7 +305,7 @@ onMounted(async () => {
.search {
--td-button-border-radius: .75rem;
--td-input-vertical-padding: .25rem 1rem;
--td-input-vertical-padding: .5rem 1rem;
flex: 1;
border: 1px solid var(--td-component-border);
+1 -1
View File
@@ -97,7 +97,7 @@ const menuGroupList = computed<MenuGroup[]>(() => [
{
icon: "undertake-delivery",
path: "/management/order-fulfillments",
title: "统一履约",
title: "履约记录",
visible: userStore.hasPermissions(permissionCodes.orderFulfillment.read)
},
{