From 92230c9a97dc9ce9df3313d11d26999c04bb6b26 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期二, 15 七月 2025 13:12:48 +0800
Subject: [PATCH] 项目初始化
---
src/pages_qiun/components/wuc-tab/wuc-tab.vue | 134 ++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 134 insertions(+), 0 deletions(-)
diff --git a/src/pages_qiun/components/wuc-tab/wuc-tab.vue b/src/pages_qiun/components/wuc-tab/wuc-tab.vue
new file mode 100644
index 0000000..45b5b28
--- /dev/null
+++ b/src/pages_qiun/components/wuc-tab/wuc-tab.vue
@@ -0,0 +1,134 @@
+<template>
+ <scroll-view class="wuc-tab" :class="tabClass" :style="tabStyle" scroll-with-animation scroll-x :scroll-left="scrollLeft">
+ <div v-if="!textFlex">
+ <div class="wuc-tab-item" :class="[index === tabCur ? selectClass + ' cur':'']" v-for="(item,index) in tabList" :key="index" :id="index" @tap="tabSelect(index,$event)">
+ <text :class="item.icon"></text>
+ <span>{{item.name}}</span>
+ </div>
+ </div>
+
+ <div class="flex text-center" v-if="textFlex">
+ <div class="wuc-tab-item flex-sub" :class="index === tabCur ? selectClass + ' cur':''" v-for="(item,index) in tabList" :key="index" :id="index" @tap="tabSelect(index,$event)">
+ <text :class="item.icon"></text>
+ <span>{{item.name}}</span>
+ </div>
+ </div>
+ </scroll-view>
+</template>
+<script>
+export default {
+ name: 'wuc-tab',
+ data() {
+ return {};
+ },
+ props: {
+ tabList: {
+ type: Array,
+ default() {
+ return [];
+ }
+ },
+ tabCur: {
+ type: Number,
+ default() {
+ return 0;
+ }
+ },
+ tabClass: {
+ type: String,
+ default() {
+ return '';
+ }
+ },
+ tabStyle: {
+ type: String,
+ default() {
+ return '';
+ }
+ },
+ textFlex: {
+ type: Boolean,
+ default() {
+ return false;
+ }
+ },
+ selectClass: {
+ type: String,
+ default() {
+ return 'text-blue';
+ }
+ }
+ },
+ methods: {
+ tabSelect(index, e) {
+ if (this.currentTab === index) return false;
+ this.$emit('update:tabCur', index);
+ this.$emit('changeTab', this.tabList[index]);
+ }
+ },
+ computed: {
+ scrollLeft() {
+ return (this.tabCur - 1) * 60;
+ }
+ }
+};
+</script>
+<style>
+div,
+scroll-view,
+swiper {
+ box-sizing: border-box;
+}
+.wuc-tab {
+ white-space: nowrap;
+}
+.wuc-tab-item {
+ height: 90rpx;
+ display: inline-block;
+ line-height: 90rpx;
+ margin: 0 10upx;
+ padding: 0 20upx;
+}
+
+.wuc-tab-item.cur {
+ color: #40A2ED;
+ background-color: #fff;
+}
+
+.wuc-tab.fixed {
+ position: fixed;
+ width: 100%;
+ top: 0;
+ z-index: 1024;
+ box-shadow: 0 1upx 6upx rgba(0, 0, 0, 0.1);
+}
+
+.flex {
+ display: flex;
+}
+.text-center {
+ text-align: center;
+}
+.flex-sub {
+ flex: 1;
+}
+.text-blue{
+ color:#40A2ED;
+}
+.text-white{
+ color:#ffffff;
+}
+.bg-white{
+ background-color: #ffffff;
+}
+.bg-blue{
+ background-color: #40A2ED;
+}
+.text-orange{
+ color: #f37b1d
+}
+
+.text-xl {
+ font-size: 36upx;
+}
+</style>
--
Gitblit v1.9.3