This commit is contained in:
X1627315083@163.com
2026-04-10 14:40:48 +08:00
parent 5e77348913
commit 3b70ed2830
11 changed files with 1039 additions and 43 deletions

View File

@@ -1,13 +1,25 @@
<script setup lang="ts">
import { ref, onMounted, onUnmounted, reactive, toRefs } from "vue";
import sellerHeader from "../../seller-header.vue"
import historyList from "./historyList.vue"
import { useRouter } from "vue-router"
//const props = defineProps({
//})
//const emit = defineEmits([
//])
const router = useRouter()
let data = reactive({
})
const searchType = ref('all')
const searchText = ref('')
const historyListRef = ref(null)
const handleSearch = () => {
}
const selectCollectionItem = (item:any) => {
router.push({path:'/home/seller/myListings/select/'+item.id})
}
onMounted(()=>{
})
onUnmounted(()=>{
@@ -26,7 +38,27 @@ const {} = toRefs(data);
>
</seller-header>
<div class="content">
1231222aaa
<div class="title">
<div class="left">
<div :class="{active:searchType == 'all'}" @click="searchType = 'all'">All</div>
<div :class="{active:searchType == 'series'}" @click="searchType = 'series'">Series Design</div>
<div :class="{active:searchType == 'single'}" @click="searchType = 'single'">Single Design</div>
</div>
<div class="right">
<div class="search_input flex flex-align-center">
<input
class="search_input_inner"
v-model="searchText"
:bordered="false"
@keydown.enter="handleSearch"
placeholder="123123"
/>
<!-- <SearchOutlined class="search_input_icon" @click="handleSearch" /> -->
<SvgIcon name="CSearch" size="20" class="search_input_icon" @click="handleSearch" />
</div>
</div>
</div>
<historyList ref="historyListRef" @selectCollectionItem="selectCollectionItem"></historyList>
</div>
</div>
</template>
@@ -42,6 +74,71 @@ const {} = toRefs(data);
margin-top: 2rem;
flex: 1;
overflow: hidden;
padding: 2.4rem 3rem;
background-color: #f9fafa;
border-radius: 2rem;
display: flex;
flex-direction: column;
> .title{
display: flex;
justify-content: space-between;
> .left{
display: flex;
align-items: center;
gap: 1.2rem;
> div{
min-width: 9rem;
padding: .4rem 2.6rem;
background-color: #fff;
border-radius: 4rem;
border: 1px solid #000000;
font-weight: 500;
font-size: 1.6rem;
line-height: 150%;
text-align: center;
cursor: pointer;
&:hover{
color: #fff;
background-color: #000;
}
}
> .active{
color: #fff;
background-color: #000;
}
}
> .right{
.search_input {
height: 3.2rem;
width: 27rem; // 默认宽度
background-color: #fff;
border: 1px solid #000;
border-radius: 3rem;
// column-gap: 3rem;
padding: 0 2rem;
.search_input_inner {
border: none;
height: 100%;
width: calc(100% - 2rem);
padding: .6rem 0;
font-size: 1.2rem;
&::placeholder {
font-size: 1.2rem;
}
&::-webkit-input-placeholder{
font-size: 1.2rem;
}
}
.search_input_icon {
font-size: 1.6rem;
color: #000;
width: initial;
height: initial;
}
}
}
}
}
}
</style>