trunkweb/pages/policySupport/policySupport.vue

<template>
	<view class="policySupport">
		<!-- 搜索筛选 -->
		<view class="header">
			<view class="headSearch">
				<view class="Search">
					<image src="https://zsy-m.mianyang.cn/upload/2021/12/09/40189e46-d5e3-4ab5-85b1-824a0758d1bd.png" mode=""></image>
					<input type="text" value="" placeholder="搜索" @click="search" />
				</view>
			<!-- 	<view class="headScreen" @click="Openpopup()">
					<image src="https://zsy-m.mianyang.cn/upload/2021/12/10/06be13b1-224a-4623-a96d-57ec0aeae512.png" mode=""></image>
					<text>筛选</text>
				</view> -->
			</view>

			<!-- table切换 -->
			<view class="uni_tab_bar">
				<view class="uni_swiper_tab order_top">
					<block v-for="(tabBar,index) in tabBars" :key="tabBar.id">
						<view class="swiper_tab_list" :class="{'active': tabIndex==tabBar.id}"
							@tap="toggleTab(tabBar.id)">
							{{tabBar.name}}
							<view class="swiper_tab_line">
							</view>
						</view>
					</block>
				</view>
			</view>



		</view>
		<!-- 这是政策模块 -->
		<view class="">
			<Country v-if="tabIndex==1" :classify="classify"></Country>
			<Province v-if="tabIndex==2" :classify="classify"></Province>
			<City v-if="tabIndex==3" :classify="classify"></City>
			<CountryLevel v-if="tabIndex==4" :classify="classify"></CountryLevel>
		</view>

		<!-- 筛选的弹框模块-->
		<!-- <wyb-popup ref="popup" type="top" height="400" width="500" radius="6" :showCloseIcon="true">
			<view class="popup-content">
				<view class="find" v-for="(item,index) in find" @click="findindex(item.id)"
					:class="{'active':item.id==findIndex}" :key='item.id'>
					<text>{{item.name}}</text>
				</view>
			</view>
		</wyb-popup> -->

	</view>
</template>

<script>
	import Country from "../../component/country.vue"
	import Province from "../../component/province.vue"
	import City from "../../component/city.vue"
	import CountryLevel from "../../component/countyLevel.vue"

	import wybPopup from '@/components/wyb-popup/wyb-popup.vue'
	export default {

		components: {
			Country,
			Province,
			City,
			CountryLevel,
			wybPopup,
		},
		data() {
			return {
				tabIndex: 2, //选中标签栏的序列
				// 选择的名字种类名字
				classify: "",
				findIndex: '',
				tabBars: [{
						name: '国家',
						id: '1',
						title: '国政策'
					},
					{
						name: '省级',
						id: '2',
						title: '省政策'
					},
					{
						name: '市级',
						id: '3',
						title: '使政策'
					},
					{
						name: '县级',
						id: '4',
						title: '县政策'
					},
				],

				find: [{
						name: '电子信息',
						id: '1',

					},
					{
						name: '先进材料',
						id: '2',
					},
					{
						name: '装备制造',
						id: '3',
					},
					{
						name: '能源化工',
						id: '4',
					},
					{
						name: '食品饮料',
						id: '5',
					},
					{
						name: '技术与应用',
						id: '6',
					},
					{
						name: '生物制药',
						id: '7',
					},
					{
						name: '轻功纺织',
						id: '8',
					},
				],
			}
		},
		onShareAppMessage() {
			return {
				title: "", // 默认是小程序的名称(可以写slogan等)
				path: '/pages/policySupport/policySupport',
			}
		},
		methods: {
			toggleTab(index) {
				this.tabIndex = index;
			},
			// 弹框显示
			Openpopup() {
				this.$refs.popup.show()
			},
			findindex(id) {
				this.findIndex = id;
				this.classify = id
				this.$refs.popup.hide()
			},
			// 跳转至搜索页面
			search() {
				uni.navigateTo({
					url: `../search/search?id=${this.tabIndex}`,
				});
			},
			getpolicysupportdata() {
				// this.$api.policysupport.postpolicysupport(data)
			}
		},
		onLoad() {
			// console.log(444);
		}
	}
</script>

<style lang="scss">
	@import "./policySupport.scss"
</style>