From f7a99184725f7ea0884cf478f169aad4e5b6583c Mon Sep 17 00:00:00 2001
From: PC-20250623MANY\Administrator <344137771@qq.com>
Date: Sun, 13 Jul 2025 18:27:57 +0800
Subject: [PATCH] 1
---
src/components/tabHead.vue | 116 +++++++++++++++++++++++++++++++++++++---------------------
1 files changed, 74 insertions(+), 42 deletions(-)
diff --git a/src/components/tabHead.vue b/src/components/tabHead.vue
index 70e6750..0e845bd 100644
--- a/src/components/tabHead.vue
+++ b/src/components/tabHead.vue
@@ -1,7 +1,10 @@
<template>
<div class="tab_head">
- <div class="icon" @click="searchShow = true">
- <van-icon name="search" size=".5em" />
+ <div class="head_left">
+ <div class="icon" @click="searchShow = true" v-if="leftShow">
+ <van-icon name="search" size=".5em" />
+ </div>
+ <slot name="left"></slot>
</div>
<div class="head_right">
<div class="icon" v-if="rightShow" @click="aRouter1">
@@ -13,17 +16,34 @@
<slot></slot>
</div>
<!-- 搜索弹窗 -->
- <van-popup v-model="searchShow" round position="bottom" :style="{ height: '80%' }">
+ <van-popup
+ v-model="searchShow"
+ round
+ position="bottom"
+ :style="{ height: '80%' }"
+ >
<div class="popup_head">
<van-icon name="arrow-left" size=".5em" @click="searchShow = false" />
<div class="popup_input">
- <van-field v-model="searchValue" :placeholder="$t('hj37')" left-icon="search" clearable />
+ <van-field
+ v-model="searchValue"
+ :placeholder="$t('hj37')"
+ left-icon="search"
+ clearable
+ />
</div>
- <van-button type="primary" round @click="submit">{{ $t("Search") }}</van-button>
+ <van-button type="primary" round @click="submit">{{
+ $t("Search")
+ }}</van-button>
</div>
- <van-list v-model="loading" :finished="finished" :finished-text="$t('hj43')" @load="onLoad"
- v-if="(lists && lists.length > 0) || !finished">
+ <van-list
+ v-model="loading"
+ :finished="finished"
+ :finished-text="$t('hj43')"
+ @load="onLoad"
+ v-if="(lists && lists.length > 0) || !finished"
+ >
<van-cell v-for="item in lists" :key="item.id">
<div class="search_item">
<div class="search_item_left">
@@ -57,35 +77,43 @@
data() {
return {
searchShow: false, // 搜索弹窗
- searchValue: '', // 搜索内容
+ searchValue: "", // 搜索内容
lists: [], // 搜索列表
loading: false, // 是否加载
finished: true, // 是否加载完成
pageNum: 1,
- pageSize: 20,
+ pageSize: 20
};
},
props: {
- rightShow: { // 是否显示客服和设置图标
+ // 是否显示客服和设置图标
+ rightShow: {
+ type: Boolean,
+ default: true
+ },
+ // 是否显示左侧搜索
+ leftShow: {
type: Boolean,
default: true
}
},
watch: {
searchShow() {
- this.searchValue = ''
- this.init()
+ this.searchValue = "";
+ this.init();
}
},
async mounted() {
- this.init()
+ this.init();
this.getInfoSite();
},
methods: {
- aRouter1() { // 跳转客服页面
+ aRouter1() {
+ // 跳转客服页面
window.open(this.onlineService);
},
- async getInfoSite() { // 获取客服地址
+ async getInfoSite() {
+ // 获取客服地址
let data = await api.getInfoSite();
if (data.status === 0) {
this.onlineService = data.data.onlineService;
@@ -93,23 +121,25 @@
} else {
this.$store.commit("elAlertShow", {
elAlertShow: true,
- elAlertText: data.msg,
+ elAlertText: data.msg
});
}
},
- goToTopUp() { // 跳转设置页面
+ goToTopUp() {
+ // 跳转设置页面
this.$router.push("/setting");
},
- onLoad: handleDt.throttle(async function (a, b) { // 搜索列表加载
+ onLoad: handleDt.throttle(async function(a, b) {
+ // 搜索列表加载
this.finished = false;
let opt = {
pageNum: this.pageNum,
pageSize: this.pageSize,
stockPlate: "",
keyWords: this.searchValue,
- stockType: '',
- orderBy: "",
- }
+ stockType: "",
+ orderBy: ""
+ };
let data = await api.getStockByType(opt);
this.loading = false; // 加载状态结束
@@ -118,23 +148,25 @@
this.lists = [...this.lists, ...data.data.list];
}
- if (data.data.list && data.data.list.length <= 0) { // 数据全部加载完成
+ if (data.data.list && data.data.list.length <= 0) {
+ // 数据全部加载完成
this.finished = true;
-
} else {
this.pageNum++;
}
}, 500),
- init() { // 初始化
+ init() {
+ // 初始化
this.pageNum = 1;
this.lists = [];
this.finished = true;
},
- submit() { // 提交搜索
- this.init()
- this.onLoad()
+ submit() {
+ // 提交搜索
+ this.init();
+ this.onLoad();
}
- },
+ }
};
</script>
@@ -144,7 +176,7 @@
.tab_head {
font-size: 10vw;
- padding: .266em;
+ padding: 0.266em;
display: flex;
justify-content: space-between;
align-items: center;
@@ -154,7 +186,7 @@
display: flex;
justify-content: center;
align-items: center;
- padding-top: .5em;
+ padding-top: 0.5em;
img {
width: 65%;
@@ -166,22 +198,22 @@
justify-content: center;
align-items: center;
font-size: 1.5em;
- padding: .5em 0;
+ padding: 0.5em 0;
.search_item_left {
flex: 1;
.search_item_left_hint {
- margin-top: .3em;
+ margin-top: 0.3em;
color: #969799;
- font-size: .8em;
+ font-size: 0.8em;
span {
border-radius: 0 26em 26em 0;
background: @dark_green;
color: #fff;
- padding: 0 .3em;
- margin-right: .1em;
+ padding: 0 0.3em;
+ margin-right: 0.1em;
}
}
}
@@ -193,7 +225,7 @@
color: #969799;
span {
- margin-right: .5em;
+ margin-right: 0.5em;
}
}
}
@@ -202,7 +234,7 @@
display: flex;
justify-content: center;
align-items: center;
- padding: .25em;
+ padding: 0.25em;
/deep/ .van-cell {
background: none;
@@ -222,11 +254,11 @@
@inpH: 1em;
height: @inpH;
flex: 1;
- border-radius: @inpH/2;
+ border-radius: @inpH / 2;
display: flex;
align-items: center;
- margin-left: .5em;
- margin-right: .5em
+ margin-left: 0.5em;
+ margin-right: 0.5em;
}
}
@@ -237,7 +269,7 @@
background: @grey;
display: flex;
justify-content: center;
- align-items: center
+ align-items: center;
}
.head_right {
@@ -247,7 +279,7 @@
.head_right {
.icon {
- margin-left: .266em;
+ margin-left: 0.266em;
}
}
}
--
Gitblit v1.9.3