做一个uni-app标签卡，可以左右滑动切换，标签名有4个，分别为任务信息、企业信息和产品信息、抽样机构信息，生成相应代码

您好，以下是生成相应代码的示例：

<template>
<view class="container">
<view class="tab-bar">
<view class="tab-item" :class="{active: currentTab === 0}" @click="switchTab(0)">任务信息</view>
<view class="tab-item" :class="{active: currentTab === 1}" @click="switchTab(1)">企业信息</view>
<view class="tab-item" :class="{active: currentTab === 2}" @click="switchTab(2)">产品信息</view>
<view class="tab-item" :class="{active: currentTab === 3}" @click="switchTab(3)">抽样机构信息</view>
</view>
<swiper class="swiper" :current="currentTab" @change="swiperChange">
<swiper-item class="swiper-item" v-for="(item, index) in tabList" :key="index">
<view class="tab-content">{{ item }}</view>
</swiper-item>
</swiper>
</view>
</template>

<script>
export default {
data() {
return {
currentTab: 0,
tabList: ['任务信息', '企业信息', '产品信息', '抽样机构信息']
}
},
methods: {
switchTab(index) {
this.currentTab = index
},
swiperChange(event) {
this.currentTab = event.detail.current
}
}
}
</script>

<style>
.container {
height: 100%;
display: flex;
flex-direction: column;
}
.tab-bar {
display: flex;
justify-content: space-between;
align-items: center;
height: 50px;
background-color: #fff;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}
.tab-item {
flex: 1;
text-align: center;
line-height: 50px;
font-size: 16px;
color: #333;
}
.tab-item.active {
color: #007aff;
}
.swiper {
flex: 1;
}
.swiper-item {
height: 100%;
}
.tab-content {
height: 100%;
padding: 20px;
}
</style>

希望对您有所帮助。